diff --git a/package.json b/package.json index 4a5b8dc..f4f8846 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "C9", - "version": "0.1.4", + "version": "0.1.5", "description": "A wrapper app for running the Cloud9 IDE locally", "main": "app://c9/www/index.html", "repository": { diff --git a/www/css/main.css b/www/css/main.css index e46681e..63423fe 100644 --- a/www/css/main.css +++ b/www/css/main.css @@ -246,3 +246,15 @@ body.ready > #logs { background-position: 0 0; top: 8px; } +#tabs .tab.active .tab_middle .tab_x:hover { + background-position: -14px 0; +} +#tabs .tab.active .tab_middle .tab_x:active { + background-position: -28px 0; +} +#tabs .tab .tab_middle .tab_x:hover { + background-position: -14px -14px; +} +#tabs .tab .tab_middle .tab_x:active { + background-position: -28px -14px; +} diff --git a/www/lib/Main.js b/www/lib/Main.js index 125532f..489eda4 100644 --- a/www/lib/Main.js +++ b/www/lib/Main.js @@ -55,10 +55,8 @@ var Main = module.exports = { }, close: function () { - var $activeTab = Tabs.getActive(), - $nextTab = Tabs.getPrevious($activeTab); + var $activeTab = Tabs.getActive(); Tabs.remove($activeTab); - Tabs.activate($nextTab); } }, @@ -174,36 +172,49 @@ var Main = module.exports = { // Initialize $(function(){ - var $welcomeTab = Tabs.activate(Tabs.add("Welcome")); + var $welcomeTab = Tabs.add({ + title: "Welcome", + tooltip: "Welcome to C9" + }); $welcomeTab[0].$element = $("#main #welcome"); + Tabs.activate($welcomeTab); + var $tabActivated, + $prevTabActivated; Tabs .on("activated", function(e, $tab){ - if($tab[0] === $welcomeTab[0]){ - Log.$logs.show(); - }else{ - Log.$logs.hide(); - } - Tabs.$tabs.each(function(i, $tab){ - $tab.$element.hide(); + // track pointer to previous tab + $prevTabActivated = $tabActivated; + $tabActivated = $tab; + // toggle the logs based on if this is the welcome tab + Log.$logs.toggle($tab[0] === $welcomeTab[0]); + // toggle the logs based on if this is the correct tab + Tabs.$tabs.each(function(i, t) { + t.$element.toggle($tab[0] === t); }); - $tab[0].$element.show(); $tab[0].$element.focus(); }) .on("removed", function(e, $tab){ + // close the workspace for the tab var $tabElement = $tab[0].$element; if ($tabElement.is("iframe")) { //NOTE: only do stuff for iframes Workspaces.close($tabElement); } + // if active tab was removed then select a new tab + if ($tab[0] === $tabActivated[0]){ + Tabs.activate($prevTabActivated || Tabs.$tabs.first()); + } }); Workspaces .on("opened", function(e, $frame){ var server = $frame[0].server, - $tab = Tabs.add(server.id); + $tab = Tabs.add({ + title: server.id, + tooltip: server.dir + }); $frame[0].$tab = $tab; $tab[0].$element = $frame; - Tabs.setTooltip($tab, server.dir); Tabs.activate($tab); Log.out("Opened workspace " + JSON.stringify(server.id) + "; ", {dir:server.dir, url:server.url}); }) diff --git a/www/lib/Tabs.js b/www/lib/Tabs.js index ee1d793..5d58227 100644 --- a/www/lib/Tabs.js +++ b/www/lib/Tabs.js @@ -36,10 +36,15 @@ var Tabs = module.exports = { //TODO: rename to Tabs return Tabs.$container.on(eventName, handlerFn); }, - add: function add(title){ - var $tab = $($(Tabs.TAB_HTML).appendTo(Tabs.$container)); - Tabs.setTitle($tab, title); + add: function add(opts){ + var $tab = $(Tabs.TAB_HTML).appendTo(Tabs.$container); + if (opts.title) Tabs.setTitle($tab, opts.title); + if (opts.tooltip) Tabs.setTooltip($tab, opts.tooltip); $tab.on("click", Tabs.activate.bind(Tabs, $tab)); + $tab.find(".tab_x").on("click", function(e) { + Tabs.remove($tab); + return false; + }); Tabs.$container.triggerHandler("added", [$tab]); return $tab; }, @@ -61,9 +66,12 @@ var Tabs = module.exports = { //TODO: rename to Tabs activate: function activate($tab){ var $oldTab = Tabs.$container.children(".tab.active"); - $oldTab.removeClass("active"); - $oldTab.triggerHandler("deactivated", [$oldTab]); - Tabs.$container.triggerHandler("deactivated", $oldTab); + if ($oldTab[0] === $tab[0]) return; + if ($oldTab[0]) { + $oldTab.removeClass("active"); + $oldTab.triggerHandler("deactivated", [$oldTab]); + Tabs.$container.triggerHandler("deactivated", $oldTab); + } $tab.addClass("active"); $tab.triggerHandler("activated", [$tab]); Tabs.$container.triggerHandler("activated", [$tab]);