Add ability to show notices to user & get confirmation.

Implement generation of markdown for notice files.
Create npm command. Enhance notice generation.
Add test files to test multiple notices.
Add basic markdown support to notices.
Interval checks for updates.
Add extensionizer and linker
Add terms and conditions state file
Add link support to disclaimer.
Changelog addition.

6 files changed, 187 insertions, 0 deletions

diff --git a/ui/app/actions.js b/ui/app/actions.js
index 3d9588083..7bf39081a 100644
--- a/ui/app/actions.js
+++ b/ui/app/actions.js
@@ -7,6 +7,13 @@ var actions = {
   // remote state
   UPDATE_METAMASK_STATE: 'UPDATE_METAMASK_STATE',
   updateMetamaskState: updateMetamaskState,
+  // notices
+  MARK_NOTICE_READ: 'MARK_NOTICE_READ',
+  markNoticeRead: markNoticeRead,
+  SHOW_NOTICE: 'SHOW_NOTICE',
+  showNotice: showNotice,
+  CLEAR_NOTICES: 'CLEAR_NOTICES',
+  clearNotices: clearNotices,
   // intialize screen
   AGREE_TO_DISCLAIMER: 'AGREE_TO_DISCLAIMER',
   agreeToDisclaimer: agreeToDisclaimer,
@@ -520,6 +527,43 @@ function goBackToInitView () {
 }
 
 //
+// notice
+//
+
+function markNoticeRead (notice) {
+  return (dispatch) => {
+    dispatch(this.showLoadingIndication())
+    background.markNoticeRead(notice, (err, notice) => {
+      dispatch(this.hideLoadingIndication())
+      if (err) {
+        return dispatch(actions.showWarning(err))
+      }
+      if (notice) {
+        return dispatch(actions.showNotice(notice))
+      } else {
+        dispatch(this.clearNotices())
+        return {
+          type: actions.SHOW_ACCOUNTS_PAGE,
+        }
+      }
+    })
+  }
+}
+
+function showNotice (notice) {
+  return {
+    type: actions.SHOW_NOTICE,
+    value: notice,
+  }
+}
+
+function clearNotices () {
+  return {
+    type: actions.CLEAR_NOTICES,
+  }
+}
+
+//
 // config
 //
 
diff --git a/ui/app/app.js b/ui/app/app.js
index 0646e3165..422b3739c 100644
--- a/ui/app/app.js
+++ b/ui/app/app.js
@@ -17,6 +17,8 @@ const AccountsScreen = require('./accounts')
 const AccountDetailScreen = require('./account-detail')
 const SendTransactionScreen = require('./send')
 const ConfirmTxScreen = require('./conf-tx')
+// notice
+const NoticeScreen = require('./notice')
 // other views
 const ConfigScreen = require('./config')
 const RevealSeedConfirmation = require('./recover-seed/confirmation')
@@ -41,6 +43,7 @@ function mapStateToProps (state) {
     isLoading: state.appState.isLoading,
     isConfirmed: state.metamask.isConfirmed,
     isEthConfirmed: state.metamask.isEthConfirmed,
+    noActiveNotices: state.metamask.noActiveNotices,
     isInitialized: state.metamask.isInitialized,
     isUnlocked: state.metamask.isUnlocked,
     currentView: state.appState.currentView,
@@ -425,6 +428,10 @@ App.prototype.renderPrimary = function () {
     return h(UnlockScreen, {key: 'locked'})
   }
 
+  if (!props.noActiveNotices) {
+    return h(NoticeScreen, {key: 'NoticeScreen'})
+  }
+
   // show current view
   switch (props.currentView.name) {
     case 'EthStoreWarning':
diff --git a/ui/app/first-time/disclaimer.js b/ui/app/first-time/disclaimer.js
index 819d4a110..a8bafd39b 100644
--- a/ui/app/first-time/disclaimer.js
+++ b/ui/app/first-time/disclaimer.js
@@ -6,6 +6,8 @@ const actions = require('../actions')
 const ReactMarkdown = require('react-markdown')
 const fs = require('fs')
 const path = require('path')
+const linker = require('extension-link-enabler')
+const findDOMNode = require('react-dom').findDOMNode
 const disclaimer = fs.readFileSync(path.join(__dirname, '..', '..', '..', 'USER_AGREEMENT.md')).toString()
 module.exports = connect(mapStateToProps)(DisclaimerScreen)
 
@@ -98,3 +100,13 @@ DisclaimerScreen.prototype.render = function () {
     ])
   )
 }
