mirror of
https://github.com/mgerb/mywebsite
synced 2026-01-11 10:22:53 +00:00
74 lines
2.1 KiB
JavaScript
74 lines
2.1 KiB
JavaScript
// The create function is called after the component is created
|
|
// and has been added to the DOM. It only runs in the browser
|
|
exports.create = function(model, dom) {
|
|
var toggle = dom.element('toggle')
|
|
, menu = dom.element('menu')
|
|
|
|
// Make sure the value gets set to the default if unselected
|
|
updateValue(model, model.get('value'), true)
|
|
|
|
// Listeners added inside of a component are removed when the
|
|
// page is re-rendered client side
|
|
dom.addListener(document.documentElement, 'click', function(e) {
|
|
if (toggle.contains(e.target) || menu.contains(e.target)) return
|
|
model.set('open', false)
|
|
})
|
|
}
|
|
|
|
// The init function is called on both the server and browser
|
|
// before rendering
|
|
exports.init = function(model) {
|
|
this.on('init:child', function(child, type) {
|
|
if (type !== 'lib:option') return
|
|
var childModel = child.model
|
|
model.at('options').push({
|
|
value: childModel.get('value')
|
|
, text: childModel.get('content')
|
|
})
|
|
|
|
updateValue(model, model.get('value'))
|
|
})
|
|
|
|
updateValue(model, model.get('value'))
|
|
|
|
model.on('set', 'value', function(value) {
|
|
updateValue(model, value, true)
|
|
})
|
|
}
|
|
|
|
exports.toggle = function() {
|
|
this.model.set('open', !this.model.get('open'))
|
|
}
|
|
|
|
exports._clickMenu = function(e) {
|
|
this.model.set('open', false)
|
|
// Don't do anything unless an option was clicked
|
|
if (e.target.tagName !== 'A') return
|
|
var item = this.model.at(e.target)
|
|
, value = item.get('value')
|
|
if (value === void 0) value = item.get('text')
|
|
this.model.set('value', value)
|
|
}
|
|
|
|
function optionValue(option) {
|
|
return ('value' in option) ? option.value : option.text
|
|
}
|
|
|
|
function updateValue(model, value, setValue) {
|
|
var options = model.get('options')
|
|
, i, len, option
|
|
if (!options) return
|
|
for (i = 0, len = options.length; i < len; i++) {
|
|
option = options[i]
|
|
if (optionValue(option) !== value) continue
|
|
model.set('label', option.text, null)
|
|
return
|
|
}
|
|
option = options[0]
|
|
value = optionValue(option)
|
|
if (setValue || value === void 0) {
|
|
model.set('value', value)
|
|
}
|
|
model.set('label', option.text, null)
|
|
}
|