Version 0.1.4

README.md

@@ -1,2 +1,9 @@
 # quickdial-webext
+
 QuickDial is a WebExt Dial page for Firefox
+
+[QuickDial on addons.mozilla.org](https://addons.mozilla.org/fr/firefox/addon/quick-dial/?src=search)
+
+## Contribute and evolution :</br>
+* [CONTRIBUTING.md](https://github.com/MatMoul/quickdial-webext/blob/develop/CONTRIBUTING.md)
+

TODO

@@ -1,6 +1,7 @@
-Add node settings popup
-Add custom image (thumbnails)
 Create style for popup
+Add a setting to customize bookmark root folder
+Add a setting to lock title from update
+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

src/html/properties.html

@@ -44,6 +44,7 @@
 							<td><span>Image :</span></td>
 							<td>
 								<button id="ImageReset">Reset</button>
+								<button id="ImageDefault">Default</button>
 								<button class="hidden" id="ImageRefresh">Refresh</button>
 								<button class="hidden" id="ImageCapture">Capture</button>
 								<input id="ImageFile" type="file" style="width:180px;">

src/js/background.js

@@ -10,6 +10,7 @@ app.init = function(){ // Init module
 		app.GridNodes.sync(app.node, app.settings.grid.root, function(){
 			browser.runtime.sendMessage({ cmd: app.Messages.Commands.gridNodesLoaded });
 			app.Bookmarks.initListener();
+			app.ContextMenus.initMenu();
 		});
 	});
 };
@@ -188,11 +189,13 @@ app.ContextMenus.initMenu = function(){ // (Called from app.init) Init context m
 		id: 'AddToQuickDial',
 		title: browser.i18n.getMessage("menuAddToQuickDial"),
 		contexts: ["all"],
-		documentUrlPatterns: [ 'http://*/*', 'https://*/*', 'file://*/*' ]
+		documentUrlPatterns: [ 'http://*/*', 'https://*/*', 'file://*/*', 'ftp://*/*' ]
 	}, function(){});
 	browser.contextMenus.onClicked.addListener(function(info, tab) { // Context menu click event
-		//if (info.menuItemId == "AddToQuickDial")
+		if (info.menuItemId == "AddToQuickDial")
-			//app.GridNodes.createBookmark(app.settings.grid.node, info.pageUrl, tab.title, function(){});
+			app.GridNodes.createBookmark(app.node, info.pageUrl, tab.title, function(){
+				browser.runtime.sendMessage( { cmd: app.Messages.Commands.gridNodesLoaded } );
+			});
 	});
 }
 
