mirror of
https://github.com/MatMoul/quickdial-webext.git
synced 2024-12-23 23:46:11 +00:00
Bug reported by Scienmind and Acid Crash: Private Window and Contextual Identities don't work
This commit is contained in:
parent
1413464149
commit
039c3566ea
2
src/dial
2
src/dial
@ -1 +1 @@
|
|||||||
<!DOCTYPE html><html><head id="head"><meta charset="utf-8" /><link rel="shortcut icon" type="image/png" href="img/24.png" /><title id="title"></title><script type="text/javascript" src="js/dial.js"></script></head><body id="body"></body></html>
|
<!DOCTYPE html><html><head><meta charset="utf-8" /><link rel="shortcut icon" type="image/png" href="img/24.png" /><script type="text/javascript" src="js/dial.js"></script></head><body></body></html>
|
@ -2,18 +2,74 @@ var core = {}; // Main app object in background.js
|
|||||||
var app = {}; // Shared app object with pages
|
var app = {}; // Shared app object with pages
|
||||||
|
|
||||||
core.init = function(){ // Init module
|
core.init = function(){ // Init module
|
||||||
core.Settings.load(function(){
|
core.Settings.init(function(){
|
||||||
core.GridNodes.sync(app.settings.grid.node, app.settings.grid.root, function(){ // Sync bookmarks with stored data
|
core.GridNodes.sync(core.node, core.settings.grid.root, function(){
|
||||||
core.ContextMenus.initMenu();
|
core.Messages.init();
|
||||||
|
browser.runtime.sendMessage({ cmd: 'SettingsChanged' });
|
||||||
|
browser.runtime.sendMessage({ cmd: 'GridNodesLoaded' });
|
||||||
core.Bookmarks.initListener();
|
core.Bookmarks.initListener();
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
}
|
};
|
||||||
|
|
||||||
|
core.Messages = {}; // Messages helper object
|
||||||
|
core.Messages.init = function(){ // Init Messages Listeners
|
||||||
|
browser.runtime.onMessage.addListener(function(request, sender, sendResponse){
|
||||||
|
switch(request.cmd){
|
||||||
|
case 'GetSettings':
|
||||||
|
sendResponse(core.settings);
|
||||||
|
break;
|
||||||
|
case 'SetSettings':
|
||||||
|
core.settings = request.settings;
|
||||||
|
core.Settings.save();
|
||||||
|
sendResponse(core.settings);
|
||||||
|
browser.runtime.sendMessage( { cmd: 'SettingsChanged' } );
|
||||||
|
browser.runtime.sendMessage( { cmd: 'GridNodesLoaded' } );
|
||||||
|
break;
|
||||||
|
case 'GetNode':
|
||||||
|
sendResponse(core.GridNodes.getNode(core.node, request.path.substr(1)));
|
||||||
|
break;
|
||||||
|
case 'SetNodeIndex':
|
||||||
|
core.GridNodes.setNodeIndex(core.GridNodes.getNode(core.node, request.path.substr(1)), request.index, request.newIndex, function(){
|
||||||
|
browser.runtime.sendMessage( { cmd: 'GridNodesLoaded' } );
|
||||||
|
});
|
||||||
|
break;
|
||||||
|
case 'CreateBookmark':
|
||||||
|
core.GridNodes.createBookmark(core.GridNodes.getNode(core.node, request.path.substr(1)), request.url, request.title, function(){
|
||||||
|
browser.runtime.sendMessage( { cmd: 'GridNodesLoaded' } );
|
||||||
|
});
|
||||||
|
break;
|
||||||
|
case 'CreateFolder':
|
||||||
|
core.GridNodes.createFolder(core.GridNodes.getNode(core.node, request.path.substr(1)), request.name, function(){
|
||||||
|
browser.runtime.sendMessage( { cmd: 'GridNodesLoaded' } );
|
||||||
|
});
|
||||||
|
break;
|
||||||
|
case 'DeleteNode':
|
||||||
|
core.GridNodes.deleteNode(core.GridNodes.getNode(core.node, request.path.substr(1)), request.id, function(){
|
||||||
|
browser.runtime.sendMessage( { cmd: 'GridNodesLoaded' } );
|
||||||
|
});
|
||||||
|
break;
|
||||||
|
case 'RefreshNode':
|
||||||
|
core.GridNodes.refreshNode(core.GridNodes.getChildNode(core.GridNodes.getNode(core.node, request.path.substr(1)), request.id), function(){
|
||||||
|
browser.runtime.sendMessage( { cmd: 'GridNodesLoaded' } );
|
||||||
|
});
|
||||||
|
break;
|
||||||
|
case 'CapturePage':
|
||||||
|
core.GridNodes.capturePage(core.GridNodes.getChildNode(core.GridNodes.getNode(core.node, request.path.substr(1)), request.id), function(){
|
||||||
|
browser.runtime.sendMessage( { cmd: 'GridNodesLoaded' } );
|
||||||
|
});
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
core.Settings = {}; // Settings helper object
|
core.Settings = {}; // Settings helper object
|
||||||
core.Settings.load = function(callback){ // Load settings
|
core.Settings.init = function(callback){ // Load settings and nodes
|
||||||
browser.storage.local.get({
|
browser.storage.local.get().then(function(data){
|
||||||
version: 2,
|
if(Object.keys(data).length == 0) {
|
||||||
|
data = {
|
||||||
|
version: 3,
|
||||||
|
settings: {
|
||||||
backgroundColor: '#3c4048',
|
backgroundColor: '#3c4048',
|
||||||
backgroundImage: null,
|
backgroundImage: null,
|
||||||
grid: {
|
grid: {
|
||||||
@ -27,8 +83,6 @@ core.Settings.load = function(callback){ // Load settings
|
|||||||
cells: {
|
cells: {
|
||||||
margin: 4,
|
margin: 4,
|
||||||
marginHover: 4,
|
marginHover: 4,
|
||||||
ratioX: 4,
|
|
||||||
ratioY: 3,
|
|
||||||
backgroundColor: null,
|
backgroundColor: null,
|
||||||
backgroundColorHover: null,
|
backgroundColorHover: null,
|
||||||
borderColor: '#333333',
|
borderColor: '#333333',
|
||||||
@ -42,34 +96,61 @@ core.Settings.load = function(callback){ // Load settings
|
|||||||
titleColor: '#ffffff',
|
titleColor: '#ffffff',
|
||||||
titleColorHover: '#33ccff',
|
titleColorHover: '#33ccff',
|
||||||
titleBackgroundColor: null,
|
titleBackgroundColor: null,
|
||||||
titleBackgroundColorHover: null
|
titleBackgroundColorHover: null,
|
||||||
|
previewWidth: 1200,
|
||||||
|
previewHeight: 710
|
||||||
},
|
},
|
||||||
root: 'Quick Dial',
|
root: 'Quick Dial',
|
||||||
|
}
|
||||||
|
},
|
||||||
node: { children: [] }
|
node: { children: [] }
|
||||||
}
|
}
|
||||||
}).then(function(obj){
|
|
||||||
if(obj.grid.cells.backIcon){ // Upgrade Data Version
|
|
||||||
obj.version = 2;
|
|
||||||
obj.grid.backNode = true;
|
|
||||||
obj.grid.backIcon = 'url(/img/back.png)';
|
|
||||||
obj.grid.folderIcon = 'url(/img/folder.png)';
|
|
||||||
obj.grid.loadingIcon = 'url(/img/throbber.gif)';
|
|
||||||
obj.grid.cells.backgroundColor = null;
|
|
||||||
obj.grid.cells.backgroundColorHover = null;
|
|
||||||
obj.grid.cells.titleBackgroundColor = null;
|
|
||||||
obj.grid.cells.titleBackgroundColorHover = null;
|
|
||||||
delete obj.grid.cells.backIcon;
|
|
||||||
delete obj.grid.cells.folderIcon;
|
|
||||||
delete obj.grid.cells.loadingIcon;
|
|
||||||
delete obj.grid.cells.backPanel;
|
|
||||||
}
|
}
|
||||||
app.settings = obj;
|
if(!data.version){ // Upgrade Data Version
|
||||||
if(callback) callback();
|
data.version = 2;
|
||||||
|
data.grid.backNode = true;
|
||||||
|
data.grid.backIcon = 'url(/img/back.png)';
|
||||||
|
data.grid.folderIcon = 'url(/img/folder.png)';
|
||||||
|
data.grid.loadingIcon = 'url(/img/throbber.gif)';
|
||||||
|
data.grid.cells.backgroundColor = null;
|
||||||
|
data.grid.cells.backgroundColorHover = null;
|
||||||
|
data.grid.cells.titleBackgroundColor = null;
|
||||||
|
data.grid.cells.titleBackgroundColorHover = null;
|
||||||
|
delete data.grid.cells.backIcon;
|
||||||
|
delete data.grid.cells.folderIcon;
|
||||||
|
delete data.grid.cells.loadingIcon;
|
||||||
|
delete data.grid.cells.backPanel;
|
||||||
|
}
|
||||||
|
if(data.version == 2){ // Upgrade Data Version
|
||||||
|
var oldData = data;
|
||||||
|
data = {};
|
||||||
|
data.version = 3;
|
||||||
|
data.settings = oldData;
|
||||||
|
data.node = oldData.grid.node;
|
||||||
|
delete data.settings.version;
|
||||||
|
delete data.settings.grid.node;
|
||||||
|
core.settings = data.settings;
|
||||||
|
core.node = data.node;
|
||||||
|
browser.storage.local.clear().then(function(){
|
||||||
|
core.Settings.save();
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
core.Settings.save = function(){ // Save settings
|
core.settings = data.settings;
|
||||||
browser.storage.local.set(app.settings);
|
core.node = data.node;
|
||||||
browser.runtime.sendMessage({ command: 'SettingsChanged' });
|
if(callback) callback();
|
||||||
|
}, function(){ console.log('Error loading data'); });
|
||||||
|
};
|
||||||
|
core.Settings.update = function(settings, callback){ // Save new settings
|
||||||
|
core.settings = settings;
|
||||||
|
core.Settings.save(callback);
|
||||||
|
};
|
||||||
|
core.Settings.save = function(callback){ // Save settings
|
||||||
|
var data = { version: 3 };
|
||||||
|
data.settings = core.settings;
|
||||||
|
data.node = core.node;
|
||||||
|
browser.storage.local.set(data).then(function(){
|
||||||
|
if(callback) callback();
|
||||||
|
}, function(){ console.log('Error saving settings'); });
|
||||||
}
|
}
|
||||||
|
|
||||||
core.init();
|
core.init();
|
||||||
@ -83,19 +164,26 @@ core.ContextMenus.initMenu = function(){ // (Called from core.init) Init context
|
|||||||
documentUrlPatterns: [ 'http://*/*', 'https://*/*', 'file://*/*' ]
|
documentUrlPatterns: [ 'http://*/*', 'https://*/*', 'file://*/*' ]
|
||||||
}, function(){});
|
}, function(){});
|
||||||
browser.contextMenus.onClicked.addListener(function(info, tab) { // Context menu click event
|
browser.contextMenus.onClicked.addListener(function(info, tab) { // Context menu click event
|
||||||
if (info.menuItemId == "AddToQuickDial")
|
//if (info.menuItemId == "AddToQuickDial")
|
||||||
core.GridNodes.createBookmark(app.settings.grid.node, info.pageUrl, tab.title, function(){});
|
//core.GridNodes.createBookmark(app.settings.grid.node, info.pageUrl, tab.title, function(){});
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
core.Bookmarks = {} // Bookmarks helper object
|
core.Bookmarks = {} // Bookmarks helper object
|
||||||
core.Bookmarks._onCreated = function(){ core.GridNodes.sync(app.settings.grid.node, app.settings.grid.root); }
|
core.Bookmarks._onCreated = function(){ }
|
||||||
core.Bookmarks._onChanged = function(){ core.GridNodes.sync(app.settings.grid.node, app.settings.grid.root); }
|
core.Bookmarks._onChanged = function(){ }
|
||||||
core.Bookmarks._onMoved = function(){ core.GridNodes.sync(app.settings.grid.node, app.settings.grid.root); }
|
core.Bookmarks._onMoved = function(){ }
|
||||||
core.Bookmarks._onRemoved = function(){ core.GridNodes.sync(app.settings.grid.node, app.settings.grid.root); }
|
core.Bookmarks._onRemoved = function(){ }
|
||||||
|
/*
|
||||||
|
core.Bookmarks._onCreated = function(){ core.GridNodes.sync(core.settings.grid.node, core.settings.grid.root); }
|
||||||
|
core.Bookmarks._onChanged = function(){ core.GridNodes.sync(core.settings.grid.node, core.settings.grid.root); }
|
||||||
|
core.Bookmarks._onMoved = function(){ core.GridNodes.sync(core.settings.grid.node, core.settings.grid.root); }
|
||||||
|
core.Bookmarks._onRemoved = function(){ core.GridNodes.sync(core.settings.grid.node, core.settings.grid.root); }
|
||||||
|
*/
|
||||||
|
// ---------
|
||||||
core.Bookmarks.initListener = function(){ // (Called from core.init) (/!\ Need filter to root tree only) Init listener of bookmarks
|
core.Bookmarks.initListener = function(){ // (Called from core.init) (/!\ Need filter to root tree only) Init listener of bookmarks
|
||||||
browser.bookmarks.onCreated.addListener(core.Bookmarks._onCreated);
|
browser.bookmarks.onCreated.addListener(core.Bookmarks._onCreated);
|
||||||
//browser.bookmarks.onChanged.addListener(core.Bookmarks._onChanged);
|
browser.bookmarks.onChanged.addListener(core.Bookmarks._onChanged);
|
||||||
browser.bookmarks.onMoved.addListener(core.Bookmarks._onMoved);
|
browser.bookmarks.onMoved.addListener(core.Bookmarks._onMoved);
|
||||||
browser.bookmarks.onRemoved.addListener(core.Bookmarks._onRemoved);
|
browser.bookmarks.onRemoved.addListener(core.Bookmarks._onRemoved);
|
||||||
}
|
}
|
||||||
@ -122,29 +210,6 @@ core.Bookmarks.load = function(rootPath, callback){ // Load root bookmark and cr
|
|||||||
}
|
}
|
||||||
|
|
||||||
core.SiteInfos = {} // Siteinfos helper object
|
core.SiteInfos = {} // Siteinfos helper object
|
||||||
core.SiteInfos.fromTab = function(callback){ // Retrieve infos from current tab. callback( { url, title, icon, screenshot } || error: callback() )
|
|
||||||
browser.tabs.getCurrent().then(function(tab){
|
|
||||||
function whaitLoaded(){
|
|
||||||
browser.tabs.get(tab.id).then(function(tab){
|
|
||||||
if(tab.status == 'loading') setTimeout(whaitLoaded, 300);
|
|
||||||
else {
|
|
||||||
browser.tabs.update(tab.id, {active: true}).then(function(){
|
|
||||||
setTimeout(function(){
|
|
||||||
browser.tabs.captureVisibleTab().then(function(img){
|
|
||||||
browser.tabs.remove(tab.id);
|
|
||||||
if(callback) callback( { url: tab.url, title: tab.title, icon: tab.favIconUrl, screenshot: img } );
|
|
||||||
}, function(){
|
|
||||||
browser.tabs.remove(tab.id);
|
|
||||||
if(callback) callback();
|
|
||||||
});
|
|
||||||
}, 300);
|
|
||||||
}, function(){ if(callback) callback(); });
|
|
||||||
}
|
|
||||||
}, function(){ if(callback) callback(); });
|
|
||||||
}
|
|
||||||
setTimeout(whaitLoaded, 300);
|
|
||||||
}, function(){ if(callback) callback(); });
|
|
||||||
}
|
|
||||||
core.SiteInfos.fromNewTab = function(url, callback){ // Retrieve infos from a new tab. callback( { url, title, icon, screenshot } || error: callback() )
|
core.SiteInfos.fromNewTab = function(url, callback){ // Retrieve infos from a new tab. callback( { url, title, icon, screenshot } || error: callback() )
|
||||||
browser.tabs.create({url: url, active: false}).then(function(tab){
|
browser.tabs.create({url: url, active: false}).then(function(tab){
|
||||||
browser.tabs.update(tab.id, {muted: true}).then();
|
browser.tabs.update(tab.id, {muted: true}).then();
|
||||||
@ -185,12 +250,12 @@ core.SiteInfos.fromNewTab = function(url, callback){ // Retrieve infos from a n
|
|||||||
ctx.restore();
|
ctx.restore();
|
||||||
img = canvas.toDataURL();
|
img = canvas.toDataURL();
|
||||||
if(callback) callback( { url: tab.url, title: tab.title, icon: tab.favIconUrl, screenshot: img } );
|
if(callback) callback( { url: tab.url, title: tab.title, icon: tab.favIconUrl, screenshot: img } );
|
||||||
}, 1);
|
}, 100);
|
||||||
}, function(){
|
}, function(){
|
||||||
browser.tabs.remove(tab.id);
|
browser.tabs.remove(tab.id);
|
||||||
if(callback) callback();
|
if(callback) callback();
|
||||||
});
|
});
|
||||||
}, 300);
|
}, 500);
|
||||||
}, function(){ if(callback) callback(); });
|
}, function(){ if(callback) callback(); });
|
||||||
}
|
}
|
||||||
}, function(){ if(callback) callback(); });
|
}, function(){ if(callback) callback(); });
|
||||||
@ -248,25 +313,12 @@ core.SiteInfos.fromFrame = function(url, callback){ // Retrieve infos from an if
|
|||||||
xmlHttp.onerror = function(){ if(callback) callback(); }
|
xmlHttp.onerror = function(){ if(callback) callback(); }
|
||||||
xmlHttp.ontimeout = function(){ if(callback) callback(); }
|
xmlHttp.ontimeout = function(){ if(callback) callback(); }
|
||||||
xmlHttp.send();
|
xmlHttp.send();
|
||||||
}
|
}
|
||||||
core.SiteInfos.fromWS = function(url, callback){ // Retrieve infos from a Web Service. callback( { url, title, (/!\ Not handled now)icon, screenshot } || error: callback() )
|
core.SiteInfos.fromWS = function(url, callback){ // Retrieve infos from a Web Service. callback( { url, title, (/!\ Not handled now)icon, screenshot } || error: callback() )
|
||||||
console.log('Not implemented');
|
console.log('Not implemented');
|
||||||
return core.SiteInfos.fromFrame(url, callback);
|
return core.SiteInfos.fromFrame(url, callback);
|
||||||
}
|
}
|
||||||
|
|
||||||
/*
|
|
||||||
core.GridNodes.GridNode = function(){
|
|
||||||
this.id = null; // 0
|
|
||||||
//this.lastUpdate = new Date(0);
|
|
||||||
this.type = core.GridNodes.GridNodeType.empty;
|
|
||||||
//this.path = '';
|
|
||||||
this.title = null; // ''
|
|
||||||
this.icon = null; // ''
|
|
||||||
this.image = null; // ''
|
|
||||||
this.url = null; // ''
|
|
||||||
this.children = null; // []
|
|
||||||
}
|
|
||||||
*/
|
|
||||||
core.GridNodes = {}; // GridNodes helper object
|
core.GridNodes = {}; // GridNodes helper object
|
||||||
core.GridNodes.GridNodeType = { // GridNodeType
|
core.GridNodes.GridNodeType = { // GridNodeType
|
||||||
back: -1,
|
back: -1,
|
||||||
@ -333,9 +385,8 @@ core.GridNodes.sync = function(gridNode, rootPath, callback){ // Sync GridNodes
|
|||||||
if(callback) callback();
|
if(callback) callback();
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
core.GridNodes.save = function(){ // Save GridNode
|
core.GridNodes.save = function(callback){ // Save GridNodes
|
||||||
browser.storage.local.set(app.settings);
|
core.Settings.save(callback);
|
||||||
browser.runtime.sendMessage({ command: 'GridNodesSaved'});
|
|
||||||
}
|
}
|
||||||
core.GridNodes.getNode = function(gridNode, path){ // Return GridNode from RootGridNode path
|
core.GridNodes.getNode = function(gridNode, path){ // Return GridNode from RootGridNode path
|
||||||
if(path.length == 0 || path == '/') return gridNode;
|
if(path.length == 0 || path == '/') return gridNode;
|
||||||
@ -348,9 +399,8 @@ core.GridNodes.getChildNode = function(gridNode, id){ // Return child node by ID
|
|||||||
for(var child of gridNode.children) if(child.id == id) return child;
|
for(var child of gridNode.children) if(child.id == id) return child;
|
||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
core.GridNodes.saveNode = function(gridNode){ // Save GridNode
|
core.GridNodes.saveNode = function(gridNode, callback){ // Save GridNode
|
||||||
browser.storage.local.set(app.settings);
|
core.Settings.save(callback);
|
||||||
browser.runtime.sendMessage({ command: 'GridNodeSaved', gridNode: gridNode });
|
|
||||||
}
|
}
|
||||||
core.GridNodes.setNodeIndex = function(gridNode, index, newIndex, callback){ // Set Child GridNodeIndex. callback(gridNode, node1, node2)
|
core.GridNodes.setNodeIndex = function(gridNode, index, newIndex, callback){ // Set Child GridNodeIndex. callback(gridNode, node1, node2)
|
||||||
while(newIndex>=gridNode.children.length)
|
while(newIndex>=gridNode.children.length)
|
||||||
@ -366,15 +416,16 @@ core.GridNodes.setNodeIndex = function(gridNode, index, newIndex, callback){ //
|
|||||||
core.GridNodes.saveNode(gridNode);
|
core.GridNodes.saveNode(gridNode);
|
||||||
if(callback) callback(gridNode, node1, node2);
|
if(callback) callback(gridNode, node1, node2);
|
||||||
}
|
}
|
||||||
core.GridNodes.createFolder = function(gridNode, name, callback){ // Create a new folder in a GridNode. callback(gridNode, newGridNode)
|
core.GridNodes.createBookmark = function(gridNode, url, title, callback){ // Create a new Bookmark in a GridNode. callback(gridNode, newGridNode)
|
||||||
browser.bookmarks.onCreated.removeListener(core.Bookmarks._onCreated);
|
browser.bookmarks.onCreated.removeListener(core.Bookmarks._onCreated);
|
||||||
browser.bookmarks.create({
|
browser.bookmarks.create({
|
||||||
parentId: gridNode.id,
|
parentId: gridNode.id,
|
||||||
title: name
|
title: title || url,
|
||||||
|
url: url
|
||||||
}).then(function(bookmarkItem){
|
}).then(function(bookmarkItem){
|
||||||
if(!gridNode) return; // ??? Why this method are called a second time with gridNode = null ???
|
if(!gridNode) return; // ??? Why this method are called a second time with gridNode = null ???
|
||||||
browser.bookmarks.onCreated.addListener(core.Bookmarks._onCreated);
|
browser.bookmarks.onCreated.addListener(core.Bookmarks._onCreated);
|
||||||
var newGridNode = { id: bookmarkItem.id, type: core.GridNodes.GridNodeType.folder, title: name, children: [] };
|
var newGridNode = { id: bookmarkItem.id, type: core.GridNodes.GridNodeType.bookmark, url: url, title };
|
||||||
var EmptyCellFound = false;
|
var EmptyCellFound = false;
|
||||||
for(var i=0; i<gridNode.children.length; i++){
|
for(var i=0; i<gridNode.children.length; i++){
|
||||||
if(gridNode.children[i].type == core.GridNodes.GridNodeType.empty){
|
if(gridNode.children[i].type == core.GridNodes.GridNodeType.empty){
|
||||||
@ -390,16 +441,15 @@ core.GridNodes.createFolder = function(gridNode, name, callback){ // Create a ne
|
|||||||
browser.bookmarks.onCreated.addListener(core.Bookmarks._onCreated);
|
browser.bookmarks.onCreated.addListener(core.Bookmarks._onCreated);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
core.GridNodes.createBookmark = function(gridNode, url, title, callback){ // Create a new Bookmark in a GridNode. callback(gridNode, newGridNode)
|
core.GridNodes.createFolder = function(gridNode, name, callback){ // Create a new folder in a GridNode. callback(gridNode, newGridNode)
|
||||||
browser.bookmarks.onCreated.removeListener(core.Bookmarks._onCreated);
|
browser.bookmarks.onCreated.removeListener(core.Bookmarks._onCreated);
|
||||||
browser.bookmarks.create({
|
browser.bookmarks.create({
|
||||||
parentId: gridNode.id,
|
parentId: gridNode.id,
|
||||||
title: title || url,
|
title: name
|
||||||
url: url
|
|
||||||
}).then(function(bookmarkItem){
|
}).then(function(bookmarkItem){
|
||||||
if(!gridNode) return; // ??? Why this method are called a second time with gridNode = null ???
|
if(!gridNode) return; // ??? Why this method are called a second time with gridNode = null ???
|
||||||
browser.bookmarks.onCreated.addListener(core.Bookmarks._onCreated);
|
browser.bookmarks.onCreated.addListener(core.Bookmarks._onCreated);
|
||||||
var newGridNode = { id: bookmarkItem.id, type: core.GridNodes.GridNodeType.bookmark, url: url, title };
|
var newGridNode = { id: bookmarkItem.id, type: core.GridNodes.GridNodeType.folder, title: name, children: [] };
|
||||||
var EmptyCellFound = false;
|
var EmptyCellFound = false;
|
||||||
for(var i=0; i<gridNode.children.length; i++){
|
for(var i=0; i<gridNode.children.length; i++){
|
||||||
if(gridNode.children[i].type == core.GridNodes.GridNodeType.empty){
|
if(gridNode.children[i].type == core.GridNodes.GridNodeType.empty){
|
||||||
@ -443,9 +493,11 @@ core.GridNodes.refreshNode = function(gridNode, callback){ // Refresh content of
|
|||||||
if(infos){
|
if(infos){
|
||||||
gridNode.title = infos.title;
|
gridNode.title = infos.title;
|
||||||
gridNode.image = infos.screenshot;
|
gridNode.image = infos.screenshot;
|
||||||
|
} else {
|
||||||
|
gridNode.image = '0';
|
||||||
|
}
|
||||||
delete gridNode.__isLoading;
|
delete gridNode.__isLoading;
|
||||||
core.GridNodes.saveNode(gridNode);
|
core.GridNodes.saveNode(gridNode);
|
||||||
} else delete gridNode.__isLoading;
|
|
||||||
if(callback) callback(infos);
|
if(callback) callback(infos);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
@ -456,20 +508,11 @@ core.GridNodes.capturePage = function(gridNode, callback){
|
|||||||
if(infos){
|
if(infos){
|
||||||
gridNode.title = infos.title;
|
gridNode.title = infos.title;
|
||||||
gridNode.image = infos.screenshot;
|
gridNode.image = infos.screenshot;
|
||||||
|
} else {
|
||||||
|
gridNode.image = '0';
|
||||||
|
}
|
||||||
delete gridNode.__isLoading;
|
delete gridNode.__isLoading;
|
||||||
core.GridNodes.saveNode(gridNode);
|
core.GridNodes.saveNode(gridNode);
|
||||||
} else delete gridNode.__isLoading;
|
|
||||||
if(callback) callback(infos);
|
if(callback) callback(infos);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
// Public members
|
|
||||||
app.GridNodeType = core.GridNodes.GridNodeType;
|
|
||||||
app.refreshNode = core.GridNodes.refreshNode;
|
|
||||||
app.getNode = core.GridNodes.getNode;
|
|
||||||
app.createFolder = core.GridNodes.createFolder;
|
|
||||||
app.createBookmark = core.GridNodes.createBookmark;
|
|
||||||
app.deleteNode = core.GridNodes.deleteNode;
|
|
||||||
app.setNodeIndex = core.GridNodes.setNodeIndex;
|
|
||||||
app.capturePage = core.GridNodes.capturePage;
|
|
||||||
app.saveSettings = core.Settings.save;
|
|
380
src/js/dial.js
380
src/js/dial.js
@ -1,118 +1,119 @@
|
|||||||
var app = {}
|
var utils = {};
|
||||||
|
var app = {};
|
||||||
var dial = {
|
var dial = {
|
||||||
styles: {},
|
|
||||||
page: 1,
|
page: 1,
|
||||||
maxpage: 1
|
maxpage: 1
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
window.onload = function(){
|
window.onload = function(){
|
||||||
function initPage(){
|
app.init();
|
||||||
browser.runtime.getBackgroundPage().then(function(page){
|
dial.init();
|
||||||
if(page.app.settings){
|
};
|
||||||
app = page.app;
|
|
||||||
dial.initUI();
|
|
||||||
browser.runtime.onMessage.addListener(function(request, sender, sendResponse){
|
|
||||||
switch(request.command){
|
|
||||||
case 'SettingsChanged':
|
|
||||||
if(app.settings){
|
|
||||||
dial.Head.removeChild(dial.Style);
|
|
||||||
dial.Body.removeChild(dial.Grid);
|
|
||||||
dial.initStyles();
|
|
||||||
dial.Grid = dial.initGrid('Grid', app.settings.grid, dial.Body);
|
|
||||||
var url = new URL(window.location);
|
|
||||||
dial.path = url.searchParams.get('path');
|
|
||||||
if(url.searchParams.get('path')) {
|
|
||||||
dial.Node = app.getNode(app.settings.grid.node, dial.path + '/');
|
|
||||||
} else {
|
|
||||||
dial.Node = app.getNode(app.settings.grid.node, '/');
|
|
||||||
}
|
|
||||||
dial.Title.innerText = dial.Node.title;
|
|
||||||
dial.populateGrid(dial.Grid, app.settings.grid, dial.Node);
|
|
||||||
}
|
|
||||||
break;
|
|
||||||
case 'GridNodesSaved':
|
|
||||||
if(app.settings) dial.populateGrid(dial.Grid, app.settings.grid, dial.Node);
|
|
||||||
break;
|
|
||||||
case 'GridNodeSaved':
|
|
||||||
// request.gridNode
|
|
||||||
if(app.settings) dial.populateGrid(dial.Grid, app.settings.grid, dial.Node);
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
} else{
|
|
||||||
setTimeout(initPage, 100);
|
|
||||||
}
|
|
||||||
}, function(){});
|
|
||||||
}
|
|
||||||
initPage();
|
|
||||||
}
|
|
||||||
window.onresize = function(){
|
window.onresize = function(){
|
||||||
if(app && app.settings) dial.updateGridLayout(dial.Grid, app.settings.grid, dial.styles.grid);
|
if(app && app.settings) dial.updateGridLayout();
|
||||||
}
|
}
|
||||||
window.onwheel = function(ev){
|
window.onwheel = function(ev){
|
||||||
if(app && app.settings){
|
if(app && app.settings){
|
||||||
if(ev.deltaY > 0){
|
if(ev.deltaY > 0){
|
||||||
if(dial.page < dial.maxpage){
|
if(dial.page < dial.maxpage){
|
||||||
dial.page += 1;
|
dial.page += 1;
|
||||||
dial.populateGrid(dial.Grid, app.settings.grid, dial.Node);
|
dial.populateGrid();
|
||||||
}
|
}
|
||||||
} else if(ev.deltaY < 0){
|
} else if(ev.deltaY < 0){
|
||||||
if(dial.page > 1){
|
if(dial.page > 1){
|
||||||
dial.page -= 1;
|
dial.page -= 1;
|
||||||
dial.populateGrid(dial.Grid, app.settings.grid, dial.Node);
|
dial.populateGrid();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
dial.initUI = function(){
|
|
||||||
dial.Head = document.getElementById('head');
|
utils.getPath = function(){
|
||||||
dial.Title = document.getElementById('title');
|
var path = new URL(window.location).searchParams.get('path');
|
||||||
dial.Body = document.getElementById('body');
|
if(path) return path + '/';
|
||||||
dial.Body.setAttribute('contextmenu', 'page');
|
else return '/';
|
||||||
dial.Body.setAttribute('contextmenu', 'page');
|
};
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
app.init = function(){
|
||||||
|
dial.path = utils.getPath();
|
||||||
|
app.Messages.getSettings(app.Settings._changed);
|
||||||
|
app.Messages.getNode(dial.path, app.GridNodes._changed);
|
||||||
|
app.Messages.init();
|
||||||
|
};
|
||||||
|
|
||||||
|
app.Messages = {};
|
||||||
|
app.Messages.init = function(){
|
||||||
|
browser.runtime.onMessage.addListener(function(request, sender, sendResponse){
|
||||||
|
switch(request.cmd){
|
||||||
|
case 'SettingsChanged':
|
||||||
|
app.Messages.getSettings(app.Settings._changed);
|
||||||
|
break;
|
||||||
|
case 'GridNodesLoaded':
|
||||||
|
app.Messages.getNode(dial.path, app.GridNodes._changed);
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
app.Messages.getSettings = function(callback){
|
||||||
|
browser.runtime.sendMessage({ cmd: 'GetSettings' }).then(callback);
|
||||||
|
};
|
||||||
|
app.Messages.getNode = function(path, callback){
|
||||||
|
browser.runtime.sendMessage({ cmd: 'GetNode', path: path }).then(callback);
|
||||||
|
};
|
||||||
|
app.Messages.setNodeIndex = function(index, newIndex, callback){
|
||||||
|
browser.runtime.sendMessage({ cmd: 'SetNodeIndex', path: dial.path, index: index, newIndex: newIndex }).then(callback);
|
||||||
|
};
|
||||||
|
app.Messages.createBookmark = function(url, callback){
|
||||||
|
browser.runtime.sendMessage({ cmd: 'CreateBookmark', path: dial.path, url: url, title: url }).then(callback);
|
||||||
|
};
|
||||||
|
app.Messages.createFolder = function(name, callback){
|
||||||
|
browser.runtime.sendMessage({ cmd: 'CreateFolder', path: dial.path, name: name }).then(callback);
|
||||||
|
};
|
||||||
|
app.Messages.deleteNode = function(id, callback){
|
||||||
|
browser.runtime.sendMessage({ cmd: 'DeleteNode', path: dial.path, id: id }).then(callback);
|
||||||
|
};
|
||||||
|
app.Messages.refreshNode = function(id, callback){
|
||||||
|
browser.runtime.sendMessage({ cmd: 'RefreshNode', path: dial.path, id: id }).then(callback);
|
||||||
|
}
|
||||||
|
app.Messages.capturePage = function(id, callback){
|
||||||
|
browser.runtime.sendMessage({ cmd: 'CapturePage', path: dial.path, id: id }).then(callback);
|
||||||
|
}
|
||||||
|
|
||||||
|
app.Settings = {};
|
||||||
|
app.Settings._changed = function(settings){
|
||||||
|
app.settings = settings;
|
||||||
dial.initStyles();
|
dial.initStyles();
|
||||||
|
dial.initGrid();
|
||||||
|
};
|
||||||
|
|
||||||
|
app.GridNodes = {};
|
||||||
|
app.GridNodes.GridNodeType = { // GridNodeType
|
||||||
|
back: -1,
|
||||||
|
empty: 0,
|
||||||
|
folder: 1,
|
||||||
|
bookmark: 2
|
||||||
|
}
|
||||||
|
app.GridNodes._changed = function(node){
|
||||||
|
app.node = node;
|
||||||
|
dial.Title.innerText = app.node.title;
|
||||||
|
dial.populateGrid();
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
dial.init = function(){
|
||||||
dial.initMenus();
|
dial.initMenus();
|
||||||
dial.Grid = dial.initGrid('Grid', app.settings.grid, dial.Body);
|
dial.Title = document.createElement('title');
|
||||||
var url = new URL(window.location);
|
document.head.appendChild(dial.Title);
|
||||||
dial.path = url.searchParams.get('path');
|
};
|
||||||
if(url.searchParams.get('path')) {
|
|
||||||
dial.Node = app.getNode(app.settings.grid.node, dial.path + '/');
|
|
||||||
} else {
|
|
||||||
dial.Node = app.getNode(app.settings.grid.node, '/');
|
|
||||||
}
|
|
||||||
dial.Title.innerText = dial.Node.title;
|
|
||||||
dial.populateGrid(dial.Grid, app.settings.grid, dial.Node);
|
|
||||||
}
|
|
||||||
|
|
||||||
dial.initStyles = function(){
|
|
||||||
dial.Style = document.createElement('style'), StyleSheet;
|
|
||||||
document.head.appendChild(dial.Style);
|
|
||||||
dial.styles.html = dial.Style.sheet.cssRules[dial.Style.sheet.insertRule('html { height: 100%; }')].style;
|
|
||||||
dial.styles.body = dial.Style.sheet.cssRules[dial.Style.sheet.insertRule('body { user-select: none; -moz-user-select: none; display: flex; width: 100%; height: 100%; margin: 0px; padding: 0px; background-color: ' + app.settings.backgroundColor + '; background-image: ' + app.settings.backgroundImage + '; background-repeat: no-repeat; background-size: 100% 100%; }')].style;
|
|
||||||
dial.styles.grid = {};
|
|
||||||
dial.styles.grid.grid = dial.Style.sheet.cssRules[dial.Style.sheet.insertRule('.Grid { border-collapse: collapse; margin: auto; }')].style;
|
|
||||||
dial.styles.grid.cell = dial.Style.sheet.cssRules[dial.Style.sheet.insertRule('.Grid td { margin: 0px; padding: 0px; }')].style;
|
|
||||||
dial.styles.grid.link = dial.Style.sheet.cssRules[dial.Style.sheet.insertRule('.Grid td>a { display: block; outline: none; overflow: hidden; text-decoration: none; margin: ' + app.settings.grid.cells.margin + 'px; border: 1px solid ' + app.settings.grid.cells.borderColor + '; border-radius: ' + app.settings.grid.cells.borderRadius + 'px; }')].style;
|
|
||||||
//dial.styles.grid.linkHover = dial.Style.sheet.cssRules[dial.Style.sheet.insertRule('.Grid td>a:hover { border-color: ' + app.settings.grid.cells.borderColorHover + '; border-radius: ' + app.settings.grid.cells.borderRadiusHover + 'px; }')].style;
|
|
||||||
dial.styles.grid.linkHover = dial.Style.sheet.cssRules[dial.Style.sheet.insertRule('.Grid td>a:hover { border-color: ' + app.settings.grid.cells.borderColorHover + '; margin: ' + app.settings.grid.cells.marginHover + 'px; border-radius: ' + app.settings.grid.cells.borderRadiusHover + 'px; }')].style;
|
|
||||||
dial.styles.grid.linkPanel = dial.Style.sheet.cssRules[dial.Style.sheet.insertRule('.Grid td>a>div:first-child { background-repeat: no-repeat; }')].style;
|
|
||||||
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;
|
|
||||||
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: 1px solid ' + app.settings.grid.cells.borderColor + '; }')].style;
|
|
||||||
if(app.settings.grid.cells.titleBackgroundColor) dial.styles.grid.linkTitle.backgroundColor = app.settings.grid.cells.titleBackgroundColor;
|
|
||||||
dial.styles.grid.linkTitleHover = dial.Style.sheet.cssRules[dial.Style.sheet.insertRule('.Grid td>a:hover>div:last-child { color: ' + app.settings.grid.cells.titleColorHover + '; 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;
|
|
||||||
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 + '; background-repeat: no-repeat; background-position: center center; }')].style;
|
|
||||||
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;
|
|
||||||
}
|
|
||||||
|
|
||||||
dial.initMenus = function(){
|
dial.initMenus = function(){
|
||||||
|
document.body.setAttribute('contextmenu', 'page');
|
||||||
dial.PageMenu = document.createElement('menu');
|
dial.PageMenu = document.createElement('menu');
|
||||||
dial.PageMenu.type = 'context';
|
dial.PageMenu.type = 'context';
|
||||||
dial.PageMenu.id = 'page'
|
dial.PageMenu.id = 'page'
|
||||||
@ -133,7 +134,7 @@ dial.initMenus = function(){
|
|||||||
dial.PageMenuNew.appendChild(dial.PageMenuCreateFolder);
|
dial.PageMenuNew.appendChild(dial.PageMenuCreateFolder);
|
||||||
dial.PageMenu.appendChild(document.createElement('hr'));
|
dial.PageMenu.appendChild(document.createElement('hr'));
|
||||||
dial.PageMenu.appendChild(dial.PageMenuSettings);
|
dial.PageMenu.appendChild(dial.PageMenuSettings);
|
||||||
dial.Body.appendChild(dial.PageMenu);
|
document.body.appendChild(dial.PageMenu);
|
||||||
|
|
||||||
dial.ItemMenu = document.createElement('menu');
|
dial.ItemMenu = document.createElement('menu');
|
||||||
dial.ItemMenu.type = 'context';
|
dial.ItemMenu.type = 'context';
|
||||||
@ -155,11 +156,15 @@ dial.initMenus = function(){
|
|||||||
*/
|
*/
|
||||||
dial.ItemMenuRefresh = document.createElement('menuitem');
|
dial.ItemMenuRefresh = document.createElement('menuitem');
|
||||||
dial.ItemMenuRefresh.label = browser.i18n.getMessage("menuRefreshItem");
|
dial.ItemMenuRefresh.label = browser.i18n.getMessage("menuRefreshItem");
|
||||||
dial.ItemMenuRefresh.onclick = dial.refreshNode;
|
dial.ItemMenuRefresh.onclick = function(){
|
||||||
|
dial.refreshNode(dial._selectedItem);
|
||||||
|
};
|
||||||
|
|
||||||
dial.ItemMenuCapture = document.createElement('menuitem');
|
dial.ItemMenuCapture = document.createElement('menuitem');
|
||||||
dial.ItemMenuCapture.label = browser.i18n.getMessage("menuCapturePage");
|
dial.ItemMenuCapture.label = browser.i18n.getMessage("menuCapturePage");
|
||||||
dial.ItemMenuCapture.onclick = dial.capturePage;
|
dial.ItemMenuCapture.onclick = function(){
|
||||||
|
dial.capturePage(dial._selectedItem);
|
||||||
|
};
|
||||||
|
|
||||||
dial.ItemMenuDelete = document.createElement('menuitem');
|
dial.ItemMenuDelete = document.createElement('menuitem');
|
||||||
dial.ItemMenuDelete.label = browser.i18n.getMessage("menuDeleteItem");
|
dial.ItemMenuDelete.label = browser.i18n.getMessage("menuDeleteItem");
|
||||||
@ -179,31 +184,59 @@ dial.initMenus = function(){
|
|||||||
dial.ItemMenu.appendChild(dial.ItemMenuDelete);
|
dial.ItemMenu.appendChild(dial.ItemMenuDelete);
|
||||||
dial.ItemMenu.appendChild(document.createElement('hr'));
|
dial.ItemMenu.appendChild(document.createElement('hr'));
|
||||||
dial.ItemMenu.appendChild(dial.ItemMenuSettings);
|
dial.ItemMenu.appendChild(dial.ItemMenuSettings);
|
||||||
dial.Body.appendChild(dial.ItemMenu);
|
document.body.appendChild(dial.ItemMenu);
|
||||||
}
|
}
|
||||||
|
dial.initStyles = function(){
|
||||||
dial.initGrid = function(name, settings, container){
|
if(dial.Style) document.head.removeChild(dial.Style);
|
||||||
|
dial.Style = document.createElement('style'), StyleSheet;
|
||||||
|
document.head.appendChild(dial.Style);
|
||||||
|
dial.styles = {};
|
||||||
|
dial.styles.html = dial.Style.sheet.cssRules[dial.Style.sheet.insertRule('html { height: 100%; }')].style;
|
||||||
|
dial.styles.body = dial.Style.sheet.cssRules[dial.Style.sheet.insertRule('body { user-select: none; -moz-user-select: none; display: flex; width: 100%; height: 100%; margin: 0px; padding: 0px; background-color: ' + app.settings.backgroundColor + '; background-image: ' + app.settings.backgroundImage + '; background-repeat: no-repeat; background-size: 100% 100%; }')].style;
|
||||||
|
dial.styles.grid = {};
|
||||||
|
dial.styles.grid.grid = dial.Style.sheet.cssRules[dial.Style.sheet.insertRule('.Grid { border-collapse: collapse; margin: auto; }')].style;
|
||||||
|
dial.styles.grid.cell = dial.Style.sheet.cssRules[dial.Style.sheet.insertRule('.Grid td { margin: 0px; padding: 0px; }')].style;
|
||||||
|
dial.styles.grid.link = dial.Style.sheet.cssRules[dial.Style.sheet.insertRule('.Grid td>a { display: block; outline: none; overflow: hidden; text-decoration: none; margin: ' + app.settings.grid.cells.margin + 'px; border: 1px solid ' + app.settings.grid.cells.borderColor + '; border-radius: ' + app.settings.grid.cells.borderRadius + 'px; }')].style;
|
||||||
|
//dial.styles.grid.linkHover = dial.Style.sheet.cssRules[dial.Style.sheet.insertRule('.Grid td>a:hover { border-color: ' + app.settings.grid.cells.borderColorHover + '; border-radius: ' + app.settings.grid.cells.borderRadiusHover + 'px; }')].style;
|
||||||
|
dial.styles.grid.linkHover = dial.Style.sheet.cssRules[dial.Style.sheet.insertRule('.Grid td>a:hover { border-color: ' + app.settings.grid.cells.borderColorHover + '; margin: ' + app.settings.grid.cells.marginHover + 'px; border-radius: ' + app.settings.grid.cells.borderRadiusHover + 'px; }')].style;
|
||||||
|
dial.styles.grid.linkPanel = dial.Style.sheet.cssRules[dial.Style.sheet.insertRule('.Grid td>a>div:first-child { background-repeat: no-repeat; }')].style;
|
||||||
|
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;
|
||||||
|
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: 1px solid ' + app.settings.grid.cells.borderColor + '; }')].style;
|
||||||
|
if(app.settings.grid.cells.titleBackgroundColor) dial.styles.grid.linkTitle.backgroundColor = app.settings.grid.cells.titleBackgroundColor;
|
||||||
|
dial.styles.grid.linkTitleHover = dial.Style.sheet.cssRules[dial.Style.sheet.insertRule('.Grid td>a:hover>div:last-child { color: ' + app.settings.grid.cells.titleColorHover + '; 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;
|
||||||
|
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 + '; background-repeat: no-repeat; background-position: center center; }')].style;
|
||||||
|
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;
|
||||||
|
};
|
||||||
|
dial.initGrid = function(){
|
||||||
|
if(dial.Grid) document.body.removeChild(dial.Grid);
|
||||||
|
dial.Grid = document.createElement('table');
|
||||||
var grid = document.createElement('table');
|
var grid = document.createElement('table');
|
||||||
grid.className = name;
|
dial.Grid.className = 'Grid';
|
||||||
grid.getLink = function(index){
|
dial.Grid.getLink = function(index){
|
||||||
var num_columns = grid.rows[0].cells.length;
|
var num_columns = dial.Grid.rows[0].cells.length;
|
||||||
return grid.rows[Math.floor(index/num_columns)].cells[index % num_columns].childNodes[0];
|
return dial.Grid.rows[Math.floor(index/num_columns)].cells[index % num_columns].childNodes[0];
|
||||||
}
|
}
|
||||||
for(var i=0; i<settings.rows; i++){
|
for(var i=0; i<app.settings.grid.rows; i++){
|
||||||
var row = grid.insertRow();
|
var row = dial.Grid.insertRow();
|
||||||
for(var j=0; j<settings.columns; j++){
|
for(var j=0; j<app.settings.grid.columns; j++){
|
||||||
var cell = row.insertCell();
|
var cell = row.insertCell();
|
||||||
var link = document.createElement('a');
|
var link = document.createElement('a');
|
||||||
cell.setAttribute('gridindex', (i * settings.columns + j));
|
cell.setAttribute('gridindex', (i * app.settings.grid.columns + j));
|
||||||
cell.appendChild(link);
|
cell.appendChild(link);
|
||||||
|
link.className = 'Empty';
|
||||||
link.appendChild(document.createElement('div'));
|
link.appendChild(document.createElement('div'));
|
||||||
link.appendChild(document.createElement('div'));
|
link.appendChild(document.createElement('div'));
|
||||||
link.onmousedown = function(){ dial._selectedItem = this; };
|
link.onmousedown = function(){ dial._selectedItem = this; };
|
||||||
|
|
||||||
function dragstart_handler(ev) {
|
function dragstart_handler(ev) {
|
||||||
var index = (dial.page - 1) * (app.settings.grid.rows * app.settings.grid.columns) + +(ev.target.parentElement.getAttribute('gridindex'));
|
var index = (dial.page - 1) * (app.settings.grid.rows * app.settings.grid.columns) + +(ev.target.parentElement.getAttribute('gridindex'));
|
||||||
if(settings.backNode && dial.path) index -= dial.page;
|
if(app.settings.grid.backNode && dial.path != '/') index -= dial.page;
|
||||||
console.log(index);
|
|
||||||
ev.dataTransfer.setData("text/plain", index);
|
ev.dataTransfer.setData("text/plain", index);
|
||||||
}
|
}
|
||||||
function dragover_handler(ev) {
|
function dragover_handler(ev) {
|
||||||
@ -218,44 +251,41 @@ dial.initGrid = function(name, settings, container){
|
|||||||
if(ev.target.tagName == 'DIV'){
|
if(ev.target.tagName == 'DIV'){
|
||||||
EndIndex = (dial.page - 1) * (app.settings.grid.rows * app.settings.grid.columns) + +(ev.target.parentElement.parentElement.getAttribute('gridindex'));
|
EndIndex = (dial.page - 1) * (app.settings.grid.rows * app.settings.grid.columns) + +(ev.target.parentElement.parentElement.getAttribute('gridindex'));
|
||||||
} else{
|
} else{
|
||||||
EndIndex =(dial.page - 1) * (app.settings.grid.rows * app.settings.grid.columns) + +(ev.target.getAttribute('gridindex'));
|
EndIndex = (dial.page - 1) * (app.settings.grid.rows * app.settings.grid.columns) + +(ev.target.getAttribute('gridindex'));
|
||||||
}
|
}
|
||||||
if(settings.backNode && dial.path) EndIndex -= dial.page;
|
if(app.settings.grid.backNode && dial.path != '/') EndIndex -= dial.page;
|
||||||
app.setNodeIndex(dial.Node, StartIndex, EndIndex);
|
app.Messages.setNodeIndex(StartIndex, EndIndex);
|
||||||
}
|
}
|
||||||
link.draggable = true;
|
link.draggable = true;
|
||||||
link.ondragstart = dragstart_handler;
|
link.ondragstart = dragstart_handler;
|
||||||
cell.ondragover = dragover_handler;
|
cell.ondragover = dragover_handler;
|
||||||
cell.ondrop = drop_handler;
|
cell.ondrop = drop_handler;
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
container.appendChild(grid);
|
document.body.appendChild(dial.Grid);
|
||||||
dial.updateGridLayout(grid, settings, dial.styles.grid);
|
dial.updateGridLayout();
|
||||||
return grid;
|
return dial.Grid;
|
||||||
}
|
};
|
||||||
|
dial.updateGridLayout = function(){
|
||||||
|
var fullWidth = dial.Grid.parentElement.offsetWidth - 2 * app.settings.grid.margin;
|
||||||
|
var fullHeight = dial.Grid.parentElement.offsetHeight - 2 * app.settings.grid.margin;
|
||||||
|
var linkWidth = fullWidth / app.settings.grid.columns;
|
||||||
|
var linkHeight = fullHeight / app.settings.grid.rows;
|
||||||
|
if(linkWidth <= linkHeight * 4 / 3) linkHeight = linkWidth / 4 * 3;
|
||||||
|
else linkWidth = linkHeight / 3 * 4;
|
||||||
|
|
||||||
dial.updateGridLayout = function(grid, settings, styles){
|
dial.styles.grid.cell.width = linkWidth.toString() + 'px';
|
||||||
var fullWidth = grid.parentElement.offsetWidth - 2 * settings.margin;
|
dial.styles.grid.cell.height = linkHeight.toString() + 'px';
|
||||||
var fullHeight = grid.parentElement.offsetHeight - 2 * settings.margin;
|
|
||||||
var linkWidth = fullWidth / settings.columns;
|
|
||||||
var linkHeight = fullHeight / settings.rows;
|
|
||||||
if(linkWidth <= linkHeight * settings.cells.ratioX / settings.cells.ratioY) linkHeight = linkWidth / settings.cells.ratioX * settings.cells.ratioY;
|
|
||||||
else linkWidth = linkHeight / settings.cells.ratioY * settings.cells.ratioX;
|
|
||||||
|
|
||||||
styles.cell.width = linkWidth.toString() + 'px';
|
linkWidth = linkWidth - 2 * (app.settings.grid.cells.margin + 1);
|
||||||
styles.cell.height = linkHeight.toString() + 'px';
|
linkHeight = linkHeight - 2 * (app.settings.grid.cells.margin + 1);
|
||||||
|
|
||||||
linkWidth = linkWidth - 2 * (settings.cells.margin + 1);
|
dial.styles.grid.link.width = linkWidth.toString() + 'px';
|
||||||
linkHeight = linkHeight - 2 * (settings.cells.margin + 1);
|
dial.styles.grid.link.height = linkHeight.toString() + 'px';
|
||||||
|
if(app.settings.grid.cells.title) dial.styles.grid.linkPanel.height = (linkHeight - app.settings.grid.cells.titleHeight - 1).toString() + 'px';
|
||||||
styles.link.width = linkWidth.toString() + 'px';
|
else dial.styles.grid.linkPanel.height = linkHeight.toString() + 'px';
|
||||||
styles.link.height = linkHeight.toString() + 'px';
|
};
|
||||||
if(settings.cells.title) styles.linkPanel.height = (linkHeight - settings.cells.titleHeight - 1).toString() + 'px';
|
dial.populateGrid = function(){
|
||||||
else styles.linkPanel.height = linkHeight.toString() + 'px';
|
|
||||||
}
|
|
||||||
|
|
||||||
dial.populateGrid = function(grid, settings, node){
|
|
||||||
populateEmpty = function(link){
|
populateEmpty = function(link){
|
||||||
link.Node = null;
|
link.Node = null;
|
||||||
link.className = 'Empty';
|
link.className = 'Empty';
|
||||||
@ -278,7 +308,7 @@ dial.populateGrid = function(grid, settings, node){
|
|||||||
link.className = 'Folder';
|
link.className = 'Folder';
|
||||||
link.childNodes[0].style.backgroundImage = '';
|
link.childNodes[0].style.backgroundImage = '';
|
||||||
link.childNodes[1].innerText = node.title;
|
link.childNodes[1].innerText = node.title;
|
||||||
if(dial.path) link.href = '?path=' + dial.path + '/' + node.title;
|
if(dial.path) link.href = '?path=' + dial.path + node.title;
|
||||||
else link.href = '?path=' + node.title;
|
else link.href = '?path=' + node.title;
|
||||||
link.onclick = null;
|
link.onclick = null;
|
||||||
link.setAttribute('contextmenu', 'item');
|
link.setAttribute('contextmenu', 'item');
|
||||||
@ -291,11 +321,7 @@ dial.populateGrid = function(grid, settings, node){
|
|||||||
} else {
|
} else {
|
||||||
link.className = 'BookmarkLoading';
|
link.className = 'BookmarkLoading';
|
||||||
link.childNodes[0].style.backgroundImage = '';
|
link.childNodes[0].style.backgroundImage = '';
|
||||||
app.refreshNode(node, function(){
|
dial.refreshNode(link);
|
||||||
link.className = 'Bookmark';
|
|
||||||
link.childNodes[0].style.backgroundImage = 'url(' + node.image + ')';
|
|
||||||
link.childNodes[1].innerText = node.title;
|
|
||||||
});
|
|
||||||
}
|
}
|
||||||
link.childNodes[1].innerText = node.title;
|
link.childNodes[1].innerText = node.title;
|
||||||
link.href = node.url;
|
link.href = node.url;
|
||||||
@ -305,69 +331,59 @@ dial.populateGrid = function(grid, settings, node){
|
|||||||
|
|
||||||
var iBase = 0;
|
var iBase = 0;
|
||||||
var linkItem = 0;
|
var linkItem = 0;
|
||||||
var allCells = settings.rows * settings.columns;
|
var allCells = app.settings.grid.rows * app.settings.grid.columns;
|
||||||
var maxCells = allCells;
|
var maxCells = allCells;
|
||||||
if(settings.backNode && dial.path){
|
if(app.settings.grid.backNode && dial.path != '/'){
|
||||||
populateBack(grid.getLink(linkItem));
|
populateBack(dial.Grid.getLink(linkItem));
|
||||||
linkItem++;
|
linkItem++;
|
||||||
maxCells -= 1;
|
maxCells -= 1;
|
||||||
}
|
}
|
||||||
dial.maxpage = Math.floor(node.children.length / maxCells);
|
dial.maxpage = Math.floor(app.node.children.length / maxCells);
|
||||||
if(dial.maxpage != node.children.length / maxCells) dial.maxpage += 1;
|
if(dial.maxpage != app.node.children.length / maxCells) dial.maxpage += 1;
|
||||||
if(dial.page > dial.maxpage) dial.page = dial.maxpage;
|
if(dial.page > dial.maxpage) dial.page = dial.maxpage;
|
||||||
if(dial.page > 1) iBase = (dial.page -1) * maxCells;
|
if(dial.page > 1) iBase = (dial.page -1) * maxCells;
|
||||||
for(var i = iBase; i<node.children.length && i<maxCells + iBase; i++) {
|
for(var i = iBase; i<app.node.children.length && i<maxCells + iBase; i++) {
|
||||||
switch(node.children[i].type){
|
switch(app.node.children[i].type){
|
||||||
case app.GridNodeType.empty:
|
case app.GridNodes.GridNodeType.empty:
|
||||||
populateEmpty(grid.getLink(linkItem));
|
populateEmpty(dial.Grid.getLink(linkItem));
|
||||||
break;
|
break;
|
||||||
case app.GridNodeType.folder:
|
case app.GridNodes.GridNodeType.folder:
|
||||||
populateFolder(grid.getLink(linkItem), node.children[i]);
|
populateFolder(dial.Grid.getLink(linkItem), app.node.children[i]);
|
||||||
break;
|
break;
|
||||||
case app.GridNodeType.bookmark:
|
case app.GridNodes.GridNodeType.bookmark:
|
||||||
populateBookmark(grid.getLink(linkItem), node.children[i]);
|
populateBookmark(dial.Grid.getLink(linkItem), app.node.children[i]);
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
linkItem++;
|
linkItem++;
|
||||||
}
|
}
|
||||||
while(linkItem<allCells){
|
while(linkItem<allCells){
|
||||||
populateEmpty(grid.getLink(linkItem));
|
populateEmpty(dial.Grid.getLink(linkItem));
|
||||||
linkItem++;
|
linkItem++;
|
||||||
}
|
}
|
||||||
}
|
};
|
||||||
|
|
||||||
dial.createBookmark = function(){
|
dial.createBookmark = function(){
|
||||||
var url = prompt(browser.i18n.getMessage("AddBookmarkPrompt"), 'https://');
|
var url = prompt(browser.i18n.getMessage("AddBookmarkPrompt"), 'https://');
|
||||||
if(url) app.createBookmark(dial.Node, url);
|
if(url) app.Messages.createBookmark(url);
|
||||||
};
|
};
|
||||||
|
|
||||||
dial.createFolder = function(){
|
dial.createFolder = function(){
|
||||||
var name = prompt(browser.i18n.getMessage("AddFolderPrompt"), 'New Folder');
|
var name = prompt(browser.i18n.getMessage("AddFolderPrompt"), 'New Folder');
|
||||||
if(name) app.createFolder(dial.Node, name);
|
if(name) app.Messages.createFolder(name);
|
||||||
};
|
};
|
||||||
|
|
||||||
dial.refreshNode = function(){
|
|
||||||
if(dial._selectedItem.Node.type == app.GridNodeType.bookmark){
|
|
||||||
var link = dial._selectedItem;
|
|
||||||
link.className = 'BookmarkLoading';
|
|
||||||
link.childNodes[0].style.backgroundImage = '';
|
|
||||||
app.refreshNode(link.Node, function(){
|
|
||||||
link.className = 'Bookmark';
|
|
||||||
link.childNodes[0].style.backgroundImage = 'url(' + link.Node.image + ')';
|
|
||||||
link.childNodes[1].innerText = link.Node.title;
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
dial.deleteNode = function(){
|
dial.deleteNode = function(){
|
||||||
if(confirm(browser.i18n.getMessage("deleteItemConfimation", dial._selectedItem.Node.title)))
|
if(confirm(browser.i18n.getMessage("deleteItemConfimation", dial._selectedItem.Node.title)))
|
||||||
app.deleteNode(dial.Node, dial._selectedItem.Node.id);
|
app.Messages.deleteNode(dial._selectedItem.Node.id);
|
||||||
|
}
|
||||||
|
dial.refreshNode = function(selectedItem){
|
||||||
|
selectedItem.className = 'BookmarkLoading';
|
||||||
|
selectedItem.childNodes[0].style.backgroundImage = app.settings.grid.loadingIcon;
|
||||||
|
app.Messages.refreshNode(selectedItem.Node.id);
|
||||||
|
}
|
||||||
|
dial.capturePage = function(selectedItem){
|
||||||
|
selectedItem.className = 'BookmarkLoading';
|
||||||
|
selectedItem.childNodes[0].style.backgroundImage = app.settings.grid.loadingIcon;
|
||||||
|
app.Messages.capturePage(selectedItem.Node.id);
|
||||||
}
|
}
|
||||||
|
|
||||||
dial.capturePage = function(){
|
|
||||||
if(dial._selectedItem.Node.type == app.GridNodeType.bookmark)
|
|
||||||
app.capturePage(dial._selectedItem.Node);
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@ -399,20 +415,20 @@ dial.PopupPanel = function(width, height, modal){ // PopupPanel Object
|
|||||||
this._contextMenuHandler = function(e){ e.preventDefault(); }
|
this._contextMenuHandler = function(e){ e.preventDefault(); }
|
||||||
this.popup = function(){
|
this.popup = function(){
|
||||||
window.addEventListener('contextmenu', this._contextMenuHandler, false);
|
window.addEventListener('contextmenu', this._contextMenuHandler, false);
|
||||||
dial.Body.appendChild(this.modal);
|
document.body.appendChild(this.modal);
|
||||||
dial.Body.appendChild(this.panelContainer);
|
document.body.appendChild(this.panelContainer);
|
||||||
}
|
}
|
||||||
this.close = function(){
|
this.close = function(){
|
||||||
dial.Body.removeChild(this.modal);
|
document.body.removeChild(this.modal);
|
||||||
dial.Body.removeChild(this.panelContainer);
|
document.body.removeChild(this.panelContainer);
|
||||||
window.removeEventListener('contextmenu', this._contextMenuHandler, false);
|
window.removeEventListener('contextmenu', this._contextMenuHandler, false);
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
this.popup = function(){
|
this.popup = function(){
|
||||||
dial.Body.appendChild(this.panelContainer);
|
document.body.appendChild(this.panelContainer);
|
||||||
}
|
}
|
||||||
this.close = function(){
|
this.close = function(){
|
||||||
dialBody.removeChild(this.panelContainer);
|
document.body.removeChild(this.panelContainer);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -1,10 +1,12 @@
|
|||||||
|
var app = {};
|
||||||
|
|
||||||
var BackgroundImage = null;
|
var BackgroundImage = null;
|
||||||
var GridBackImage = null;
|
var GridBackImage = null;
|
||||||
var GridFolderImage = null;
|
var GridFolderImage = null;
|
||||||
|
|
||||||
window.onload = function(){
|
app.init = function(){
|
||||||
browser.runtime.getBackgroundPage().then(function(page){
|
app.Messages.getSettings(function(settings){
|
||||||
app = page.app;
|
app.settings = settings;
|
||||||
BackgroundColor.value = app.settings.backgroundColor;
|
BackgroundColor.value = app.settings.backgroundColor;
|
||||||
BackgroundImage = app.settings.backgroundImage;
|
BackgroundImage = app.settings.backgroundImage;
|
||||||
BackgroundPreview.style.backgroundColor = app.settings.backgroundColor;
|
BackgroundPreview.style.backgroundColor = app.settings.backgroundColor;
|
||||||
@ -77,7 +79,7 @@ window.onload = function(){
|
|||||||
else app.settings.grid.cells.titleBackgroundColor = GridCellsTitleBackgroundColor.value;
|
else app.settings.grid.cells.titleBackgroundColor = GridCellsTitleBackgroundColor.value;
|
||||||
if(GridCellsTitleBackgroundTransparentHover.checked == true) app.settings.grid.cells.titleBackgroundColorHover = null;
|
if(GridCellsTitleBackgroundTransparentHover.checked == true) app.settings.grid.cells.titleBackgroundColorHover = null;
|
||||||
else app.settings.grid.cells.titleBackgroundColorHover = GridCellsTitleBackgroundColorHover.value;
|
else app.settings.grid.cells.titleBackgroundColorHover = GridCellsTitleBackgroundColorHover.value;
|
||||||
app.saveSettings();
|
browser.runtime.sendMessage( { cmd: 'SetSettings', settings: app.settings } );
|
||||||
}
|
}
|
||||||
BtnCancel.onclick = function(){
|
BtnCancel.onclick = function(){
|
||||||
window.frameElement.popup.close();
|
window.frameElement.popup.close();
|
||||||
@ -152,5 +154,17 @@ window.onload = function(){
|
|||||||
}
|
}
|
||||||
fileReader.readAsDataURL(GridFolderImageFile.files[0]);
|
fileReader.readAsDataURL(GridFolderImageFile.files[0]);
|
||||||
}
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
app.Messages = {};
|
||||||
|
app.Messages.getSettings = function(callback){
|
||||||
|
browser.runtime.sendMessage({ cmd: 'GetSettings' }).then(callback);
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
window.onload = function(){
|
||||||
|
app.init();
|
||||||
|
};
|
||||||
|
|
||||||
}
|
|
Loading…
Reference in New Issue
Block a user