Add Torrent Link modal

renderer/views/app.js

@@ -7,8 +7,9 @@ var hx = hyperx(h)
 var Header = require('./header')
 var Player = require('./player')
 var TorrentList = require('./torrent-list')
-
-var isOSX = process.platform === 'darwin'
+var Modals = {
+  'open-torrent-address-modal': require('./open-torrent-address-modal')
+}
 
 function App (state, dispatch) {
   // Hide player controls while playing video, if the mouse stays still for a while
@@ -28,21 +29,36 @@ function App (state, dispatch) {
   if (state.window.isFullScreen) cls.push('is-fullscreen')
   if (state.window.isFocused) cls.push('is-focused')
   if (hideControls) cls.push('hide-video-controls')
-
   return hx`
     <div class='app ${cls.join(' ')}'>
       ${getHeader()}
       <div class='content'>${getView()}</div>
+      ${getModal()}
     </div>
   `
 
   function getHeader () {
+    var isOSX = process.platform === 'darwin'
     // Hide the header on Windows/Linux when in the player
     if (isOSX || state.url !== 'player') {
       return Header(state, dispatch)
     }
   }
 
+  function getModal () {
+    if (state.modal) {
+      var contents = Modals[state.modal](state, dispatch)
+      return hx`
+        <div class='modal'>
+          <div class='modal-background'></div>
+          <div class='modal-content add-file-modal'>
+            ${contents}
+          </div>
+        </div>
+      `
+    }
+  }
+
   function getView () {
     if (state.url === 'home') {
       return TorrentList(state, dispatch)

renderer/views/header.js

@@ -40,7 +40,7 @@ function Header (state, dispatch) {
         <i
           class='icon add'
           title='add torrent'
-          onclick=${() => dispatch('addTorrent')}>
+          onclick=${() => dispatch('showOpenTorrentFile')}>
           add
         </i>
       `

renderer/views/open-torrent-address-modal.js

@@ -0,0 +1,31 @@
+module.exports = OpenTorrentAddressModal
+
+var h = require('virtual-dom/h')
+var hyperx = require('hyperx')
+var hx = hyperx(h)
+
+function OpenTorrentAddressModal (state, dispatch) {
+  return hx`
+    <div class='open-torrent-address-modal'>
+      <p><strong>Enter torrent address or magnet link</strong></p>
+      <p>
+        <input id='add-torrent-url' type='text' autofocus onkeypress=${handleKeyPress} />
+        <button class='primary' onclick=${handleOK}>OK</button>
+        <button class='cancel' onclick=${handleCancel}>Cancel</button>
+      </p>
+    </div>
+  `
+
+  function handleKeyPress (e) {
+    if (e.which === 13) handleOK() /* hit Enter to submit */
+  }
+
+  function handleOK () {
+    dispatch('exitModal')
+    dispatch('addTorrent', document.querySelector('#add-torrent-url').value)
+  }
+
+  function handleCancel () {
+    dispatch('exitModal')
+  }
+}