dave
/
tabbro
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Add window renaming, further improvements to element() and style updates

This commit is contained in:
Dave Pedu 2015-02-08 23:18:10 -08:00
parent 97b9f1824c
commit f3bff31b47
3 changed files with 125 additions and 78 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

76
background.js
View File

@ -177,6 +177,7 @@ _tabbro_ = function() {
windowId:win.id,
url:moreTabsToOpen[i].url
}, function(ev) {
// Mark tab as sticky again
for(var x in win.tabs) {
win.tabs[x].sticky = true
}
@ -184,10 +185,27 @@ _tabbro_ = function() {
}
}
})
}
this.ui_open_tab = function(winindex, tabindex) {
// Open a single tab
var tab = this.tree[winindex].tabs[tabindex]
chrome.windows.create({
focused:true,
url:tab.url
}, function(ev) {})
}
this.ui_rename_window = function(winindex, newname) {
this.tree[winindex].name = newname
bro.notify()
}
this.getCount = function() {
// Return count of loaded tabs
var count = 0;
@ -215,7 +233,7 @@ _tabbro_ = function() {
this._storage.get("tabbro", function(_data){
// If there's no data we get {}
if(_data.tabbro==undefined) {
console.log("setup: initializing tabbro")
//console.log("setup: initializing tabbro")
bro.tree = []
bro.data = {
version: bro.__VERSION,
@ -255,12 +273,12 @@ _tabbro_ = function() {
id: _windows[w].id,
tabs:[],
sticky: false,
name: ""
name: "Window"
})
// Get all tabs in this window
chrome.tabs.getAllInWindow(_windows[w].id, function(_tabs){
console.log(_tabs)
//console.log(_tabs)
for(var i in _tabs) {
var w = bro.t_getWindow(_tabs[i].windowId)
w.tabs.push({
@ -268,7 +286,7 @@ _tabbro_ = function() {
title: _tabs[i].title,
url: _tabs[i].url,
sticky: false,
name: ""
name: "Tab"
})
}
bro.save()
@ -301,8 +319,8 @@ _tabbro_ = function() {
}
// Prune tabs
pruneTabs = pruneTabs.reverse()
console.log("pruneData: pruneTabs:" )
console.log(pruneTabs)
//console.log("pruneData: pruneTabs:" )
//console.log(pruneTabs)
for(var p in pruneTabs) { // why the fuck is p a string?
this.tree[w].tabs.splice(pruneTabs[p], 1)
}
@ -310,14 +328,14 @@ _tabbro_ = function() {
}
// Prune windows
pruneWindows = pruneWindows.reverse()
console.log("pruneData: pruneWindows:" )
console.log(pruneWindows)
//console.log("pruneData: pruneWindows:" )
//console.log(pruneWindows)
for(var p in pruneWindows) { // why the fuck is p a string?
var removed = this.tree.splice(pruneWindows[p], 1)
console.log("Pruned: ")
console.log(removed)
//console.log("Pruned: ")
//console.log(removed)
}
console.log("after pruneData: tree length: " + this.tree.length)
//console.log("after pruneData: tree length: " + this.tree.length)
}
@ -339,7 +357,7 @@ _tabbro_ = function() {
this.save = function() {
// Save data to sync
console.log("save: ")
//console.log("save: ")
this._storage.set({"tabbro":this.data})
}
@ -349,15 +367,15 @@ _tabbro_ = function() {
// Add window listeners
chrome.windows.onCreated.addListener(function(e) {
if(e.type!="normal") return
console.log("windows.onCreated")
console.log(e)
//console.log("windows.onCreated")
//console.log(e)
if(bro.nextCreatedWindowIndex==null) {
bro.tree.push({
id: e.id,
tabs:[],
sticky: false,
name: ""
name: "New Window"
})
} else {
// We were just ordered to restore a saved window
@ -371,7 +389,7 @@ _tabbro_ = function() {
chrome.windows.onRemoved.addListener(function(windowid) {
console.log("windows.onRemoved")
//console.log("windows.onRemoved")
//console.log(windowid)
var thewindow = bro.t_getWindow(windowid)
if(thewindow.sticky) {
@ -389,15 +407,15 @@ _tabbro_ = function() {
chrome.windows.onFocusChanged.addListener(function(x) {
console.log("windows.onFocusChanged")
console.log(x)
//console.log("windows.onFocusChanged")
//console.log(x)
})
// Add tab listeners
chrome.tabs.onCreated.addListener(function(e) {
console.log("tabs.onCreated")
console.log(e)
//console.log("tabs.onCreated")
//console.log(e)
bro.t_addTabtoWindow(e.windowId, {
id: e.id,
@ -426,8 +444,8 @@ _tabbro_ = function() {
chrome.tabs.onMoved.addListener(function(x) {
console.log("tabs.onMoved")
console.log(x)
//console.log("tabs.onMoved")
//console.log(x)
// TODO re-order data model when tabs are re-ordered
})
@ -447,22 +465,22 @@ _tabbro_ = function() {
chrome.tabs.onDetached.addListener(function(x) {
console.log("tabs.onDetached")
console.log(x)
//console.log("tabs.onDetached")
//console.log(x)
// TODO this is when the user pulls a tab off the window
})
chrome.tabs.onAttached.addListener(function(x) {
console.log("tabs.onAttached")
console.log(x)
//console.log("tabs.onAttached")
//console.log(x)
// TODO this is when a the user drops a tab onto another window
})
chrome.tabs.onRemoved.addListener(function(tabid) {
console.log("tabs.onRemoved")
console.log(tabid)
//console.log("tabs.onRemoved")
//console.log(tabid)
var thewindow = bro.t_getWindowFromTab(tabid)

74
popup.js
View File

@ -38,7 +38,11 @@ function element(kind, options) {
for(var key in options) {
if(special.indexOf(key)==-1) {
if(key.substr(0,3)=="_on") { // Keys prefixed with _on are treated as event listeners such as _onclick
element[key.substr(1)] = options[key]
if(typeof options[key] == "string") {
element[key.substr(1)] = options[options[key]]
} else {
element[key.substr(1)] = options[key]
}
} else element.setAttribute(key, options[key])
}
}
@ -66,14 +70,41 @@ function renderTree(data) {
function renderWindow(windowdata, winnum) {
var win = element('li', {class:(windowdata.sticky?"sticky":"")});
var label = element('span', {_html: '<i class="fa '+(windowdata.sticky?"fa-thumb-tack":"fa-square-o")+'"></i> Window '+windowdata.id, _parent:win})
var label = element('span', {class:"name-line", _parent:win})
var label_icon = element('span', {class:"name-icon", _parent:label, _html:(windowdata.sticky?'<i class="fa fa-thumb-tack"></i> ':'<i class="fa fa-square-o"></i> ')})
var label_name = element('span', {class:"name-string", _parent:label, _html:windowdata.name, _ondblclick:function(){
var namestringspan = this
var name = namestringspan.innerHTML
namestringspan.innerHTML = ""
var input = element('input', {
_parent: namestringspan,
value:name,
type:"text",
_onblur:function(ev){
if(ev && ev.keyCode) {
if(ev.keyCode!=13) {
return
}
}
console.log("Rename window #"+winnum+" to "+this.value)
tabbro.ui_rename_window(winnum, this.value)
namestringspan.innerHTML = this.value
}, _onkeyup:"_onblur"
})
input.focus()
input.setSelectionRange(0,9999)
}})
var options = element('div', {class:"options", _parent:label})
var options = element('div', {class:"options", _parent:win})
var stickunstick = element('a', {
class:"unstick"+(windowdata.sticky?" stuck":""),
_onclick: function() {
console.log("Stuck window #"+winnum)
//console.log("Stuck window #"+winnum)
tabbro.ui_stick_window(winnum)
repaint()
},
@ -87,7 +118,7 @@ function renderWindow(windowdata, winnum) {
var deletewindow = element('a', {
class:"delete",
_onclick: function() {
console.log("Delete window #"+winnum)
//console.log("Delete window #"+winnum)
tabbro.ui_delete_window(winnum)
repaint()
},
@ -97,11 +128,24 @@ function renderWindow(windowdata, winnum) {
_parent:options
})
/*var rename = element('a', {
class:"rename",
_onclick: function() {
//console.log("Open window #"+winnum)
//tabbro.ui_open_window(winnum)
repaint()
},
href: "#",
title: "Info",
_html:'<i class="fa fa-info-circle"></i>',
_parent:options
})*/
var opennew = element('a', {
class:"open",
_onclick: function() {
console.log("Open window #"+winnum)
//console.log("Open window #"+winnum)
tabbro.ui_open_window(winnum)
repaint()
},
@ -112,8 +156,6 @@ function renderWindow(windowdata, winnum) {
})
var list = element("ul", {class:"window"})
for(var i in windowdata.tabs) {
list.appendChild(renderTab(windowdata.tabs[i], i, winnum))
@ -125,14 +167,18 @@ function renderWindow(windowdata, winnum) {
function renderTab(tabdata, tabnum, winnum) {
var tab = element('li', {class:"clearfix"})
tab.innerHTML = (tabdata.sticky?'<i class="fa fa-thumb-tack"></i> ':'')+tabdata.title + " ("+tabdata.id+")"
var label = element('span', {class:"name-line", _parent:tab})
var label_icon = element('span', {class:"name-icon", _parent:label, _html:(tabdata.sticky?'<i class="fa fa-thumb-tack"></i> ':'')})
var label_name = element('span', {class:"name-string", _parent:label, _html:tabdata.title + " ("+tabdata.id+")"})
var options = element('div', {class:"options", _parent:tab})
var stickunstick = element('a', {
class:"unstick"+(tabdata.sticky?" stuck":""),
_onclick: function() {
console.log("Stuck tab #"+tabnum+" in window #"+winnum)
//console.log("Stuck tab #"+tabnum+" in window #"+winnum)
tabbro.ui_stick_tab(winnum, tabnum)
repaint()
},
@ -146,7 +192,7 @@ function renderTab(tabdata, tabnum, winnum) {
var deletetab = element('a', {
class:"delete",
_onclick: function() {
console.log("Delete tab #"+tabnum+" in window #"+winnum)
//console.log("Delete tab #"+tabnum+" in window #"+winnum)
tabbro.ui_delete_tab(winnum, tabnum)
repaint()
},
@ -160,9 +206,9 @@ function renderTab(tabdata, tabnum, winnum) {
var opennew = element('a', {
class:"open",
_onclick: function() {
console.log("Open tab #"+tabnum+" from window #"+winnum)
//tabbro.ui_delete_window(winnum)
//repaint()
//console.log("Open tab #"+tabnum+" from window #"+winnum)
tabbro.ui_open_tab(winnum, tabnum)
repaint()
},
href: "#",
title: "Duplicate tab",

53
style.css
View File

@ -63,10 +63,11 @@ table {
/* GLOBAL */
body {
width: 640px;
padding: 10px 10px 10px 10px;
width: 420px;
padding: 5px 0px;
margin: 0;
font-family: Open sans;
font-size: 12px;
}
@ -74,7 +75,7 @@ body {
.options {
position: absolute;
top: -3px;
left: 0px;
right: 0px;
display: none;
background-color: #fff;
padding: 3px;
@ -93,26 +94,31 @@ li:hover>.options, li:hover>span>.options {
ul#root {
}
ul#root > li {
margin-bottom: 20px;
}
ul#root > li:nth-child(2n) {
background-color: rgba(0,0,0,0.05);
}
ul#root > li > span {
min-height: 25px;
display: block;
padding: 0px 10px 5px 10px;
}
ul#root li {
position: relative;
min-height: 25px;
padding: 5px 0px;
}
ul#root > li > ul {
margin-left: 30px;
ul#root > li {
padding-bottom: 0px
}
ul#root > li > ul > li:nth-child(2n) {
ul#root > li > ul > li {
padding-left: 30px;
}
ul#root > li > ul > li > span {
overflow-x: hidden;
text-overflow: ellipsis;
white-space: nowrap;
display: block;
}
ul#root > li > ul > li:nth-child(2n+1) {
background-color: rgba(0,0,0,0.05);
}
@ -121,29 +127,6 @@ ul#root > li > ul > li:nth-child(2n) {
.wrapper {
}
ul#root > li {
margin-bottom: 10px;
overflow-x: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
ul.window {
padding
padding-left: 25px;