init

Author: Ke, Mingze

.gitignore

@@ -0,0 +1,4 @@
+node_modules/
+bower_components/
+build/
+chrome-app/json-human/

bower.json

@@ -0,0 +1,8 @@
+{
+  "name": "chrome-api-proxy",
+  "description": "Leverage Chrome App API in Browser",
+  "license": "MIT",
+  "dependencies": {
+    "json-human": "*"
+  }
+}

chrome-app/assets/icon_128.png

@@ -0,0 +1,173 @@
++(function (scope) {
+
+  'use strict';
+
+  var slice = Array.prototype.slice,
+    undef = undefined,
+    transReq = scope.transforms.request,
+    transRes = scope.transforms.response,
+    listenerMap = {},
+    portMap = {},
+    objCache = {};
+
+  chrome.app.runtime.onLaunched.addListener(function () {
+
+    chrome.app.window.create('index.html', {
+      id: "main",
+      innerBounds: {
+        width: 480,
+        height: 640,
+        minWidth: 480,
+        minHeight: 640
+      }
+    });
+
+    chrome.runtime.onConnectExternal.addListener(function (port) {
+      if (!port.name) {
+        return;
+      }
+
+      portMap[port.name] = port;
+
+      port.onMessage.addListener(function (msg) {
+        if (msg.method) {
+          invoke(port.name, msg.id, msg.method, msg.params);
+        }
+      });
+
+      port.onDisconnect.addListener(function (port) {
+        delete portMap[port.name];
+        cleanupListener(port.name);
+      });
+    });
+
+  });
+
+  function invoke(senderId, id, method, params) {
+    var m = normalize(method),
+      obj = resolve(m),
+      ctx = resolve(m.split('.').slice(0, -1).join('.'));
+
+    if (m.indexOf('.addListener') === m.length - 12) {
+      addListener(m.substr(0, m.length - 12), senderId, id);
+    } else if (m.indexOf('.removeListener') === m.length - 15) {
+      removeListener(m.substr(0, m.length - 15), senderId, id);
+    } else {
+      if (typeof obj === 'function') {
+        params = transformParams(m, params, transReq, ctx);
+        obj.apply(ctx, params.concat(callback));
+      }
+
+      function callback() {
+        var args = slice.call(arguments),
+          port = portMap[senderId];
+
+        if (!port) {
+          return;
+        }
+
+        if (chrome.runtime.lastError) {
+          port.postMessage({
+            jsonrpc: '2.0',
+            id: id,
+            error: chrome.runtime.lastError.message
+          });
+        } else {
+          args = transformParams(m, args, transRes, ctx);
+          port.postMessage({
+            jsonrpc: '2.0',
+            id: id,
+            result: args
+          });
+        }
+      }
+    }
+  }
+
+  function transformParams(name, params, map, ctx) {
+    var func = map[name];
+
+    if (typeof func === 'function') {
+      return func.apply(ctx, params);
+    }
+    return params;
+  }
+
+  function addListener(objName, portName, id) {
+    if (listenerMap[objName]) {
+      listenerMap[objName].receivers.push({
+        portName: portName,
+        id: id
+      });
+    } else {
+      listenerMap[objName] = {
+        listener: function () {
+          var args = transformParams(objName + '.addListener', slice.call(arguments),
+            transRes, resolve(objName));
+
+          listenerMap[objName].receivers.forEach(function (receiver, idx) {
+            portMap[receiver.portName].postMessage({
+              jsonrpc: '2.0',
+              id: receiver.id,
+              result: args
+            });
+          });
+        },
+        receivers: [{
+          portName: portName,
+          id: id
+        }]
+      };
+      resolve(objName).addListener(listenerMap[objName].listener);
+    }
+  }
+
+  function removeListener(objName, portName, id) {
+    if (listenerMap[objName]) {
+      if (typeof id === 'undefined') {
+        listenerMap[objName].receivers.forEach(function (receiver, idx) {
+          if (receiver.portName === portName) {
+            listenerMap[objName].receivers.splice(idx, 1);
+          }
+        });
+      } else {
+        listenerMap[objName].receivers.some(function (receiver, idx) {
+          if (receiver.portName === portName && receiver.id === id) {
+            listenerMap[objName].receivers.splice(idx, 1);
+            return true;
+          }
+        });
+      }
+      if (listenerMap[objName].receivers.length === 0) {
+        resolve(objName).removeListener(listenerMap[objName].listener);
+        delete listenerMap[objName];
+      }
+    }
+  }
+
+  function cleanupListener(portName) {
+    Object.keys(listenerMap).forEach(function (objName) {
+      removeListener(objName, portName);
+    });
+  }
+
+  function normalize(method) {
+    return (method.indexOf('window.') === 0) ? method.substring(7) : method;
+  }
+
+  function resolve(name) {
+    var tmpName = '';
+
+    return (objCache[name]) ||
+      name.split('.').reduce(function (obj, prop) {
+        tmpName += ((tmpName ? '.' : '') + prop);
+        if (obj && obj[prop]) {
+          objCache[tmpName] = obj[prop];
+          return obj[prop];
+        } else {
+          return undef;
+        }
+      }, scope);
+  }
+
+}(window));

chrome-app/eventPage.js

