3 files changed, 103 insertions, 0 deletions
diff --git a/mascara/example/app.js b/mascara/example/app.js
new file mode 100644
index 000000000..aae7ccd19
--- /dev/null
+++ b/mascara/example/app.js
@@ -0,0 +1,57 @@
+window.addEventListener('load', web3Detect)
+window.addEventListener('message', console.warn)
+
+function web3Detect() {
+  if (global.web3) {
+    logToDom('web3 detected!')
+    startApp()
+  } else {
+    logToDom('no web3 detected!')
+  }
+}
+
+function startApp(){
+  console.log('app started')
+
+  var primaryAccount
+  console.log('getting main account...')
+  web3.eth.getAccounts((err, addresses) => {
+    if (err) console.error(err)
+    console.log('set address', addresses[0])
+    primaryAccount = addresses[0]
+  })
+
+  document.querySelector('.action-button-1').addEventListener('click', function(){
+    console.log('saw click')
+    console.log('sending tx')
+    primaryAccount
+    web3.eth.sendTransaction({
+      from: primaryAccount,
+      to: primaryAccount,
+      value: 0,
+    }, function(err, txHash){
+      if (err) throw err
+      console.log('sendTransaction result:', err || txHash)
+    })
+  })
+  document.querySelector('.action-button-2').addEventListener('click', function(){
+    console.log('saw click')
+    setTimeout(function(){
+      console.log('sending tx')
+      web3.eth.sendTransaction({
+        from: primaryAccount,
+        to: primaryAccount,
+        value: 0,
+      }, function(err, txHash){
+        if (err) throw err
+        console.log('sendTransaction result:', err || txHash)
+      })
+    })
+  })
+
+}
+
+function logToDom(message){
+  document.body.appendChild(document.createTextNode(message))
+  console.log(message)
+}
diff --git a/mascara/example/app/index.html b/mascara/example/app/index.html
new file mode 100644
index 000000000..02323e5f9
--- /dev/null
+++ b/mascara/example/app/index.html
@@ -0,0 +1,15 @@
+<!doctype html>
+
+<html lang="en">
+<head>
+  <meta charset="utf-8">
+  <title>MetaMask ZeroClient Example</title>
+  <script src="http://localhost:9001/metamascara.js"></script>
+</head>
+
+<body>
+  <button class="action-button-1">SYNC TX</button>
+  <button class="action-button-2">ASYNC TX</button>
+  <script src="./app.js"></script>
+</body>
+</html>
+\ No newline at end of file
diff --git a/mascara/example/server.js b/mascara/example/server.js
new file mode 100644
index 000000000..d39c19600
--- /dev/null
+++ b/mascara/example/server.js
@@ -0,0 +1,31 @@
+const express = require('express')
+const createMetamascaraServer = require('../server/')
+const createBundle = require('../server/util').createBundle
+const serveBundle = require('../server/util').serveBundle
+
+//
+// Iframe Server
+//
+
+const mascaraServer = createMetamascaraServer()
+
+// start the server
+const mascaraPort = 9001
+mascaraServer.listen(mascaraPort)
+console.log(`Mascara service listening on port ${mascaraPort}`)
+
+
+//
+// Dapp Server
+//
+
+const dappServer = express()
+
+// serve dapp bundle
+serveBundle(dappServer, '/app.js', createBundle(require.resolve('./app.js')))
+dappServer.use(express.static(__dirname + '/app/'))
+
+// start the server
+const dappPort = '9002'
+dappServer.listen(dappPort)
+console.log(`Dapp listening on port ${dappPort}`)