diff --git a/source/Ox.UI/js/Form/Ox.Input.js b/source/Ox.UI/js/Form/Ox.Input.js
index 5390a960..89fe8d34 100644
--- a/source/Ox.UI/js/Form/Ox.Input.js
+++ b/source/Ox.UI/js/Form/Ox.Input.js
@@ -935,1020 +935,3 @@ Ox.Input = function(options, self) {
return that;
};
-
-/**
-delete below
-*/
-
-Ox.AutocorrectIntFunction = function(min, max, pad, year) {
- var pad = pad || false,
- year = year || false,
- maxLength = max.toString().length,
- ret = null,
- values = [];
- Ox.range(min, max + 1).forEach(function(v) {
- values.push(v + '');
- pad && v.toString().length < maxLength && values.push(Ox.pad(v, maxLength));
- });
- return function(value, blur, callback) {
- var results;
- if (year && value == '1') {
- value = '1900';
- } else {
- results = Ox.find(values, value);
- value = results[0].length == 1 && results[0][0].length < maxLength ?
- (pad ? Ox.pad(results[0][0], maxLength) : results[0][0]) :
- (results[0].length ? results[0][0] : null);
- }
- callback(value);
- };
-};
-
-// fixme: remove
-
-Ox.Input_ = function(options, self) {
-
- /*
- options:
- clear boolean, clear button, or not
- disabled boolean, disabled, or not
- height height (px), if type is 'textarea'
- id
- label string, or
- array [{ id, title, checked }] (selectable label) or
- array [{ id, label: [{ id, title, checked }], width }] (multiple selectable labels)
- label and placeholder are mutually exclusive
- labelWidth integer (px)
- placeholder string, or
- array [{ id, title, checked }] (selectable placeholder)
- label and placeholder are mutually exclusive
- separator string, or
- array of strings
- to separate multiple values
- separatorWidth integer (px), or
- array of integers
- serialize function
- size 'large', 'medium' or 'small'
- type 'password', 'select' or 'text'
- unit string, or
- array [{ id, title, checked }] (selectable unit)
- unitWidth integer (px)
- value string, or
- array [{ id, value, width }] (multiple values)
- width integer (px)
- methods:
- events:
- */
-
- self = self || {};
- var that = Ox.Element({}, self)
- .defaults({
- autocomplete: null,
- autocorrect: null,
- autosuggest: null,
- autosuggestHighlight: false,
- autosuggestSubmit: false,
- autovalidate: null,
- autovalidateName: 'Value',
- clear: false,
- disabled: false,
- height: 128,
- id: '',
- key: '',
- label: '',
- labelWidth: 64,
- placeholder: '',
- separator: '',
- separatorWidth: 16,
- serialize: null,
- size: 'medium',
- type: 'text',
- unit: '',
- unitWidth: 64,
- value: '',
- width: 128
- })
- .options(options || {})
- .addClass('OxInput Ox' + Ox.toTitleCase(self.options.size))
- .css({
- width: self.options.width + 'px'
- });
-
- Ox.extend(self, {
- clearWidth: 16,
- hasMultipleKeys: Ox.isArray(self.options.label) && 'label' in self.options.label[0],
- hasMultipleValues: Ox.isArray(self.options.value) &&
- (self.options.type != 'select' || 'items' in self.options.value[0]),
- hasSelectableKeys: Ox.isArray(self.options.label) || Ox.isArray(self.options.placeholder),
- hasSelectableUnits: Ox.isArray(self.options.unit),
- keyName: self.options.label ? 'label' : (self.options.placeholder ? 'placeholder' : ''),
- placeholderWidth: 16,
- selectedKey: [0], // fixme: only set on demand?
- selectedValue: 0,
- selectedUnit: 0,
- /* valid: autovalidateCall(true) */
- });
-
- ['autocomplete', 'autocorrect', 'autosuggest', 'autovalidate'].forEach(function(v) {
- //if (!Ox.isFunction(self.options[v])) {
- self.options[v] = {
- '': self.options[v]
- };
- //}
- });
-
- if (self.keyName && !self.hasMultipleKeys) {
- self.options[self.keyName] = [Ox.extend({
- id: '',
- label: self.options[self.keyName],
- }, self.keyName == 'label' ? {
- id: '',
- width: self.options.labelWidth
- } : {})];
- if (!self.hasSelectableKeys) {
- self.options[self.keyName][0].label = [{
- id: '',
- title: self.options[self.keyName][0].label
- }];
- }
- }
- if (self.hasSelectableKeys) {
- self.options[self.keyName].forEach(function(key, keyPos) {
- if (key.width) {
- self.options.labelWidth = (keyPos == 0 ? 0 : self.options.labelWidth) + key.width;
- }
- self.selectedKey[keyPos] = 0;
- Ox.forEach(key, function(value, valuePos) {
- if (value.checked) {
- self.selectedKey[keyPos] = valuePos;
- return false;
- }
- });
- });
- }
- self.valueWidth = self.options.width -
- (self.options.label ? self.options.labelWidth : 0) -
- ((self.options.placeholder && self.options.placeholder[0].label.length > 1) ? self.placeholderWidth : 0) -
- (self.options.unit ? self.options.unitWidth : 0) -
- (self.options.clear ? self.clearWidth : 0);
- /*
- if (self.hasMultipleValues) {
- self.valueWidth -= Ox.isArray(self.options.separatorWidth) ?
- Ox.sum(self.options.separatorWidth) :
- (self.options.value.length - 1) * self.options.separatorWidth;
- }
- */
- //Ox.Log('Form', 'self.hasMulVal', self.hasMultipleValues);
- //Ox.Log('Form', 'self.options.value', self.options.value)
- if (!self.hasMultipleValues) {
- if (self.options.type == 'select') {
- self.options.value = [{
- id: '',
- items: self.options.value,
- width: self.valueWidth
- }];
- } else if (self.options.type == 'range') {
- self.options.value = [Ox.extend({
- id: '',
- size: self.valueWidth
- }, self.options.value)];
- } else {
- self.options.value = [{
- id: '',
- value: self.options.value,
- width: self.valueWidth
- }]
- }
- }
- //Ox.Log('Form', 'self.options.value', self.options.value)
- self.values = self.options.value.length;
- //Ox.Log('Form', self.options.id, 'self.values', self.values)
-
- if (Ox.isString(self.options.separator)) {
- self.options.separator = $.map(new Array(self.values - 1), function(v, i) {
- return self.options.separator;
- });
- }
- if (Ox.isNumber(self.options.separatorWidth)) {
- self.options.separatorWidth = $.map(new Array(self.values - 1), function(v, i) {
- return self.options.separatorWidth;
- });
- }
-
- if (self.options.unit) {
- if (self.hasSelectableUnits) {
- Ox.forEach(self.options.unit, function(unit, pos) {
- if (unit.checked) {
- self.selectedUnit = pos;
- return false;
- }
- });
- } else {
- self.options.unit = [{
- id: '',
- title: self.options.unit
- }];
- }
- }
-
- //Ox.Log('Form', 'self', self);
-
- if (self.keyName) {
- that.$key = [];
- self.options[self.keyName].forEach(function(key, keyPos) {
- //Ox.Log('Form', 'keyPos key', keyPos, key)
- if (self.keyName == 'label' && key.label.length == 1) {
- that.$key[keyPos] = Ox.Label({
- overlap: 'right',
- title: key.label[0].title,
- width: self.options.labelWidth
- })
- .css({
- float: 'left'
- })
- .click(function() {
- that.$input[0].focusInput(true);
- })
- .appendTo(that);
- } else if (key.label.length > 1) {
- //Ox.Log('Form', 'key.length > 1')
- self.selectKeyId = self.options.id + Ox.toTitleCase(self.keyName) +
- (self.options[self.keyName].length == 1 ? '' : keyPos);
- //Ox.Log('Form', 'three', self.selectedKey, keyPos, self.selectedKey[keyPos]);
- that.$key[keyPos] = Ox.Select({
- id: self.selectKeyId,
- items: $.map(key.label, function(value, valuePos) {
- return {
- checked: valuePos == self.selectedKey[keyPos],
- id: value.id,
- group: self.selectKeyId, // fixme: same id, works here, but should be different
- title: value.title
- };
- }),
- overlap: 'right',
- type: self.options.label ? 'text' : 'image',
- width: self.options.label ? (self.options.label.length == 1 ? self.options.labelWidth : key.width) : self.placeholderWidth
- })
- .css({
- float: 'left'
- })
- .appendTo(that);
- that.bindEvent('change_' + self.selectKeyId, changeKey);
- }
- });
- }
-
- if (self.options.clear) {
- that.$clear = Ox.Button({
- overlap: 'left',
- title: 'close',
- type: 'image'
- })
- .css({
- float: 'right'
- })
- .click(clear)
- .appendTo(that);
- }
-
- if (self.options.unit.length == 1) {
- that.$unit = Ox.Label({
- overlap: 'left',
- title: self.options.unit[0].title,
- width: self.options.unitWidth
- })
- .css({
- float: 'right'
- })
- .click(function() {
- that.$input[0].focusInput(true);
- })
- .appendTo(that);
- } else if (self.options.unit.length > 1) {
- self.selectUnitId = self.options.id + 'Unit';
- that.$unit = Ox.Select({
- id: self.selectUnitId,
- items: $.map(self.options.unit, function(unit, i) {
- //Ox.Log('Form', 'unit', unit)
- return {
- checked: i == 0,
- id: unit.id,
- group: self.selectUnitId, // fixme: same id, works here, but should be different
- title: unit.title
- };
- }),
- overlap: 'left',
- size: self.options.size,
- width: self.options.unitWidth
- })
- .css({
- float: 'right'
- })
- .appendTo(that);
- }
-
- if (self.values) {
- that.$separator = [];
- self.options.value.forEach(function(v, i) {
- if (i < self.values - 1) {
- that.$separator[i] = Ox.Label({
- textAlign: 'center',
- title: self.options.separator[i],
- width: self.options.separatorWidth[i] + 32
- })
- .css({
- float: 'left',
- marginLeft: (v.width - (i == 0 ? 16 : 32)) + 'px'
- })
- .click(function() {
- that.$input[0].focusInput(true);
- })
- .appendTo(that);
- }
- });
- }
- that.$input = [];
- //self.margin = 0;
- self.options.value.forEach(function(v, i) {
- //Ox.Log('Form', 'o k i', self.options, self.keyName, i);
- var id = self.keyName ? $.map(self.selectedKey, function(v, i) {
- return self.options[self.keyName][i].id;
- }).join('.') : '';
- //self.margin -= (i == 0 ? 16 : self.options.value[i - 1].width)
- //Ox.Log('Form', 'v:', v, 'id:', id)
- if (self.options.type == 'select') {
- that.$input[i] = Ox.Select({
- id: v.id,
- items: v.items,
- width: v.width
- }).
- css({
- float: 'left'
- });
- } else if (self.options.type == 'range') {
- that.$input[i] = Ox.Range(v)
- .css({
- float: 'left'
- });
- } else {
- that.$input[i] = Ox.InputElement({
- autocomplete: self.options.autocomplete[id],
- autocorrect: self.options.autocorrect[id],
- autosuggest: self.options.autosuggest[id],
- autosuggestHighlight: self.options.autosuggestHighlight,
- autosuggestSubmit: self.options.autosuggestSubmit,
- autovalidate: self.options.autovalidate[id],
- autovalidateName: self.options.autovalidateName,
- disabled: self.options.disabled,
- height: self.options.height,
- id: self.options.id + 'Input' + Ox.toTitleCase(v.id),
- key: self.hasSelectableKeys ? self.options[self.keyName][0].label[self.selectedKey[0]].id : '',
- parent: that,
- placeholder: self.options.placeholder ? self.options.placeholder[0].label[0].title : '',
- size: self.options.size,
- type: self.options.type,
- value: v.value,
- width: v.width
- });
- }
- that.$input[i]
- .css(Ox.extend({}, self.options.value.length > 1 ? {
- float: 'left',
- marginLeft: -Ox.sum($.map(self.options.value, function(v_, i_) {
- return i_ > i ? self.options.value[i_ - 1].width + self.options.separatorWidth[i_ - 1] : (i_ == i ? 16 : 0);
- }))
- } : {}))
- .appendTo(that);
- });
-
- //width(self.options.width);
-
- function changeKey(data) {
- //Ox.Log('Form', 'changeKey', data);
- if (data) { // fixme: necessary?
- self.key = {
- id: data.id,
- title: data.value // fixme: should be data.title
- };
- that.$input[0].options({
- key: data.id
- });
- }
- if (self.options.label) {
- //that.$label.html(self.option.title);
- that.$input[0].focusInput(true);
- //autocompleteCall();
- } else {
- that.$input[0].options({
- placeholder: data.value // fixme: should be data.title
- });
- /*
- if (that.$input.hasClass('OxPlaceholder')) {
- that.$input.val(self.key.title);
- //that.$input.focus();
- } else {
- that.$input.focus();
- self.options.autosuggest && autosuggestCall();
- }
- */
- }
- }
-
- function changeUnit() {
- that.$input[0].focusInput(true);
- }
-
- function clear() {
- that.$input.forEach(function(v, i) {
- v.val('');
- });
- that.$input[0].focusInput();
- }
-
- function height(value) {
- var stop = 8 / value;
- if (self.options.type == 'textarea') {
- that.$element
- .height(value)
- .css({
- background: '-moz-linear-gradient(top, rgb(224, 224, 224), rgb(208, 208, 208) ' + (stop * 100) + '%, rgb(208, 208, 208) ' + (100 - stop * 100) + '%, rgb(192, 192, 192))'
- })
- .css({
- background: '-webkit-gradient(linear, left top, left bottom, from(rgb(224, 224, 224)), color-stop(' + stop + ', rgb(208, 208, 208)), color-stop(' + (1 - stop) + ', rgb(208, 208, 208)), to(rgb(192, 192, 192)))'
- });
- that.$input
- .height(value)
- .css({
- background: '-moz-linear-gradient(top, rgb(224, 224, 224), rgb(240, 240, 240) ' + (stop * 100) + '%, rgb(240, 240, 240) ' + (100 - stop * 100) + '%, rgb(255, 255, 255))'
- })
- .css({
- background: '-webkit-gradient(linear, left top, left bottom, from(rgb(224, 224, 224)), color-stop(' + stop + ', rgb(240, 240, 240)), color-stop(' + (1 - stop) + ', rgb(240, 240, 240)), to(rgb(255, 255, 255)))'
- });
- }
- }
-
- function selectUnit() {
- self.$selectUnitMenu.show();
- }
-
- function submit() {
- //Ox.Log('Form', 'submit')
- var value = that.$input.val();
- that.$input.blur();
- that.triggerEvent('submit', self.options.key ? {
- key: self.options.key,
- value: value
- } : value);
- }
-
- function width(value) {
- that.$element.width(value);
- that.$input.width(
- value - (self.options.type == 'textarea' ? 0 : 12) -
- (self.options.label ? self.options.labelWidth : 0) -
- (self.options.placeholder.length > 1 ? 16 : 0) -
- (self.options.unit ? self.options.unitWidth : 0) -
- (self.options.clear ? 16 : 0)
- );
- }
-
- self.setOption = function(key, value) {
- if (key == 'height') {
- height(value);
- } else if (key == 'width') {
- width(value);
- }
- };
-
- that.changeLabel = function(id) {
- that.$key.html(Ox.getObjectById(self.options.label, id).title);
- self.selectMenu.checkItem(id);
- };
-
- return that;
-
-}
-
-Ox.InputElement_ = function(options, self) {
-
- self = self || {};
- var that = Ox.Element(
- options.type == 'textarea' ? 'textarea' : 'input', self
- )
- .defaults({
- autocomplete: null,
- autocorrect: null,
- autosuggest: null,
- autosuggestHighlight: false,
- autosuggestSubmit: false,
- autovalidate: null,
- disabled: false,
- height: 128,
- id: '',
- key: '',
- parent: null,
- placeholder: '',
- size: 'medium',
- type: 'text',
- value: '',
- width: 128
- })
- .options(options || {})
- .addClass('OxInput Ox' + Ox.toTitleCase(self.options.size) + (
- (self.options.placeholder && self.options.value === '') ?
- ' OxPlaceholder' : ''
- ))
- .attr(self.options.type == 'textarea' ? {} : {
- type: self.options.type
- })
- .css({
- float: 'left',
- width: (self.options.width - 14) + 'px'
- })
- .val(
- (self.options.placeholder && self.options.value === '') ?
- self.options.placeholder : self.options.value
- )
- .blur(blur)
- .change(change)
- .focus(focus);
-
- //Ox.Log('Form', 'InputElement self.options', self.options)
-
- self.bindKeyboard = self.options.autocomplete || self.options.autocorrect
- || self.options.autosuggest || self.options.autovalidate;
-
- if (self.options.autosuggest) {
- self.autosuggestId = self.options.id + 'Menu'; // fixme: we do this in other places ... are we doing it the same way? var name?
- self.$autosuggestMenu = Ox.Menu({
- element: that.$element,
- id: self.autosuggestId,
- offset: {
- left: 4,
- top: 0
- },
- size: self.options.size
- });
- that.bindEvent('click_' + self.autosuggestId, clickMenu);
- }
-
- that.bindEvent(Ox.extend(self.options.type == 'textarea' ? {} : {
- key_enter: submit
- }, {
- key_escape: cancel
- }));
-
- function autocomplete(value) {
- var value = value.toLowerCase(),
- ret = '';
- if (value !== '') {
- Ox.forEach(self.options.autocomplete, function(v, i) {
- if (v.toLowerCase().indexOf(value) == 0) {
- ret = v;
- return false;
- }
- });
- }
- return ret;
- }
-
- function autocompleteCall() {
- var value = that.$element.val();
- Ox.isFunction(self.options.autocomplete) ?
- self.options.autocomplete(self.options.key ? {
- key: self.options.key,
- value: value
- } : value, autocompleteCallback) :
- autocompleteCallback(autocomplete(value));
- }
-
- function autocompleteCallback(value) {
- var pos = cursor()[0];
- if (value) {
- that.$element.val(value);
- cursor(pos, value.length);
- }
- }
-
- function autocorrect(value) {
- var length = value.length;
- return $.map(value.toLowerCase().split(''), function(v, i) {
- if (new RegExp(self.options.autocorrect).test(v)) {
- return v
- } else {
- return null;
- }
- }).join('');
- }
-
- function autocorrectCall(blur) {
- var blur = blur || false,
- value = that.$element.val(),
- pos = cursor()[0];
- Ox.isFunction(self.options.autocorrect) ?
- self.options.autocorrect(value, blur, autocorrectCallback) :
- autocorrectCallback(autocorrect(value), blue);
- }
-
- function autocorrectCallback(value, blur) {
- var length = that.$element.val().length;
- that.$element.val(self.options.value);
- !blur && cursor(pos + value.length - length);
- }
-
- function autosuggest(value) {
- var value = value.toLowerCase(),
- values = [[], []];
- if (value !== '') {
- (
- self.options.key ?
- self.options.autosuggest[self.options.key] : self.options.autosuggest
- ).forEach(function(v, i) {
- //Ox.Log('Form', 'v...', v)
- var index = v.toLowerCase().indexOf(value);
- index > -1 && values[index == 0 ? 0 : 1].push(v);
- });
- }
- return Ox.merge(values[0], values[1]);
- }
-
- function autosuggestCall() {
- var value = that.$element.val();
- Ox.isFunction(self.options.autosuggest) ?
- self.options.autosuggest(self.options.key ? {
- key: self.options.key,
- value: value
- } : value, autosuggestCallback) :
- autosuggestCallback(autosuggest(value));
- }
-
- function autosuggestCallback(values) {
- var values = values || [],
- selected = values.length == 1 ? 0 : -1,
- value = that.$element.val().toLowerCase();
- //Ox.Log('Form', 'values', values);
- if (values.length) {
- values = $.map(values, function(v, i) {
- if (value == v.toLowerCase()) {
- selected = i;
- }
- return {
- id: v.toLowerCase().replace(/ /g, '_'), // fixme: need function to do lowercase, underscores etc?
- title: self.options.autosuggestHighlight ? v.replace(
- new RegExp('(' + value + ')', 'ig'),
- '$1'
- ) : v
- };
- });
- // self.selectMenu && self.selectMenu.hideMenu(); // fixme: need event
- self.$autosuggestMenu.options({
- items: values,
- selected: selected
- }).showMenu();
- } else {
- self.$autosuggestMenu.hideMenu();
- }
- }
-
- function autovalidate(value) {
- return {
- valid: self.options.autovalidate(value) != null,
- message: 'Invalid ' + self.options.name
- };
- }
-
- function autovalidateCall(blur) {
- var blur = blur || false,
- value = that.$element.val();
- if (value !== '') {
- Ox.isFunction(self.options.autovalidate) ?
- self.options.autovalidate(value, autovalidateCallback) :
- autovalidateCallback(autovalidate(value), blur);
- } else {
- autovalidateCallback({
- blur: blur,
- valid: false,
- message: 'Empty ' + self.options.name
- });
- }
- }
-
- function autovalidateCallback(data, blur) {
- if (data.valid != self.valid) {
- self.valid = data.valid;
- that.triggerEvent('validate', Ox.extend(data, {
- blur: blur
- }));
- }
- }
-
- function blur() {
- if (!self.options.autosuggest || self.$autosuggestMenu.is(':hidden')) {
- //Ox.Log('Form', 'losing focus...')
- that.loseFocus();
- self.options.parent.removeClass('OxFocus');
- self.options.autocorrect && autocorrectCall(true);
- // self.options.autosuggest && self.$autosuggestMenu.hideMenu();
- self.options.autovalidate && autovalidateCall(true);
- if (self.options.placeholder && that.$element.val() === '') {
- that.$element.addClass('OxPlaceholder').val(self.options.placeholder);
- }
- }
- if (self.bindKeyboard) {
- Ox.UI.$document.unbind('keydown', keydown);
- }
- }
-
- function cancel() {
- that.$element.blur();
- }
-
- function change() {
-
- }
-
- function clear() {
- that.$element.val('').focus();
- }
-
- function clickMenu(data) {
- //Ox.Log('Form', 'clickMenu', data);
- that.$element.val(data.title);
- //self.$autosuggestMenu.hideMenu();
- self.options.autosuggestSubmit && submit();
- }
-
- // FIXME: make this public!
- function cursor(start, end) {
- /*
- cursor() returns [start, end]
- cursor(start) sets start
- cursor([start, end]) sets start and end
- cursor(start, end) sets start and end
- */
- var isArray = Ox.isArray(start);
- if (arguments.length == 0) {
- return [that.$element[0].selectionStart, that.$element[0].selectionEnd];
- } else {
- start = isArray ? start[0] : start;
- end = isArray ? start[1] : (end ? end : start);
- that.$element[0].setSelectionRange(start, end);
- }
- }
-
- function focus() {
- var val = that.$element.val();
- that.gainFocus();
- self.options.parent.addClass('OxFocus');
- if (that.$element.hasClass('OxPlaceholder')) {
- that.$element.val('').removeClass('OxPlaceholder');
- }
- if (self.bindKeyboard) {
- // fixme: different in webkit and firefox (?), see keyboard handler, need generic function
- Ox.UI.$document.keydown(keydown);
- //Ox.Log('Form', 'calling autosuggest...')
- self.options.autosuggest && setTimeout(autosuggestCall, 0); // fixme: why is the timeout needed?
- }
- }
-
- function keydown(event) {
- //Ox.Log('Form', 'keyCode', event.keyCode)
- if (event.keyCode != 9 && event.keyCode != 13 && event.keyCode != 27) { // fixme: can't 13 and 27 return false?
- setTimeout(function() { // fixme: document what this timeout is for
- var value = that.$element.val();
- if (value != self.options.value) {
- self.options.value = value;
- self.options.autocomplete && autocompleteCall();
- self.options.autocorrect && autocorrectCall();
- self.options.autosuggest && autosuggestCall();
- self.options.autovalidate && autovalidateCall();
- }
- }, 25);
- }
- }
-
- function submit() {
-
- }
-
- self.setOption = function(key, value) {
- if (key == 'placeholder') {
- that.$element.hasClass('OxPlaceholder') && that.$element.val(value);
- } else if (key == 'value') {
- if (self.options.placeholder) {
- if (value === '') {
- that.$element.addClass('OxPlaceholder').val(self.options.placeholder);
- } else {
- that.$element.removeClass('OxPlaceholder');
- }
- }
- change(); // fixme: keypress too
- }
- }
-
- return that;
-
-}
-
-Ox.Range_ = function(options, self) {
-
- /*
- init
- */
- self = self || {};
- var that = Ox.Element({}, self)
- .defaults({
- animate: false,
- arrows: false,
- arrowStep: 1,
- arrowSymbols: ['left', 'right'],
- max: 100,
- min: 0,
- orientation: 'horizontal',
- step: 1,
- size: 128,
- thumbSize: 16,
- thumbValue: false,
- trackImages: [],
- trackStep: 0,
- value: 0,
- valueNames: null
- })
- .options(Ox.extend(options, {
- arrowStep: options.arrowStep ?
- options.arrowStep : options.step,
- trackImages: $.makeArray(options.trackImages || [])
- }))
- .addClass('OxRange')
- .css({
- width: self.options.size + 'px'
- });
-
- // fixme: self. ... ?
- var trackImages = self.options.trackImages.length,
- values = (self.options.max - self.options.min + self.options.step) /
- self.options.step;
-
- /*
- construct
- */
- that.$element
- .css({
- width: self.options.size + 'px'
- });
- if (self.options.arrows) {
- var $arrowDec = Ox.Button({
- style: 'symbol',
- type: 'image',
- value: self.options.arrowSymbols[0]
- })
- .addClass('OxArrow')
- .mousedown(mousedownArrow)
- .click(clickArrowDec)
- .appendTo(that.$element);
- }
- var $track = Ox.Element()
- .addClass('OxTrack')
- .mousedown(clickTrack)
- .appendTo(that.$element);
-
- if (trackImages) {
- var width = parseFloat(screen.width / trackImages),
- $image = $('