scanner: Add frame page

scanner/app.json

@@ -10,7 +10,8 @@
         "pages/test/test",
         "pages/article/article",
         "pages/nav/nav",
-        "pages/chat/chat"
+        "pages/chat/chat",
+        "pages/frame/frame"
     ],
     "window": {
         "backgroundTextStyle": "light",

scanner/pages/frame/frame.js

@@ -0,0 +1,150 @@
+// pages/frame/frame.js
+const { get_phone_model } = require("../../utils");
+const { data_url_from_frame } = require("../../precheck");
+
+Page({
+
+    /**
+     * Page initial data
+     */
+    data: {
+        uploaded: 0,
+        failed: 0,
+        session_id: Date.now(),
+        frame_id: 0,
+        next_upload_time: 0,
+        uploading: false,
+    },
+
+    /**
+     * Lifecycle function--Called when page load
+     */
+    onLoad(options) {
+
+    },
+
+    /**
+     * Lifecycle function--Called when page is initially rendered
+     */
+    onReady() {
+
+    },
+
+    /**
+     * Lifecycle function--Called when page show
+     */
+    onShow() {
+
+    },
+
+    /**
+     * Lifecycle function--Called when page hide
+     */
+    onHide() {
+
+    },
+
+    /**
+     * Lifecycle function--Called when page unload
+     */
+    onUnload() {
+
+    },
+
+    /**
+     * Page event handler function--Called when user drop down
+     */
+    onPullDownRefresh() {
+
+    },
+
+    /**
+     * Called when page reach bottom
+     */
+    onReachBottom() {
+
+    },
+
+    /**
+     * Called when user click on the top right corner to share
+     */
+    onShareAppMessage() {
+
+    },
+
+    set_pos() {
+        this.setData({
+            label: "pos",
+            pos_class: "active",
+            neg_class: "",
+            stop_class: "",
+        })
+    },
+    
+    set_neg() {
+        this.setData({
+            label: "neg",
+            pos_class: "",
+            neg_class: "active",
+            stop_class: "",
+        })
+    },
+    stop() {
+        this.setData({
+            "label": null,
+            pos_class: "",
+            neg_class: "",
+            stop_class: "active",
+        })
+    },
+    setup_camera() {
+        console.log("setup_camera");
+        const ctx = wx.createCameraContext();
+        ctx.setZoom({
+            zoom: 2
+        })
+        const listener = ctx.onCameraFrame((res) => { this.handle_frame(res) });
+        listener.start();
+    },
+    handle_frame(res) {
+        if (!this.data.label || this.data.uploading) {
+            return;
+        }
+        const now = Date.now();
+        if (now < this.data.next_upload_time) {
+            return;
+        }
+        console.log("uploading frame", this.data.frame_id);
+        const session_id = this.data.session_id;
+        const frame_id = this.data.frame_id;
+        this.setData({
+            frame_id: frame_id + 1,
+            uploading: true,
+        });
+        const url = `https://themblem.com/api/v5/frame/${session_id}/${frame_id}`;
+        const image_data_url = data_url_from_frame(res.width, res.height, res.data);
+        wx.request({
+            url,
+            method: "POST",
+            data: {
+                label: this.data.label,
+                phone_model: get_phone_model(),
+                image: image_data_url,
+            },
+            success: (res) => {
+                this.setData({
+                    uploaded: this.data.uploaded + 1,
+                    next_upload_time: now + 500,
+                    uploading: false,
+                });
+            },
+            fail: (res) => {
+                this.setData({
+                    failed: this.data.failed + 1,
+                    next_upload_time: now + 500,
+                    uploading: false,
+                });
+            },
+        });
+    },
+})

scanner/pages/frame/frame.json

@@ -0,0 +1,3 @@
+{
+    "usingComponents": {}
+}

scanner/pages/frame/frame.wxml

@@ -0,0 +1,15 @@
+
+<view class="buttons">
+    <button class="{{pos_class}}" bind:tap="set_pos">Pos</button>
+    <button class="{{neg_class}}" bind:tap="set_neg">Neg</button>
+    <button class="{{stop_class}}" bind:tap="stop">Stop</button>
+    <view>
+        uploaded: {{ uploaded }}
+        failed: {{ failed }}
+    </view>
+</view>
+<camera class="camera" flash="{{ camera_flash }}"
+        mode="normal"
+        frame-size="large"
+        resolution="high"
+        bindinitdone="setup_camera"></camera>

scanner/pages/frame/frame.wxss

@@ -0,0 +1,25 @@
+
+camera.camera {
+    position: absolute;
+    top: 0;
+    left: 0;
+    height: 100%;
+    width: 100%;
+    z-index: -3;
+  }
+view.buttons {
+    background-color: rgba(55, 55, 55, 0.4);
+    color: white;
+    padding-top: 10px;
+    position: fixed;
+    bottom: 0;
+}
+  view.buttons button {
+      display: inline-block;
+      margin: 5px;
+  }
+
+  button.active {
+      background-color: green;
+  }
+  

scanner/project.config.json

@@ -55,5 +55,6 @@
         ],
         "include": []
     },
-    "appid": "wx8e174d4fb7ef5fb6"
+    "appid": "wx8e174d4fb7ef5fb6",
+    "projectname": "emblem-scanner"
 }

scanner/project.private.config.json

@@ -9,6 +9,13 @@
                     "launchMode": "default",
                     "scene": null
                 },
+                {
+                    "name": "frame",
+                    "pathName": "pages/frame/frame",
+                    "query": "",
+                    "launchMode": "default",
+                    "scene": null
+                },
                 {
                     "name": "chat",
                     "pathName": "pages/chat/chat",