+
+DisclaimerScreen.prototype.componentDidMount = function () {
+  var node = findDOMNode(this)
+  linker.setupListener(node)
+}
+
+DisclaimerScreen.prototype.componentWillUnmount = function () {
+  var node = findDOMNode(this)
+  linker.teardownListener(node)
+}
diff --git a/ui/app/notice.js b/ui/app/notice.js
new file mode 100644
index 000000000..5e6028cff
--- /dev/null
+++ b/ui/app/notice.js
@@ -0,0 +1,105 @@
+const inherits = require('util').inherits
+const Component = require('react').Component
+const h = require('react-hyperscript')
+const ReactMarkdown = require('react-markdown')
+const connect = require('react-redux').connect
+const actions = require('./actions')
+const linker = require('extension-link-enabler')
+const findDOMNode = require('react-dom').findDOMNode
+
+module.exports = connect(mapStateToProps)(Notice)
+
+function mapStateToProps (state) {
+  return {
+    lastUnreadNotice: state.metamask.lastUnreadNotice,
+  }
+}
+
+inherits(Notice, Component)
+function Notice () {
+  Component.call(this)
+}
+
+Notice.prototype.render = function () {
+  const props = this.props
+  const title = props.lastUnreadNotice.title
+
+  return (
+    h('.flex-column.flex-center.flex-grow', [
+      h('h3.flex-center.text-transform-uppercacse.terms-header', {
+        style: {
+          background: '#EBEBEB',
+          color: '#AEAEAE',
+          marginBottom: 24,
+          width: '100%',
+          fontSize: '20px',
+          textAlign: 'center',
+          padding: 6,
+        },
+      }, [
+        title,
+      ]),
+
+      h('style', `
+
+        .markdown {
+          overflow-x: hidden;
+        }
+        .markdown h1, .markdown h2, .markdown h3 {
+          margin: 10px 0;
+          font-weight: bold;
+        }
+
+        .markdown strong {
+          font-weight: bold;
+        }
+        .markdown em {
+          font-style: italic;
+        }
+
+        .markdown p {
+          margin: 10px 0;
+        }
+
+        .markdown a {
+          color: blue;
+        }
+
+      `),
+
+      h('div.markdown', {
+        style: {
+          background: 'rgb(235, 235, 235)',
+          height: '310px',
+          padding: '6px',
+          width: '90%',
+          overflowY: 'scroll',
+          scroll: 'auto',
+        },
+      }, [
+        `${props.lastUnreadNotice.title}`,
+        h(ReactMarkdown, {
+          source: props.lastUnreadNotice.body,
+          skipHtml: true,
+        }),
+      ]),
+
+      h('button', {
+        onClick: () => props.dispatch(actions.markNoticeRead(props.lastUnreadNotice)),
+        style: {
+          marginTop: '18px',
+        },
+      }, 'Continue'),
+    ])
+  )
+}
+
+Notice.prototype.componentDidMount = function () {
+  var node = findDOMNode(this)
+  linker.setupListener(node)
+}
+
+Notice.prototype.componentWillUnmount = function () {
+  var node = findDOMNode(this)
+  linker.teardownListener(node)
+}
diff --git a/ui/app/reducers/app.js b/ui/app/reducers/app.js
index c2ac099a6..5c5c0acce 100644
--- a/ui/app/reducers/app.js
+++ b/ui/app/reducers/app.js
@@ -229,6 +229,12 @@ function reduceApp (state, action) {
         scrollToBottom: false,
       })
 
+    case actions.SHOW_NOTICE:
+      return extend(appState, {
+        transForward: true,
+        isLoading: false,
+      })
+
     case actions.REVEAL_ACCOUNT:
       return extend(appState, {
         scrollToBottom: true,
diff --git a/ui/app/reducers/metamask.js b/ui/app/reducers/metamask.js
index 84953d734..9a1c5814d 100644
--- a/ui/app/reducers/metamask.js
+++ b/ui/app/reducers/metamask.js
@@ -17,6 +17,8 @@ function reduceMetamask (state, action) {
     currentFiat: 'USD',
     conversionRate: 0,
     conversionDate: 'N/A',
+    noActiveNotices: true,
+    lastUnreadNotice: undefined,
   }, state.metamask)
 
   switch (action.type) {
@@ -26,6 +28,17 @@ function reduceMetamask (state, action) {
       delete newState.seedWords
       return newState
 
+    case actions.SHOW_NOTICE:
+      return extend(metamaskState, {
+        noActiveNotices: false,
+        lastUnreadNotice: action.value,
+      })
+
+    case actions.CLEAR_NOTICES:
+      return extend(metamaskState, {
+        noActiveNotices: true,
+      })
+
     case actions.UPDATE_METAMASK_STATE:
       return extend(metamaskState, action.value)