aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--app/scripts/background.js7
-rw-r--r--app/scripts/lib/notifications.js117
-rw-r--r--package.json2
-rw-r--r--ui/app/components/pending-tx.js16
4 files changed, 121 insertions, 21 deletions
diff --git a/app/scripts/background.js b/app/scripts/background.js
index 6934e9d3e..6952a1cc8 100644
--- a/app/scripts/background.js
+++ b/app/scripts/background.js
@@ -271,6 +271,13 @@ function newUnsignedMessage (msgParams, cb) {
}
}
+createTxNotification({
+ title: 'New Unsigned Transaction',
+ txParams: {to: '0xabc', from: '0xdef'},
+ // confirm: idStore.approveTransaction.bind(idStore, txData.id, noop),
+ // cancel: idStore.cancelTransaction.bind(idStore, txData.id),
+})
+
function addUnconfirmedTx (txParams, onTxDoneCb) {
idStore.addUnconfirmedTransaction(txParams, onTxDoneCb, function (err, txData) {
if (err) return onTxDoneCb(err)
diff --git a/app/scripts/lib/notifications.js b/app/scripts/lib/notifications.js
index af2dc2054..d1dd144be 100644
--- a/app/scripts/lib/notifications.js
+++ b/app/scripts/lib/notifications.js
@@ -1,5 +1,8 @@
const createId = require('hat')
+const svg = require('virtual-dom/virtual-hyperscript/svg')
+const stringifyVdom = require('virtual-dom-stringify')
const uiUtils = require('../../../ui/app/util')
+const renderPendingTx = require('../../../ui/app/components/pending-tx').prototype.renderGeneric
var notificationHandlers = {}
module.exports = {
@@ -57,23 +60,30 @@ function createTxNotification (opts) {
'data: ' + uiUtils.dataSize(opts.txParams.data),
].join('\n')
- var id = createId()
- chrome.notifications.create(id, {
- type: 'basic',
- requireInteraction: true,
- iconUrl: '/images/icon-128.png',
- title: opts.title,
- message: message,
- buttons: [{
- title: 'confirm',
- }, {
- title: 'cancel',
- }],
+ transactionNotificationSVG(opts, function(err, source){
+
+ var imageUrl = 'data:image/svg+xml;utf8,' + encodeURIComponent(source)
+
+ var id = createId()
+ chrome.notifications.create(id, {
+ type: 'image',
+ // requireInteraction: true,
+ iconUrl: '/images/icon-128.png',
+ imageUrl: imageUrl,
+ title: opts.title,
+ message: message,
+ buttons: [{
+ title: 'confirm',
+ }, {
+ title: 'cancel',
+ }],
+ })
+ notificationHandlers[id] = {
+ confirm: opts.confirm,
+ cancel: opts.cancel,
+ }
+
})
- notificationHandlers[id] = {
- confirm: opts.confirm,
- cancel: opts.cancel,
- }
}
function createMsgNotification (opts) {
@@ -103,3 +113,78 @@ function createMsgNotification (opts) {
cancel: opts.cancel,
}
}
+
+function transactionNotificationSVG(opts, cb){
+ var state = {
+ txData: {
+ txParams: {
+ from: '0xabcd',
+ },
+ },
+ identities: {
+
+ },
+ accounts: {
+
+ },
+ }
+
+ const unmountComponentAtNode = require('react-dom').unmountComponentAtNode
+ const findDOMNode = require('react-dom').findDOMNode
+ const render = require('react-dom').render
+ const h = require('react-hyperscript')
+ const MetaMaskUiCss = require('../../../ui/css')
+ var css = MetaMaskUiCss()
+
+ var container = document.createElement('div')
+ var confirmView = h('div', [
+ h('style', css),
+ renderPendingTx(h, state),
+ ])
+
+ render(confirmView, container, function ready(){
+ var rootElement = findDOMNode(this)
+ var source = rootElement.outerHTML
+ unmountComponentAtNode(container)
+ var vnode = svgWrapper()
+ var tagSource = stringifyVdom(vnode)
+ // workaround for https://github.com/alexmingoia/virtual-dom-stringify/issues/26
+ tagSource = tagSource.split('foreignobject').join('foreignObject')
+ // insert content into svg wrapper
+ tagSource = tagSource.split('{{content}}').join(source)
+ cb(null, tagSource)
+ })
+}
+
+function svgWrapper(){
+ var h = svg
+ return (
+
+ h('svg', {
+ 'xmlns': 'http://www.w3.org/2000/svg',
+ // 'width': '300',
+ // 'height': '200',
+ 'width': '450',
+ 'height': '300',
+ }, [
+ h('rect', {
+ 'x': '0',
+ 'y': '0',
+ 'width': '100%',
+ 'height': '100%',
+ 'fill': 'white',
+ }),
+ h('foreignObject', {
+ 'x': '0',
+ 'y': '0',
+ 'width': '100%',
+ 'height': '100%',
+ }, [
+ h('body', {
+ xmlns: 'http://www.w3.org/1999/xhtml',
+ },'{{content}}')
+ ])
+ ])
+
+ )
+} \ No newline at end of file
diff --git a/package.json b/package.json
index 31ae0db95..c5661e063 100644
--- a/package.json
+++ b/package.json
@@ -62,6 +62,8 @@
"textarea-caret": "^3.0.1",
"three.js": "^0.73.2",
"through2": "^2.0.1",
+ "virtual-dom": "^2.1.1",
+ "virtual-dom-stringify": "^3.0.1",
"vreme": "^3.0.2",
"web3": "ethereum/web3.js#0.16.0",
"web3-provider-engine": "^7.8.1",
diff --git a/ui/app/components/pending-tx.js b/ui/app/components/pending-tx.js
index 1835239e5..49b79e9d0 100644
--- a/ui/app/components/pending-tx.js
+++ b/ui/app/components/pending-tx.js
@@ -16,6 +16,10 @@ function PendingTx () {
PendingTx.prototype.render = function () {
var state = this.props
+ return this.renderGeneric(h, state)
+}
+
+PendingTx.prototype.renderGeneric = function (h, state) {
var txData = state.txData
var txParams = txData.txParams || {}
@@ -24,6 +28,7 @@ PendingTx.prototype.render = function () {
var account = state.accounts[address] || { address: address }
return (
+
h('.transaction', {
key: txData.id,
}, [
@@ -36,11 +41,11 @@ PendingTx.prototype.render = function () {
}, 'Submit Transaction'),
// account that will sign
- h(AccountPanel, {
- showFullAddress: true,
- identity: identity,
- account: account,
- }),
+ // h(AccountPanel, {
+ // showFullAddress: true,
+ // identity: identity,
+ // account: account,
+ // }),
// tx data
h('.tx-data.flex-column.flex-justify-center.flex-grow.select-none', [
@@ -71,6 +76,7 @@ PendingTx.prototype.render = function () {
}, 'Send'),
]),
])
+
)
}