Code: Remove TODO, look now at issue

.gitignore

@@ -1 +1,2 @@
 **/src.zip
+/*.zip

TODO

@@ -1,5 +0,0 @@
-Create style for popup
-Add a visual hint for multipage
-Need a best solution to update folder and bookmark when it are updated from Firefox
-Improve screenshot result
-Add favicon support

makebeta

@@ -0,0 +1,43 @@
+#!/bin/bash
+
+if [ "$1" == "" ]; then
+	echo "Error: No version provided"
+	echo "./makebeta 0.0.1b1"
+	exit 1
+fi
+
+clear
+branch=$(git rev-parse --abbrev-ref HEAD)
+read -p "Current branch is $branch. Continue ? (y/N)" choice
+case "$choice" in 
+  n|N|'' )
+    echo "Cancel !"
+    exit 1
+  ;;
+  y|Y ) echo "Make beta...";;
+  * )
+    echo "Cancel !"
+    exit 1
+  ;;
+esac
+
+
+
+# Ready to update :
+
+git branch beta
+git checkout beta
+
+version=$1
+
+sed -i "/\"version\":/c\ \ \"version\": \"$version\"," src/manifest.json
+
+git commit -a -m "Beta Version $version"
+
+cd src
+zip -r ../quickdial-beta-$version.zip . -x src.zip
+cd ..
+
+git checkout $branch
+git branch -D beta
+

makerelease

@@ -46,3 +46,7 @@ git tag -a "v$version" -m "Version $version"
 git push --tags
 
 git checkout $branch
+
+cd src
+zip -r ../quickdial-$version.zip . -x src.zip
+cd ..

src/html/settings.html

@@ -194,6 +194,10 @@
 							<td><input id="GridCellsTitleBackgroundColor" type="color"></td>
 							<td><input id="GridCellsTitleBackgroundColorHover" type="color"></td>
 						</tr>
+						<tr>
+							<td><span>Snapshot Delay :</span></td>
+							<td colspan="2"><input id="GridCellsSnapshotDelay" type="number" min="300" max="10000"></td>
+						</tr>
 					</table>
 				</div>
 			</div>

src/js/background.js

@@ -132,8 +132,8 @@ app.Settings.init = function(callback){ // Load settings and nodes
 							borderSizeHover: 1,
 							title: true,
 							titleHover: true,
-							titleHeight: 15,
-							titleHeightHover: 15,
+							titleHeight: 16,
+							titleHeightHover: 16,
 							titleFontSize: 10,
 							titleFontSizeHover: 10,
 							titleFont: 'Arial, Verdana, Sans-serif',
@@ -144,7 +144,8 @@ app.Settings.init = function(callback){ // Load settings and nodes
 							titleBorderSize: 1,
 							titleBorderSizeHover: 1,
 							previewWidth: 1200,
-							previewHeight: 710
+							previewHeight: 710,
+							snapshotDelay: 2000
 						},
 						root: 'Quick Dial',
 					}
@@ -191,13 +192,16 @@ app.Settings.init = function(callback){ // Load settings and nodes
 			data.settings.grid.cells.borderSize = 1;
 			data.settings.grid.cells.borderSizeHover = data.settings.grid.cells.borderSize;
 			data.settings.grid.cells.titleHover = data.settings.grid.cells.title;
-			data.settings.grid.cells.titleHeight -= 1;
 			data.settings.grid.cells.titleHeightHover = data.settings.grid.cells.titleHeight;
 			data.settings.grid.cells.titleFontSizeHover = data.settings.grid.cells.titleFontSize;
 			data.settings.grid.cells.titleBorderSize = 1;
 			data.settings.grid.cells.titleBorderSizeHover = data.settings.grid.cells.titleBorderSize;
 			app.Settings.save();
 		}
+		if(data.version == 4){ // Upgrade Data Version
+			if(!data.settings.grid.cells.snapshotDelay) data.settings.grid.cells.snapshotDelay = 2000;
+			//app.Settings.save();			
+		}
 		app.settings = data.settings;
 		app.node = data.node;
 		if(callback) callback();
@@ -297,7 +301,8 @@ app.SiteInfos.fromNewTab = function(url, callback){  // Retrieve infos from a ne
 								imgObj.src = img;
 
 								var previewWidth = 1200; // Need to be linked to settings
-								var previewHeight = 710; // Need to be linked to settings
+								var previewHeight = previewWidth / app.settings.grid.columns * app.settings.grid.rows;
+								if(app.settings.grid.title == true) previewHeight -= app.settings.grid.titleHeight;
 
 								var canvas = document.createElement('canvas');
 								canvas.style.width = previewWidth.toString() + 'px';
@@ -326,7 +331,7 @@ app.SiteInfos.fromNewTab = function(url, callback){  // Retrieve infos from a ne
 								browser.tabs.remove(tab.id);
 								if(callback) callback();
 							});
-						}, 500);
+						}, app.settings.grid.cells.snapshotDelay);
 					}, function(){ if(callback) callback(); });
 				}
 			}, function(){ if(callback) callback(); });
@@ -363,7 +368,8 @@ app.SiteInfos.fromFrame = function(url, callback){ // Retrieve infos from an ifr
 	}
 
 	var previewWidth = 1200; // Need to be linked to settings
-	var previewHeight = 710; // Need to be linked to settings
+	var previewHeight = previewWidth / app.settings.grid.columns * app.settings.grid.rows;
+	if(app.settings.grid.title == true) previewHeight -= app.settings.grid.titleHeight;
 	var iframe;
 	var xmlHttp = new XMLHttpRequest();
 	xmlHttp.timeout = 10000
@@ -373,7 +379,7 @@ app.SiteInfos.fromFrame = function(url, callback){ // Retrieve infos from an ifr
 		iframe.width = previewWidth
 		iframe.height = previewHeight
 		iframe.style.position = 'absolute';
-		//iframe.style.visibility = 'hidden';
+		iframe.scrolling = 'no';
 		var content = xmlHttp.responseText.replace('<head>', '<head><base href="' + url + '">');
 		iframe.onload = function(){ pageLoaded(); }
 		document.body.appendChild(iframe);
@@ -409,7 +415,10 @@ app.GridNodes.sync = function(gridNode, rootPath, callback){ // Sync GridNodes w
 			gridNode.title = bookmarkItem.title;
 			if(bookmarkItem.url){
 				gridNode.type = app.GridNodes.GridNodeType.bookmark;
-				if(!gridNode.url) gridNode.url = bookmarkItem.url;
+				if(gridNode.url != bookmarkItem.url){
+					gridNode.url = bookmarkItem.url;
+					delete gridNode.image;
+				}
 			} else if(bookmarkItem.children){
 				gridNode.type = app.GridNodes.GridNodeType.folder;
 				var EmptyNodes = [];

src/js/dial.js

@@ -288,10 +288,13 @@ dial.initStyles = function(){
 	if(app.settings.grid.cells.backgroundColor) dial.styles.grid.linkPanel.backgroundColor = app.settings.grid.cells.backgroundColor;
 	dial.styles.grid.linkPanelHover = dial.Style.sheet.cssRules[dial.Style.sheet.insertRule('.Grid td>a:hover>div:first-child { }')].style;
 	if(app.settings.grid.cells.backgroundColorHover) dial.styles.grid.linkPanelHover.backgroundColor = app.settings.grid.cells.backgroundColorHover;
+	else dial.styles.grid.linkPanelHover.backgroundColor = 'transparent';
 	dial.styles.grid.linkTitle = dial.Style.sheet.cssRules[dial.Style.sheet.insertRule('.Grid td>a>div:last-child { height: ' + app.settings.grid.cells.titleHeight + 'px; font-size: ' + app.settings.grid.cells.titleFontSize + 'pt; font-family: ' + app.settings.grid.cells.titleFont + 'pt; text-align: center; overflow: hidden; color: ' + app.settings.grid.cells.titleColor + '; border-top: ' + app.settings.grid.cells.titleBorderSize + 'px solid ' + app.settings.grid.cells.borderColor + '; }')].style;
 	if(app.settings.grid.cells.titleBackgroundColor) dial.styles.grid.linkTitle.backgroundColor = app.settings.grid.cells.titleBackgroundColor;
+	else dial.styles.grid.linkTitle.backgroundColor = 'transparent';
 	dial.styles.grid.linkTitleHover = dial.Style.sheet.cssRules[dial.Style.sheet.insertRule('.Grid td>a:hover>div:last-child { font-size: ' + app.settings.grid.cells.titleFontSizeHover + 'pt; color: ' + app.settings.grid.cells.titleColorHover + '; border-top-width: ' + app.settings.grid.cells.titleBorderSizeHover + 'px; border-top-color: ' + app.settings.grid.cells.borderColorHover + ' }')].style;
 	if(app.settings.grid.cells.titleBackgroundColorHover) dial.styles.grid.linkTitleHover.backgroundColor = app.settings.grid.cells.titleBackgroundColorHover;
+	else dial.styles.grid.linkTitleHover.backgroundColor = 'transparent';
 	dial.styles.grid.linkEmpty = dial.Style.sheet.cssRules[dial.Style.sheet.insertRule('.Grid td>a.Empty { display: none; }')].style;
 	dial.styles.grid.linkBack = dial.Style.sheet.cssRules[dial.Style.sheet.insertRule('.Grid td>a.Back :first-child { background-image: ' + app.settings.grid.backIcon + '; }')].style;
 	applyImageMode(app.settings.grid.backIconMode, dial.styles.grid.linkBack);
@@ -342,10 +345,23 @@ dial.initGrid = function(){
 				}
 				var index = (dial.page - 1) * (app.settings.grid.rows * app.settings.grid.columns) + +(ev.target.parentElement.getAttribute('gridindex'));
 				if(app.settings.grid.backNode && dial.path != '/') index -= dial.page;
-				ev.dataTransfer.setData("text/plain", index);
+				ev.dataTransfer.setData("text/plain", JSON.stringify({parentId: app.node.id, index: index}));
 			}
 			function dragover_handler(ev) {
 				ev.preventDefault();
+				var data = ev.dataTransfer.getData("text");
+				try {
+					data = JSON.parse(data);
+				} catch(e) {
+					data = null;
+				}
+				if(!data){
+					ev.dataTransfer.dropEffect = "none";
+					return;
+				} else if(data.parentId != app.node.id){
+					ev.dataTransfer.dropEffect = "none";
+					return;
+				}
 				if(app.settings.grid.backNode && dial.path != '/'){
 					var gridIndex = 0;
 					if(ev.target.tagName == 'DIV') gridIndex = +(ev.target.parentElement.parentElement.getAttribute('gridindex'));
@@ -359,7 +375,15 @@ dial.initGrid = function(){
 			function drop_handler(ev) {
 				ev.preventDefault();
 				if(ev.buttons == 1) return;
-				var StartIndex = ev.dataTransfer.getData("text");
+				var data = ev.dataTransfer.getData("text");
+				try {
+					data = JSON.parse(data);
+				} catch(e) {
+					data = null;
+				}
+				if(!data) return;
+				else if(data.parentId != app.node.id) return;
+				var StartIndex = data.index;
 				var EndIndex = 0;
 				if(ev.target.tagName == 'DIV'){
 					EndIndex = (dial.page - 1) * (app.settings.grid.rows * app.settings.grid.columns) + +(ev.target.parentElement.parentElement.getAttribute('gridindex'));
@@ -391,8 +415,8 @@ dial.updateGridLayout = function(){
 		var cellHeight = fullHeight / app.settings.grid.rows;
 		var linkWidth = 0;
 		var linkHeight = 0;
-		if(cellWidth <= cellHeight * 4 / 3) cellHeight = cellWidth / 4 * 3;
-		else cellWidth = cellHeight / 3 * 4;
+		if(cellWidth <= cellHeight * app.settings.grid.columns / app.settings.grid.rows) cellHeight = cellWidth / app.settings.grid.columns * app.settings.grid.rows;
+		else cellWidth = cellHeight / app.settings.grid.rows * app.settings.grid.columns;
 		linkWidth = cellWidth - 2 * (cellsMargin + 1) - 2 * borderSize;
 		linkHeight = cellHeight - 2 * (cellsMargin + 1) - 2 * borderSize - titleBorderSize;
 		return {

src/js/settings.js

@@ -69,6 +69,7 @@ app.init = function(){
 		GridCellsTitleBackgroundColor.value = app.settings.grid.cells.titleBackgroundColor;
 		GridCellsTitleBackgroundColorHover.value = app.settings.grid.cells.titleBackgroundColorHover;
 		GridCellsTitleBackgroundTransparentHover.checked = (app.settings.grid.cells.titleBackgroundColorHover == null);
+		GridCellsSnapshotDelay.value = app.settings.grid.cells.snapshotDelay;
 	});
 
 	BtnOk.onclick = function(){
@@ -115,6 +116,7 @@ app.init = function(){
 		else app.settings.grid.cells.titleBackgroundColor = GridCellsTitleBackgroundColor.value;
 		if(GridCellsTitleBackgroundTransparentHover.checked == true) app.settings.grid.cells.titleBackgroundColorHover = null;
 		else app.settings.grid.cells.titleBackgroundColorHover = GridCellsTitleBackgroundColorHover.value;
+		app.settings.grid.cells.snapshotDelay = GridCellsSnapshotDelay.value;
 		app.settings.grid.root = GridRoot.value;
 		browser.runtime.sendMessage( { cmd: app.Messages.Commands.setSettings, settings: app.settings } );
 	}

src/manifest.json

@@ -2,7 +2,7 @@
 
   "manifest_version": 2,
   "name": "Quick Dial",
-  "version": "0.1.7",
+  "version": "0.1.8",
   "author": "MatMoul",
   "homepage_url": "https://github.com/MatMoul/quickdial-webext",
   "developer": {