价格和电话设置更改

Album/game.js

@@ -0,0 +1,7 @@
+import './js/libs/weapp-adapter'
+import './js/libs/symbol'
+
+import Main from './js/main.js'
+
+new Main()
+

Album/game.json

@@ -0,0 +1,6 @@
+{
+  "deviceOrientation":"landscape",
+  "networkTimeout": {
+    "request": 5000
+  }
+}

Album/js/draw/FirstLevelDirectory.js

@@ -0,0 +1,72 @@
+/*
+绘制一级目录列表
+*/
+//获取手机屏幕大小信息
+var sw = 0
+var sh = 0
+wx.getSystemInfo({
+  success: function (res) {
+    sw = res.screenWidth
+    sh = res.screenHeight
+  }
+})
+const screenWidth = sw
+const screenHeight = sh
+
+
+export default class FLD {
+  drawFLD(context, image, status, index, text) {
+    //console.log(index)
+    
+    //当未被选中时
+    if (status == false) {
+      //根据是第几个一级目录画图标
+      image.onload = function () {
+        let ratio = image.width / image.height
+        context.drawImage(image, (screenWidth - 48) * 2, (index * 50) * 2, 50 * 2, (50/ratio)* 2)
+      }
+      //把目录名字加上
+      //drawText(text, index)
+      context.fillStyle = '#000'
+      context.font = "20px Arial"
+      if(text.length == 1){
+        context.fillText(text, (screenWidth - 29) * 2, ((index + 2) * 50 - 4) * 2)
+      }
+      if (text.length == 2) {
+        context.fillText(text, (screenWidth - 33) * 2, ((index + 2) * 50 - 4) * 2)
+      }
+      if (text.length == 3) {
+        context.fillText(text, (screenWidth - 39) * 2, ((index + 2) * 50 - 4) * 2)
+      }
+      if (text.length == 4) {
+        context.fillText(text, (screenWidth - 45) * 2, ((index + 2) * 50 - 4) * 2)
+      }
+    }
+    else {
+      //将选项背景换成白色，左边界变成红色
+      context.fillStyle = '#fff'
+      context.fillRect((screenWidth - 48) * 2, (index * 50 + 50) * 2, 50 * 2, 50 * 2)
+      context.fillStyle = '#FFA500'
+      context.fillRect((screenWidth - 50) * 2, (index * 50 + 50) * 2, 2 * 2, 50 * 2)
+      image.onload = function () {
+        let ratio = image.width / image.height
+        context.drawImage(image, (screenWidth - 48) * 2, (index * 50) * 2, 50 * 2, (50 / ratio) * 2)
+      }
+      context.fillStyle = '#000'
+      context.font = "20px Arial"
+      if (text.length == 1) {
+        context.fillText(text, (screenWidth - 29) * 2, ((index + 2) * 50 - 4) * 2)
+      }
+      if (text.length == 2) {
+        context.fillText(text, (screenWidth - 33) * 2, ((index + 2) * 50 - 4) * 2)
+      }
+      if (text.length == 3) {
+        context.fillText(text, (screenWidth - 39) * 2, ((index + 2) * 50 - 4) * 2)
+      }
+      if (text.length == 4) {
+        context.fillText(text, (screenWidth - 45) * 2, ((index + 2) * 50 - 4) * 2)
+      }
+    }
+    index++
+  }
+}

Album/js/draw/SecondLevelDirectory.js

@@ -0,0 +1,88 @@
+
+/*
+绘制二级目录列表
+*/
+//获取手机屏幕大小信息
+var sw = 0
+var sh = 0
+//是否为iPhoneX
+let isiPhoneX = false
+wx.getSystemInfo({
+  success: function (res) {
+    sw = res.screenWidth
+    sh = res.screenHeight
+    let mobileType = res.model
+    if (mobileType == 'iPhone X') isiPhoneX = true
+    else isiPhoneX = false
+  }
+})
+const screenWidth = sw
+const screenHeight = sh
+
+//绘制子目录列表
+export default class SLD {
+  drawSLD(context, status, index, text) {
+    index = index + 4
+    if(isiPhoneX){
+      //未被选中时
+      if (status == false) {
+        //绘制文字，选中和未选中状态下文字颜色不一样
+        context.fillStyle = '#696969'
+        context.font = "20px Arial"
+        //文字总是保持居中，只考虑了2个和3个字
+        if (text.length == 3) {
+          context.fillText(text, 70+2 * 2, (index * 25 + 50) * 2)
+        }
+        if (text.length == 2) {
+          context.fillText(text, 70+8 * 2, (index * 25 + 50) * 2)
+        }
+      }
+      else {//当被选中时，突出显示
+        context.fillStyle = '#dcdcdc'
+        context.fillRect(70, (index * 25 + 35) * 2, 40 * 2, 50, )
+
+        ///绘制文字，选中和未选中状态下文字颜色不一样
+        context.fillStyle = '#FFA500'
+        context.font = "20px Arial"
+        //文字总是保持居中，只考虑了2个和3个字
+        if (text.length == 3) {
+          context.fillText(text, 70+2 * 2, (index * 25 + 50) * 2)
+        }
+        if (text.length == 2) {
+          context.fillText(text, 70+8 * 2, (index * 25 + 50) * 2)
+        }
+      }
+    }else{
+      //未被选中时
+      if (status == false) {
+
+        //绘制文字，选中和未选中状态下文字颜色不一样
+        context.fillStyle = '#696969'
+        context.font = "20px Arial"
+        //文字总是保持居中，只考虑了2个和3个字
+        if (text.length == 3) {
+          context.fillText(text, 2 * 2, (index * 25 +50) * 2)
+        }
+        if (text.length == 2) {
+          context.fillText(text, 8 * 2, (index * 25 +50) * 2)
+        }
+      }
+      else {//当被选中时，突出显示
+        context.fillStyle = '#dcdcdc'
+        context.fillRect(0, (index * 25 + 35) * 2, 40 * 2, 50,)
+        
+        ///绘制文字，选中和未选中状态下文字颜色不一样
+        context.fillStyle = '#FFA500'
+        context.font = "20px Arial"
+        //文字总是保持居中，只考虑了2个和3个字
+        if (text.length == 3) {
+          context.fillText(text, 2 * 2, (index * 25 + 50) * 2)
+        }
+        if (text.length == 2) {
+          context.fillText(text, 8 * 2, (index * 25 + 50) * 2)
+        }
+      }
+    }
+    
+  }
+}

Album/js/draw/base.js

@@ -0,0 +1,66 @@
+//获取手机屏幕大小信息
+var sw = 0
+var sh = 0
+//是否为iPhoneX
+let isiPhoneX = false
+wx.getSystemInfo({
+  success: function (res) {
+    sw = res.screenWidth
+    sh = res.screenHeight
+    let mobileType = res.model
+    if (mobileType == 'iPhone X') isiPhoneX = true
+    else isiPhoneX = false
+  }
+})
+const screenWidth = sw
+const screenHeight = sh
+
+/*
+画两边的灰色选择栏和下一页按钮
+*/
+function basePage(context) {
+  if (isiPhoneX) {
+    context.fillStyle = '#fff'
+    context.fillRect(35 * 2, 0, screenWidth * 2, screenHeight * 2)
+    context.fillStyle = '#f8f8f8'
+    context.fillRect(35 * 2, 0, screenWidth * 2, 40 * 2)
+    context.fillRect(35 * 2, 50 * 2, 40 * 2, screenHeight * 2)
+    context.fillRect((screenWidth - 50) * 2, 50 * 2, 50 * 2, screenHeight * 2)
+    context.fillStyle = '#FFA500'
+    context.fillRect((screenWidth - 50) * 2, (screenHeight - 30) * 2, 50 * 2, 30 * 2)
+    context.fillRect((screenWidth - 50) * 2, (screenHeight - 65) * 2, 50 * 2, 30 * 2)
+    context.font = '20px Arial'
+    context.fillStyle = '#696969'
+    context.fillText('新品上市', 35 * 2, 70 * 2)
+    context.fillText('促销产品', 35 * 2, 95 * 2)
+    context.fillText('风格', 35 * 2, 120 * 2)
+  } else {
+    context.fillStyle = '#fff'
+    context.fillRect(0, 0, screenWidth * 2, screenHeight * 2)
+    context.fillStyle = '#f8f8f8'
+    context.fillRect(0, 0, screenWidth * 2, 40 * 2)
+    context.fillRect(0, 50 * 2, 40 * 2, screenHeight * 2)
+    context.fillRect((screenWidth - 50) * 2, 50 * 2, 50 * 2, screenHeight * 2)
+    context.fillStyle = '#FFA500'
+    context.fillRect((screenWidth - 50) * 2, (screenHeight - 30) * 2, 50 * 2, 30 * 2)
+    context.fillRect((screenWidth - 50) * 2, (screenHeight - 65) * 2, 50 * 2, 30 * 2)
+    context.font = '20px Arial'
+    context.fillStyle = '#696969'
+    context.fillText('新品上市', 0, 70 * 2)
+    context.fillText('促销产品', 0, 95 * 2)
+    context.fillText('风格', 0, 120 * 2)
+  }
+  context.fillStyle = '#FFA500'
+  context.fillRect(300, 20, 100, 40)
+  context.fillStyle = '#fff'
+  context.font = "26px Arial"
+  context.fillText('下一页', (screenWidth - 46) * 2, (screenHeight - 9) * 2)
+  context.fillText('上一页', (screenWidth - 46) * 2, (screenHeight - 44) * 2)
+  context.font = "26px Arial"
+  context.fillText('搜索', 320, 50)
+  context.fillRect(76,20,220,40)
+  context.fillStyle = '#696969'
+  context.fillText('关键词查询',90,50)
+
+}
+export { basePage }

Album/js/draw/content.js

@@ -0,0 +1,156 @@
+/*
+主体内容绘制
+*/
+
+//获取手机屏幕大小信息
+var sw = 0
+var sh = 0
+//是否为iPhoneX
+let isiPhoneX = false
+wx.getSystemInfo({
+  success: function (res) {
+    sw = res.screenWidth
+    sh = res.screenHeight
+    let mobileType = res.model
+    if (mobileType == 'iPhone X') isiPhoneX = true
+    else isiPhoneX = false
+  }
+})
+const screenWidth = sw
+const screenHeight = sh
+var imgx = 0
+var imgy = 0
+if (isiPhoneX) {
+  imgx = (screenWidth - 240 - 35) / 3
+  imgy = (screenHeight - 118) / 3
+} else {
+  imgx = (screenWidth - 180) / 3
+  imgy = (screenHeight - 118) / 3
+}
+const imgX = imgx
+const imgY = imgy
+//每个页面放九个元素，每个元素依据它的下标来确定放置的位置
+export default class Content {
+  drawContent(context, image, index, text) {
+    context.fillStyle = '#000'
+    context.font = "24px Arial"
+    if (isiPhoneX) {
+      if (index % 9 == 0) {
+        //先绘制示例图
+        image.onload = function () {
+          context.drawImage(image, (40 + 17+ 10 + 40) * 2 + 70, 42 * 2, imgX * 2, imgY * 2)
+        }
+        //绘制描述文字
+        context.fillText(text, (40 + 40 + 17 + 10 + 15) * 2 + 70, (imgY + 2 + 15 + 40) * 2)
+      }
+      if (index % 9 == 1) {
+        image.onload = function () {
+          context.drawImage(image, (40 + 40+ 17 + 10 + imgX + 10) * 2 + 70, 42 * 2, imgX * 2, imgY * 2)
+        }
+        context.fillText(text, (40 + 40 + 17 + 10 + imgX + 10 + 15) * 2 + 70, (imgY + 2 + 15 + 40) * 2)
+      }
+      if (index % 9 == 2) {
+        image.onload = function () {
+          context.drawImage(image, (40 + 40 + 17 + 10 + imgX + 10 + imgX + 10) * 2 + 70, 42 * 2, imgX * 2, imgY * 2)
+        }
+        context.fillText(text, (40 + 40 + 17 + 10 + imgX + 10 + imgX + 10 + 15) * 2 + 70, (imgY + 2 + 15 + 40) * 2)
+      }
+      if (index % 9 == 3) {
+        image.onload = function () {
+          context.drawImage(image, (40 + 40 + 17 + 10) * 2 + 70, (2 + imgY + 15 + 10 + 40) * 2, imgX * 2, imgY * 2)
+        }
+        context.fillText(text, (40 + 40 + 17 + 10 + 15) * 2 + 70, (imgY + 2 + 15 + imgY + 10 + 15 + 40) * 2)
+      }
+      if (index % 9 == 4) {
+        image.onload = function () {
+          context.drawImage(image, (40 + 40 + 17 + 10 + imgX + 10) * 2 + 70, (2 + imgY + 15 + 10 + 40) * 2, imgX * 2, imgY * 2)
+        }
+        context.fillText(text, (40 + 40 + 17 + 10 + imgX + 10 + 15) * 2 + 70, (imgY + 2 + 15 + imgY + 10 + 15 + 40) * 2)
+
+      }
+      if (index % 9 == 5) {
+        image.onload = function () {
+          context.drawImage(image, (40 + 40 + 17 + 10 + imgX + 10 + imgX + 10) * 2 + 70, (2 + imgY + 15 + 10 + 40) * 2, imgX * 2, imgY * 2)
+        }
+        context.fillText(text, (40 + 40 + 17 + 10 + imgX + 10 + imgX + 10 + 15) * 2 + 70, (imgY + 2 + 15 + imgY + 10 + 15 + 40) * 2)
+      }
+      if (index % 9 == 6) {
+        image.onload = function () {
+          context.drawImage(image, (40 + 40 + 17 + 10) * 2 + 70, (2 + imgY + 15 + 10 + imgY + 15 + 10 + 40) * 2, imgX * 2, imgY * 2)
+        }
+        context.fillText(text, (40 + 40 + 10 + 17 + 15) * 2 + 70, (imgY + 2 + 15 + imgY + 10 + 15 + imgY + 10 + 15 + 40) * 2)
+      }
+      if (index % 9 == 7) {
+        image.onload = function () {
+          context.drawImage(image, (40 + 40 + 17 + 10 + imgX + 10) * 2 + 70, (2 + imgY + 15 + 10 + imgY + 15 + 10 + 40) * 2, imgX * 2, imgY * 2)
+        }
+        context.fillText(text, (40 + 40 + 17 + 10 + imgX + 10 + 15) * 2 + 70, (imgY + 2 + 15 + imgY + 10 + 15 + imgY + 10 + 15 + 40) * 2)
+      }
+      if (index % 9 == 8) {
+        image.onload = function () {
+          context.drawImage(image, (40 + 40 + 17 + 10 + imgX + 10 + imgX + 10) * 2 + 70, (2 + imgY + 15 + 10 + imgY + 15 + 10 + 40) * 2, imgX * 2, imgY * 2)
+        }
+        context.fillText(text, (40 + 40 + 17 + 10 + imgX + 10 + imgX + 10 + 15) * 2 + 70, (imgY + 2 + 15 + imgY + 10 + 15 + imgY + 15 + 10 + 40) * 2)
+      }
+    } else {
+      if (index % 9 == 0) {
+        //先绘制示例图
+        image.onload = function () {
+          context.drawImage(image, (40 + 10+17) * 2, 42 * 2, imgX * 2, imgY * 2)
+        }
+        //绘制描述文字
+        context.fillText(text, (40 + 10 + 15) * 2, (imgY + 2 +40 + 15) * 2)
+      }
+      if (index % 9 == 1) {
+        image.onload = function () {
+          context.drawImage(image, (40 + 10 + imgX + 17+ 10) * 2, 42 * 2, imgX * 2, imgY * 2)
+        }
+        context.fillText(text, (40 + 10 + imgX + 10 + 15) * 2, (imgY + 2 + 40+ 15) * 2)
+      }
+      if (index % 9 == 2) {
+        image.onload = function () {
+          context.drawImage(image, (40 + 10 + 17 + imgX + 10 + imgX + 10) * 2, 42 * 2, imgX * 2, imgY * 2)
+        }
+        context.fillText(text, (40 + 10 + imgX + 10 + imgX + 10 + 15) * 2, (imgY + 2 + 40 + 15) * 2)
+      }
+      if (index % 9 == 3) {
+        image.onload = function () {
+          context.drawImage(image, (40 + 17 + 10) * 2, (2 + imgY + 15 + 10 + 40) * 2, imgX * 2, imgY * 2)
+        }
+        context.fillText(text, (40 + 10 + 15) * 2, (imgY + 2 + 15 + imgY + 10 + 15 + 40) * 2)
+      }
+      if (index % 9 == 4) {
+        image.onload = function () {
+          context.drawImage(image, (40 + 17 + 10 + imgX + 10) * 2, (2 + imgY + 15 + 10 + 40) * 2, imgX * 2, imgY * 2)
+        }
+        context.fillText(text, (40 + 10 + imgX + 10 + 15) * 2, (imgY + 2 + 15 + imgY + 10 + 15 + 40) * 2)
+
+      }
+      if (index % 9 == 5) {
+        image.onload = function () {
+          context.drawImage(image, (40 + 17 + 10 + imgX + 10 + imgX + 10) * 2, (2 + imgY + 15 + 10 + 40) * 2, imgX * 2, imgY * 2)
+        }
+        context.fillText(text, (40 + 10 + imgX + 10 + imgX + 10 + 15) * 2, (imgY + 2 + 15 + imgY + 10 + 15 + 40) * 2)
+      }
+      if (index % 9 == 6) {
+        image.onload = function () {
+          context.drawImage(image, (40 + 17 + 10) * 2, (2 + imgY + 15 + 10 + imgY + 15 + 10 + 40) * 2, imgX * 2, imgY * 2)
+        }
+        context.fillText(text, (40 + 10 + 15) * 2, (imgY + 2 + 15 + imgY + 10 + 15 + imgY + 10 + 15 + 40) * 2)
+      }
+      if (index % 9 == 7) {
+        image.onload = function () {
+          context.drawImage(image, (40 + 17 + 10 + imgX + 10) * 2, (2 + imgY + 15 + 10 + imgY + 15 + 10 + 40) * 2, imgX * 2, imgY * 2)
+        }
+        context.fillText(text, (40 + 10 + imgX + 10 + 15) * 2, (imgY + 2 + 15 + imgY + 10 + 15 + imgY + 10 + 15 + 40) * 2)
+      }
+      if (index % 9 == 8) {
+        image.onload = function () {
+          context.drawImage(image, (40 + 17 + 10 + imgX + 10 + imgX + 10) * 2, (2 + imgY + 15 + 10 + imgY + 15 + 10 + 40) * 2, imgX * 2, imgY * 2)
+        }
+        context.fillText(text, (40 + 10 + imgX + 10 + imgX + 10 + 15) * 2, (imgY + 2 + 15 + imgY + 10 + 15 + imgY + 15 + 10 + 40) * 2)
+      }
+    }
+
+  }
+}

