diff options
Diffstat (limited to 'ui/imports/ui/components/select-model')
-rw-r--r-- | ui/imports/ui/components/select-model/select-model.html | 23 | ||||
-rw-r--r-- | ui/imports/ui/components/select-model/select-model.js | 79 |
2 files changed, 102 insertions, 0 deletions
diff --git a/ui/imports/ui/components/select-model/select-model.html b/ui/imports/ui/components/select-model/select-model.html new file mode 100644 index 0000000..71b9c81 --- /dev/null +++ b/ui/imports/ui/components/select-model/select-model.html @@ -0,0 +1,23 @@ +<!-- +######################################################################################## +# Copyright (c) 2017 Koren Lev (Cisco Systems), Yaron Yogev (Cisco Systems) and others # +# # +# All rights reserved. This program and the accompanying materials # +# are made available under the terms of the Apache License, Version 2.0 # +# which accompanies this distribution, and is available at # +# http://www.apache.org/licenses/LICENSE-2.0 # +######################################################################################## + --> +<template name="SelectModel"> + <select class="js-select form-control" + multiple="{{ multi }}" + {{ markIfDisabled }} + > + {{#if showNullOption }}<option value="">{{ nullOptionLabel }}</option>{{/if}} + {{#each option in options }} + <option value="{{ option.value }}" + selected="{{ isSelected option.value }}" + >{{ option.label }}</option> + {{/each }} + </select> +</template> diff --git a/ui/imports/ui/components/select-model/select-model.js b/ui/imports/ui/components/select-model/select-model.js new file mode 100644 index 0000000..01fca9c --- /dev/null +++ b/ui/imports/ui/components/select-model/select-model.js @@ -0,0 +1,79 @@ +///////////////////////////////////////////////////////////////////////////////////////// +// Copyright (c) 2017 Koren Lev (Cisco Systems), Yaron Yogev (Cisco Systems) and others / +// / +// All rights reserved. This program and the accompanying materials / +// are made available under the terms of the Apache License, Version 2.0 / +// which accompanies this distribution, and is available at / +// http://www.apache.org/licenses/LICENSE-2.0 / +///////////////////////////////////////////////////////////////////////////////////////// +/* + * Template Component: SelectModel + */ + +//import { Meteor } from 'meteor/meteor'; +import { Template } from 'meteor/templating'; +import * as R from 'ramda'; +//import { ReactiveDict } from 'meteor/reactive-dict'; + +import './select-model.html'; + +/* + * Lifecycles + */ + +Template.SelectModel.onCreated(function() { +}); + +/* +Template.SelectModel.rendered = function() { +}; +*/ + +/* + * Events + */ + +Template.SelectModel.events({ + 'change .js-select': function (event) { + event.stopPropagation(); + event.preventDefault(); + + let instance = Template.instance(); + // Extract string values from select element's attribute. + let elementSelectedValues = R.map(function (optionEl) { + return optionEl.value; + }, event.target.selectedOptions); + + let selectedValues = instance.data.multi ? elementSelectedValues : + elementSelectedValues[0]; + + if (instance.data.setModel) { + instance.data.setModel(selectedValues); + } + } +}); + +/* + * Helpers + */ + +Template.SelectModel.helpers({ + isSelected: function (optionValue) { + let instance = Template.instance(); + let selectedValues = instance.data.values; + + if (R.isNil(selectedValues)) { return false; } + return R.contains(optionValue, selectedValues); + }, + markIfDisabled: function () { + let instance = Template.instance(); + let attrs = {}; + if (instance.data.disabled) { + attrs = R.assoc('disabled', true, attrs); + } + + return attrs; + } +}); + + |