diff --git a/src/html/properties.html b/src/html/properties.html
index 26cd695..2e2ad6f 100644
--- a/src/html/properties.html
+++ b/src/html/properties.html
@@ -44,6 +44,13 @@
Image : |
+
diff --git a/src/js/background.js b/src/js/background.js
index 0c04bd5..55048ff 100644
--- a/src/js/background.js
+++ b/src/js/background.js
@@ -502,17 +502,33 @@ app.GridNodes.updateNode = function(gridNode, value, callback){
if(value.titleLocked!=null) gridNode.titleLocked = value.titleLocked;
if(value.image) gridNode.image = value.image;
else delete gridNode.image;
- if(gridNode.type == app.GridNodes.GridNodeType.bookmark) gridNode.url = value.url;
- app.GridNodes.refreshNode(gridNode, function(){
+ if(value.imageMode || value.imageMode == 0) {
+ if(value.imageMode == -1) delete gridNode.imageMode;
+ else gridNode.imageMode = value.imageMode;
+ }
+ if(gridNode.type == app.GridNodes.GridNodeType.bookmark && value.url && gridNode.url != value.url){
+ gridNode.url = value.url;
+ app.GridNodes.refreshNode(gridNode, function(){
+ browser.runtime.sendMessage({ cmd: app.Messages.Commands.gridNodesLoaded });
+ var data = { title: gridNode.title };
+ if(gridNode.imageMode) data.imageMode = gridNode.imageMode;
+ if(gridNode.type == app.GridNodes.GridNodeType.bookmark) data.url = gridNode.url;
+ browser.bookmarks.onChanged.removeListener(app.Bookmarks._onChanged);
+ browser.bookmarks.update(gridNode.id, data).then(function(){
+ browser.bookmarks.onChanged.addListener(app.Bookmarks._onChanged);
+ });
+ app.GridNodes.saveNode(gridNode);
+ });
+ } else {
browser.runtime.sendMessage({ cmd: app.Messages.Commands.gridNodesLoaded });
var data = { title: gridNode.title };
- if(gridNode.type == app.GridNodes.GridNodeType.bookmark) data.url = gridNode.url;
+ if(gridNode.imageMode) data.imageMode = gridNode.imageMode;
browser.bookmarks.onChanged.removeListener(app.Bookmarks._onChanged);
browser.bookmarks.update(gridNode.id, data).then(function(){
browser.bookmarks.onChanged.addListener(app.Bookmarks._onChanged);
});
- });
- app.GridNodes.saveNode(gridNode);
+ app.GridNodes.saveNode(gridNode);
+ }
}
if(callback) callback(gridNode);
}
diff --git a/src/js/dial.js b/src/js/dial.js
index dda69d7..6d20daf 100644
--- a/src/js/dial.js
+++ b/src/js/dial.js
@@ -417,6 +417,35 @@ dial.updateGridLayout = function(){
else dial.styles.grid.linkPanelHover.height = values.linkHeight.toString() + 'px';
};
dial.populateGrid = function(){
+ function applyImageMode(imageMode, target){
+ switch(imageMode){
+ case -1:
+ target.backgroundRepeat = '';
+ target.backgroundSize = '';
+ target.backgroundPosition = '';
+ break;
+ case 0:
+ target.backgroundRepeat = 'no-repeat';
+ target.backgroundSize = '100% 100%';
+ target.backgroundPosition = '';
+ break;
+ case 1:
+ target.backgroundRepeat = 'no-repeat';
+ target.backgroundSize = 'cover';
+ target.backgroundPosition = 'center';
+ break;
+ case 2:
+ target.backgroundRepeat = 'no-repeat';
+ target.backgroundSize = 'contain';
+ target.backgroundPosition = 'center';
+ break;
+ case 3:
+ target.backgroundRepeat = 'no-repeat';
+ target.backgroundSize = 'auto auto';
+ target.backgroundPosition = 'center';
+ break;
+ }
+ }
populateEmpty = function(link){
link.Node = null;
link.className = 'Empty';
@@ -437,6 +466,8 @@ dial.populateGrid = function(){
populateFolder = function(link, node){
link.Node = node;
link.className = 'Folder';
+ if(node.imageMode || node.imageMode == 0) applyImageMode(node.imageMode, link.childNodes[0].style);
+ else applyImageMode(-1, link.childNodes[0].style);
if(node.image){
if(node.image.indexOf('url(')>=0) link.childNodes[0].style.backgroundImage = node.image;
else link.childNodes[0].style.backgroundImage = 'url(' + node.image + ')';
@@ -449,6 +480,8 @@ dial.populateGrid = function(){
}
populateBookmark = function(link, node){
link.Node = node;
+ if(node.imageMode || node.imageMode == 0) applyImageMode(node.imageMode, link.childNodes[0].style);
+ else applyImageMode(-1, link.childNodes[0].style);
if(node.image){
link.className = 'Bookmark';
if(node.image.indexOf('url(')>=0) link.childNodes[0].style.backgroundImage = node.image;
diff --git a/src/js/properties.js b/src/js/properties.js
index d205788..cfcd6bc 100644
--- a/src/js/properties.js
+++ b/src/js/properties.js
@@ -19,6 +19,8 @@ app.init = function(){
app.Messages.getNodeByID(new URL(window.location).searchParams.get('id'), function(node){
app.node = node;
Title.value = node.title;
+ if(node.imageMode == 0) ImageMode.value = 0;
+ else if(node.imageMode) ImageMode.value = node.imageMode;
ImagePreview.style.backgroundRepeat = 'no-repeat';
ImagePreview.style.backgroundSize = '100% 100%';
switch(node.type){
@@ -97,10 +99,10 @@ app.init = function(){
BtnApply.onclick = function(){
switch(app.node.type){
case app.GridNodes.GridNodeType.folder:
- app.Messages.updateNode(app.node.id, { title: Title.value, image: Image })
+ app.Messages.updateNode(app.node.id, { title: Title.value, image: Image, imageMode: +(ImageMode.value) })
break;
case app.GridNodes.GridNodeType.bookmark:
- app.Messages.updateNode(app.node.id, { title: Title.value, titleLocked: TitleLocked.checked, url: Url.value, image: Image })
+ app.Messages.updateNode(app.node.id, { title: Title.value, titleLocked: TitleLocked.checked, url: Url.value, image: Image, imageMode: +(ImageMode.value) })
break;
}
}
|