Album/js/draw/details.js

@@ -0,0 +1,89 @@
+//获取手机屏幕大小信息
+var sw = 0
+var sh = 0
+//是否为iPhoneX
+let isiPhoneX = false
+wx.getSystemInfo({
+  success: function (res) {
+    sw = res.screenWidth
+    sh = res.screenHeight
+    let mobileType = res.model
+    if (mobileType == 'iPhone X') isiPhoneX = true
+    else isiPhoneX = false
+  }
+})
+const screenWidth = sw
+const screenHeight = sh
+//功能栏
+let img1 = wx.createImage()
+img1.src = 'images/1.png'
+let img2 = wx.createImage()
+img2.src = 'images/3.png'
+let img3 = wx.createImage()
+img3.src = 'images/4.png'
+let img4 = wx.createImage()
+img4.src = 'images/2.png'
+let img5 = wx.createImage()
+img5.src = 'images/5.png'
+let forward = wx.createImage()
+forward.src = 'images/forward.png'
+let back = wx.createImage()
+back.src = 'images/back.png'
+let ratio = img1.width / img1.height
+let loadingDown = false
+export default class Details {
+  showDetails(context, image, text, price) {
+    if (isiPhoneX) {
+      //加载大图
+      image.onload = function () {        
+        context.clearRect(0, 0, screenWidth * 2, screenHeight * 2)
+        context.drawImage(image, 70, 0, screenWidth * 2, screenHeight * 2)
+        context.drawImage(img1, (screenWidth / 2 - 200) * 2 + 70, (screenHeight - 35) * 2, 90 * 2, (90 / ratio) * 2)
+        context.drawImage(img2, (screenWidth / 2 - 100) * 2 + 70, (screenHeight - 35) * 2, 90 * 2, (90 / ratio) * 2)
+        context.drawImage(img3, (screenWidth / 2) * 2 + 70, (screenHeight - 35) * 2, 90 * 2, (90 / ratio) * 2)
+        context.drawImage(img4, (screenWidth / 2 + 100) * 2 + 70, (screenHeight - 35) * 2, 90 * 2, (90 / ratio) * 2)
+        context.drawImage(img5, 10 * 2 + 70, (screenHeight - 40) * 2, 30 * 2, 30 * 2)
+        context.drawImage(forward, (screenWidth - 40) * 2, (screenHeight / 2 - 15) * 2, 60, 60)
+        context.drawImage(back, 10 * 2 + 70, (screenHeight / 2 - 15) * 2, 60, 60)
+        //编号和单价
+        context.fillStyle = 'rgba(0,0,0,0.25)'
+        context.fillRect(70, 0, screenWidth*2 - 70, 60)
+        context.font = "32px Arial"
+        context.fillStyle = '#fff'
+        context.fillText(text, 80 * 2, 25 * 2)
+        if(price != ''){
+          context.fillText('单价：', screenWidth, 25 * 2)
+          context.fillStyle = '#FFA500'
+          context.fillText('¥' + price, screenWidth + 90, 25 * 2)
+        }  
+        wx.hideLoading()  
+      }
+    } else {
+      //加载大图
+      image.onload = function () {
+        context.clearRect(0, 0, screenWidth * 2, screenHeight * 2)
+        context.drawImage(image, 0, 0, screenWidth * 2, screenHeight * 2)
+        //编号和单价
+        context.fillStyle = 'rgba(0,0,0,0.25)'
+        context.fillRect(0,0,screenWidth*2,60)
+        context.font = "32px Arial"
+        context.fillStyle = '#fff'
+        context.fillText(text, 80 * 2, 25 * 2)
+        if(price != ''){
+          context.fillText('单价：', screenWidth, 25 * 2)
+          context.fillStyle = '#FFA500'
+          context.fillText('¥' + price, screenWidth + 90, 25 * 2)
+        }
+        context.drawImage(img1, (screenWidth / 2 - 200) * 2, (screenHeight - 35) * 2, 90 * 2, (90 / ratio) * 2)
+        context.drawImage(img2, (screenWidth / 2 - 100) * 2, (screenHeight - 35) * 2, 90 * 2, (90 / ratio) * 2)
+        context.drawImage(img3, (screenWidth / 2) * 2, (screenHeight - 35) * 2, 90 * 2, (90 / ratio) * 2)
+        context.drawImage(img4, (screenWidth / 2 + 100) * 2, (screenHeight - 35) * 2, 90 * 2, (90 / ratio) * 2)
+        context.drawImage(img5, 10 * 2, (screenHeight - 40) * 2, 30 * 2, 30 * 2)
+        context.drawImage(forward, (screenWidth - 40) * 2, (screenHeight / 2 - 15) * 2, 60, 60)
+        context.drawImage(back, 10 * 2, (screenHeight / 2 - 15) * 2, 60, 60)
+        wx.hideLoading()  
+      }
+    }
+  }
+}
+

Album/js/draw/price.js

@@ -0,0 +1,65 @@
+/*
+设置价格
+*/
+
+//获取手机屏幕大小信息
+var sw = 0
+var sh = 0
+//是否为iPhoneX
+let isiPhoneX = false
+wx.getSystemInfo({
+  success: function (res) {
+    sw = res.screenWidth
+    sh = res.screenHeight
+    let mobileType = res.model
+    if (mobileType == 'iPhone X') isiPhoneX = true
+    else isiPhoneX = false
+  }
+})
+const screenWidth = sw
+const screenHeight = sh
+var imgx = 0
+var imgy = 0
+if (isiPhoneX) {
+  imgx = (screenWidth - 240 - 35) / 3
+  imgy = (screenHeight - 95) / 9
+} else {
+  imgx = (screenWidth - 180) / 3
+  imgy = (screenHeight - 95) / 9
+}
+const imgX = imgx
+const imgY = imgy
+export default class Price{
+  setPrice(context,image,index,name,price){
+    
+    if(isiPhoneX){
+      var ratio = image.width / image.height
+      context.drawImage(image, 50 * 2 + 70, 50 * 2 + (index * (imgY + 5)) * 2 + 10, (imgY - 5) * ratio * 2, (imgY - 5) * 2)
+      context.fillStyle = '#000'
+      context.font = "24px Arial"
+      context.fillText(name, 50 * 2 +70+ imgY * ratio * 2 + 20, 50 * 2 + imgY * 2 - 15 + (index * (imgY + 5)) * 2)
+      context.fillText("¥" + price, (screenWidth - 160) * 2, 50 * 2 + imgY * 2 - 15 + (index * (imgY + 5)) * 2)
+      context.fillStyle = '#FFA500'
+      context.fillRect((screenWidth - 100) * 2, 50 * 2 + imgY * 2 - 50 + (index * (imgY + 5)) * 2, 40 * 2, 25 * 2)
+      context.fillStyle = '#fff'
+      context.fillText('报价', (screenWidth - 100) * 2 + 15, 50 * 2 + imgY * 2 - 15 + (index * (imgY + 5)) * 2)
+      context.fillStyle = '#D3D3D3'
+      context.fillRect(50 * 2+70, 46 * 2 + ((index + 1) * (imgY + 5)) * 2, (screenWidth - 110) * 2 - 70, 2)
+    }else{
+      image.onload = function () {
+        var ratio = image.width / image.height
+        context.drawImage(image, 50 * 2, 50 * 2 + (index * (imgY + 5)) * 2 + 10, (imgY - 5) * ratio * 2, (imgY-5) * 2)
+        context.fillStyle = '#000'
+        context.font = "24px Arial"
+        context.fillText(name, 50 * 2 + imgY * ratio * 2 + 20, 50 * 2 + imgY * 2 - 15 + (index * (imgY + 5)) * 2)
+        context.fillText("¥" + price, (screenWidth - 160) * 2, 50 * 2 + imgY * 2 - 15 + (index * (imgY + 5)) * 2)
+        context.fillStyle = '#FFA500'
+        context.fillRect((screenWidth - 100) * 2, 50 * 2 + imgY * 2 - 50 + (index * (imgY + 5)) * 2, 40 * 2, 25 * 2 )
+        context.fillStyle = '#fff'
+        context.fillText('报价', (screenWidth - 100) * 2 + 15, 50 * 2 + imgY * 2 - 15 + (index * (imgY + 5)) * 2)
+        context.fillStyle = '#D3D3D3'
+        context.fillRect(50 * 2, 46 * 2 + ((index + 1) * (imgY + 5)) * 2,(screenWidth-110)*2,2)
+      }
+    }
+  }
+}

Album/js/libs/symbol.js

@@ -0,0 +1,17 @@
+/**
+ * 对于ES6中Symbol的极简兼容
+ * 方便模拟私有变量
+ */
+
+let Symbol  = window.Symbol
+let idCounter = 0
+
+if (!Symbol) {
+  Symbol = function Symbol(key) {
+    return `__${key}_${Math.floor(Math.random() * 1e9)}_${++idCounter}__`
+  }
+
+  Symbol.iterator = Symbol('Symbol.iterator')
+}
+
+window.Symbol = Symbol

Album/js/libs/weapp-adapter.js

