diff --git a/src/extensions/tabs/index.coffee b/src/extensions/tabs/index.coffee new file mode 100644 index 000000000..8b5de5d05 --- /dev/null +++ b/src/extensions/tabs/index.coffee @@ -0,0 +1 @@ +module.exports = require 'tabs/src/tabs' diff --git a/src/extensions/tabs/spec/tabs-spec.coffee b/src/extensions/tabs/spec/tabs-spec.coffee new file mode 100644 index 000000000..9a873c1e9 --- /dev/null +++ b/src/extensions/tabs/spec/tabs-spec.coffee @@ -0,0 +1,34 @@ +$ = require 'jquery' +_ = require 'underscore' +RootView = require 'root-view' +Tabs = require 'tabs' + +describe "Tabs", -> + [rootView, editor, statusBar, buffer, tabs] = [] + + beforeEach -> + rootView = new RootView(require.resolve('fixtures/sample.js')) + rootView.open('sample.txt') + rootView.simulateDomAttachment() + rootView.activateExtension(Tabs) + editor = rootView.getActiveEditor() + tabs = rootView.find('.tabs').view() + + afterEach -> + rootView.remove() + + describe "@activate", -> + fit "appends a status bear to all existing and new editors", -> + expect(rootView.panes.find('.pane').length).toBe 1 + expect(rootView.panes.find('.pane > .tabs').length).toBe 1 + editor.splitRight() + expect(rootView.find('.pane').length).toBe 2 + expect(rootView.panes.find('.pane > .tabs').length).toBe 2 + + describe "#initialize()", -> + fit "creates a tab for each edit session on the editor to which the tab-strip belongs", -> + expect(editor.editSessions.length).toBe 2 + expect(tabs.find('.tab').length).toBe 2 + + expect(tabs.find('.tab:eq(0) .file-name').text()).toBe editor.editSessions[0].buffer.getBaseName() + expect(tabs.find('.tab:eq(1) .file-name').text()).toBe editor.editSessions[1].buffer.getBaseName() diff --git a/src/extensions/tabs/src/tabs.coffee b/src/extensions/tabs/src/tabs.coffee new file mode 100644 index 000000000..abbc06ad9 --- /dev/null +++ b/src/extensions/tabs/src/tabs.coffee @@ -0,0 +1,25 @@ +{View, $$} = require 'space-pen' + +module.exports = +class Tabs extends View + @activate: (rootView) -> + requireStylesheet 'tabs/src/tabs.css' + + for editor in rootView.getEditors() + @prependToEditorPane(rootView, editor) if rootView.parents('html').length + + rootView.on 'editor-open', (e, editor) => + @prependToEditorPane(rootView, editor) + + @prependToEditorPane: (rootView, editor) -> + if pane = editor.pane() + pane.prepend(new Tabs(editor)) + + @content: -> + @div class: 'tabs' + + initialize: (@editor) -> + for editSession in @editor.editSessions + @append $$ -> + @div class: 'tab', => + @div editSession.buffer.getBaseName(), class: 'file-name' diff --git a/src/extensions/tabs/src/tabs.css b/src/extensions/tabs/src/tabs.css new file mode 100644 index 000000000..fb8c5f0d8 --- /dev/null +++ b/src/extensions/tabs/src/tabs.css @@ -0,0 +1,20 @@ +.tabs { + background: #222; + border-bottom: 4px solid #555; +} + +.tab { + float: left; + margin: 4px; + margin-bottom: 0; + margin-right: 0; + padding: 4px; + background: #555; + color: white; + -webkit-border-top-left-radius: 4px; + -webkit-border-top-right-radius: 4px; +} + +.tab:last-child { + margin-right: 4px; +} \ No newline at end of file