From c1f0530bcf5164af6ff51eafc37092867f255305 Mon Sep 17 00:00:00 2001
From: Ramiro Saenz <saenzramiro@gmail.com>
Date: Tue, 23 Aug 2016 17:29:11 -0300
Subject: [PATCH] Fixes #217

MouseWheel are not supported.
---
 app/Application.js | 56 ++++++++++++++++++++++++----------------------
 app/ux/WebView.js  | 43 +++++++++++++++++++++++++++++++++++
 2 files changed, 72 insertions(+), 27 deletions(-)

diff --git a/app/Application.js b/app/Application.js
index fa671a8c..86408a8c 100644
--- a/app/Application.js
+++ b/app/Application.js
@@ -53,55 +53,57 @@ Ext.define('Rambox.Application', {
 				,{
 					 key: "\t"
 					,ctrl: true
- 					,alt: false
- 					,shift: true
- 					,handler: function(key) {
- 						var tabPanel = Ext.cq1('app-main');
- 						var activeIndex = tabPanel.items.indexOf(tabPanel.getActiveTab());
+					,alt: false
+					,shift: true
+					,handler: function(key) {
+						var tabPanel = Ext.cq1('app-main');
+						var activeIndex = tabPanel.items.indexOf(tabPanel.getActiveTab());
 						if ( tabPanel.items.items[activeIndex - 1] && tabPanel.items.items[activeIndex - 1].id === 'tbfill' ) activeIndex--;
 						if ( !tabPanel.items.items[activeIndex - 1] && tabPanel.items.items.length !== 2 ) activeIndex = tabPanel.items.items.length;
 						if ( tabPanel.items.items.length === 2 ) activeIndex = 1;
 						tabPanel.setActiveTab( activeIndex - 1 );
- 					}
+					}
 				}
 				,{
-					 key: [Ext.event.Event.NUM_PLUS, Ext.event.Event.NUM_MINUS]
+					 key: [Ext.event.Event.NUM_PLUS, Ext.event.Event.NUM_MINUS, 187, 189]
 					,ctrl: true
- 					,alt: false
- 					,shift: false
- 					,handler: function(key) {
+					,alt: false
+					,shift: false
+					,handler: function(key) {
 						var tabPanel = Ext.cq1('app-main');
 						if ( tabPanel.items.indexOf(tabPanel.getActiveTab()) === 0 ) return false;
-						var currentLevel = tabPanel.getActiveTab().zoomLevel;
-						if ( key === Ext.event.Event.NUM_PLUS ) { // Plus key
-							currentLevel = currentLevel + 0.25;
-						} else { // Minus Key
-							currentLevel = currentLevel - 0.25;
-						}
- 						tabPanel.getActiveTab().down('component').el.dom.getWebContents().setZoomLevel(currentLevel);
-						tabPanel.getActiveTab().zoomLevel = currentLevel;
- 					}
+
+						key === Ext.event.Event.NUM_PLUS || key === 187 ? tabPanel.getActiveTab().zoomIn() : tabPanel.getActiveTab().zoomOut();
+					}
 				}
 				,{
-					 key: Ext.event.Event.NUM_ZERO
+					 key: [Ext.event.Event.NUM_ZERO, '0']
 					,ctrl: true
- 					,alt: false
- 					,shift: false
- 					,handler: function(key) {
+					,alt: false
+					,shift: false
+					,handler: function(key) {
 						var tabPanel = Ext.cq1('app-main');
 						if ( tabPanel.items.indexOf(tabPanel.getActiveTab()) === 0 ) return false;
- 						tabPanel.getActiveTab().down('component').el.dom.getWebContents().setZoomLevel(0);
-						tabPanel.getActiveTab().zoomLevel = 0;
- 					}
+
+						tabPanel.getActiveTab().resetZoom();
+					}
 				}
 				,{
-					 key: "0123456789"
+					 key: "123456789"
 					,ctrl: true
 					,alt: false
 					,handler: function(key) {
 						Ext.cq1('app-main').setActiveTab(key - 48);
 					}
 				}
+				,{
+					 key: 188 // comma
+					,ctrl: true
+					,alt: false
+					,handler: function(key) {
+						Ext.cq1('app-main').setActiveTab(0);
+					}
+				}
 				,{
 					 key: Ext.event.Event.F1
 					,ctrl: false
diff --git a/app/ux/WebView.js b/app/ux/WebView.js
index 1216493e..11873e87 100644
--- a/app/ux/WebView.js
+++ b/app/ux/WebView.js
@@ -86,6 +86,25 @@ Ext.define('Rambox.ux.WebView',{
 							]
 						}
 						,'-'
+						,{
+							 text: 'Zoom In'
+							,glyph: 'xf00e@FontAwesome'
+							,scope: me
+							,handler: me.zoomIn
+						}
+						,{
+							 text: 'Zoom Out'
+							,glyph: 'xf010@FontAwesome'
+							,scope: me
+							,handler: me.zoomOut
+						}
+						,{
+							 text: 'Reset Zoom'
+							,glyph: 'xf002@FontAwesome'
+							,scope: me
+							,handler: me.resetZoom
+						}
+						,'-'
 						,{
 							 text: 'Reload'
 							,glyph: 'xf021@FontAwesome'
@@ -305,4 +324,28 @@ Ext.define('Rambox.ux.WebView',{
 
 		webview.goForward();
 	}
+
+	,zoomIn: function() {
+		var me = this;
+		var webview = me.down('component').el.dom;
+
+		me.zoomLevel = me.zoomLevel + 0.25;
+		webview.getWebContents().setZoomLevel(me.zoomLevel);
+	}
+
+	,zoomOut: function() {
+		var me = this;
+		var webview = me.down('component').el.dom;
+
+		me.zoomLevel = me.zoomLevel - 0.25;
+		webview.getWebContents().setZoomLevel(me.zoomLevel);
+	}
+
+	,resetZoom: function() {
+		var me = this;
+		var webview = me.down('component').el.dom;
+
+		me.zoomLevel = 0;
+		webview.getWebContents().setZoomLevel(0);
+	}
 });