@@ -0,0 +1,1594 @@
+/******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId])
+/******/ 			return installedModules[moduleId].exports;
+
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			exports: {},
+/******/ 			id: moduleId,
+/******/ 			loaded: false
+/******/ 		};
+
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+
+/******/ 		// Flag the module as loaded
+/******/ 		module.loaded = true;
+
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+
+
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "";
+
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(0);
+/******/ })
+/************************************************************************/
+/******/ ([
+/* 0 */
+/***/ (function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	var _window2 = __webpack_require__(1);
+
+	var _window = _interopRequireWildcard(_window2);
+
+	var _HTMLElement = __webpack_require__(5);
+
+	var _HTMLElement2 = _interopRequireDefault(_HTMLElement);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }
+
+	var global = GameGlobal;
+
+	function inject() {
+	  _window.addEventListener = function (type, listener) {
+	    _window.document.addEventListener(type, listener);
+	  };
+	  _window.removeEventListener = function (type, listener) {
+	    _window.document.removeEventListener(type, listener);
+	  };
+
+	  if (_window.canvas) {
+	    _window.canvas.addEventListener = _window.addEventListener;
+	    _window.canvas.removeEventListener = _window.removeEventListener;
+	  }
+
+	  var _wx$getSystemInfoSync = wx.getSystemInfoSync(),
+	      platform = _wx$getSystemInfoSync.platform;
+
+	  // 开发者工具无法重定义 window
+
+
+	  if (platform === 'devtools') {
+	    for (var key in _window) {
+	      var descriptor = Object.getOwnPropertyDescriptor(global, key);
+
+	      if (!descriptor || descriptor.configurable === true) {
+	        Object.defineProperty(window, key, {
+	          value: _window[key]
+	        });
+	      }
+	    }
+
+	    for (var _key in _window.document) {
+	      var _descriptor = Object.getOwnPropertyDescriptor(global.document, _key);
+
+	      if (!_descriptor || _descriptor.configurable === true) {
+	        Object.defineProperty(global.document, _key, {
+	          value: _window.document[_key]
+	        });
+	      }
+	    }
+	    window.parent = window;
+	  } else {
+	    for (var _key2 in _window) {
+	      global[_key2] = _window[_key2];
+	    }
+	    global.window = _window;
+	    window = global;
+	    window.top = window.parent = window;
+	  }
+	}
+
+	if (!GameGlobal.__isAdapterInjected) {
+	  GameGlobal.__isAdapterInjected = true;
+	  inject();
+	}
+
+/***/ }),
+/* 1 */
+/***/ (function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+	exports.cancelAnimationFrame = exports.requestAnimationFrame = exports.clearInterval = exports.clearTimeout = exports.setInterval = exports.setTimeout = exports.canvas = exports.location = exports.localStorage = exports.HTMLElement = exports.FileReader = exports.Audio = exports.Image = exports.WebSocket = exports.XMLHttpRequest = exports.navigator = exports.document = undefined;
+
+	var _WindowProperties = __webpack_require__(2);
+
+	Object.keys(_WindowProperties).forEach(function (key) {
+	  if (key === "default" || key === "__esModule") return;
+	  Object.defineProperty(exports, key, {
+	    enumerable: true,
+	    get: function get() {
+	      return _WindowProperties[key];
+	    }
+	  });
+	});
+
+	var _constructor = __webpack_require__(4);
+
+	Object.keys(_constructor).forEach(function (key) {
+	  if (key === "default" || key === "__esModule") return;
+	  Object.defineProperty(exports, key, {
+	    enumerable: true,
+	    get: function get() {
+	      return _constructor[key];
+	    }
+	  });
+	});
+
+	var _Canvas = __webpack_require__(10);
+
+	var _Canvas2 = _interopRequireDefault(_Canvas);
+
+	var _document2 = __webpack_require__(11);
+
+	var _document3 = _interopRequireDefault(_document2);
+
+	var _navigator2 = __webpack_require__(18);
+
+	var _navigator3 = _interopRequireDefault(_navigator2);
+
+	var _XMLHttpRequest2 = __webpack_require__(19);
+
+	var _XMLHttpRequest3 = _interopRequireDefault(_XMLHttpRequest2);
+
+	var _WebSocket2 = __webpack_require__(20);
+
+	var _WebSocket3 = _interopRequireDefault(_WebSocket2);
+
+	var _Image2 = __webpack_require__(12);
+
+	var _Image3 = _interopRequireDefault(_Image2);
+
+	var _Audio2 = __webpack_require__(13);
+
+	var _Audio3 = _interopRequireDefault(_Audio2);
+
+	var _FileReader2 = __webpack_require__(21);
+
+	var _FileReader3 = _interopRequireDefault(_FileReader2);
+
+	var _HTMLElement2 = __webpack_require__(5);
+
+	var _HTMLElement3 = _interopRequireDefault(_HTMLElement2);
+
+	var _localStorage2 = __webpack_require__(22);
+
+	var _localStorage3 = _interopRequireDefault(_localStorage2);
+
+	var _location2 = __webpack_require__(23);
+
+	var _location3 = _interopRequireDefault(_location2);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	exports.document = _document3.default;
+	exports.navigator = _navigator3.default;
+	exports.XMLHttpRequest = _XMLHttpRequest3.default;
+	exports.WebSocket = _WebSocket3.default;
+	exports.Image = _Image3.default;
+	exports.Audio = _Audio3.default;
+	exports.FileReader = _FileReader3.default;
+	exports.HTMLElement = _HTMLElement3.default;
+	exports.localStorage = _localStorage3.default;
+	exports.location = _location3.default;
+
+
+	// 暴露全局的 canvas
+	var canvas = new _Canvas2.default();
+
+	exports.canvas = canvas;
+	exports.setTimeout = setTimeout;
+	exports.setInterval = setInterval;
+	exports.clearTimeout = clearTimeout;
+	exports.clearInterval = clearInterval;
+	exports.requestAnimationFrame = requestAnimationFrame;
+	exports.cancelAnimationFrame = cancelAnimationFrame;
+
+/***/ }),
+/* 2 */
+/***/ (function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+	exports.performance = exports.ontouchend = exports.ontouchmove = exports.ontouchstart = exports.screen = exports.devicePixelRatio = exports.innerHeight = exports.innerWidth = undefined;
+
+	var _performance2 = __webpack_require__(3);
+
+	var _performance3 = _interopRequireDefault(_performance2);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	var _wx$getSystemInfoSync = wx.getSystemInfoSync(),
+	    screenWidth = _wx$getSystemInfoSync.screenWidth,
+	    screenHeight = _wx$getSystemInfoSync.screenHeight,
+	    devicePixelRatio = _wx$getSystemInfoSync.devicePixelRatio;
+
+	var innerWidth = exports.innerWidth = screenWidth;
+	var innerHeight = exports.innerHeight = screenHeight;
+	exports.devicePixelRatio = devicePixelRatio;
+	var screen = exports.screen = {
+	  availWidth: innerWidth,
+	  availHeight: innerHeight
+	};
+	var ontouchstart = exports.ontouchstart = null;
+	var ontouchmove = exports.ontouchmove = null;
+	var ontouchend = exports.ontouchend = null;
+
+	exports.performance = _performance3.default;
+
+/***/ }),
+/* 3 */
+/***/ (function(module, exports) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+	var performance = void 0;
+
+	if (wx.getPerformance) {
+	  var _wx$getSystemInfoSync = wx.getSystemInfoSync(),
+	      platform = _wx$getSystemInfoSync.platform;
+
+	  var wxPerf = wx.getPerformance();
+	  var initTime = wxPerf.now();
+
+	  var clientPerfAdapter = Object.assign({}, wxPerf, {
+	    now: function now() {
+	      return (wxPerf.now() - initTime) / 1000;
+	    }
+	  });
+
+	  performance = platform === 'devtools' ? wxPerf : clientPerfAdapter;
+	}
+
+	exports.default = performance;
+
+/***/ }),
+/* 4 */
+/***/ (function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+	exports.HTMLCanvasElement = exports.HTMLImageElement = undefined;
+
+	var _HTMLElement3 = __webpack_require__(5);
+
+	var _HTMLElement4 = _interopRequireDefault(_HTMLElement3);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+	function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+	function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+	var HTMLImageElement = exports.HTMLImageElement = function (_HTMLElement) {
+	  _inherits(HTMLImageElement, _HTMLElement);
+
+	  function HTMLImageElement() {
+	    _classCallCheck(this, HTMLImageElement);
+
+	    return _possibleConstructorReturn(this, (HTMLImageElement.__proto__ || Object.getPrototypeOf(HTMLImageElement)).call(this, 'img'));
+	  }
+
+	  return HTMLImageElement;
+	}(_HTMLElement4.default);
+
+	var HTMLCanvasElement = exports.HTMLCanvasElement = function (_HTMLElement2) {
+	  _inherits(HTMLCanvasElement, _HTMLElement2);
+
+	  function HTMLCanvasElement() {
+	    _classCallCheck(this, HTMLCanvasElement);
+
+	    return _possibleConstructorReturn(this, (HTMLCanvasElement.__proto__ || Object.getPrototypeOf(HTMLCanvasElement)).call(this, 'canvas'));
+	  }
+
+	  return HTMLCanvasElement;
+	}(_HTMLElement4.default);
+
+/***/ }),
+/* 5 */
+/***/ (function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+
+	var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+	var _Element2 = __webpack_require__(6);
+
+	var _Element3 = _interopRequireDefault(_Element2);
+
+	var _util = __webpack_require__(9);
+
+	var _WindowProperties = __webpack_require__(2);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+	function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+	function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+	var HTMLElement = function (_Element) {
+	  _inherits(HTMLElement, _Element);
+
+	  function HTMLElement() {
+	    var tagName = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
+
+	    _classCallCheck(this, HTMLElement);
+
+	    var _this = _possibleConstructorReturn(this, (HTMLElement.__proto__ || Object.getPrototypeOf(HTMLElement)).call(this));
+
+	    _this.className = '';
+	    _this.childern = [];
+	    _this.style = {
+	      width: _WindowProperties.innerWidth + 'px',
+	      height: _WindowProperties.innerHeight + 'px'
+	    };
+	    _this.insertBefore = _util.noop;
+	    _this.innerHTML = '';
+
+	    _this.tagName = tagName.toUpperCase();
+	    return _this;
+	  }
+
+	  _createClass(HTMLElement, [{
+	    key: 'setAttribute',
+	    value: function setAttribute(name, value) {
+	      this[name] = value;
+	    }
+	  }, {
+	    key: 'getAttribute',
+	    value: function getAttribute(name) {
+	      return this[name];
+	    }
+	  }, {
+	    key: 'getBoundingClientRect',
+	    value: function getBoundingClientRect() {
+	      return {
+	        top: 0,
+	        left: 0,
+	        width: _WindowProperties.innerWidth,
+	        height: _WindowProperties.innerHeight
+	      };
+	    }
+	  }, {
+	    key: 'focus',
+	    value: function focus() {}
+	  }, {
+	    key: 'clientWidth',
+	    get: function get() {
+	      var ret = parseInt(this.style.fontSize, 10) * this.innerHTML.length;
+
+	      return Number.isNaN(ret) ? 0 : ret;
+	    }
+	  }, {
+	    key: 'clientHeight',
+	    get: function get() {
+	      var ret = parseInt(this.style.fontSize, 10);
+
+	      return Number.isNaN(ret) ? 0 : ret;
+	    }
+	  }]);
+
+	  return HTMLElement;
+	}(_Element3.default);
+
+	exports.default = HTMLElement;
+
+/***/ }),
+/* 6 */
+/***/ (function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+
+	var _Node2 = __webpack_require__(7);
+
+	var _Node3 = _interopRequireDefault(_Node2);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+	function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+	function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+	var ELement = function (_Node) {
+	  _inherits(ELement, _Node);
+
+	  function ELement() {
+	    _classCallCheck(this, ELement);
+
+	    var _this = _possibleConstructorReturn(this, (ELement.__proto__ || Object.getPrototypeOf(ELement)).call(this));
+
+	    _this.className = '';
+	    _this.children = [];
+	    return _this;
+	  }
+
+	  return ELement;
+	}(_Node3.default);
+
+	exports.default = ELement;
+
+/***/ }),
+/* 7 */
+/***/ (function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+
+	var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+	var _EventTarget2 = __webpack_require__(8);
+
+	var _EventTarget3 = _interopRequireDefault(_EventTarget2);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+	function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+	function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+	var Node = function (_EventTarget) {
+	  _inherits(Node, _EventTarget);
+
+	  function Node() {
+	    _classCallCheck(this, Node);
+
+	    var _this = _possibleConstructorReturn(this, (Node.__proto__ || Object.getPrototypeOf(Node)).call(this));
+
+	    _this.childNodes = [];
+	    return _this;
+	  }
+
+	  _createClass(Node, [{
+	    key: 'appendChild',
+	    value: function appendChild(node) {
+	      if (node instanceof Node) {
+	        this.childNodes.push(node);
+	      } else {
+	        throw new TypeError('Failed to executed \'appendChild\' on \'Node\': parameter 1 is not of type \'Node\'.');
+	      }
+	    }
+	  }, {
+	    key: 'cloneNode',
+	    value: function cloneNode() {
+	      var copyNode = Object.create(this);
+
+	      Object.assign(copyNode, this);
+	      return copyNode;
+	    }
+	  }, {
+	    key: 'removeChild',
+	    value: function removeChild(node) {
+	      var index = this.childNodes.findIndex(function (child) {
+	        return child === node;
+	      });
+
+	      if (index > -1) {
+	        return this.childNodes.splice(index, 1);
+	      }
+	      return null;
+	    }
+	  }]);
+
+	  return Node;
+	}(_EventTarget3.default);
+
+	exports.default = Node;
+
+/***/ }),
+/* 8 */
+/***/ (function(module, exports) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+
+	var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+	function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+	var _events = new WeakMap();
+
+	var EventTarget = function () {
+	  function EventTarget() {
+	    _classCallCheck(this, EventTarget);
+
+	    _events.set(this, {});
+	  }
+
+	  _createClass(EventTarget, [{
+	    key: 'addEventListener',
+	    value: function addEventListener(type, listener) {
+	      var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
+
+	      var events = _events.get(this);
+
+	      if (!events) {
+	        events = {};
+	        _events.set(this, events);
+	      }
+	      if (!events[type]) {
+	        events[type] = [];
+	      }
+	      events[type].push(listener);
+
+	      if (options.capture) {
+	        console.warn('EventTarget.addEventListener: options.capture is not implemented.');
+	      }
+	      if (options.once) {
+	        console.warn('EventTarget.addEventListener: options.once is not implemented.');
+	      }
+	      if (options.passive) {
+	        console.warn('EventTarget.addEventListener: options.passive is not implemented.');
+	      }
+	    }
+	  }, {
+	    key: 'removeEventListener',
+	    value: function removeEventListener(type, listener) {
+	      var listeners = _events.get(this)[type];
+
+	      if (listeners && listeners.length > 0) {
+	        for (var i = listeners.length; i--; i > 0) {
+	          if (listeners[i] === listener) {
+	            listeners.splice(i, 1);
+	            break;
+	          }
+	        }
+	      }
+	    }
+	  }, {
+	    key: 'dispatchEvent',
+	    value: function dispatchEvent() {
+	      var event = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+
+	      var listeners = _events.get(this)[event.type];
+
+	      if (listeners) {
+	        for (var i = 0; i < listeners.length; i++) {
+	          listeners[i](event);
+	        }
+	      }
+	    }
+	  }]);
+
+	  return EventTarget;
+	}();
+
+	exports.default = EventTarget;
+
+/***/ }),
+/* 9 */
+/***/ (function(module, exports) {
+
+	"use strict";
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+	exports.noop = noop;
+	function noop() {}
+
+/***/ }),
+/* 10 */
+/***/ (function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+	exports.default = Canvas;
+
+	var _constructor = __webpack_require__(4);
+
+	var _HTMLElement = __webpack_require__(5);
+
+	var _HTMLElement2 = _interopRequireDefault(_HTMLElement);
+
+	var _document = __webpack_require__(11);
+
+	var _document2 = _interopRequireDefault(_document);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	var hasModifiedCanvasPrototype = false;
+	var hasInit2DContextConstructor = false;
+	var hasInitWebGLContextConstructor = false;
+
+	function Canvas() {
+	  var canvas = wx.createCanvas();
+
+	  canvas.type = 'canvas';
+
+	  canvas.__proto__.__proto__ = new _HTMLElement2.default('canvas');
+
+	  var _getContext = canvas.getContext;
+
+	  canvas.getBoundingClientRect = function () {
+	    var ret = {
+	      top: 0,
+	      left: 0,
+	      width: window.innerWidth,
+	      height: window.innerHeight
+	    };
+	    return ret;
+	  };
+
+	  return canvas;
+	}
+
+/***/ }),
+/* 11 */
+/***/ (function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+
+	var _window = __webpack_require__(1);
+
+	var window = _interopRequireWildcard(_window);
+
+	var _HTMLElement = __webpack_require__(5);
+
+	var _HTMLElement2 = _interopRequireDefault(_HTMLElement);
+
+	var _Image = __webpack_require__(12);
+
+	var _Image2 = _interopRequireDefault(_Image);
+
+	var _Audio = __webpack_require__(13);
+
+	var _Audio2 = _interopRequireDefault(_Audio);
+
+	var _Canvas = __webpack_require__(10);
+
+	var _Canvas2 = _interopRequireDefault(_Canvas);
+
+	__webpack_require__(16);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }
+
+	var events = {};
+
+	var document = {
+	  readyState: 'complete',
+	  visibilityState: 'visible',
+	  documentElement: window,
+	  hidden: false,
+	  style: {},
+	  location: window.location,
+	  ontouchstart: null,
+	  ontouchmove: null,
+	  ontouchend: null,
+
+	  head: new _HTMLElement2.default('head'),
+	  body: new _HTMLElement2.default('body'),
+
+	  createElement: function createElement(tagName) {
+	    if (tagName === 'canvas') {
+	      return new _Canvas2.default();
+	    } else if (tagName === 'audio') {
+	      return new _Audio2.default();
+	    } else if (tagName === 'img') {
+	      return new _Image2.default();
+	    }
+
+	    return new _HTMLElement2.default(tagName);
+	  },
+	  getElementById: function getElementById(id) {
+	    if (id === window.canvas.id) {
+	      return window.canvas;
+	    }
+	    return null;
+	  },
+	  getElementsByTagName: function getElementsByTagName(tagName) {
+	    if (tagName === 'head') {
+	      return [document.head];
+	    } else if (tagName === 'body') {
+	      return [document.body];
+	    } else if (tagName === 'canvas') {
+	      return [window.canvas];
+	    }
+	    return [];
+	  },
+	  getElementsByName: function getElementsByName(tagName) {
+	    if (tagName === 'head') {
+	      return [document.head];
+	    } else if (tagName === 'body') {
+	      return [document.body];
+	    } else if (tagName === 'canvas') {
+	      return [window.canvas];
+	    }
+	    return [];
+	  },
+	  querySelector: function querySelector(query) {
+	    if (query === 'head') {
+	      return document.head;
+	    } else if (query === 'body') {
+	      return document.body;
+	    } else if (query === 'canvas') {
+	      return window.canvas;
+	    } else if (query === '#' + window.canvas.id) {
+	      return window.canvas;
+	    }
+	    return null;
+	  },
+	  querySelectorAll: function querySelectorAll(query) {
+	    if (query === 'head') {
+	      return [document.head];
+	    } else if (query === 'body') {
+	      return [document.body];
+	    } else if (query === 'canvas') {
+	      return [window.canvas];
+	    }
+	    return [];
+	  },
+	  addEventListener: function addEventListener(type, listener) {
+	    if (!events[type]) {
+	      events[type] = [];
+	    }
+	    events[type].push(listener);
+	  },
+	  removeEventListener: function removeEventListener(type, listener) {
+	    var listeners = events[type];
+
+	    if (listeners && listeners.length > 0) {
+	      for (var i = listeners.length; i--; i > 0) {
+	        if (listeners[i] === listener) {
+	          listeners.splice(i, 1);
+	          break;
+	        }
+	      }
+	    }
+	  },
+	  dispatchEvent: function dispatchEvent(event) {
+	    var listeners = events[event.type];
+
+	    if (listeners) {
+	      for (var i = 0; i < listeners.length; i++) {
+	        listeners[i](event);
+	      }
+	    }
+	  }
+	};
+
+	exports.default = document;
+
+/***/ }),
+/* 12 */
+/***/ (function(module, exports) {
+
+	"use strict";
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+	exports.default = Image;
+	function Image() {
+	  var image = wx.createImage();
+
+	  return image;
+	}
+
+/***/ }),
+/* 13 */
+/***/ (function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+
+	var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+	var _HTMLAudioElement2 = __webpack_require__(14);
+
+	var _HTMLAudioElement3 = _interopRequireDefault(_HTMLAudioElement2);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+	function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+	function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+	var HAVE_NOTHING = 0;
+	var HAVE_METADATA = 1;
+	var HAVE_CURRENT_DATA = 2;
+	var HAVE_FUTURE_DATA = 3;
+	var HAVE_ENOUGH_DATA = 4;
+
+	var _innerAudioContext = new WeakMap();
+	var _src = new WeakMap();
+	var _loop = new WeakMap();
+	var _autoplay = new WeakMap();
+
+	var Audio = function (_HTMLAudioElement) {
+	  _inherits(Audio, _HTMLAudioElement);
+
+	  function Audio(url) {
+	    _classCallCheck(this, Audio);
+
+	    var _this = _possibleConstructorReturn(this, (Audio.__proto__ || Object.getPrototypeOf(Audio)).call(this));
+
+	    _this.HAVE_NOTHING = HAVE_NOTHING;
+	    _this.HAVE_METADATA = HAVE_METADATA;
+	    _this.HAVE_CURRENT_DATA = HAVE_CURRENT_DATA;
+	    _this.HAVE_FUTURE_DATA = HAVE_FUTURE_DATA;
+	    _this.HAVE_ENOUGH_DATA = HAVE_ENOUGH_DATA;
+	    _this.readyState = HAVE_NOTHING;
+
+
+	    _src.set(_this, '');
+
+	    var innerAudioContext = wx.createInnerAudioContext();
+
+	    _innerAudioContext.set(_this, innerAudioContext);
+
+	    innerAudioContext.onCanplay(function () {
+	      _this.dispatchEvent({ type: 'load' });
+	      _this.dispatchEvent({ type: 'loadend' });
+	      _this.dispatchEvent({ type: 'canplay' });
+	      _this.dispatchEvent({ type: 'canplaythrough' });
+	      _this.dispatchEvent({ type: 'loadedmetadata' });
+	      _this.readyState = HAVE_CURRENT_DATA;
+	    });
+	    innerAudioContext.onPlay(function () {
+	      _this.dispatchEvent({ type: 'play' });
+	    });
+	    innerAudioContext.onPause(function () {
+	      _this.dispatchEvent({ type: 'pause' });
+	    });
+	    innerAudioContext.onEnded(function () {
+	      _this.dispatchEvent({ type: 'ended' });
+	      _this.readyState = HAVE_ENOUGH_DATA;
+	    });
+	    innerAudioContext.onError(function () {
+	      _this.dispatchEvent({ type: 'error' });
+	    });
+
+	    if (url) {
+	      _innerAudioContext.get(_this).src = url;
+	    }
+	    return _this;
+	  }
+
+	  _createClass(Audio, [{
+	    key: 'load',
+	    value: function load() {
+	      console.warn('HTMLAudioElement.load() is not implemented.');
+	    }
+	  }, {
+	    key: 'play',
+	    value: function play() {
+	      _innerAudioContext.get(this).play();
+	    }
+	  }, {
+	    key: 'pause',
+	    value: function pause() {
+	      _innerAudioContext.get(this).pause();
+	    }
+	  }, {
+	    key: 'canPlayType',
+	    value: function canPlayType() {
+	      var mediaType = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
+
+	      if (typeof mediaType !== 'string') {
+	        return '';
+	      }
+
+	      if (mediaType.indexOf('audio/mpeg') > -1 || mediaType.indexOf('audio/mp4')) {
+	        return 'probably';
+	      }
+	      return '';
+	    }
+	  }, {
+	    key: 'cloneNode',
+	    value: function cloneNode() {
+	      var newAudio = new Audio();
+	      newAudio.loop = _innerAudioContext.get(this).loop;
+	      newAudio.autoplay = _innerAudioContext.get(this).autoplay;
+	      newAudio.src = this.src;
+	      return newAudio;
+	    }
+	  }, {
+	    key: 'currentTime',
+	    get: function get() {
+	      return _innerAudioContext.get(this).currentTime;
+	    },
+	    set: function set(value) {
+	      _innerAudioContext.get(this).seek(value);
+	    }
+	  }, {
+	    key: 'src',
+	    get: function get() {
+	      return _src.get(this);
+	    },
+	    set: function set(value) {
+	      _src.set(this, value);
+	      _innerAudioContext.get(this).src = value;
+	    }
+	  }, {
+	    key: 'loop',
+	    get: function get() {
+	      return _innerAudioContext.get(this).loop;
+	    },
+	    set: function set(value) {
+	      _innerAudioContext.get(this).loop = value;
+	    }
+	  }, {
+	    key: 'autoplay',
+	    get: function get() {
+	      return _innerAudioContext.get(this).autoplay;
+	    },
+	    set: function set(value) {
+	      _innerAudioContext.get(this).autoplay = value;
+	    }
+	  }, {
+	    key: 'paused',
+	    get: function get() {
+	      return _innerAudioContext.get(this).paused;
+	    }
+	  }]);
+
+	  return Audio;
+	}(_HTMLAudioElement3.default);
+
+	exports.default = Audio;
+
+/***/ }),
+/* 14 */
+/***/ (function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+
+	var _HTMLMediaElement2 = __webpack_require__(15);
+
+	var _HTMLMediaElement3 = _interopRequireDefault(_HTMLMediaElement2);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+	function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+	function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+	var HTMLAudioElement = function (_HTMLMediaElement) {
+	  _inherits(HTMLAudioElement, _HTMLMediaElement);
+
+	  function HTMLAudioElement() {
+	    _classCallCheck(this, HTMLAudioElement);
+
+	    return _possibleConstructorReturn(this, (HTMLAudioElement.__proto__ || Object.getPrototypeOf(HTMLAudioElement)).call(this, 'audio'));
+	  }
+
+	  return HTMLAudioElement;
+	}(_HTMLMediaElement3.default);
+
+	exports.default = HTMLAudioElement;
+
+/***/ }),
+/* 15 */
+/***/ (function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+
+	var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+	var _HTMLElement2 = __webpack_require__(5);
+
+	var _HTMLElement3 = _interopRequireDefault(_HTMLElement2);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+	function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+	function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+	var HTMLMediaElement = function (_HTMLElement) {
+	  _inherits(HTMLMediaElement, _HTMLElement);
+
+	  function HTMLMediaElement(type) {
+	    _classCallCheck(this, HTMLMediaElement);
+
+	    return _possibleConstructorReturn(this, (HTMLMediaElement.__proto__ || Object.getPrototypeOf(HTMLMediaElement)).call(this, type));
+	  }
+
+	  _createClass(HTMLMediaElement, [{
+	    key: 'addTextTrack',
+	    value: function addTextTrack() {}
+	  }, {
+	    key: 'captureStream',
+	    value: function captureStream() {}
+	  }, {
+	    key: 'fastSeek',
+	    value: function fastSeek() {}
+	  }, {
+	    key: 'load',
+	    value: function load() {}
+	  }, {
+	    key: 'pause',
+	    value: function pause() {}
+	  }, {
+	    key: 'play',
+	    value: function play() {}
+	  }]);
+
+	  return HTMLMediaElement;
+	}(_HTMLElement3.default);
+
+	exports.default = HTMLMediaElement;
+
+/***/ }),
+/* 16 */
+/***/ (function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	__webpack_require__(17);
+
+/***/ }),
+/* 17 */
+/***/ (function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	var _window = __webpack_require__(1);
+
+	var window = _interopRequireWildcard(_window);
+
+	var _document = __webpack_require__(11);
+
+	var _document2 = _interopRequireDefault(_document);
+
+	var _util = __webpack_require__(9);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }
+
+	function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+	var TouchEvent = function TouchEvent(type) {
+	  _classCallCheck(this, TouchEvent);
+
+	  this.target = window.canvas;
+	  this.currentTarget = window.canvas;
+	  this.touches = [];
+	  this.targetTouches = [];
+	  this.changedTouches = [];
+	  this.preventDefault = _util.noop;
+	  this.stopPropagation = _util.noop;
+
+	  this.type = type;
+	};
+
+	function touchEventHandlerFactory(type) {
+	  return function (event) {
+	    var touchEvent = new TouchEvent(type);
+
+	    touchEvent.touches = event.touches;
+	    touchEvent.targetTouches = Array.prototype.slice.call(event.touches);
+	    touchEvent.changedTouches = event.changedTouches;
+	    touchEvent.timeStamp = event.timeStamp;
+	    _document2.default.dispatchEvent(touchEvent);
+	  };
+	}
+
+	wx.onTouchStart(touchEventHandlerFactory('touchstart'));
+	wx.onTouchMove(touchEventHandlerFactory('touchmove'));
+	wx.onTouchEnd(touchEventHandlerFactory('touchend'));
+	wx.onTouchCancel(touchEventHandlerFactory('touchcancel'));
+
+/***/ }),
+/* 18 */
+/***/ (function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+
+	var _util = __webpack_require__(9);
+
+	// TODO 需要 wx.getSystemInfo 获取更详细信息
+	var _wx$getSystemInfoSync = wx.getSystemInfoSync(),
+	    platform = _wx$getSystemInfoSync.platform;
+
+	var navigator = {
+	  platform: platform,
+	  language: 'zh-cn',
+	  appVersion: '5.0 (iPhone; CPU iPhone OS 9_1 like Mac OS X) AppleWebKit/601.1.46 (KHTML, like Gecko) Version/9.0 Mobile/13B143 Safari/601.1',
+	  userAgent: 'Mozilla/5.0 (iPhone; CPU iPhone OS 10_3_1 like Mac OS X) AppleWebKit/603.1.30 (KHTML, like Gecko) Mobile/14E8301 MicroMessenger/6.6.0 MiniGame NetType/WIFI Language/zh_CN',
+	  onLine: true, // TODO 用 wx.getNetworkStateChange 和 wx.onNetworkStateChange 来返回真实的状态
+
+	  // TODO 用 wx.getLocation 来封装 geolocation
+	  geolocation: {
+	    getCurrentPosition: _util.noop,
+	    watchPosition: _util.noop,
+	    clearWatch: _util.noop
+	  }
+	};
+
+	exports.default = navigator;
+
+/***/ }),
+/* 19 */
+/***/ (function(module, exports) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+
+	var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+	function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+	var _url = new WeakMap();
+	var _method = new WeakMap();
+	var _requestHeader = new WeakMap();
+	var _responseHeader = new WeakMap();
+	var _requestTask = new WeakMap();
+
+	function _triggerEvent(type) {
+	  if (typeof this['on' + type] === 'function') {
+	    for (var _len = arguments.length, args = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
+	      args[_key - 1] = arguments[_key];
+	    }
+
+	    this['on' + type].apply(this, args);
+	  }
+	}
+
+	function _changeReadyState(readyState) {
+	  this.readyState = readyState;
+	  _triggerEvent.call(this, 'readystatechange');
+	}
+
+	var XMLHttpRequest = function () {
+	  // TODO 没法模拟 HEADERS_RECEIVED 和 LOADING 两个状态
+	  function XMLHttpRequest() {
+	    _classCallCheck(this, XMLHttpRequest);
+
+	    this.onabort = null;
+	    this.onerror = null;
+	    this.onload = null;
+	    this.onloadstart = null;
+	    this.onprogress = null;
+	    this.ontimeout = null;
+	    this.onloadend = null;
+	    this.onreadystatechange = null;
+	    this.readyState = 0;
+	    this.response = null;
+	    this.responseText = null;
+	    this.responseType = '';
+	    this.responseXML = null;
+	    this.status = 0;
+	    this.statusText = '';
+	    this.upload = {};
+	    this.withCredentials = false;
+
+	    _requestHeader.set(this, {
+	      'content-type': 'application/x-www-form-urlencoded'
+	    });
+	    _responseHeader.set(this, {});
+	  }
+
+	  /*
+	   * TODO 这一批事件应该是在 XMLHttpRequestEventTarget.prototype 上面的
+	   */
+
+
+	  _createClass(XMLHttpRequest, [{
+	    key: 'abort',
+	    value: function abort() {
+	      var myRequestTask = _requestTask.get(this);
+
+	      if (myRequestTask) {
+	        myRequestTask.abort();
+	      }
+	    }
+	  }, {
+	    key: 'getAllResponseHeaders',
+	    value: function getAllResponseHeaders() {
+	      var responseHeader = _responseHeader.get(this);
+
+	      return Object.keys(responseHeader).map(function (header) {
+	        return header + ': ' + responseHeader[header];
+	      }).join('\n');
+	    }
+	  }, {
+	    key: 'getResponseHeader',
+	    value: function getResponseHeader(header) {
+	      return _responseHeader.get(this)[header];
+	    }
+	  }, {
+	    key: 'open',
+	    value: function open(method, url /* async, user, password 这几个参数在小程序内不支持*/) {
+	      _method.set(this, method);
+	      _url.set(this, url);
+	      _changeReadyState.call(this, XMLHttpRequest.OPENED);
+	    }
+	  }, {
+	    key: 'overrideMimeType',
+	    value: function overrideMimeType() {}
+	  }, {
+	    key: 'send',
+	    value: function send() {
+	      var _this = this;
+
+	      var data = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
+
+	      if (this.readyState !== XMLHttpRequest.OPENED) {
+	        throw new Error("Failed to execute 'send' on 'XMLHttpRequest': The object's state must be OPENED.");
+	      } else {
+	        wx.request({
+	          data: data,
+	          url: _url.get(this),
+	          method: _method.get(this),
+	          header: _requestHeader.get(this),
+	          responseType: this.responseType,
+	          success: function success(_ref) {
+	            var data = _ref.data,
+	                statusCode = _ref.statusCode,
+	                header = _ref.header;
+
+	            if (typeof data !== 'string' && !(data instanceof ArrayBuffer)) {
+	              try {
+	                data = JSON.stringify(data);
+	              } catch (e) {
+	                data = data;
+	              }
+	            }
+
+	            _this.status = statusCode;
+	            _responseHeader.set(_this, header);
+	            _triggerEvent.call(_this, 'loadstart');
+	            _changeReadyState.call(_this, XMLHttpRequest.HEADERS_RECEIVED);
+	            _changeReadyState.call(_this, XMLHttpRequest.LOADING);
+
+	            _this.response = data;
+
+	            if (data instanceof ArrayBuffer) {
+	              _this.responseText = '';
+	              var bytes = new Uint8Array(data);
+	              var len = bytes.byteLength;
+
+	              for (var i = 0; i < len; i++) {
+	                _this.responseText += String.fromCharCode(bytes[i]);
+	              }
+	            } else {
+	              _this.responseText = data;
+	            }
+	            _changeReadyState.call(_this, XMLHttpRequest.DONE);
+	            _triggerEvent.call(_this, 'load');
+	            _triggerEvent.call(_this, 'loadend');
+	          },
+	          fail: function fail(_ref2) {
+	            var errMsg = _ref2.errMsg;
+
+	            // TODO 规范错误
+	            if (errMsg.indexOf('abort') !== -1) {
+	              _triggerEvent.call(_this, 'abort');
+	            } else {
+	              _triggerEvent.call(_this, 'error', errMsg);
+	            }
+	            _triggerEvent.call(_this, 'loadend');
+	          }
+	        });
+	      }
+	    }
+	  }, {
+	    key: 'setRequestHeader',
+	    value: function setRequestHeader(header, value) {
+	      var myHeader = _requestHeader.get(this);
+
+	      myHeader[header] = value;
+	      _requestHeader.set(this, myHeader);
+	    }
+	  }]);
+
+	  return XMLHttpRequest;
+	}();
+
+	XMLHttpRequest.UNSEND = 0;
+	XMLHttpRequest.OPENED = 1;
+	XMLHttpRequest.HEADERS_RECEIVED = 2;
+	XMLHttpRequest.LOADING = 3;
+	XMLHttpRequest.DONE = 4;
+	exports.default = XMLHttpRequest;
+
+/***/ }),
+/* 20 */
+/***/ (function(module, exports) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+
+	var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+	function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+	var _socketTask = new WeakMap();
+
+	var WebSocket = function () {
+	  // TODO 更新 binaryType
+	  // The connection is in the process of closing.
+	  // The connection is not yet open.
+	  function WebSocket(url) {
+	    var _this = this;
+
+	    var protocols = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
+
+	    _classCallCheck(this, WebSocket);
+
+	    this.binaryType = '';
+	    this.bufferedAmount = 0;
+	    this.extensions = '';
+	    this.onclose = null;
+	    this.onerror = null;
+	    this.onmessage = null;
+	    this.onopen = null;
+	    this.protocol = '';
+	    this.readyState = 3;
+
+	    if (typeof url !== 'string' || !/(^ws:\/\/)|(^wss:\/\/)/.test(url)) {
+	      throw new TypeError('Failed to construct \'WebSocket\': The URL \'' + url + '\' is invalid');
+	    }
+
+	    this.url = url;
+	    this.readyState = WebSocket.CONNECTING;
+
+	    var socketTask = wx.connectSocket({
+	      url: url,
+	      protocols: Array.isArray(protocols) ? protocols : [protocols]
+	    });
+
+	    _socketTask.set(this, socketTask);
+
+	    socketTask.onClose(function (res) {
+	      _this.readyState = WebSocket.CLOSED;
+	      if (typeof _this.onclose === 'function') {
+	        _this.onclose(res);
+	      }
+	    });
+
+	    socketTask.onMessage(function (res) {
+	      if (typeof _this.onmessage === 'function') {
+	        _this.onmessage(res);
+	      }
+	    });
+
+	    socketTask.onOpen(function () {
+	      _this.readyState = WebSocket.OPEN;
+	      if (typeof _this.onopen === 'function') {
+	        _this.onopen();
+	      }
+	    });
+
+	    socketTask.onError(function (res) {
+	      if (typeof _this.onerror === 'function') {
+	        _this.onerror(new Error(res.errMsg));
+	      }
+	    });
+
+	    return this;
+	  } // TODO 小程序内目前获取不到，实际上需要根据服务器选择的 sub-protocol 返回
+	  // TODO 更新 bufferedAmount
+	  // The connection is closed or couldn't be opened.
+
+	  // The connection is open and ready to communicate.
+
+
+	  _createClass(WebSocket, [{
+	    key: 'close',
+	    value: function close(code, reason) {
+	      this.readyState = WebSocket.CLOSING;
+	      var socketTask = _socketTask.get(this);
+
+	      socketTask.close({
+	        code: code,
+	        reason: reason
+	      });
+	    }
+	  }, {
+	    key: 'send',
+	    value: function send(data) {
+	      if (typeof data !== 'string' && !(data instanceof ArrayBuffer)) {
+	        throw new TypeError('Failed to send message: The data ' + data + ' is invalid');
+	      }
+
+	      var socketTask = _socketTask.get(this);
+
+	      socketTask.send({
+	        data: data
+	      });
+	    }
+	  }]);
+
+	  return WebSocket;
+	}();
+
+	WebSocket.CONNECTING = 0;
+	WebSocket.OPEN = 1;
+	WebSocket.CLOSING = 2;
+	WebSocket.CLOSED = 3;
+	exports.default = WebSocket;
+
+/***/ }),
+/* 21 */
+/***/ (function(module, exports) {
+
+	"use strict";
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+
+	var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+	function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+	/*
+	 * TODO 使用 wx.readFile 来封装 FileReader
+	 */
+	var FileReader = function () {
+	  function FileReader() {
+	    _classCallCheck(this, FileReader);
+	  }
+
+	  _createClass(FileReader, [{
+	    key: "construct",
+	    value: function construct() {}
+	  }]);
+
+	  return FileReader;
+	}();
+
+	exports.default = FileReader;
+
+/***/ }),
+/* 22 */
+/***/ (function(module, exports) {
+
+	"use strict";
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+	var localStorage = {
+	  get length() {
+	    var _wx$getStorageInfoSyn = wx.getStorageInfoSync(),
+	        keys = _wx$getStorageInfoSyn.keys;
+
+	    return keys.length;
+	  },
+
+	  key: function key(n) {
+	    var _wx$getStorageInfoSyn2 = wx.getStorageInfoSync(),
+	        keys = _wx$getStorageInfoSyn2.keys;
+
+	    return keys[n];
+	  },
+	  getItem: function getItem(key) {
+	    return wx.getStorageSync(key);
+	  },
+	  setItem: function setItem(key, value) {
+	    return wx.setStorageSync(key, value);
+	  },
+	  removeItem: function removeItem(key) {
+	    wx.removeStorageSync(key);
+	  },
+	  clear: function clear() {
+	    wx.clearStorageSync();
+	  }
+	};
+
+	exports.default = localStorage;
+
+/***/ }),
+/* 23 */
+/***/ (function(module, exports) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+	var location = {
+	  href: 'game.js',
+	  reload: function reload() {}
+	};
+
+	exports.default = location;
+
+/***/ })
+/******/ ]);