@@ -0,0 +1,37 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta charset="utf-8">
+  <title>Chrome API Proxy</title>
+  <script src="json-human/src/json.human.js"></script>
+  <script src="main.js"></script>
+  <link rel="stylesheet" href="json-human/css/json.human.css"></link>
+  <style>
+  html,
+  body {
+    overflow-y: auto;
+  }
+  
+  body {
+    -webkit-user-select: text
+  }
+  
+  .button {
+    font-size: 26px;
+  }
+  </style>
+</head>
+
+<body>
+  <button class='button' id='refresh'>刷新</button>
+  <h1>Serial Port Status</h1>
+  <div id='serial-port-status'></div>
+  <div>
+    <input id='disconnId' type='text' size='5' />
+    <button id='disconnect'>Disconnect</button>
+    <span id='disconnStatus'></span>
+  </div>
+</body>
+
+</html>

chrome-app/index.html

@@ -0,0 +1,46 @@
++(function () {
+
+  'use strict';
+
+  var node;
+
+  document.addEventListener('DOMContentLoaded', function () {
+    node = document.querySelector('#serial-port-status');
+
+    getNode('refresh').addEventListener('click', function () {
+      refreshStatus(node);
+    }, false);
+
+    getNode('disconnect').addEventListener('click', function () {
+      chrome.serial.disconnect(parseInt(getNode('disconnId').value), function (e) {
+        refreshStatus(node);
+        if (e !== true) {
+          alert(e + '');
+        }
+      });
+    });
+
+    refreshStatus(node);
+  }, false);
+
+  function refreshStatus(node) {
+    var status = {};
+
+    getNode('disconnId').value = '';
+    getNode('disconnStatus').innerHTML = '';
+
+    chrome.serial.getDevices(function (devs) {
+      status.devices = devs;
+      chrome.serial.getConnections(function (conns) {
+        status.connections = conns;
+        node.innerHTML = '';
+        node.appendChild(JsonHuman.format(status));
+      });
+    });
+  }
+
+  function getNode(id) {
+    return document.getElementById(id);
+  }
+
+}());

chrome-app/main.js

@@ -0,0 +1,20 @@
+{
+  "name": "Chrome API Proxy",
+  "version": "0.0.3",
+  "manifest_version": 2,
+  "minimum_chrome_version": "23",
+  "app": {
+    "background": {
+      "scripts": [
+        "transforms.js",
+        "eventPage.js"
+      ]
+    }
+  },
+  "permissions": [
+    "serial"
+  ],
+  "icons": {
+    "128": "assets/icon_128.png"
+  }
+}

chrome-app/manifest.json

@@ -0,0 +1,23 @@
++(function (scope) {
+
+  'use strict';
+
+  var slice = Array.prototype.slice;
+
+  scope.transforms = scope.transforms || {
+    request: {},
+    response: {}
+  };
+
+  scope.transforms.request['chrome.serial.send'] = function (connectionId, data) {
+    return [connectionId, new Uint8Array(data).buffer];
+  };
+
+  scope.transforms.response['chrome.serial.onReceive.addListener'] = function (event) {
+    return [{
+      connectionId: event.connectionId,
+      data: slice.call(new Uint8Array(event.data))
+    }];
+  };
+
+}(window));

chrome-app/transforms.js

@@ -0,0 +1,38 @@
++(function (window) {
+
+  'use strict';
+
+  var PROXY_ID = 'pddlkidaibpbhpkfbhkbeolbagpmkhhn';
+
+  var ready, port;
+
+  ready = true;
+  port = chrome.runtime.connect(PROXY_ID, {
+    name: randomId()
+  });
+  port.onMessage.addListener(receiveMessage);
+  port.onDisconnect.addListener(onDisconnect);
+
+  window.addEventListener('message', function (event) {
+    var msg = event.data;
+
+    if (msg.jsonrpc && msg.method) {
+      ready && port.postMessage(msg);
+    }
+  }, false);
+
+  function receiveMessage(msg) {
+    window.postMessage(msg, '*');
+  }
+
+  function onDisconnect() {
+    ready = false;
+    port.onMessage.removeListener(receiveMessage);
+    port.onDisconnect.removeListener(onDisconnect);
+  }
+
+  function randomId() {
+    return (Math.random() * Date.now()).toString(36).replace(/\./g, '');
+  }
+
+}(window));

chrome-extension/assets/icon_128.png

@@ -0,0 +1,18 @@
+{
+  "name": "Chrome API Proxy - Agent",
+  "version": "0.0.3",
+  "manifest_version": 2,
+  "minimum_chrome_version": "23",
+  "content_scripts": [{
+    "matches": [
+      "<all_urls>"
+    ],
+    "js": [
+      "contentScript.js"
+    ],
+    "run_at": "document_start"
+  }],
+  "icons": {
+    "128": "assets/icon_128.png"
+  }
+}

chrome-extension/contentScript.js

@@ -0,0 +1,20 @@
+<html>
+
+<head>
+  <script src="../lib/chrome.serial.js"></script>
+  <script src="../bower_components/json-human/src/json.human.js"></script>
+  <script>
+  chrome.serial.getDevices(function(devs) {
+    document.body.appendChild(JsonHuman.format(devs));
+  });
+
+  chrome.serial.connect('/dev/cu.usbmodem1411', function(info) {
+    document.body.appendChild(JsonHuman.format(info));
+  });
+  </script>
+</head>
+
+<body>
+</body>
+
+</html>