kiteditor 1.0.1

data/spec/javascripts/mercury/palette_spec.js.coffee

@@ -0,0 +1,49 @@
+describe "Mercury.Palette", ->
+
+  template 'mercury/palette.html'
+
+  beforeEach ->
+    $.fx.off = true
+
+  afterEach ->
+    @palette = null
+    delete(@palette)
+
+  describe "#build", ->
+
+    it "builds an element", ->
+      @palette = new Mercury.Palette('/blank.html', 'foo', {appendTo: '#test', for: $('#button')})
+      html = $('<div>').html(@palette.element).html()
+      expect(html).toContain('class="mercury-palette mercury-foo-palette loading"')
+      expect(html).toContain('style="display:none"')
+
+    it "appends to any element", ->
+      @palette = new Mercury.Palette('/blank.html', 'foo', {appendTo: '#palette_container', for: $('#button')})
+      expect($('#palette_container .mercury-palette').length).toEqual(1)
+
+
+  describe "observed events", ->
+
+    beforeEach ->
+      @palette = new Mercury.Palette('/blank.html', 'foo', {appendTo: '#test', for: $('#button')})
+
+    it "hides", ->
+      @palette.element.css({display: 'block'})
+      Mercury.trigger('hide:dialogs')
+      expect(@palette.element.css('display')).toEqual('none')
+
+    it "doesn't hide if it's the same dialog", ->
+      @palette.element.css({display: 'block'})
+      Mercury.trigger('hide:dialogs', @palette)
+      expect(@palette.element.css('display')).toEqual('block')
+
+
+  describe "#position", ->
+
+    beforeEach ->
+      @palette = new Mercury.Palette('/blank.html', 'foo', {appendTo: '#test', for: $('#button')})
+
+    it "positions based on it's button", ->
+      @palette.element.css({display: 'block'})
+      @palette.position(true)
+      expect(@palette.element.offset()).toEqual({top: 62, left: 42})

data/spec/javascripts/mercury/panel_spec.js.coffee