Album/js/main.js

@@ -0,0 +1,1254 @@
+import { basePage } from './draw/base.js'
+import FLD from './draw/FirstLevelDirectory.js'
+import SLD from './draw/SecondLevelDirectory.js'
+import Content from './draw/content.js'
+import Details from './draw/details.js'
+import setPrice from './draw/price.js'
+
+//import canvas from './libs/weapp-adapter.js'
+
+var url = 'https://t6.9026.com/api/album/cat?parent_id=0&store_id=1'//初始顶级目录url
+var FLDsource = []//顶级目录对象列表
+var SLDsource = []//二级目录对象列表
+var GoodsSource = []//商品对象列表
+var AllSource = []//所有商品对象
+var GoodsDetail//商品详情
+var flag1 = 0//通过flag1来判断现在处于哪一个顶级目录，然后利用flag1传参数获取该顶级目录下的二级目录信息
+var flag2 = 0//通过flag1来判断现在处于哪一个二级目录，然后利用flag2传参数获取该顶级目录下的商品列表
+var flag3 = 0//通过flag3来判断选择的是哪一个商品，然后获取它的的详情
+var flag4 = 0//价格设置参考参数
+//获取手机屏幕大小信息
+
+var sw = 0
+var sh = 0
+//是否为iPhoneX
+let isiPhoneX = false
+wx.getSystemInfo({
+  success: function (res) {
+    sw = res.screenWidth
+    sh = res.screenHeight
+    let mobileType = res.model
+    if (mobileType == 'iPhone X') isiPhoneX = true
+    else isiPhoneX = false
+  }
+})
+console.log('iphonex:' + isiPhoneX)
+const screenWidth = sw
+const screenHeight = sh
+//定义画布
+//let canvas = wx.createCanvas()
+canvas.height = screenHeight * 2
+canvas.width = screenWidth * 2
+let context = canvas.getContext('2d')
+
+//中间商品列表显示区绘制辅助变量
+var imgx = 0
+var imgy = 0
+if (isiPhoneX) {
+  imgx = (screenWidth - 240 - 35) / 3
+  imgy = (screenHeight - 118) / 3
+} else {
+  imgx = (screenWidth - 180) / 3
+  imgy = (screenHeight - 118) / 3
+}
+const imgX = imgx
+const imgY = imgy
+const imgyy = (screenHeight - 95) / 9
+
+//定义按钮区域
+//一级目录按钮区域
+let FLDbtnArea = []
+//二级目录按钮区域
+let SLDbtnArea = []
+
+if (isiPhoneX) {
+  //产品列表区域
+  var CA = [{ startX: 67 + 75, startY: 42, endX: 67 + imgX + 75, endY: 42 + imgY + 25, status: false }, { startX: 77 + 75 + imgX, startY: 42, endX: 77 + 75 + imgX + imgX, endY: 42 + imgY + 25, status: false }, { startX: 87 + 75 + imgX + imgX, startY: 42, endX: 87 + 75 + imgX + imgX + imgX, endY: 42 + 25 + imgY, status: false },
+  { startX: 67 + 75, startY: 42 + imgY + 25, endX: 67 + imgX + 75, endY: 42 + imgY + 25 + imgY + 25, status: false }, { startX: 77 + 75 + imgX, startY: 42 + imgY + 25, endX: 77 + 75 + imgX + imgX, endY: 42 + imgY + 25 + imgY + 25, status: false }, { startX: 87 + 75 + imgX + imgX, startY: 42 + imgY + 25, endX: 87 + 75 + imgX + imgX + imgX, endY: 42 + imgY + 25 + imgY + 25, status: false },
+  { startX: 67 + 75, startY: 42 + imgY + 25 + imgY + 25, endX: 67 + 75 + imgX, endY: 42 + imgY + 25 + imgY + 25 + imgY + 25, status: false }, { startX: 77 + 75 + imgX, startY: 42 + imgY + 25 + imgY + 25, endX: 77 + 75 + imgX + imgX, endY: 42 + imgY + 25 + imgY + 25 + imgY + 25, status: false }, { startX: 87 + 75 + imgX + imgX, startY: 42 + imgY + 25 + imgY + 25, endX: 87 + 75 + imgX + imgX + imgX, endY: 42 + imgY + 25 + imgY + 25 + imgY + 25, status: false }]
+  //详情界面按钮区域
+  var DA = [{ startX: 35, startY: screenHeight - 50, endX: 50 + 35, endY: screenHeight }, { startX: screenWidth / 2 - 200 + 35, startY: screenHeight - 35, endX: screenWidth / 2 - 110 + 35, endY: screenHeight - 12 }, { startX: screenWidth / 2 - 100 + 35, startY: screenHeight - 35, endX: screenWidth / 2 - 10 + 35, endY: screenHeight - 12 }, { startX: screenWidth / 2 + 35, startY: screenHeight - 35, endX: screenWidth / 2 + 90 + 35, endY: screenHeight - 12 }, { startX: screenWidth / 2 + 100 + 35, startY: screenHeight - 35, endX: screenWidth / 2 + 190 + 35, endY: screenHeight - 12 }, { startX: 10 + 35, startY: screenHeight / 2 - 15, endX: 40 + 35, endY: screenHeight / 2 + 15 }, { startX: screenWidth - 40, startY: screenHeight / 2 - 15, endX: screenWidth - 10, endY: screenHeight / 2 + 15 }]
+  //新品上市，促销产品，风格
+  var SA = [{ startX: 35, startY: 50, endX: 60, endY: 75, status: true }, { startX: 35, startY: 75, endX: 60, endY: 100, status: false }, { startX: 35, startY: 100, endX: 60, endY: 125, status: false }, { startX: 35, startY: screenHeight - 60, endX: 75, endY: screenHeight - 30 }, { startX: 35, startY: screenHeight - 30, endX: 75, endY: screenHeight }]
+} else {
+  //产品列表区域
+  var CA = [{ startX: 67, startY: 42, endX: 67 + imgX, endY: 42 + imgY + 25, status: false }, { startX: 77 + imgX, startY: 42, endX: 77 + imgX + imgX, endY: 42 + imgY + 25, status: false }, { startX: 87 + imgX + imgX, startY: 42, endX: 87 + imgX + imgX + imgX, endY: 42 + 25 + imgY, status: false },
+  { startX: 67, startY: 42 + imgY + 25, endX: 67 + imgX, endY: 42 + imgY + 25 + imgY + 25, status: false }, { startX: 77 + imgX, startY: 42 + imgY + 25, endX: 77 + imgX + imgX, endY: 42 + imgY + 25 + imgY + 25, status: false }, { startX: 87 + imgX + imgX, startY: 42 + imgY + 25, endX: 87 + imgX + imgX + imgX, endY: 42 + imgY + 25 + imgY + 25, status: false },
+  { startX: 67, startY: 42 + imgY + 25 + imgY + 25, endX: 67 + imgX, endY: 42 + imgY + 25 + imgY + 25 + imgY + 25, status: false }, { startX: 77 + imgX, startY: 42 + imgY + 25 + imgY + 25, endX: 77 + imgX + imgX, endY: 42 + imgY + 25 + imgY + 25 + imgY + 25, status: false }, { startX: 87 + imgX + imgX, startY: 42 + imgY + 25 + imgY + 25, endX: 87 + imgX + imgX + imgX, endY: 42 + imgY + 25 + imgY + 25 + imgY + 25, status: false }]
+  //详情界面按钮区域
+  var DA = [{ startX: 0, startY: screenHeight - 50, endX: 50, endY: screenHeight }, { startX: screenWidth / 2 - 200, startY: screenHeight - 35, endX: screenWidth / 2 - 110, endY: screenHeight - 12 }, { startX: screenWidth / 2 - 100, startY: screenHeight - 35, endX: screenWidth / 2 - 10, endY: screenHeight - 12 }, { startX: screenWidth / 2, startY: screenHeight - 35, endX: screenWidth / 2 + 90, endY: screenHeight - 12 }, { startX: screenWidth / 2 + 100, startY: screenHeight - 35, endX: screenWidth / 2 + 190, endY: screenHeight - 12 }, { startX: 10, startY: screenHeight / 2 - 15, endX: 40, endY: screenHeight / 2 + 15 }, { startX: screenWidth - 40, startY: screenHeight / 2 - 15, endX: screenWidth - 10, endY: screenHeight / 2 + 15 }]
+  //新品上市，促销产品，风格
+  var SA = [{ startX: 0, startY: 50, endX: 25, endY: 75, status: true }, { startX: 0, startY: 75, endX: 25, endY: 100, status: false }, { startX: 0, startY: 100, endX: 25, endY: 125, status: false }, { startX: 0, startY: screenHeight - 60, endX: 40, endY: screenHeight - 30 }, { startX: 0, startY: screenHeight - 30, endX: 40, endY: screenHeight }]
+}
+
+const ContentbtnArea = [...CA]
+const DetailbtnArea = [...DA]
+const SLDArea = [...SA]
+
+//搜索按钮
+let SearchButton = [{ startX: 38, startY: 10, endX: 140, endY: 30 }, { startX: 150, startY: 10, endX: 200, endY: 30 }]
+//翻页按钮
+const pageArea = [{ startX: screenWidth - 50, startY: screenHeight - 30, endX: screenWidth, endY: screenHeight }, { startX: screenWidth - 50, startY: screenHeight - 65, endX: screenWidth, endY: screenHeight - 35 }]
+//尺寸安装图片转换界面
+const attrArea = [{ startX: (screenWidth - (screenHeight - 100) * 1.778) / 2, startY: 30, endX: screenWidth / 2, endY: 60 }, { startX: screenWidth / 2, startY: 30, endX: (screenWidth + (screenHeight - 100) * 1.778) / 2 - 30, endY: 60 }, { startX: (screenWidth + (screenHeight - 100) * 1.778) / 2 - 30, startY: 30, endX: (screenWidth + (screenHeight - 100) * 1.778) / 2, endY: 60 }]
+//setprice
+
+const setpriceArea = [{ startX: screenWidth - 100, startY: 50, endX: screenWidth - 50, endY: 50 + imgyy + 5 }, { startX: screenWidth - 100, startY: 50 + imgyy + 5, endX: screenWidth - 50, endY: 50 + (imgyy + 5) * 2 }, { startX: screenWidth - 100, startY: 50 + (imgyy + 5) * 2, endX: screenWidth - 50, endY: 50 + (imgyy + 5) * 3 }, { startX: screenWidth - 100, startY: 50 + (imgyy + 5) * 3, endX: screenWidth - 50, endY: 50 + (imgyy + 5) * 4 }, { startX: screenWidth - 100, startY: 50 + (imgyy + 5) * 4, endX: screenWidth - 50, endY: 50 + (imgyy + 5) * 5 }, { startX: screenWidth - 100, startY: 50 + (imgyy + 5) * 5, endX: screenWidth - 50, endY: 50 + (imgyy + 5) * 6 }, { startX: screenWidth - 100, startY: 50 + (imgyy + 5) * 6, endX: screenWidth - 50, endY: 50 + (imgyy + 5) * 7 }, { startX: screenWidth - 100, startY: 50 + (imgyy + 5) * 7, endX: screenWidth - 50, endY: 50 + (imgyy + 5) * 8 }, { startX: screenWidth - 100, startY: 50 + (imgyy + 5) * 8, endX: screenWidth - 50, endY: 50 + (imgyy + 5) * 9 }]
+// setprice ok
+
+const sp = [{ startX: screenWidth / 2 - 150, startY: screenHeight / 2 - 80, endX: screenWidth / 2 + 150, endY: screenHeight / 2 }, { startX: screenWidth / 2 - 40, startY: screenHeight / 2 + 30, endX: screenWidth / 2 + 40, endY: screenHeight / 2 + 70 },]
+
+//定义目录选中状态
+let FLDstatus = false
+let SLDstatus = false
+//定义是否在详情界面状态
+let Detailstatus = false
+//是否隐藏了按钮
+let Buttonstatus = false
+//touchmove是否结束
+let touchend = false
+//是不是经销商
+let isAgent = false
+//是否到尺寸和安装图片转换界面
+let attrFlag = false
+//风格是否打开
+let styleOpen = true
+//当前是尺寸还是安装
+let attrORupload = true
+//是否在设置价格的界面
+let setprice = false
+//是否点了报价
+let setClick = false
+//是否在设置电话
+let setMobile = false
+//定义当前页数
+let page = 0
+//手指开始点击的坐标，用于判断手势滑动的左右上下方向
+let startx = 0
+let starty = 0
+//agent_id
+let agent_id = 0
+let status = 0
+let style = 0
+let cat_id = 0
+//输入的搜索内容
+var KeyWord = ''
+//厂家名字
+var FactoryName = ''
+//输入的价格
+var pricein = 0.0
+//输入的电话
+var mobilein = '0'
+//绘制函数
+function reStart() {
+  console.log('reStartSuccess')//调用成功输出'reStartSuccess'
+  //reset()//清空之前屏幕上的绘制内容，减少缓存占用，及信息重叠
+  if (Detailstatus == false) {
+    //绘制两个侧边栏
+    basePage(context)
+    if (isAgent == true) {
+      if (setprice == true) {
+        context.fillStyle = '#FFA500'
+        context.fillRect(SLDArea[3].startX * 2, SLDArea[3].startY * 2, 80, 54)
+        context.fillRect(SLDArea[4].startX * 2, SLDArea[4].startY * 2 + 6, 80, 54)
+        context.fillStyle = '#fff'
+        context.font = '20px Arial'
+        context.fillText('设置电话', SLDArea[3].startX * 2, SLDArea[3].startY * 2 + 40)
+        context.fillText('退出报价', SLDArea[4].startX * 2, SLDArea[4].startY * 2 + 40)
+      } else {
+        context.fillStyle = '#FFA500'
+        context.fillRect(SLDArea[3].startX * 2, SLDArea[3].startY * 2, 80, 54)
+        context.fillRect(SLDArea[4].startX * 2, SLDArea[4].startY * 2 + 6, 80, 54)
+        context.fillStyle = '#fff'
+        context.font = '20px Arial'
+        context.fillText('设置电话', SLDArea[3].startX * 2, SLDArea[3].startY * 2 + 40)
+        context.fillText('设置报价', SLDArea[4].startX * 2, SLDArea[4].startY * 2 + 40)
+      }
+    }
+    //console.log(parseInt(GoodsSource.length / 9))
+    //上一页下一页按钮禁用
+    if (parseInt((GoodsSource.length - 1) / 9) == 0 || page == parseInt(GoodsSource.length / 9)) {
+      context.fillStyle = '#D3D3D3'
+      context.fillRect((screenWidth - 50) * 2, (screenHeight - 30) * 2, 50 * 2, 30 * 2)
+      context.fillStyle = '#fff'
+      context.font = "26px Arial"
+      context.fillText('下一页', (screenWidth - 46) * 2, (screenHeight - 9) * 2)
+    }
+    if (page == 0) {
+      context.fillStyle = '#D3D3D3'
+      context.fillRect((screenWidth - 50) * 2, (screenHeight - 65) * 2, 50 * 2, 30 * 2)
+      context.fillStyle = '#fff'
+      context.font = "26px Arial"
+      context.fillText('上一页', (screenWidth - 46) * 2, (screenHeight - 44) * 2)
+    }
+    //厂家名字
+    context.fillStyle = '#000'
+    context.font = '30px 黑体'
+    context.fillText(FactoryName, screenWidth - 60, 52)
+    //绘制一级目录
+    try {
+      let dir1 = new FLD()
+      for (let i = 0; i < FLDsource.length; i++) {
+        let img = wx.createImage()
+        img.src = FLDsource[i].pic_url
+        dir1.drawFLD(context, img, FLDbtnArea[i].status, i, FLDsource[i].name)
+      }
+    } catch (e) {
+      console.log(e.message)
+    }
+    //绘制二级目录
+    try {
+      if (SLDArea[0].status == true) {
+        context.fillStyle = '#f8f8f8'
+        context.fillRect(SLDArea[0].startX * 2, SLDArea[0].startY * 2, 40 * 2, 25 * 2)
+        context.font = '20px Arial'
+        context.fillStyle = '#FFA500'
+        context.fillText('新品上市', SLDArea[0].startX * 2, (SLDArea[0].startY + 20) * 2)
+        context.fillStyle = '#696969'
+        context.fillText('促销产品', SLDArea[1].startX * 2, (SLDArea[1].startY + 20) * 2)
+        context.fillText('风格', SLDArea[2].startX * 2, (SLDArea[2].startY + 20) * 2)
+      }
+      if (SLDArea[1].status == true) {
+        context.fillStyle = '#f8f8f8'
+        context.fillRect(SLDArea[1].startX * 2, SLDArea[1].startY * 2, 40 * 2, 25 * 2)
+        context.font = '20px Arial'
+        context.fillStyle = '#FFA500'
+        context.fillText('促销产品', SLDArea[1].startX * 2, (SLDArea[1].startY + 20) * 2)
+        context.fillStyle = '#696969'
+        context.fillText('新品上市', SLDArea[0].startX * 2, (SLDArea[0].startY + 20) * 2)
+        context.fillText('风格', SLDArea[2].startX * 2, (SLDArea[2].startY + 20) * 2)
+      }
+      if (SLDArea[2].status == true) {
+        context.fillStyle = '#f8f8f8'
+        context.fillRect(SLDArea[2].startX * 2, SLDArea[2].startY * 2, 40 * 2, 25 * 2)
+        context.font = '20px Arial'
+        context.fillStyle = '#FFA500'
+        context.fillText('风格', SLDArea[2].startX * 2, (SLDArea[2].startY + 20) * 2)
+        context.fillStyle = '#696969'
+        context.fillText('新品上市', SLDArea[0].startX * 2, (SLDArea[0].startY + 20) * 2)
+        context.fillText('促销产品', SLDArea[1].startX * 2, (SLDArea[1].startY + 20) * 2)
+      } else {
+        for (let i in SLDbtnArea) {
+          SLDbtnArea[i].status = false
+        }
+      }
+      if (styleOpen == true) {
+        let openImg = wx.createImage()
+        openImg.src = 'images/7.png'
+        openImg.onload = function () {
+          context.drawImage(openImg, SLDArea[2].startX * 2 + 25, SLDArea[2].startY * 2 - 5, 40 * 2, 40 * 2)
+          let dir2 = new SLD()
+          for (let i = 0; i < SLDbtnArea.length; i++) {
+            dir2.drawSLD(context, SLDbtnArea[i].status, i, SLDsource[i].name)
+          }
+        }
+      }
+      else {
+        let openImg = wx.createImage()
+        openImg.src = 'images/6.png'
+        openImg.onload = function () {
+          context.drawImage(openImg, SLDArea[2].startX * 2 + 25, SLDArea[2].startY * 2 - 5, 40 * 2, 40 * 2)
+        }
+      }
+    } catch (e) {
+      console.log(e.message)
+    }
+    if (setprice == false) {
+      //绘制内容
+      try {
+        let dir3 = new Content()
+        if (GoodsSource.length < 10) {//当商品列表小于10的时候，无需翻页，直接绘制
+          for (let i = 0; i < GoodsSource.length; i++) {
+            let img = wx.createImage()
+            img.src = GoodsSource[i].cover_pic
+            dir3.drawContent(context, img, i, GoodsSource[i].name)
+          }
+        }
+        else {//当商品列表大于9的时候，需要翻页，通过变量page来控制绘制
+          for (let j = page * 9; j < (page + 1) * 9; j++) {
+            let img = wx.createImage()
+            try {
+              img.src = GoodsSource[j].cover_pic
+              dir3.drawContent(context, img, j % 9, GoodsSource[j].name)
+            } catch (e) {
+              console.log(e.message)
+            }
+          }
+          // if (page > (GoodsSource.length - 1) % 9) break //如果页数大于实际页数的话，停止绘制,避免出现获取不到资源而报错
+        }
+      } catch (e) {
+        console.log(e.message)
+      }
+    } else {//设置报价
+      try {
+        let dir3 = new setPrice()
+        if (GoodsSource.length < 10) {//当商品列表小于10的时候，无需翻页，直接绘制
+          for (let i = 0; i < GoodsSource.length; i++) {
+            let img = wx.createImage()
+            img.src = GoodsSource[i].cover_pic
+            dir3.setPrice(context, img, i, GoodsSource[i].name, '0')
+          }
+        }
+        else {//当商品列表大于9的时候，需要翻页，通过变量page来控制绘制
+          for (let j = page * 9; j < (page + 1) * 9; j++) {
+            let img = wx.createImage()
+            try {
+              img.src = GoodsSource[j].cover_pic
+              dir3.setPrice(context, img, j % 9, GoodsSource[j].name, '0')
+            } catch (e) {
+              console.log(e.message)
+            }
+          }
+          // if (page > (GoodsSource.length - 1) % 9) break //如果页数大于实际页数的话，停止绘制,避免出现获取不到资源而报错
+        }
+      } catch (e) {
+
+      }
+    }
+  } else {//绘制详细内容
+    try {
+      let dt = new Details()
+      //console.log('进入详情')
+      let img = new Image()
+      img.src = GoodsDetail.detail_pic
+      if (Buttonstatus == false) {
+        dt.showDetails(context, img, GoodsDetail.name, GoodsDetail.price)
+      }
+      else {
+        if (isiPhoneX) {
+          context.drawImage(img, 70, 0, screenWidth * 2, screenHeight * 2)
+        } else {
+          context.drawImage(img, 0, 0, screenWidth * 2, screenHeight * 2)
+        }
+      }
+
+    } catch (e) {
+      console.log(e.message)
+      Detailstatus = false
+      wx.showToast({
+        title: '暂无详情',
+        icon: 'none'
+      })
+      reStart()
+    }
+  }
+}
+//触摸响应函数
+wx.onTouchStart(((e) => {
+  try {
+    //e.preventDefault()
+    var x = e.touches[0].clientX
+    var y = e.touches[0].clientY
+    startx = x
+    starty = y
+  } catch (evt) {
+    console.log(evt.message)
+  }
+  if (Detailstatus == false) {//当不在详情界面时
+    //一级目录控制
+    for (let btn in FLDbtnArea) {
+      if (x >= FLDbtnArea[btn].startX
+        && x <= FLDbtnArea[btn].endX
+        && y >= FLDbtnArea[btn].startY
+        && y <= FLDbtnArea[btn].endY) {
+        for (let i in FLDbtnArea) {//点击该按钮的时候，它变为活跃状态status=true，而其他所有按钮变为非活跃状态status=false
+          FLDbtnArea[i].status = false
+        }
+        for (let i in ContentbtnArea) {//发生页面切换时所有商品详情均为不活跃状态
+          ContentbtnArea[i].status = false
+        }
+        page = 0//发生页面切换时页数置0
+        flag1 = btn
+        flag2 = 0//发生一级目录切换时，二级目录选中第一个
+        status = 2
+        //FLDbtnArea[btn].status = true
+        SLDArea[0].status = true
+        SLDArea[1].status = false
+        SLDArea[2].status = false
+        getFLDsource(callback1, url)//重绘
+      }
+    }
+    //二级目录控制
+    for (let btn in SLDbtnArea) {
+      if (x >= SLDbtnArea[btn].startX
+        && x <= SLDbtnArea[btn].endX
+        && y >= SLDbtnArea[btn].startY
+        && y <= SLDbtnArea[btn].endY) {
+        if (styleOpen == true) {
+          for (let i in SLDbtnArea) {//点击该按钮的时候，它变为活跃状态status=true，而其他所有按钮变为非活跃状态status=false
+            SLDbtnArea[i].status = false
+          }
+          for (let i in ContentbtnArea) {//发生页面切换时所有商品详情均为不活跃状态
+            ContentbtnArea[i].status = false
+          }
+          SLDbtnArea[btn].status = true
+          status = 3
+          page = 0//发生页面切换时页数置0
+          flag2 = btn
+          SLDArea[0].status = false
+          SLDArea[1].status = false
+          SLDArea[2].status = true
+          //SLDbtnArea[btn].status = true
+          getSLDsource(callback2, FLDsource)//重绘
+        }
+      }
+    }
+    if (x >= SLDArea[0].startX
+      && x <= SLDArea[0].endX
+      && y >= SLDArea[0].startY
+      && y <= SLDArea[0].endY) {
+      page = 0
+      flag2 = 0
+      status = 2
+      SLDArea[0].status = true
+      SLDArea[1].status = false
+      SLDArea[2].status = false
+      for (let i in SLDbtnArea) {//点击该按钮的时候，它变为活跃状态status=true，而其他所有按钮变为非活跃状态status=false
+        SLDbtnArea[i].status = false
+      }
+      SLDbtnArea[0].status = true
+      getGoodsSource(callback3, SLDsource)
+    }
+    if (x >= SLDArea[1].startX
+      && x <= SLDArea[1].endX
+      && y >= SLDArea[1].startY
+      && y <= SLDArea[1].endY) {
+      page = 0
+      flag2 = 0
+      status = 1
+      SLDArea[0].status = false
+      SLDArea[1].status = true
+      SLDArea[2].status = false
+      for (let i in SLDbtnArea) {//点击该按钮的时候，它变为活跃状态status=true，而其他所有按钮变为非活跃状态status=false
+        SLDbtnArea[i].status = false
+      }
+      SLDbtnArea[0].status = true
+      getGoodsSource(callback3, SLDsource)
+    }
+    if (x >= SLDArea[2].startX
+      && x <= SLDArea[2].endX
+      && y >= SLDArea[2].startY
+      && y <= SLDArea[2].endY) {
+      if (styleOpen == true) styleOpen = false
+      else styleOpen = true
+      if (styleOpen == true) {
+        page = 0
+        flag2 = 0
+        status = 3
+        SLDArea[0].status = false
+        SLDArea[1].status = false
+        SLDArea[2].status = true
+        for (let i in SLDbtnArea) {//点击该按钮的时候，它变为活跃状态status=true，而其他所有按钮变为非活跃状态status=false
+          SLDbtnArea[i].status = false
+        }
+        SLDbtnArea[0].status = true
+      }
+      getGoodsSource(callback3, SLDsource)
+    }
+    //翻页控制
+    if (x >= pageArea[0].startX
+      && x <= pageArea[0].endX
+      && y >= pageArea[0].startY
+      && y <= pageArea[0].endY) {
+      if (page == parseInt(GoodsSource.length / 9)) {
+
+      } else {
+        if (page < parseInt(GoodsSource.length / 9))//只有在当前页数小于实际页数的时候才能再往上+
+          page++//点击翻页时页数+1
+        console.log(page)
+        //getFLDsource(callback1, url)//重绘
+        reStart()
+      }
+    }
+    if (x >= pageArea[1].startX
+      && x <= pageArea[1].endX
+      && y >= pageArea[1].startY
+      && y <= pageArea[1].endY) {
+      if (page == 0) {
+
+      } else {
+        if (page > 0)
+          page--//点击翻页时页数-1
+        console.log(page)
+        reStart()
+      }
+    }
+    //搜索
+    if (x >= SearchButton[0].startX
+      && x <= SearchButton[0].endX
+      && y >= SearchButton[0].startY
+      && y <= SearchButton[0].endY) {
+      //清除目录控制状态 
+      SLDArea[0].status = false
+      SLDArea[1].status = false
+      SLDArea[2].status = false
+      for (let i in FLDbtnArea) {
+        FLDbtnArea[i].status = false
+      }
+      GoodsSource = []
+      wx.showKeyboard({
+        defaultValue: '',
+        maxLength: 8,
+        multiple: false,
+        confirmHold: true,
+        confirmType: 'done',
+        success: function () {
+          wx.onKeyboardConfirm(((res) => {
+            KeyWord = res.value
+            context.fillStyle = '#fff'
+            context.fillRect(76, 20, 220, 40)
+            context.font = "26px Arial"
+            context.fillStyle = '#696969'
+            context.fillText(KeyWord, 90, 50)
+            wx.hideKeyboard({})
+            wx.showToast({
+              title: '输入完成',
+              icon: 'success',
+              duration: 500
+            })
+          }))
+        }
+      })
+      reStart()
+    }
+    if (x >= SearchButton[1].startX
+      && x <= SearchButton[1].endX
+      && y >= SearchButton[1].startY
+      && y <= SearchButton[1].endY) {
+      if (KeyWord == '') {
+        //do nothing
+      } else {
+        wx.request({
+          url: 'https://t6.9026.com/api/album/search_goods',
+          data: {
+            store_id: 1,
+            keywords: KeyWord
+          },
+          method: 'GET',
+          success: function (res) {
+            try {
+              let test = JSON.stringify(res.data)
+              let tet = JSON.parse(test)
+              GoodsSource.splice(0, GoodsSource.length)//每次调用重新填充数据的时候清空之前数据
+              for (let i in tet.data.goods) {
+                GoodsSource.push(tet.data.goods[i])
+              }
+            } catch (e) {
+              wx.showToast({
+                title: '请求异常',
+                icon: 'none',
+                duration: 800
+              })
+            }
+            callback3(GoodsSource)//导出商品列表
+          }
+        })
+      }
+    }
+    if(isAgent == true){
+      if (x >= SLDArea[3].startX
+        && x <= SLDArea[3].endX
+        && y >= SLDArea[3].startY
+        && y <= SLDArea[3].endY) {
+        setMobile = true
+        context.fillStyle = '#f8f8f8'
+        context.fillRect((screenWidth / 2 - 150) * 2, (screenHeight / 2 - 80) * 2, 300 * 2, 160 * 2)
+        context.fillStyle = '#A9A9A9'
+        context.font = '32px Arial'
+        context.fillText('设置联系电话', (screenWidth / 2 - 130) * 2, (screenHeight / 2 - 40) * 2)
+        context.fillStyle = '#DCDCDC'
+        context.fillText('电话', (screenWidth / 2 - 130) * 2, screenHeight)
+        context.fillStyle = '#A9A9A9'
+        context.fillRect((screenWidth / 2 - 150) * 2, screenHeight + 20, 600, 2)
+        context.fillStyle = '#DC143C'
+        context.fillRect(screenWidth - 80, screenHeight + 60, 160, 80)
+        context.fillStyle = '#fff'
+        context.fillText('确定', screenWidth - 30, screenHeight + 110)
+      }
+      if (x >= SLDArea[4].startX
+        && x <= SLDArea[4].endX
+        && y >= SLDArea[4].startY
+        && y <= SLDArea[4].endY) {
+        if (GoodsSource.length != 0) {
+          setMobile = false
+          if (setprice == true) {
+            setprice = false
+            reStart()
+          } else {
+            setprice = true
+            reStart()
+          }
+        } else {
+          wx.showToast({
+            title: '当前列表无商品',
+            icon: 'none',
+            duration: 500
+          })
+        }
+      }
+    }
+    if (setprice == false) {
+      if (setMobile == false) {
+        //内容点击进入详情控制
+        for (let con in ContentbtnArea) {
+          if (x >= ContentbtnArea[con].startX
+            && x <= ContentbtnArea[con].endX
+            && y >= ContentbtnArea[con].startY
+            && y <= ContentbtnArea[con].endY) {
+            Detailstatus = true
+            for (let x in ContentbtnArea) {
+              ContentbtnArea[x].status = false
+            }
+            ContentbtnArea[con].status = true//用于判断是否进入详情
+            con = parseInt(con)
+            flag3 = (page * 9) + con
+            Buttonstatus = false
+            getGoodsDetail(callback4, GoodsSource)
+            //reStart() //重绘
+          }
+        }
+      }
+    } else {
+      if (setMobile == false) {
+        if (setClick == false) {
+          for (let con in setpriceArea) {
+            if (x >= setpriceArea[con].startX
+              && x <= setpriceArea[con].endX
+              && y >= setpriceArea[con].startY
+              && y <= setpriceArea[con].endY) {
+              setClick = true
+              console.log('报价' + con)
+              con = parseInt(con)
+              flag4 = (page * 9) + con
+              context.fillStyle = '#f8f8f8'
+              context.fillRect((screenWidth / 2 - 150) * 2, (screenHeight / 2 - 80) * 2, 300 * 2, 160 * 2)
+              context.fillStyle = '#A9A9A9'
+              context.font = '32px Arial'
+              context.fillText(GoodsSource[flag4].name, (screenWidth / 2 - 130) * 2, (screenHeight / 2 - 40) * 2)
+              context.fillStyle = '#DCDCDC'
+              context.fillText('价格', (screenWidth / 2 - 130) * 2, screenHeight)
+              context.fillStyle = '#A9A9A9'
+              context.fillRect((screenWidth / 2 - 150) * 2, screenHeight + 20, 600, 2)
+              context.fillStyle = '#DC143C'
+              context.fillRect(screenWidth - 80, screenHeight + 60, 160, 80)
+              context.fillStyle = '#fff'
+              context.fillText('确定', screenWidth - 30, screenHeight + 110)
+            }
+          }
+        }
+        if (setClick == true) {
+          if (x >= sp[0].startX
+            && x <= sp[0].endX
+            && y >= sp[0].startY
+            && y <= sp[0].endY) {
+            wx.showKeyboard({
+              defaultValue: '',
+              maxLength: 8,
+              multiple: false,
+              confirmHold: true,
+              confirmType: 'done',
+              success: function () {
+                wx.onKeyboardConfirm(((res) => {
+                  pricein = res.value
+                  context.fillStyle = '#f8f8f8'
+                  context.fillRect((screenWidth / 2 - 150) * 2, screenHeight - 70, 600, 70)
+                  context.font = '32px Arial'
+                  context.fillStyle = '#DCDCDC'
+                  console.log('设置价格执行')
+                  context.fillText(pricein, (screenWidth / 2 - 130) * 2, screenHeight)
+                  wx.hideKeyboard({})
+                }))
+              }
+            })
+          }
+          if (x >= sp[1].startX
+            && x <= sp[1].endX
+            && y >= sp[1].startY
+            && y <= sp[1].endY) {
+            setClick = false
+            console.log('setSuccess')
+            let turl = 'https://t6.9026.com/api/album/set-price'
+            wx.request({
+              url: turl,
+              data: {
+                store_id: 1,
+                agent_id: agent_id,
+                type: 1,
+                price: pricein,
+                goods_id: GoodsSource[flag4].id
+              },
+              method: 'GET',
+              success: function () {
+                wx.showToast({
+                  title: GoodsSource[flag4].name+'价格已更新为'+pricein,
+                  icon: 'none',
+                  duration: 1500
+                })
+                getGoodsSource(callback3, SLDsource)
+              }
+            })
+          }
+        }
+      }
+    }
+    if (setMobile == false) {
+    } else {
+      if (x >= sp[0].startX
+        && x <= sp[0].endX
+        && y >= sp[0].startY
+        && y <= sp[0].endY) {
+        wx.showKeyboard({
+          defaultValue: '',
+          maxLength: 11,
+          multiple: false,
+          confirmHold: true,
+          confirmType: 'done',
+          success: function () {
+            wx.onKeyboardConfirm(((res) => {
+              mobilein = res.value
+              context.fillStyle = '#f8f8f8'
+              context.fillRect((screenWidth / 2 - 150) * 2, screenHeight - 70, 600, 70)
+              context.font = '32px Arial'
+              context.fillStyle = '#DCDCDC'
+              console.log('设置电话执行')
+              context.fillText(mobilein, (screenWidth / 2 - 130) * 2, screenHeight)
+              wx.hideKeyboard({})
+            }))
+          }
+        })
+      }
+      if (x >= sp[1].startX
+        && x <= sp[1].endX
+        && y >= sp[1].startY
+        && y <= sp[1].endY) {
+        setMobile = false
+        console.log('setMobileSuccess')
+        let turl = 'https://t6.9026.com/api/album/set-price'
+        wx.request({
+          url: turl,
+          data: {
+            store_id: 1,
+            agent_id: agent_id,
+            type: 0,
+            mobile: mobilein,
+            //goods_id: GoodsSource[flag4].id
+          },
+          method: 'GET',
+          success: function () {
+            wx.showToast({
+              title: '联系电话已更新为'+mobilein,
+              icon: 'none',
+              duration: 1500
+            })
+            getGoodsSource(callback3, SLDsource)
+          }
+        })
+      }
+    }
+  }
+  else {//在详情界面的时候
+    if (attrFlag == false) {
+      //  点击返回按钮返回原来界面
+      if (x >= DetailbtnArea[0].startX
+        && x <= DetailbtnArea[0].endX
+        && y >= DetailbtnArea[0].startY
+        && y <= DetailbtnArea[0].endY) {
+        Detailstatus = false
+        reStart() //重绘
+      }
+      //分享好友
+      if (x >= DetailbtnArea[1].startX
+        && x <= DetailbtnArea[1].endX
+        && y >= DetailbtnArea[1].startY
+        && y <= DetailbtnArea[1].endY) {
+        wx.shareAppMessage({
+          //title: '经销商id:' + agent_id,
+          query: 'agent_id=' + agent_id
+        })
+      }
+      //联系商家
+      if (x >= DetailbtnArea[2].startX
+        && x <= DetailbtnArea[2].endX
+        && y >= DetailbtnArea[2].startY
+        && y <= DetailbtnArea[2].endY) {
+        let tel = GoodsDetail.mobile
+        wx.setClipboardData({
+          data: tel,
+          success: function () {
+            if (tel == '') {
+              wx.showToast({
+                title: '暂无商家联系电话',
+                icon: 'none',
+                duration: 1000
+              })
+            } else {
+              wx.showToast({
+                title: '电话' + tel + '已复制到剪贴板',
+                icon: 'none',
+                duration: 1000
+              })
+            }
+          }
+        })
+      }
+      //详情&购买
+      if (x >= DetailbtnArea[3].startX
+        && x <= DetailbtnArea[3].endX
+        && y >= DetailbtnArea[3].startY
+        && y <= DetailbtnArea[3].endY) {
+        if (Buttonstatus == true) Buttonstatus = false
+        else Buttonstatus = true
+        let img = new wx.createImage()
+        img.src = GoodsDetail.detail
+        img.onload = function () {
+          let ratio = img.width / img.height
+          context.drawImage(img, screenWidth - (screenHeight - 80) * ratio, 60, (screenHeight - 80) * 2 * ratio, (screenHeight - 80) * 2)
+        }
+      }
+      //尺寸&安装
+      if (x >= DetailbtnArea[4].startX
+        && x <= DetailbtnArea[4].endX
+        && y >= DetailbtnArea[4].startY
+        && y <= DetailbtnArea[4].endY) {
+        attrFlag = true
+        Buttonstatus = false
+        let img = new wx.createImage()
+        img.src = GoodsDetail.upload_img
+        img.onload = function () {
+          let ratio = img.width / img.height
+          context.drawImage(img, (screenWidth - (screenHeight - 100) * ratio), 120, (screenHeight - 100) * 2 * ratio, (screenHeight - 100) * 2)
+          context.fillStyle = '#F5F5F5'
+          context.fillRect((screenWidth - (screenHeight - 100) * ratio), 60, (screenHeight - 100) * 2 * ratio, 60)
+          context.fillStyle = '#FFA500'
+          context.fillRect((screenWidth - (screenHeight - 100) * ratio), 118, (screenHeight - 100) * ratio, 2)
+          context.fillStyle = '#696969'
+          context.font = '30px Arial'
+          context.fillText('安装图', screenWidth - 280, 100)
+          context.fillText('尺寸图', screenWidth + 190, 100)
+          let closeImg = wx.createImage()
+          closeImg.src = 'images/close.png'
+          closeImg.onload = function () {
+            context.drawImage(closeImg, screenWidth + (screenHeight - 100) * ratio - 60, 60, 60, 60)
+          }
+        }
+      }
+      //上一张
+      if (x >= DetailbtnArea[5].startX
+        && x <= DetailbtnArea[5].endX
+        && y >= DetailbtnArea[5].startY
+        && y <= DetailbtnArea[5].endY) {
+        Buttonstatus = false
+        if (flag3 <= 0) {
+          wx.showToast({
+            title: '已经是第一个了',
+            icon: 'none',
+            duration: 800
+          })
+          flag3 = 0
+          reStart()
+        }
+        if (flag3 > 0) {
+          flag3 = flag3 - 1
+          console.log('flag3:' + flag3)
+          getGoodsDetail(callback4, GoodsSource)
+        }
+      }
+      //下一张
+      if (x >= DetailbtnArea[6].startX
+        && x <= DetailbtnArea[6].endX
+        && y >= DetailbtnArea[6].startY
+        && y <= DetailbtnArea[6].endY) {
+        Buttonstatus = false
+        if (flag3 == GoodsSource.length - 1) {
+          wx.showToast({
+            title: '已经是最后一个了',
+            icon: 'none',
+            duration: 800
+          })
+        }
+        if (flag3 < GoodsSource.length - 1) {
+          flag3 = flag3 + 1
+          console.log('flag3:' + flag3)
+          getGoodsDetail(callback4, GoodsSource)
+        }
+      }
+      //隐藏或显示按钮
+      if (x >= 75
+        && x <= screenWidth - 40
+        && y >= 0
+        && y <= screenHeight - 40) {
+        if (Buttonstatus == true) {
+          Buttonstatus = false
+          reStart()
+        }
+        else {
+          Buttonstatus = true
+          reStart()
+        }
+      }
+    } else {//在尺寸和安装图片转化界面
+      if (x >= attrArea[0].startX
+        && x <= attrArea[0].endX
+        && y >= attrArea[0].startY
+        && y <= attrArea[0].endY) {
+        attrFlag = true
+        Buttonstatus = false
+        let img = new wx.createImage()
+        img.src = GoodsDetail.upload_img
+        img.onload = function () {
+          let ratio = img.width / img.height
+          context.drawImage(img, (screenWidth - (screenHeight - 100) * ratio), 120, (screenHeight - 100) * 2 * ratio, (screenHeight - 100) * 2)
+          context.fillStyle = '#F5F5F5'
+          context.fillRect((screenWidth - (screenHeight - 100) * ratio), 60, (screenHeight - 100) * 2 * ratio, 60)
+          context.fillStyle = '#FFA500'
+          context.fillRect((screenWidth - (screenHeight - 100) * ratio), 118, (screenHeight - 100) * ratio, 2)
+          context.fillStyle = '#696969'
+          context.font = '30px Arial'
+          context.fillText('安装图', screenWidth - 280, 100)
+          context.fillText('尺寸图', screenWidth + 190, 100)
+          let closeImg = wx.createImage()
+          closeImg.src = 'images/close.png'
+          closeImg.onload = function () {
+            context.drawImage(closeImg, screenWidth + (screenHeight - 100) * ratio - 60, 60, 60, 60)
+          }
+        }
+      }
+      if (x >= attrArea[1].startX
+        && x <= attrArea[1].endX
+        && y >= attrArea[1].startY
+        && y <= attrArea[1].endY) {
+        attrFlag = true
+        Buttonstatus = false
+        let img = new wx.createImage()
+        img.src = GoodsDetail.attr
+        img.onload = function () {
+          let ratio = img.width / img.height
+          context.drawImage(img, (screenWidth - (screenHeight - 100) * ratio), 120, (screenHeight - 100) * 2 * ratio, (screenHeight - 100) * 2)
+          context.fillStyle = '#F5F5F5'
+          context.fillRect((screenWidth - (screenHeight - 100) * ratio), 60, (screenHeight - 100) * 2 * ratio, 60)
+          context.fillStyle = '#FFA500'
+          context.fillRect(screenWidth, 118, (screenHeight - 100) * ratio, 2)
+          context.fillStyle = '#696969'
+          context.font = '30px Arial'
+          context.fillText('安装图', screenWidth - 280, 100)
+          context.fillText('尺寸图', screenWidth + 190, 100)
+          let closeImg = wx.createImage()
+          closeImg.src = 'images/close.png'
+          closeImg.onload = function () {
+            context.drawImage(closeImg, screenWidth + (screenHeight - 100) * ratio - 60, 60, 60, 60)
+          }
+        }
+      }
+      //隐藏安装尺寸图片
+      if (x >= attrArea[2].startX
+        && x <= attrArea[2].endX
+        && y >= attrArea[2].startY
+        && y <= attrArea[2].endY) {
+        attrFlag = false
+        Buttonstatus = false
+        reStart()
+      }
+    }
+  }
+
+}))
+//滑动响应函数
+wx.onTouchEnd(((e) => {
+  var endX = e.changedTouches[0].clientX
+  var endY = e.changedTouches[0].clientY
+  if (Detailstatus == false) {
+
+  }
+  if (Detailstatus == true) {//在详情界面，左右滑动，查看商品
+    if (attrFlag == false) {
+      if (endX - startx > 0) {//向右滑动
+        Buttonstatus = false
+        if (flag3 <= 0) {
+          wx.showToast({
+            title: '已经是第一个了',
+            icon: 'none',
+            duration: 800
+          })
+          flag3 = 0
+          reStart()
+        }
+        if (flag3 > 0) {
+          flag3 = flag3 - 1
+          console.log('flag3:' + flag3)
+          getGoodsDetail(callback4, GoodsSource)
+        }
+      }
+      if (endX - startx < 0) {//向左滑动
+        Buttonstatus = false
+        if (flag3 == GoodsSource.length - 1) {
+          wx.showToast({
+            title: '已经是最后一个了',
+            icon: 'none',
+            duration: 800
+          })
+        }
+        if (flag3 < GoodsSource.length - 1) {
+          flag3 = flag3 + 1
+          console.log('flag3:' + flag3)
+          getGoodsDetail(callback4, GoodsSource)
+        }
+      }
+    }
+  }
+}))
+//清除之前绘制内容
+function reset() {
+  context.clearRect(0, 0, screenWidth * 2, screenHeight * 2)
+}
+//获取顶级目录列表
+function getFLDsource(callback1, url) {
+  try {
+    wx.request({
+      url: url,  //这里''里面填写你的服务器API接口的路径    
+      data: {
+      },  //这里是可以填写服务器需要的参数    
+      method: 'GET', // 声明GET请求    
+      // header: {}, // 设置请求的 header，GET请求可以不填    
+      success: function (res) {
+        if (res.statusCode == 200) {
+          let test = JSON.stringify(res.data)
+          let tet = JSON.parse(test)
+          FLDsource.splice(0, FLDsource.length)
+          for (let i in tet.data.cats) {
+            FLDsource.push(tet.data.cats[i])
+          }
+          callback1(FLDsource)//导出顶级目录列表
+        }
+        //console.log(res.statusCode)
+      }
+    });
+  } catch (e) {
+    wx.showToast({
+      title: '加载异常',
+      icon: 'none',
+      duration: 500
+    })
+  }
+
+}
+//在回调函数中通过顶级目录个数获得它的按钮区域
+function callback1(res) {
+  FLDbtnArea.splice(0, FLDbtnArea.length)//每次调用重新填充数据的时候清空之前数据
+  for (let i = 0; i < res.length; i++) {//通过顶级目录个数获得它的按钮区域
+    let s = false
+    if (i == flag1) s = true
+    let FLDobj = new Object()
+    FLDobj.startX = screenWidth - 50
+    FLDobj.startY = 50 * (i + 1)
+    FLDobj.endX = screenWidth
+    FLDobj.endY = 50 * (i + 2)
+    FLDobj.status = s
+    FLDbtnArea.push(FLDobj)
+  }
+  //console.log(FLDsource)
+  getSLDsource(callback2, FLDsource)//获取二级目录信息
+}
+//根据获取第一个请求函数得到的顶级目录信息来获取二级目录信息
+function getSLDsource(callback2, FLDsource) {
+  //  通过flag1来判断现在处于哪一个顶级目录，然后利用flag1传参数获取该顶级目录下的二级目录信息
+  let u = 'https://t6.9026.com/api/album/style?store_id=1'
+  //console.log(u)
+  try {
+    wx.request({
+      url: u,
+      data: {
+      },
+      method: 'GET',
+      success: function (res) {
+        if (res.statusCode == 200) {
+          let test = JSON.stringify(res.data)
+          let tet = JSON.parse(test)
+          SLDsource.splice(0, SLDsource.length)//每次调用重新填充数据的时候清空之前数据
+          for (let i in tet.data.style) {
+            SLDsource.push(tet.data.style[i])
+          }
+          callback2(SLDsource)//导出二级目录列表
+        }
+        //  console.log(res.statusCode)
+      }
+    })
+  } catch (e) {
+    wx.showToast({
+      title: '加载异常',
+      icon: 'none',
+      duration: 500
+    })
+  }
+}
+//通过二级目录列表的长度来得到它的按钮区域列表
+function callback2(res) {
+  SLDbtnArea.splice(0, SLDbtnArea.length)//每次调用重新填充数据的时候清空之前数据
+  for (let i = 0; i < res.length; i++) {
+    let s = false
+    if (i == flag2) s = true
+    let SLDobj = new Object()
+    if (isiPhoneX) {
+      SLDobj.startX = 35
+    } else {
+      SLDobj.startX = 0
+    }
+    SLDobj.startY = 25 * (i + 4) + 35
+    if (isiPhoneX) {
+      SLDobj.endX = 70
+    } else {
+      SLDobj.endX = 40
+    }
+    SLDobj.endY = 25 * (i + 5) + 35
+    SLDobj.status = s
+    SLDbtnArea.push(SLDobj)
+  }
+  //console.log(SLDsource)
+  // reStart()
+  getGoodsSource(callback3, SLDsource)
+}
+function getGoodsSource(callback3, SLDsource) {
+  cat_id = FLDsource[flag1].id
+  if (SLDsource) {
+    style = SLDsource[flag2].id
+  }
+  let u = 'https://t6.9026.com/api/album/goods' + '?store_id=1&cat_id=' + cat_id + '&status=' + status + '&style=' + style
+  wx.request({
+    url: u,
+    data: {
+    },
+    method: 'GET',
+    success: function (res) {
+      try {
+        let test = JSON.stringify(res.data)
+        let tet = JSON.parse(test)
+        FactoryName = tet.data.name
+        GoodsSource.splice(0, GoodsSource.length)//每次调用重新填充数据的时候清空之前数据
+        for (let i in tet.data.goods) {
+          GoodsSource.push(tet.data.goods[i])
+        }
+      } catch (e) {
+        wx.showToast({
+          title: '请求异常',
+          icon: 'none',
+          duration: 800
+        })
+      }
+      callback3(GoodsSource)//导出商品列表
+      //console.log(res.statusCode)
+    }
+  })
+
+}
+function callback3(res) {
+  console.log(GoodsSource)
+  reStart()
+}
+function getGoodsDetail(callback4, GoodsSource) {
+  //如果所点击的区域没有商品展示，那么不进入详情界面
+  let ur = 'https://t6.9026.com/api/album/goods-detail?store_id=1&agent_id=' + agent_id + '&goods_id='
+  try {
+    ur = ur + GoodsSource[flag3].id
+  } catch (e) {
+    console.log(e.message)
+    Detailstatus = false
+    // reStart()
+  }
+  wx.request({
+    url: ur,
+    data: {
+    },
+    method: 'GET',
+    success: function (res) {
+      try {
+        GoodsDetail = {}
+        let test = JSON.stringify(res.data)
+        let tet = JSON.parse(test)
+        GoodsDetail = tet.data.goods
+      } catch (e) {
+        Detailstatus = false
+        wx.showToast({
+          title: '暂无商品详情',
+          icon: 'none',
+          duration: 800
+        })
+      }
+      callback4(GoodsDetail)//导出商品列表
+    }
+  })
+}
+function callback4(res) {
+  if (GoodsDetail == null) {
+    // wx.hideLoading()
+  } else {
+    wx.showLoading({
+      title: 'loading',
+    })
+    //console.log(GoodsDetail)
+  }
+  if (Detailstatus == true)//如果没获取到详情，说明所点击区域没有元素，不进行重绘
+    reStart()
+}
+
+function UserLogin() {
+  context.fillStyle = '#fff'
+  context.fillRect(0,0,screenWidth*2,screenHeight*2)
+  wx.showLoading({
+    title: '正在登录',
+  })
+  wx.login({
+    success: function (res) {
+      let code = res.code
+      console.log(code)
+      wx.getUserInfo({
+        success: function (res) {
+          let encrypted_data = res.encryptedData
+          let iv = res.iv
+          let tx = res.userInfo.avatarUrl
+          let nn = res.userInfo.nickName
+          wx.request({
+            url: 'https://t6.9026.com/api/album/xyx_login',
+            method: 'POST',
+            data: {
+              code: code,
+              avatar: tx,
+              nickName: nn,
+              iv: iv,
+              store_id: 1
+            },
+            success: function (res) {
+              let is_agent = res.data.data.d.data.is_agent
+              if (is_agent == 1) {
+                isAgent = true
+                agent_id = res.data.data.d.data.agent_id
+                wx.hideLoading()
+                getFLDsource(callback1, url)
+              }
+              else {
+                isAgent = false
+                var test = wx.getLaunchOptionsSync()
+                console.log(test)
+                agent_id = test.query.agent_id
+                if (agent_id == undefined)
+                  agent_id = 0
+                console.log(agent_id)
+                wx.hideLoading()
+                getFLDsource(callback1, url)
+              }
+            }
+          })
+        }
+      })
+    }
+  })
+}
+function sleep(time) {
+  return new Promise((resolve) => setTimeout(resolve, time));
+}
+/*
+主函数
+*/
+export default class Main {
+  constructor() {
+    UserLogin()
+  }
+}

