Merge branch 'dev'

Author: gera2ld

src/background/app.js

@@ -5,6 +5,7 @@ var badges = require('./badges');
 var cache = require('./utils/cache');
 var tabsUtils = require('./utils/tabs');
 var scriptUtils = require('./utils/script');
+var clipboard = require('./utils/clipboard');
 var _ = require('../common');
 
 var vmdb = exports.vmdb = new VMDB;
@@ -92,7 +93,16 @@ var commands = {
     });
   },
   SetValue: function (data, _src) {
-    return vmdb.setValue(data.uri, data.values);
+    return vmdb.setValue(data.uri, data.values)
+    .then(function () {
+      tabsUtils.broadcast({
+        cmd: 'UpdateValues',
+        data: {
+          uri: data.uri,
+          values: data.values,
+        },
+      });
+    });
   },
   GetOptions: function (_data, _src) {
     return _.options.getAll();
@@ -184,8 +194,37 @@ var commands = {
   GetFromCache: function (data, _src) {
     return cache.get(data) || null;
   },
+  Notification: function (data, _src) {
+    return notification(data);
+  },
+  SetClipboard: function (data, _src) {
+    clipboard.set(data);
+  },
 };
 
+var notification = function () {
+  function notification(data) {
+    var n = new Notification(data.title || _.i18n('extName'), {
+      body: data.text,
+      icon: data.image,
+    });
+    var nid = ++ id;
+    n.onclick = wrapEvent(nid, 'NotificationClick');
+    n.onclose = wrapEvent(nid, 'NotificationClose');
+    return nid;
+  }
+  function wrapEvent(nid, evt) {
+    return function () {
+      tabsUtils.broadcast({
+        cmd: evt,
+        data: nid,
+      });
+    };
+  }
+  var id = 0;
+  return notification;
+}();
+
 function reinit() {
   var func = function (f) {
     var c = 0;

src/background/utils/clipboard.js

@@ -0,0 +1,16 @@
+var textarea = document.createElement('textarea');
+document.body.appendChild(textarea);
+
+var clipboardData = {};
+function oncopy(e) {
+  e.preventDefault();
+  e.clipboardData.setData(clipboardData.type || 'text/plain', clipboardData.data);
+}
+document.addEventListener('copy', oncopy, false);
+
+exports.set = function (data) {
+  clipboardData.type = data.type;
+  clipboardData.data = data.data;
+  textarea.focus();
+  document.execCommand('copy', false, null);
+};

src/background/utils/tabs.js

@@ -34,7 +34,12 @@ var on = function () {
   return register;
 }();
 
+function broadcast(data) {
+  _.mx.rt.post('Broadcast', data);
+}
+
 module.exports = Object.assign(_.tabs, {
   update: update,
   on: on,
+  broadcast: broadcast,
 });

src/injected.js

@@ -63,7 +63,7 @@ function post(target, data, callback) {
   }
   rt.post(target, data);
 }
-rt.listen(id, function (obj) {
+function onMessage(obj) {
   var maps = {
     Command: function (data) {
       comm.post({cmd: 'Command', data: data});
@@ -77,10 +77,14 @@ rt.listen(id, function (obj) {
     HttpRequested: function (res) {
       comm.post({cmd: 'HttpRequested', data: res});
     },
+    NotificationClick: onNotificationClick,
+    NotificationClose: onNotificationClose,
   };
   var func = maps[obj.cmd];
   if (func) func(obj.data);
-});
+}
+rt.listen(id, onMessage);
+rt.listen('Broadcast', onMessage);
 
 /**
  * @desc Wrap methods to prevent unexpected modifications.
@@ -210,6 +214,25 @@ var comm = {
         var req = comm.requests[r.id];
         if (req) req.callback(r);
       },
+      UpdateValues: function (data) {
+        var values = comm.values;
+        if (values && values[data.uri]) values[data.uri] = data.values;
+      },
+      NotificationClicked: function (id) {
+        var options = comm.notif[id];
+        if (options) {
+          var onclick = options.onclick;
+          onclick && onclick();
+        }
+      },
+      NotificationClosed: function (id) {
+        var options = comm.notif[id];
+        if (options) {
+          delete comm.notif[id];
+          var ondone = options.ondone;
+          ondone && ondone();
+        }
+      },
     };
     var func = maps[obj.cmd];
     if (func) func(obj.data);
@@ -501,6 +524,41 @@ var comm = {
           return comm.Request(details);
         },
       },
+      GM_notification: {
+        value: function (text, title, image, onclick) {
+          if (!text) {
+            throw 'Invalid parameters.';
+          }
+          var options = typeof text === 'object' ? text : {
+            text: text,
+            title: title,
+            image: image,
+            onclick: onclick,
+          };
+          var id = comm.notif[''] = (comm.notif[''] || 0) + 1;
+          comm.notif[id] = options;
+          comm.post({
+            cmd: 'Notification',
+            data: {
+              id: id,
+              text: options.text,
+              title: options.title,
+              image: options.image,
+            },
+          });
+        },
+      },
+      GM_setClipboard: {
+        value: function (text, type) {
+          comm.post({
+            cmd: 'SetClipboard',
+            data: {
+              type: type,
+              data: text,
+            },
+          });
+        },
+      },
     };
     comm.forEach(grant, function (name) {
       var prop = gm_funcs[name];
@@ -551,6 +609,7 @@ var comm = {
     var idle = [];
     var end = [];
     comm.command = {};
+    comm.notif = {};
     comm.version = data.version;
     comm.values = {};
     // reset load and checkLoad
@@ -616,11 +675,33 @@ function handleC(e) {
         document.head.appendChild(style);
       }
     },
+    Notification: onNotificationCreate,
+    SetClipboard: function (data) {
+      post('Background', {cmd: 'SetClipboard', data: data});
+    },
   };
   var func = maps[req.cmd];
   if (func) func(req.data);
 }
 
+var notifications = {};
+function onNotificationCreate(options) {
+  post('Background', {cmd: 'Notification', data: options}, function (nid) {
+    notifications[nid] = options.id;
+  });
+}
+function onNotificationClick(nid) {
+  var id = notifications[nid];
+  id && comm.post({cmd: 'NotificationClicked', data: id});
+}
+function onNotificationClose(nid) {
+  var id = notifications[nid];
+  if (id) {
+    comm.post({cmd: 'NotificationClosed', data: id});
+    delete notifications[nid];
+  }
+}
+
 function objEncode(obj) {
   var list = [];
   for (var i in obj) {

src/popup/views/item.html

@@ -1,7 +1,7 @@
-<div class="menu-item" :class="[options.className,{disabled:options.disabled}]" :title="options.title||options.name">
-  <div class="menu-item-detail" v-if="options.detailClick" @click="detailClick">...</div>
+<div class="menu-item" :class="[data.className,{disabled:data.disabled}]" :title="data.title||data.name">
+  <div class="menu-item-detail" v-if="data.detailClick" @click="detailClick">...</div>
   <div class="menu-item-label" @click="onClick">
-    <svg class="icon"><use :xlink:href="'#'+options.symbol"/></svg>
-    {{options.name}}
+    <svg class="icon"><use :xlink:href="'#'+data.symbol"/></svg>
+    {{data.name}}
   </div>
 </div>

src/popup/views/item.js

@@ -13,14 +13,23 @@ module.exports = {
   props: ['options'],
   template: cache.get('./item.html'),
   data: function () {
-    // make options reactive
     return {
-      reactiveOptions: this.options,
+      data: {},
     };
   },
+  watch: {
+    options: 'update',
+  },
   methods: {
+    update: function () {
+      this.data = this.options;
+      this.init();
+    },
+    init: wrapHandler('init'),
     onClick: wrapHandler('onClick'),
     detailClick: wrapHandler('detailClick'),
   },
-  mounted: wrapHandler('init'),
+  mounted: function () {
+    this.update();
+  },
 };