Merge pull request #6 from brave/zoom

Add zoom shortcut support.

app/content/webviewPreload.js

@@ -0,0 +1,25 @@
+var webFrame = require('electron').webFrame
+var ipc = require('electron').ipcRenderer
+
+var browserZoomLevel = 0
+var browserMaxZoom = 9
+var browserMinZoom = -8
+
+ipc.on('zoom-in', function () {
+  if (browserMaxZoom > browserZoomLevel) {
+    browserZoomLevel += 1
+  }
+  webFrame.setZoomLevel(browserZoomLevel)
+})
+
+ipc.on('zoom-out', function () {
+  if (browserMinZoom < browserZoomLevel) {
+    browserZoomLevel -= 1
+  }
+  webFrame.setZoomLevel(browserZoomLevel)
+})
+
+ipc.on('zoom-reset', function () {
+  browserZoomLevel = 0
+  webFrame.setZoomLevel(browserZoomLevel)
+})

app/index.js

@@ -65,7 +65,10 @@ app.on('ready', function () {
     ['Escape', 'shortcut-stop'],
     ['Ctrl+Tab', 'shortcut-next-tab'],
     ['Ctrl+Shift+Tab', 'shortcut-prev-tab'],
-    ['CmdOrCtrl+R', 'shortcut-reload']
+    ['CmdOrCtrl+R', 'shortcut-reload'],
+    ['CmdOrCtrl+=', 'shortcut-zoom-in'],
+    ['CmdOrCtrl+-', 'shortcut-zoom-out'],
+    ['CmdOrCtrl+0', 'shortcut-zoom-reset']
   ]
 
   simpleWebContentEvents.forEach((shortcutEventName) =>

js/components/frame.js

@@ -20,6 +20,24 @@ class Frame extends ImmutableComponent {
         webview.reload()
       }
     })
+    ipc.on('shortcut-zoom-in', () => {
+      let webview = ReactDOM.findDOMNode(this.refs.webview)
+      if (webview) {
+        webview.send('zoom-in')
+      }
+    })
+    ipc.on('shortcut-zoom-out', () => {
+      let webview = ReactDOM.findDOMNode(this.refs.webview)
+      if (webview) {
+        webview.send('zoom-out')
+      }
+    })
+    ipc.on('shortcut-zoom-reset', () => {
+      let webview = ReactDOM.findDOMNode(this.refs.webview)
+      if (webview) {
+        webview.send('zoom-reset')
+      }
+    })
     process.on('reload-active-frame', () => {
       if (this.props.isActive) {
         let webview = ReactDOM.findDOMNode(this.refs.webview)
@@ -105,7 +123,10 @@ class Frame extends ImmutableComponent {
           frameWrapper: true,
           isActive: this.props.isActive
         })}>
-      <webview ref='webview' src={this.props.frame.get('location')} />
+      <webview
+        ref='webview'
+        src={this.props.frame.get('location')}
+        preload='content/webviewPreload.js'/>
     </div>
   }
 }