@@ -360,6 +363,7 @@ app.GridNodes.sync = function(gridNode, rootPath, callback){ // Sync GridNodes w
 				if(! gridNode.children) gridNode.children = [];
 				else {
 					for(var i=gridNode.children.length-1; i>=0; i--){
+						if(!gridNode.children[i]) gridNode.children[i] = { type: app.GridNodes.GridNodeType.empty };
 						if(gridNode.children[i].type==app.GridNodes.GridNodeType.empty){
 							EmptyNodes.unshift(gridNode.children[i]);
 						} else {
@@ -448,11 +452,14 @@ app.GridNodes.getNodeWithParents = function(id){
 app.GridNodes.updateNode = function(gridNode, value, callback){
 	if(value){
 		if(value.title) gridNode.title = value.title;
+		if(value.image) gridNode.image = value.image;
+		else delete gridNode.image;
 		if(gridNode.type == app.GridNodes.GridNodeType.bookmark && value.url && gridNode.url != value.url){
 			gridNode.url = value.url;
-			delete gridNode.image;
+			app.GridNodes.refreshNode(gridNode, function(){
+				browser.runtime.sendMessage({ cmd: app.Messages.Commands.gridNodesLoaded });
+			});
 		}
-		if(value.image) gridNode.image = value.image;
 		app.GridNodes.saveNode(gridNode);
 	}
 	if(callback) callback(gridNode);
@@ -480,14 +487,16 @@ app.GridNodes.setNodeIndex = function(gridNode, index, newIndex, callback){ // S
 }
 app.GridNodes.createBookmark = function(gridNode, url, title, callback){ // Create a new Bookmark in a GridNode.  callback(gridNode, newGridNode)
 	browser.bookmarks.onCreated.removeListener(app.Bookmarks._onCreated);
+	var prefix = '';
+	if(url.indexOf('://')<0) prefix = 'http://';
 	browser.bookmarks.create({
 		parentId: gridNode.id,
 		title: title || url,
-		url: url
+		url: prefix + url
 	}).then(function(bookmarkItem){
 		if(!gridNode) return; // ??? Why this method are called a second time with gridNode = null ???
 		browser.bookmarks.onCreated.addListener(app.Bookmarks._onCreated);
-		var newGridNode = { id: bookmarkItem.id, type: app.GridNodes.GridNodeType.bookmark, url: url, title };
+		var newGridNode = { id: bookmarkItem.id, type: app.GridNodes.GridNodeType.bookmark, url: prefix + url, title };
 		var EmptyCellFound = false;
 		for(var i=0; i<gridNode.children.length; i++){
 			if(gridNode.children[i].type == app.GridNodes.GridNodeType.empty){

src/js/dial.js

@@ -209,7 +209,7 @@ dial.initMenus = function(){
 	document.body.appendChild(dial.ItemMenu);
 }
 dial.initStyles = function(){
-	if(dial.Style) document.head.removeChild(dial.Style);
+	var oldStyle = dial.Style;
 	dial.Style = document.createElement('style'), StyleSheet;
 	document.head.appendChild(dial.Style);
 	dial.styles = {};
@@ -234,9 +234,10 @@ dial.initStyles = function(){
 	dial.styles.grid.linkFolder = dial.Style.sheet.cssRules[dial.Style.sheet.insertRule('.Grid td>a.Folder :first-child { background-image: ' + app.settings.grid.folderIcon + '; background-repeat: no-repeat; background-size: 100% 100%; }')].style;
 	dial.styles.grid.linkBookmark = dial.Style.sheet.cssRules[dial.Style.sheet.insertRule('.Grid td>a.Bookmark :first-child { background-repeat: no-repeat; background-size: 100% 100%; }')].style;
 	dial.styles.grid.linkBookmarkLoading = dial.Style.sheet.cssRules[dial.Style.sheet.insertRule('.Grid td>a.BookmarkLoading :first-child { background-image: url("' + app.settings.grid.cells.loadingIcon + '"); background-repeat: no-repeat; background-position: center center; }')].style;
+	if(oldStyle) document.head.removeChild(oldStyle);
 };
 dial.initGrid = function(){
-	if(dial.Grid) document.body.removeChild(dial.Grid);
+	var oldGrid = dial.Grid;
 	dial.Grid = document.createElement('table');
 	var grid = document.createElement('table');
 	dial.Grid.className = 'Grid';
@@ -257,13 +258,25 @@ dial.initGrid = function(){
 			link.onmousedown = function(){ dial._selectedItem = this; };
 			
 			function dragstart_handler(ev) {
+				if(!ev.target.Node){
+					ev.preventDefault();
+					return;
+				}
 				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);
 			}
 			function dragover_handler(ev) {
 				ev.preventDefault();
-				ev.dataTransfer.dropEffect = "move"
+				if(app.settings.grid.backNode && dial.path != '/'){
+					var gridIndex = 0;
+					if(ev.target.tagName == 'DIV') gridIndex = +(ev.target.parentElement.parentElement.getAttribute('gridindex'));
+					else gridIndex = +(ev.target.getAttribute('gridindex'));
+					if(gridIndex==0) ev.dataTransfer.dropEffect = "none";
+					else ev.dataTransfer.dropEffect = "move";
+				} else {
+					ev.dataTransfer.dropEffect = "move";
+				}
 			}
 			function drop_handler(ev) {
 				ev.preventDefault();
@@ -286,6 +299,7 @@ dial.initGrid = function(){
 	}
 	document.body.appendChild(dial.Grid);
 	dial.updateGridLayout();
+	if(oldGrid) document.body.removeChild(oldGrid);
 	return dial.Grid;
 };
 dial.updateGridLayout = function(){

src/js/properties.js

@@ -17,11 +17,15 @@ app.init = function(){
 			switch(node.type){
 				case app.GridNodes.GridNodeType.folder:
 					Url.parentNode.parentNode.style.display = 'none';
-					if(node.image) Image = node.image;
+					if(node.image){
-					else Image = app.settings.grid.folderIcon;
+						if(node.image.indexOf('url(')>0) Image = node.image;
-					ImagePreview.style.backgroundImage = Image;
+						else Image = 'url(' + node.image + ')';
+					} else Image = null;
+					if(Image==null) ImagePreview.style.backgroundImage = app.settings.grid.folderIcon;
+					else ImagePreview.style.backgroundImage = Image;
 					break;
 				case app.GridNodes.GridNodeType.bookmark:
+					ImageDefault.style.display = 'none';
 					Url.value = node.url;
 					Image = 'url(' + node.image + ')';
 					ImagePreview.style.backgroundImage = Image;
@@ -46,6 +50,17 @@ app.init = function(){
 				}
 			};
 
+			ImageDefault.onclick = function(){
+				switch(node.type){
+					case app.GridNodes.GridNodeType.folder:
+						Image = null;
+						ImagePreview.style.backgroundImage = app.settings.grid.folderIcon;
+						break;
+					case app.GridNodes.GridNodeType.bookmark:
+						break;
+				}
+			};
+
 
 			ImageFile.onclick = function(){
 				this.value = null;

src/manifest.json

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