@@ -0,0 +1,185 @@
+describe "Mercury.Panel", ->
+
+  template 'mercury/panel.html'
+
+  beforeEach ->
+    Mercury.displayRect = {top: 20, left: 20, width: 200, height: 200}
+    $.fx.off = true
+    Mercury.determinedLocale =
+      top: {'hello world!': 'bork! bork!'}
+      sub: {'foo': 'Bork!'}
+
+  afterEach ->
+    Mercury.config.localization.enabled = false
+    delete(@panel)
+    $(window).unbind('mercury:resize')
+    $(window).unbind('mercury:hide:panels')
+
+  describe "#build", ->
+
+    it "builds an element", ->
+      @panel = new Mercury.Panel('/evergreen/resources/panel.html', 'foo', {appendTo: '#test', title: 'foo panel'})
+      html = $('<div>').html(@panel.element).html()
+      expect(html).toContain('class="mercury-panel loading"')
+      expect(html).toContain('style="display:none;"')
+      expect(html).toContain('<h1>foo panel</h1><div class="mercury-panel-pane"></div>')
+      expect(html).not.toContain('class="mercury-panel-close"')
+
+    it "appends to any element", ->
+      @panel = new Mercury.Panel('/evergreen/resources/panel.html', 'foo', {appendTo: '#panel_container', title: 'foo panel'})
+      expect($('#panel_container .mercury-panel').length).toEqual(1)
+
+    it "creates a close button if it should", ->
+      @panel = new Mercury.Panel('/evergreen/resources/panel.html', 'foo', {appendTo: '#test', title: 'foo panel', closeButton: true})
+      html = $('<div>').html(@panel.element).html()
+      expect(html).toContain('class="mercury-panel-close"')
+      expect(@panel.element.find('.mercury-panel-close').css('opacity')).toEqual('0')
+
+
+  describe "observed events", ->
+
+    beforeEach ->
+      @panel = new Mercury.Panel('/evergreen/resources/panel.html', 'foo', {appendTo: '#test', title: 'foo panel', for: $('#button'), closeButton: true})
+
+    describe "custom event: resize", ->
+
+      it "calls position", ->
+        spy = spyOn(Mercury.Panel.prototype, 'position').andCallFake(=>)
+        Mercury.trigger('resize')
+        expect(spy.callCount).toEqual(1)
+
+    describe "custom event: hide:panels", ->
+
+      it "hides", ->
+        @panel.element.css({display: 'block'})
+        Mercury.trigger('hide:panels')
+        expect(@panel.element.css('display')).toEqual('none')
+
+      it "doesn't hide if it's the same dialog", ->
+        @panel.element.css({display: 'block'})
+        Mercury.trigger('hide:panels', @panel)
+        expect(@panel.element.css('display')).toEqual('block')
+
+    describe "ajax:beforeSend", ->
+
+      it "sets a success that will load the contents of the response", ->
+        options = {}
+        loadContentSpy = spyOn(Mercury.Panel.prototype, 'loadContent').andCallFake(=>)
+        resizeSpy = spyOn(Mercury.Panel.prototype, 'resize').andCallFake(=>)
+        @panel.element.trigger('ajax:beforeSend', [null, options])
+        expect(options.success).toBeDefined()
+        options.success('new content')
+        expect(loadContentSpy.callCount).toEqual(1)
+        expect(loadContentSpy.argsForCall[0]).toEqual(['new content'])
+        expect(resizeSpy.callCount).toEqual(1)
+
+    describe "clicking on the close button", ->
+
+      it "calls hide:panels", ->
+        spy = spyOn(Mercury, 'trigger').andCallFake(=>)
+        jasmine.simulate.click(@panel.element.find('.mercury-panel-close').get(0))
+        expect(spy.callCount).toEqual(1)
+        expect(spy.argsForCall[0]).toEqual(['hide:panels'])
+
+
+  describe "#show", ->
+
+    beforeEach ->
+      @panel = new Mercury.Panel('/evergreen/resources/panel.html', 'foo', {appendTo: '#test', title: 'foo panel'})
+
+    it "hides other panels and dialogs", ->
+      spyOn(Mercury.Panel.prototype, 'position')
+      spyOn(Mercury.Panel.prototype, 'appear')
+      spy = spyOn(Mercury, 'trigger').andCallFake(=>)
+      @panel.show()
+      expect(spy.callCount).toEqual(2)
+      expect(spy.argsForCall[0]).toEqual(['hide:panels', @panel])
+      expect(spy.argsForCall[1]).toEqual(['hide:dialogs', @panel])
+
+
+  describe "#resize", ->
+
+    beforeEach ->
+      @panel = new Mercury.Panel('/evergreen/resources/panel.html', 'foo', {appendTo: '#panel_container', title: 'foo panel'})
+      @panel.element.css({display: 'block'})
+      @panel.visible = true
+
+    it "figures out what size it should be and resizes", ->
+      @panel.resize()
+      expect(@panel.element.offset()).toEqual({top: 42, left: 84})
+      expect(@panel.element.css('display')).toEqual('block')
+
+    it "calls makeDraggable", ->
+      spy = spyOn(Mercury.Panel.prototype, 'makeDraggable').andCallFake(=>)
+      @panel.resize()
+      expect(spy.callCount).toEqual(1)
+
+    it "keeps it hidden if it's not supposed to be visible", ->
+      @panel.visible = false
+      @panel.resize()
+      expect(@panel.element.css('display')).toEqual('none')
+
+
+  describe "#position", ->
+
+    beforeEach ->
+      @panel = new Mercury.Panel('/evergreen/resources/panel.html', 'foo', {appendTo: '#panel_container', title: 'foo panel'})
+      @panel.element.css({display: 'block'})
+      @panel.visible = true
+
+    it "positions based on the display rectangle", ->
+      @panel.position(true)
+      expect(@panel.element.offset()).toEqual({top: 70, left: 122})
+      expect(@panel.element.css('display')).toEqual('block')
+
+    it "calls makeDraggable", ->
+      spy = spyOn(Mercury.Panel.prototype, 'makeDraggable').andCallFake(=>)
+      @panel.position()
+      expect(spy.callCount).toEqual(1)
+
+    it "keeps it hidden if it's not supposed to be visible", ->
+      @panel.visible = false
+      @panel.position()
+      expect(@panel.element.css('display')).toEqual('none')
+
+
+  describe "#loadContent", ->
+
+    beforeEach ->
+      @panel = new Mercury.Panel('/evergreen/resources/panel.html', 'foo', {appendTo: '#test', title: 'foo panel'})
+
+    it "sets loaded to be true", ->
+      @panel.loadContent()
+      expect(@panel.loaded).toEqual(true)
+
+    it "removes the loading class from the element", ->
+      @panel.loadContent()
+      expect(@panel.element.hasClass('loading')).toEqual(false)
+
+    it "sets the element html to be the data passed to it", ->
+      @panel.loadContent('<span>hello world!</span>')
+      html = @panel.element.html()
+      expect(html).toContain('<h1>foo panel</h1>')
+      expect(html).toContain('class="mercury-panel-pane"')
+      expect(html).toContain('style="visibility: hidden;')
+      expect(html).toContain('hello world!')
+
+    it "sets the element html to be the data passed to it", ->
+      Mercury.config.localization.enabled = true
+      @panel.loadContent('<span>hello world!</span>')
+      html = @panel.element.html()
+      expect(html).toContain('<h1>foo panel</h1>')
+      expect(html).toContain('class="mercury-panel-pane"')
+      expect(html).toContain('style="visibility: hidden;')
+      expect(html).toContain('bork! bork!')
+
+
+  describe "#makesDraggable", ->
+
+    beforeEach ->
+      @panel = new Mercury.Panel('/evergreen/resources/panel.html', 'foo', {appendTo: '#test', title: 'foo panel'})
+
+    it "makes the element draggable", ->
+      spy = spyOn($.fn, 'draggable').andCallFake(=>)
+      @panel.makeDraggable()
+      expect(spy.callCount).toEqual(1)