Album/project.config.json

@@ -0,0 +1,33 @@
+{
+	"description": "项目配置文件。",
+	"setting": {
+		"urlCheck": true,
+		"es6": true,
+		"postcss": true,
+		"minified": true,
+		"newFeature": true
+	},
+	"compileType": "game",
+	"libVersion": "1.9.98",
+	"appid": "wx605448628d21d682",
+	"projectname": "Album",
+	"isGameTourist": true,
+	"condition": {
+		"search": {
+			"current": -1,
+			"list": []
+		},
+		"conversation": {
+			"current": -1,
+			"list": []
+		},
+		"game": {
+			"currentL": -1,
+			"list": []
+		},
+		"miniprogram": {
+			"current": -1,
+			"list": []
+		}
+	}
+}

Album/readme.md

@@ -0,0 +1,14 @@
+```
+./js
+|——draw
+|  |——base.js. 						//绘制两边的目录栏背景和下一页按钮
+|  |——FirstLevelDirectory.js		//绘制顶级目录
+|  |——SecondLevelDirectory.js  	    //绘制子目录
+|  |——content.js					//绘制商品列表
+|  |——details.js					//绘制商品详情
+|——lib
+|  |——symbol.js                     // ES6 Symbol简易兼容
+|  |——weapp-adapter.js              // 小游戏适配器
+|——main.js							//绘制入口
+```
+

Album/sources.json

@@ -0,0 +1,60 @@
+{
+  "firstleveldirectory": [
+    {
+      "name": "帝澳尼",
+      "url": "./images/20170713100908_4721.png",
+      "secondleveldirectory": [
+        {
+          "name": "法式床",
+          "content":[
+            {
+              "name":"S6821 【法式双人床】",
+              "url":"./images/products/20170811163608_9341.jpg",
+              "price":"",
+              "detail":"",
+              "size":""
+            }
+          ]
+        },
+        {
+          "name": "电视柜",
+          "content":[]
+        },
+        {
+          "name": "茶几",
+          "content": []
+        },
+        {
+          "name": "妆台",
+          "content": []
+        },
+        {
+          "name": "衣柜",
+          "content": []
+        },
+        {
+          "name": "沙发",
+          "content": []
+        },
+        {
+          "name": "其他",
+          "content": []
+        }
+      ]
+    },
+    {
+      "name": "蓝城家居",
+      "url": "./images/20170713095359_2145.png",
+      "secondleveldirectory": [
+        {
+          "name": "电视柜",
+          "content": []
+        },
+        {
+          "name": "茶几",
+          "content": []
+        }
+      ]
+    }
+  ]
+}