Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Browse files

refactor UIMenu as UIBase subclass

  • Loading branch information...
commit 64af08db39790bb6e6b0b0652abf753058d4cb36 1 parent 9f08a1d
@erisdev authored
View
0  resources/views/ui/menu/menu.hamlc → resources/views/ui/menu/index.hamlc
File renamed without changes
View
5 resources/views/ui/menu/item.hamlc
@@ -1,4 +1 @@
-- if @label?
- %li.ui-menuItem{id: @id, tabindex: 0}= @label
-- else
- %li.ui-menuSeparator
+%li.ui-menuItem{id: @id, tabindex: 0}= @label
View
2  scripts/mentions.coffee
@@ -19,4 +19,4 @@ exports.remember = (message) ->
onAfter: -> flash el
exports.menu = new UIMenu 'Mentions',
- itemTemplate: 'views/mention'
+ defaults: {template: 'views/mention'}
View
1  scripts/ui/base.coffee
@@ -7,7 +7,6 @@ exports = class UIBase extends jQuery.model.BaseModel
super resources.render(template, options), options
toggle: ->
- console.log this
if $(@rootElement).is(':visible')
this.hide arguments...
else
View
83 scripts/ui/menu.coffee
@@ -1,65 +1,62 @@
resources = require 'resources'
+UIBase = require 'ui/base'
-exports = class UIMenu
- constructor: (@title, options, buildMenu) ->
+UIMenuSeparator = class $.model.UIMenuSeparator extends UIBase
+ constructor: -> super $('<li class="ui-menuSeparator">')
+
+UIMenuItem = class $.model.UIMenuItem extends UIBase
+ constructor: (options, @action) ->
+ super options.template ? 'views/ui/menu/item', options
+
+ $(@rootElement).bind 'click', (event) =>
+ this.action?(event)
+ $(event.target).closest('.ui-menu').model().hide()
+
+exports = class $.model.UIMenu extends UIBase
+ @property 'title', '.ui-menuHeader'
+
+ constructor: (title, options, buildMenu) ->
if not buildMenu? and typeof options is 'function'
[options, buildMenu] = [{}, options]
else if not options?
options = {}
- @items = []
- @itemTemplate = options.itemTemplate ? 'views/ui/menu/item'
- @temporary = options.temporary ? false
+ super 'views/ui/menu', $.extend({title}, options)
if buildMenu?
buildMenu
+ defaults: (options) =>
+ $.extend @defaults, options
item: =>
- @addItem.apply this, arguments
+ this.addItem arguments...
separator: =>
- @addSeparator.apply this, arguments
+ this.addSeparator arguments...
+
+ Object.defineProperty @prototype, 'items',
+ get: -> this.find('.ui-menuItem, .ui-menuSeparator').models()
+
+ load: (options) ->
+ @defaults = $.extend {}, options.defaults
addItem: (label, options, action) ->
if not action? and typeof options is 'function'
[options, action] = [{}, options]
- item = $.extend {label, action}, options
- item.id ?= Math.uuid()
-
- if contentElement = @rootElement?.find('.ui-menuContent')
- this.renderItem contentElement, item
+ options = $.extend {label}, @defaults, options
- @items.push item
+ this.find('.ui-menuContent').append \
+ new UIMenuItem(options, action).rootElement
addSeparator: ->
- @items.push {}
-
- render: ->
- html = resources.render 'views/ui/menu/menu', this
- @rootElement = $(html).data(ui: this).hide().appendTo 'body'
-
- content = @rootElement.find '.ui-menuContent'
- this.renderItem(content, item) for item in @items
-
- renderItem: (content, item)->
- html = resources.render @itemTemplate, item
- $(html).on 'click', (event) =>
- item.action.call event.target, event
- this.hide()
- .appendTo content
-
- toggle: (pos) ->
- if @rootElement?.is(':visible')
- this.hide()
- else
- this.show pos
+ this.find('.ui-menuContent').append new UIMenuSeparator().rootElement
show: (targetPos = {}) ->
- unless @rootElement?
- this.render()
+ el = $(@rootElement)
+ el.appendTo('body') unless @rootElement.parentElement?
cssPos = {}
- height = @rootElement.outerHeight()
- width = @rootElement.outerWidth()
+ height = el.outerHeight()
+ width = el.outerWidth()
if targetPos.at?
# position relative to another element
@@ -78,12 +75,4 @@ exports = class UIMenu
then [cssPos.top, cssPos.bottom] = [y, '']
else [cssPos.bottom, cssPos.top ] = [window.innerHeight - y, '']
- @rootElement.css(cssPos).cssFadeIn() unless @rootElement.is ':visible'
-
- hide: ->
- @rootElement?.cssFadeOut =>
- this.destroy() if @temporary
-
- destroy: ->
- @rootElement.remove()
- @rootElement = null
+ el.css(cssPos).cssFadeIn()
View
1  scripts/ui/panel.coffee
@@ -24,7 +24,6 @@ exports = class UIPanel
# promote header, content and footer elements from the content template
for className in ['ui-panelHeader', 'ui-panelFooter', 'ui-panelContent']
@rootElement.find(".ui-panelContent > .#{className}").each (i, el) ->
- console.log ""
$(el).closest('.ui-panel').children(".#{className}").replaceWith el
$(this).trigger jQuery.Event('ui:load', {ui: this, @rootElement})
Please sign in to comment.
Something went wrong with that request. Please try again.