data/spec/javascripts/mercury/region_spec.js.coffee

@@ -0,0 +1,298 @@
+describe "Mercury.Region", ->
+
+  template 'mercury/region.html'
+
+  beforeEach ->
+    Mercury.config.regions.className = 'custom-region-class'
+    Mercury.config.regions.dataAttributes = []
+
+  afterEach ->
+    @region = null
+    delete(@region)
+    $(window).unbind('mercury:mode')
+    $(window).unbind('mercury:focus:frame')
+    $(window).unbind('mercury:action')
+
+  describe "constructor", ->
+
+    beforeEach ->
+      @buildSpy = spyOn(Mercury.Region.prototype, 'build').andCallFake(=>)
+      @bindEventsSpy = spyOn(Mercury.Region.prototype, 'bindEvents').andCallFake(=>)
+      @pushHistorySpy = spyOn(Mercury.Region.prototype, 'pushHistory').andCallFake(=>)
+
+    it "expects an element and window (for context)", ->
+      @region = new Mercury.Region($('#region'), window)
+      expect(@region.element.get(0)).toEqual($('#region').get(0))
+
+    it "accepts options", ->
+      @region = new Mercury.Region($('#region'), window, {foo: 'bar'})
+      expect(@region.options).toEqual({foo: 'bar'})
+
+    it "sets variables we need", ->
+      @region = new Mercury.Region($('#region'), window, {foo: 'bar'})
+      expect(@region.name).toEqual('region')
+      expect(@region.history).toBeDefined()
+
+    it "sets name based on configuration", ->
+      Mercury.config.regions.identifier = 'data-scope'
+      @region = new Mercury.Region($('#region'), window, {foo: 'bar'})
+      expect(@region.name).toEqual('scope')
+
+    it "calls build", ->
+      @region = new Mercury.Region($('#region'), window, {foo: 'bar'})
+      expect(@buildSpy.callCount).toEqual(1)
+
+    it "calls bindEvents", ->
+      @region = new Mercury.Region($('#region'), window, {foo: 'bar'})
+      expect(@bindEventsSpy.callCount).toEqual(1)
+
+    it "pushes the initial state to the history buffer", ->
+      @region = new Mercury.Region($('#region'), window, {foo: 'bar'})
+      expect(@pushHistorySpy.callCount).toEqual(1)
+
+    it "sets the instance of the region into data for the element", ->
+      @region = new Mercury.Region($('#region'), window, {foo: 'bar'})
+      expect(@region.element.data('region')).toEqual(@region)
+
+
+  describe "#build", ->
+
+    it "does nothing and is there as an interface"
+
+
+  describe "#focus", ->
+
+    it "does nothing and is there as an interface"
+
+
+  describe "observed events", ->
+
+    beforeEach ->
+      @region = new Mercury.Region($('#region_with_snippet'), window)
+
+    describe "custom event: mode", ->
+
+      it "calls togglePreview if the mode is preview", ->
+        spy = spyOn(Mercury.Region.prototype, 'togglePreview').andCallFake(=>)
+        Mercury.trigger('mode', {mode: 'foo'})
+        expect(spy.callCount).toEqual(0)
+        Mercury.trigger('mode', {mode: 'preview'})
+        expect(spy.callCount).toEqual(1)
+
+    describe "custom event: focus:frame", ->
+
+      beforeEach ->
+        @focusSpy = spyOn(Mercury.Region.prototype, 'focus').andCallFake(=>)
+
+      it "does nothing if in preview mode", ->
+        @region.previewing = true
+        Mercury.trigger('focus:frame', {region: @region})
+        expect(@focusSpy.callCount).toEqual(0)
+
+      it "does nothing if it's not active region", ->
+        Mercury.region = {}
+        Mercury.trigger('focus:frame', {region: @region})
+        expect(@focusSpy.callCount).toEqual(0)
+
+      it "calls focus", ->
+        Mercury.region = @region
+        Mercury.trigger('focus:frame', {region: @region})
+        expect(@focusSpy.callCount).toEqual(1)
+
+    describe "custom event: action", ->
+
+      beforeEach ->
+        @execCommandSpy = spyOn(Mercury.Region.prototype, 'execCommand').andCallFake(=>)
+
+      it "does nothing if in preview mode", ->
+        @region.previewing = true
+        Mercury.trigger('action', {action: 'foo', value: 'bar'})
+        expect(@execCommandSpy.callCount).toEqual(0)
+
+      it "does nothing if it's not active region", ->
+        Mercury.region = {}
+        Mercury.trigger('action', {action: 'foo', value: 'bar'})
+        expect(@execCommandSpy.callCount).toEqual(0)
+
+      it "calls execCommand with the action and options", ->
+        Mercury.region = @region
+        Mercury.trigger('action', {action: 'foo', value: 'bar'})
+        expect(@execCommandSpy.callCount).toEqual(1)
+        expect(@execCommandSpy.argsForCall[0]).toEqual(['foo', {action: 'foo', value: 'bar'}])
+
+    describe "mouseover", ->
+
+      beforeEach ->
+        @triggerSpy = spyOn(Mercury, 'trigger').andCallFake(=>)
+
+      it "does nothing if in preview mode", ->
+        @region.previewing = true
+        jasmine.simulate.mousemove($('#region_with_snippet .mercury-snippet').get(0))
+        expect(@triggerSpy.callCount).toEqual(0)
+
+      it "does nothing if it's not the active region", ->
+        Mercury.region = {}
+        jasmine.simulate.mousemove($('#region_with_snippet .mercury-snippet').get(0))
+        expect(@triggerSpy.callCount).toEqual(0)
+
+      it "shows the snippet toolbar if a snippet was moused over", ->
+        Mercury.region = @region
+        jasmine.simulate.mousemove($('#region_with_snippet .mercury-snippet').get(0))
+        expect(@triggerSpy.callCount).toEqual(1)
+        expect(@triggerSpy.argsForCall[0][0]).toEqual('show:toolbar')
+
+    describe "mouseout", ->
+
+      beforeEach ->
+        @triggerSpy = spyOn(Mercury, 'trigger').andCallFake(=>)
+
+      it "does nothing if previewing", ->
+        @region.previewing = true
+        jasmine.simulate.mouseout(@region.element.get(0))
+        expect(@triggerSpy.callCount).toEqual(0)
+
+      it "hides the snippet toolbar", ->
+        jasmine.simulate.mouseout(@region.element.get(0))
+        expect(@triggerSpy.callCount).toEqual(1)
+        expect(@triggerSpy.argsForCall[0]).toEqual(['hide:toolbar', {type: 'snippet', immediately: false}])
+
+
+  describe "#html", ->
+
+    beforeEach ->
+      @region = new Mercury.Region($('#region_with_snippet'), window)
+
+    describe "getting html", ->
+
+      it "returns the html of the element", ->
+        content = @region.content()
+        expect(content).toEqual('contents<div class="mercury-snippet" data-snippet="snippet_1" data-version="1">snippet</div>')
+
+      it "replaces snippet content with an indentifier if asked", ->
+        content = @region.content(null, true)
+        expect(content).toEqual('contents<div class="mercury-snippet" data-snippet="snippet_1">[snippet_1]</div>')
+
+    describe "setting html", ->
+
+      it "sets the value of the html", ->
+        @region.content('new html')
+        expect($('#region_with_snippet').html()).toEqual('new html')
+
+
+  describe "#togglePreview", ->
+
+    beforeEach ->
+      @region = new Mercury.Region($('#region'), window)
+      Mercury.region = @region
+      @focusSpy = spyOn(Mercury.Region.prototype, 'focus').andCallFake(=>)
+      @triggerSpy = spyOn(Mercury, 'trigger').andCallFake(=>)
+
+    describe "when not previewing", ->
+
+      beforeEach ->
+        @region.togglePreview()
+
+      it "sets previewing to true", ->
+        expect(@region.previewing).toEqual(true)
+
+      it "swaps classes on the element", ->
+        expect(@region.element.hasClass('custom-region-class')).toEqual(false)
+        expect(@region.element.hasClass('custom-region-class-preview')).toEqual(true)
+
+      it "triggers a blur event", ->
+        expect(@triggerSpy.callCount).toEqual(1)
+        expect(@triggerSpy.argsForCall[0]).toEqual(['region:blurred', {region: @region}])
+
+    describe "when previewing", ->
+
+      beforeEach ->
+        @region.previewing = true
+        @region.togglePreview()
+
+      it "sets previewing to false", ->
+        expect(@region.previewing).toEqual(false)
+
+      it "swaps classes on the element", ->
+        expect(@region.element.hasClass('custom-region-class-preview')).toEqual(false)
+        expect(@region.element.hasClass('custom-region-class')).toEqual(true)
+
+      it "calls focus if it's the active region", ->
+        expect(@focusSpy.callCount).toEqual(1)
+
+
+  describe "#execCommand", ->
+
+    beforeEach ->
+      Mercury.changes = false
+      @region = new Mercury.Region($('#region'), window)
+
+    it "calls focus", ->
+      spy = spyOn(Mercury.Region.prototype, 'focus').andCallFake(=>)
+      @region.execCommand('foo')
+      expect(spy.callCount).toEqual(1)
+
+    it "pushes to the history (unless the action is redo)", ->
+      spy = spyOn(Mercury.Region.prototype, 'pushHistory').andCallFake(=>)
+      @region.execCommand('redo')
+      expect(spy.callCount).toEqual(0)
+      @region.execCommand('foo')
+      expect(spy.callCount).toEqual(1)
+
+    it "tells Mercury that changes have been made", ->
+      @region.execCommand('foo')
+      expect(Mercury.changes).toEqual(true)
+
+
+  describe "#pushHistory", ->
+
+    beforeEach ->
+      Mercury.changes = false
+      @region = new Mercury.Region($('#region'), window)
+
+    it "pushes the current content (html) of the region to the history buffer", ->
+      spy = spyOn(@region.history, 'push').andCallFake(=>)
+      @region.pushHistory('foo')
+      expect(spy.callCount).toEqual(1)
+
+
+  describe "#snippets", ->
+
+    it "does nothing and is there as an interface", ->
+
+
+  describe "#dataAttributes", ->
+
+    beforeEach ->
+      Mercury.config.regions.dataAttributes = ['scope', 'version']
+      @region = new Mercury.Region($('#region'), window)
+
+    it "returns an object of data attributes based on configuration", ->
+      @region.element.attr('data-version', 2)
+      expect(@region.dataAttributes()).toEqual({scope: 'scope', version: '2'})
+
+
+  describe "#serialize", ->
+
+    beforeEach ->
+      @region = new Mercury.Region($('#region'), window)
+
+    describe "without data attributes configured", ->
+
+      it "returns an object with it's type, value, and snippets", ->
+        serialized = @region.serialize()
+        expect(serialized.type).toEqual('region')
+        expect(serialized.value).toEqual('contents')
+        expect(serialized.snippets).toEqual({})
+        expect(serialized.data).toEqual({})
+
+    describe "with data attributes configured", ->
+
+      beforeEach ->
+        Mercury.config.regions.dataAttributes = ['scope', 'version']
+
+      it "returns an object with it's type, value, data and snippets", ->
+        serialized = @region.serialize()
+        expect(serialized.type).toEqual('region')
+        expect(serialized.value).toEqual('contents')
+        expect(serialized.snippets).toEqual({})
+        expect(serialized.data).toEqual({scope: 'scope', version: '1'})