chore(代码合并): 代码从Custom/common分支合并

uni_modules/mp-html/static/app-plus/mp-html/js/handler.js

@@ -1 +1,254 @@
-"use strict";function t(t){for(var e=Object.create(null),n=t.attributes.length;n--;)e[t.attributes[n].name]=t.attributes[n].value;return e}function e(){a[1]&&(this.src=a[1],this.onerror=null),this.onclick=null,this.ontouchstart=null,uni.postMessage({data:{action:"onError",source:"img",attrs:t(this)}})}function n(){window.unloadimgs-=1,0===window.unloadimgs&&uni.postMessage({data:{action:"onReady"}})}function o(r,s,c){for(var d=0;d<r.length;d++)!function(d){var u=r[d],l=void 0;if(u.type&&"node"!==u.type)l=document.createTextNode(u.text.replace(/&amp;/g,"&"));else{var g=u.name;"svg"===g&&(c="http://www.w3.org/2000/svg"),"html"!==g&&"body"!==g||(g="div"),l=c?document.createElementNS(c,g):document.createElement(g);for(var p in u.attrs)l.setAttribute(p,u.attrs[p]);if(u.children&&o(u.children,l,c),"img"===g){if(window.unloadimgs+=1,l.onload=n,l.onerror=n,!l.src&&l.getAttribute("data-src")&&(l.src=l.getAttribute("data-src")),u.attrs.ignore||(l.onclick=function(e){e.stopPropagation(),uni.postMessage({data:{action:"onImgTap",attrs:t(this)}})}),a[2]){var h=new Image;h.src=l.src,l.src=a[2],h.onload=function(){l.src=this.src},h.onerror=function(){l.onerror()}}l.onerror=e}else if("a"===g)l.addEventListener("click",function(e){e.stopPropagation(),e.preventDefault();var n,o=this.getAttribute("href");o&&"#"===o[0]&&(n=(document.getElementById(o.substr(1))||{}).offsetTop),uni.postMessage({data:{action:"onLinkTap",attrs:t(this),offset:n}})},!0);else if("video"===g||"audio"===g)i.push(l),u.attrs.autoplay||u.attrs.controls||l.setAttribute("controls","true"),l.onplay=function(){if(uni.postMessage({data:{action:"onPlay"}}),a[3])for(var t=0;t<i.length;t++)i[t]!==this&&i[t].pause()},l.onerror=function(){uni.postMessage({data:{action:"onError",source:g,attrs:t(this)}})};else if("table"===g&&a[4]&&!l.style.cssText.includes("inline")){var f=document.createElement("div");f.style.overflow="auto",f.appendChild(l),l=f}else"svg"===g&&(c=void 0)}s.appendChild(l)}(d)}document.addEventListener("UniAppJSBridgeReady",function(){document.body.onclick=function(){return uni.postMessage({data:{action:"onClick"}})},uni.postMessage({data:{action:"onJSBridgeReady"}})});var a,i=[];window.setContent=function(t,e,n){var r=document.getElementById("content");e[0]&&(document.body.style.cssText=e[0]),e[5]||(r.style.userSelect="none"),n||(r.innerHTML="",i=[]),a=e,window.unloadimgs=0;var s=document.createDocumentFragment();o(t,s),r.appendChild(s);var c=r.scrollHeight;uni.postMessage({data:{action:"onLoad",height:c}}),window.unloadimgs||uni.postMessage({data:{action:"onReady",height:c}}),clearInterval(window.timer),window.timer=setInterval(function(){r.scrollHeight!==c&&(c=r.scrollHeight,uni.postMessage({data:{action:"onHeightChange",height:c}}))},350)},window.onunload=function(){clearInterval(window.timer)};
+// 等待初始化完毕
+document.addEventListener('UniAppJSBridgeReady', () => {
+  document.body.onclick = () =>
+    uni.postMessage({
+      data: {
+        action: 'onClick'
+      }
+    })
+  uni.postMessage({
+    data: {
+      action: 'onJSBridgeReady'
+    }
+  })
+})
+
+let options
+let medias = []
+
+/**
+ * @description 获取标签的所有属性
+ * @param {Element} ele
+ */
+function getAttrs (ele) {
+  const attrs = Object.create(null)
+  for (let i = ele.attributes.length; i--;) {
+    attrs[ele.attributes[i].name] = ele.attributes[i].value
+  }
+  return attrs
+}
+
+/**
+ * @description 图片加载出错
+ */
+function onImgError () {
+  if (options[1]) {
+    this.src = options[1]
+    this.onerror = null
+  }
+  // 取消监听点击
+  this.onclick = null
+  this.ontouchstart = null
+  uni.postMessage({
+    data: {
+      action: 'onError',
+      source: 'img',
+      attrs: getAttrs(this)
+    }
+  })
+}
+
+/**
+ * @description 检查是否所有图片加载完毕
+ */
+function checkReady () {
+  window.unloadimgs -= 1
+  if (window.unloadimgs === 0) {
+    // 所有图片加载完毕
+    uni.postMessage({
+      data: {
+        action: 'onReady'
+      }
+    })
+  }
+}
+
+/**
+ * @description 创建 dom 结构
+ * @param {object[]} nodes 节点数组
+ * @param {Element} parent 父节点
+ * @param {string} namespace 命名空间
+ */
+function createDom (nodes, parent, namespace) {
+  for (let i = 0; i < nodes.length; i++) {
+    const node = nodes[i]
+    let ele
+    if (!node.type || node.type === 'node') {
+      let name = node.name
+      // svg 需要设置 namespace
+      if (name === 'svg') {
+        namespace = 'http://www.w3.org/2000/svg'
+      }
+      if (name === 'html' || name === 'body') {
+        name = 'div'
+      }
+      // 创建标签
+      if (!namespace) {
+        ele = document.createElement(name)
+      } else {
+        ele = document.createElementNS(namespace, name)
+      }
+      // 设置属性
+      for (const item in node.attrs) {
+        ele.setAttribute(item, node.attrs[item])
+      }
+      // 递归创建子节点
+      if (node.children) {
+        createDom(node.children, ele, namespace)
+      }
+
+      // 处理图片
+      if (name === 'img') {
+        window.unloadimgs += 1
+        ele.onload = checkReady
+        ele.onerror = checkReady
+        if (!ele.src && ele.getAttribute('data-src')) {
+          ele.src = ele.getAttribute('data-src')
+        }
+        if (!node.attrs.ignore) {
+          // 监听图片点击事件
+          ele.onclick = function (e) {
+            e.stopPropagation()
+            uni.postMessage({
+              data: {
+                action: 'onImgTap',
+                attrs: getAttrs(this)
+              }
+            })
+          }
+        }
+        if (options[2]) {
+          const image = new Image()
+          image.src = ele.src
+          ele.src = options[2]
+          image.onload = function () {
+            ele.src = this.src
+          }
+          image.onerror = function () {
+            ele.onerror()
+          }
+        }
+        ele.onerror = onImgError
+      } else if (name === 'a') {
+        // 处理链接
+        ele.addEventListener('click', function (e) {
+          e.stopPropagation()
+          e.preventDefault() // 阻止默认跳转
+          const href = this.getAttribute('href')
+          let offset
+          if (href && href[0] === '#') {
+            offset = (document.getElementById(href.substr(1)) || {}).offsetTop
+          }
+          uni.postMessage({
+            data: {
+              action: 'onLinkTap',
+              attrs: getAttrs(this),
+              offset
+            }
+          })
+        }, true)
+      } else if (name === 'video' || name === 'audio') {
+        // 处理音视频
+        medias.push(ele)
+        if (!node.attrs.autoplay && !node.attrs.controls) {
+          ele.setAttribute('controls', 'true')
+        }
+        ele.onplay = function () {
+          uni.postMessage({
+            data: {
+              action: 'onPlay'
+            }
+          })
+          if (options[3]) {
+            for (let i = 0; i < medias.length; i++) {
+              if (medias[i] !== this) {
+                medias[i].pause()
+              }
+            }
+          }
+        }
+        ele.onerror = function () {
+          uni.postMessage({
+            data: {
+              action: 'onError',
+              source: name,
+              attrs: getAttrs(this)
+            }
+          })
+        }
+      } else if (name === 'table' && options[4] && !ele.style.cssText.includes('inline')) {
+        // 处理表格
+        const div = document.createElement('div')
+        div.style.overflow = 'auto'
+        div.appendChild(ele)
+        ele = div
+      } else if (name === 'svg') {
+        namespace = undefined
+      }
+    } else {
+      ele = document.createTextNode(node.text.replace(/&amp;/g, '&'))
+    }
+    parent.appendChild(ele)
+  }
+}
+
+// 设置 html 内容
+window.setContent = function (nodes, opts, append) {
+  const ele = document.getElementById('content')
+
+  // 容器样式
+  if (opts[0]) {
+    document.body.style.cssText = opts[0]
+  }
+
+  // 长按复制
+  if (!opts[5]) {
+    ele.style.userSelect = 'none'
+  }
+
+  if (!append) {
+    ele.innerHTML = '' // 不追加则先清空
+    medias = []
+  }
+
+  options = opts
+  window.unloadimgs = 0
+  const fragment = document.createDocumentFragment()
+  createDom(nodes, fragment)
+  ele.appendChild(fragment)
+
+  // 触发事件
+  let height = ele.scrollHeight
+  uni.postMessage({
+    data: {
+      action: 'onLoad',
+      height
+    }
+  })
+  if (!window.unloadimgs) {
+    uni.postMessage({
+      data: {
+        action: 'onReady',
+        height
+      }
+    })
+  }
+
+  clearInterval(window.timer)
+  window.timer = setInterval(() => {
+    if (ele.scrollHeight !== height) {
+      height = ele.scrollHeight
+      uni.postMessage({
+        data: {
+          action: 'onHeightChange',
+          height: height
+        }
+      })
+    }
+  }, 350)
+}
+
+// 回收计时器
+window.onunload = function () {
+  clearInterval(window.timer)
+}

uni_modules/mp-html/static/app-plus/mp-html/local.html

@@ -1 +1,33 @@
-<head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"><style>body,html{width:100%;height:100%;overflow-x:scroll;overflow-y:hidden}body{margin:0}video{width:300px;height:225px}img{max-width:100%;-webkit-touch-callout:none}</style></head><body><div id="content" style="overflow:hidden"></div><script type="text/javascript" src="./js/uni.webview.min.js"></script><script type="text/javascript" src="./js/handler.js"></script></body>
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no">
+  <style>
+    html,
+    body {
+      width: 100%;
+      height: 100%;
+      overflow-x: scroll;
+      overflow-y: hidden;
+    }
+
+    body {
+      margin: 0;
+    }
+
+    video {
+      width: 300px;
+      height: 225px;
+    }
+
+    img {
+      max-width: 100%;
+      -webkit-touch-callout: none;
+    }
+  </style>
+</head>
+
+<body>
+  <div id="content" style="overflow: hidden;"></div>
+  <script type="text/javascript" src="./js/uni.webview.min.js"></script>
+  <script type="text/javascript" src="./js/handler.js"></script>
+</body>