diff --git a/draft/library/wsf_js_widget/kernel/input/wsf_input_control.e b/draft/library/wsf_js_widget/kernel/input/wsf_input_control.e index 7acf8f86..5c5b8a5c 100644 --- a/draft/library/wsf_js_widget/kernel/input/wsf_input_control.e +++ b/draft/library/wsf_js_widget/kernel/input/wsf_input_control.e @@ -98,6 +98,11 @@ feature -- Change end end + set_type (t: STRING) + do + type := t + end + feature -- Implementation value: STRING diff --git a/draft/library/wsf_js_widget/kernel/input/wsf_textarea_control.e b/draft/library/wsf_js_widget/kernel/input/wsf_textarea_control.e index 2b0318b4..c318d92c 100644 --- a/draft/library/wsf_js_widget/kernel/input/wsf_textarea_control.e +++ b/draft/library/wsf_js_widget/kernel/input/wsf_textarea_control.e @@ -24,7 +24,7 @@ feature {NONE} -- Initialization make (t: STRING) -- Initialize with specified control name and text to be displayed in this textarea do - make_input ( t) + make_input (t) tag_name := "textarea" end diff --git a/draft/library/wsf_js_widget/kernel/widgets/wsf_country_chooser_control.e b/draft/library/wsf_js_widget/kernel/widgets/wsf_country_chooser_control.e index 2d02d434..b81da55c 100644 --- a/draft/library/wsf_js_widget/kernel/widgets/wsf_country_chooser_control.e +++ b/draft/library/wsf_js_widget/kernel/widgets/wsf_country_chooser_control.e @@ -31,7 +31,7 @@ create feature {NONE} -- Initialization make (t: STRING) - -- Make a dropdown control with specified tag name (such as li) and menu title + -- Make a country chooser control with specified tag name (such as li) and menu title local temp: WSF_MULTI_CONTROL [WSF_STATELESS_CONTROL] options: WSF_MULTI_CONTROL [WSF_STATELESS_CONTROL] diff --git a/draft/library/wsf_js_widget/wsf_js_widget-safe.ecf b/draft/library/wsf_js_widget/wsf_js_widget-safe.ecf index 36617de7..14a4d6b0 100644 --- a/draft/library/wsf_js_widget/wsf_js_widget-safe.ecf +++ b/draft/library/wsf_js_widget/wsf_js_widget-safe.ecf @@ -17,7 +17,6 @@ - diff --git a/examples/widgetapp/assets/bootstrap-datetimepicker.css b/examples/widgetapp/assets/bootstrap-datetimepicker.css new file mode 100644 index 00000000..d861789d --- /dev/null +++ b/examples/widgetapp/assets/bootstrap-datetimepicker.css @@ -0,0 +1,257 @@ +/*! + * Datepicker for Bootstrap + * + * Copyright 2012 Stefan Petre + * Licensed under the Apache License v2.0 + * http://www.apache.org/licenses/LICENSE-2.0 + * + */ +.clearfix { + *zoom: 1 +} + +.clearfix:before,.clearfix:after { + display: table; + content: ""; + line-height: 0 +} + +.clearfix:after { + clear: both +} + +.hide-text { + font: 0/0 a; + color: transparent; + text-shadow: none; + background-color: transparent; + border: 0 +} + +.input-block-level { + display: block; + width: 100%; + min-height: 30px; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box +} + +.bootstrap-datetimepicker-widget { + top: 0; + left: 0; + width: 250px; + padding: 4px; + margin-top: 1px; + z-index: 3000; + -webkit-border-radius: 4px; + -moz-border-radius: 4px; + border-radius: 4px +} + +.bootstrap-datetimepicker-widget:before { + content: ''; + display: inline-block; + border-left: 7px solid transparent; + border-right: 7px solid transparent; + border-bottom: 7px solid #ccc; + border-bottom-color: rgba(0, 0, 0, 0.2); + position: absolute; + top: -7px; + left: 6px +} + +.bootstrap-datetimepicker-widget:after { + content: ''; + display: inline-block; + border-left: 6px solid transparent; + border-right: 6px solid transparent; + border-bottom: 6px solid #fff; + position: absolute; + top: -6px; + left: 7px +} + +.bootstrap-datetimepicker-widget>ul { + list-style-type: none; + margin: 0 +} + +.bootstrap-datetimepicker-widget .timepicker-hour,.bootstrap-datetimepicker-widget .timepicker-minute,.bootstrap-datetimepicker-widget .timepicker-second + { + width: 100%; + font-weight: bold; + font-size: 1.2em +} + +.bootstrap-datetimepicker-widget table[data-hour-format="12"] .separator + { + width: 4px; + padding: 0; + margin: 0 +} + +.bootstrap-datetimepicker-widget .datepicker>div { + display: none +} + +.bootstrap-datetimepicker-widget .picker-switch { + text-align: center +} + +.bootstrap-datetimepicker-widget table { + width: 100%; + margin: 0 +} + +.bootstrap-datetimepicker-widget td,.bootstrap-datetimepicker-widget th + { + text-align: center; + width: 20px; + height: 20px; + -webkit-border-radius: 4px; + -moz-border-radius: 4px; + border-radius: 4px +} + +.bootstrap-datetimepicker-widget td.day:hover,.bootstrap-datetimepicker-widget td.hour:hover,.bootstrap-datetimepicker-widget td.minute:hover,.bootstrap-datetimepicker-widget td.second:hover + { + background: #eee; + cursor: pointer +} + +.bootstrap-datetimepicker-widget td.old,.bootstrap-datetimepicker-widget td.new + { + color: #999 +} + +.bootstrap-datetimepicker-widget td.active,.bootstrap-datetimepicker-widget td.active:hover + { + color: #fff; + background-color: #006dcc; + background-image: -moz-linear-gradient(top, #08c, #04c); + background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#08c), + to(#04c)); + background-image: -webkit-linear-gradient(top, #08c, #04c); + background-image: -o-linear-gradient(top, #08c, #04c); + background-image: linear-gradient(to bottom, #08c, #04c); + background-repeat: repeat-x; + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff0088cc', + endColorstr='#ff0044cc', GradientType=0); + border-color: #04c #04c #002a80; + border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25); + *background-color: #04c; + filter: progid:DXImageTransform.Microsoft.gradient(enabled= false); + color: #fff; + text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25) +} + +.bootstrap-datetimepicker-widget td.active:hover,.bootstrap-datetimepicker-widget td.active:hover:hover,.bootstrap-datetimepicker-widget td.active:active,.bootstrap-datetimepicker-widget td.active:hover:active,.bootstrap-datetimepicker-widget td.active.active,.bootstrap-datetimepicker-widget td.active:hover.active,.bootstrap-datetimepicker-widget td.active.disabled,.bootstrap-datetimepicker-widget td.active:hover.disabled,.bootstrap-datetimepicker-widget td.active[disabled],.bootstrap-datetimepicker-widget td.active:hover[disabled] + { + color: #fff; + background-color: #04c; + *background-color: #003bb3 +} + +.bootstrap-datetimepicker-widget td.active:active,.bootstrap-datetimepicker-widget td.active:hover:active,.bootstrap-datetimepicker-widget td.active.active,.bootstrap-datetimepicker-widget td.active:hover.active + { + background-color: #039 \9 +} + +.bootstrap-datetimepicker-widget td.disabled,.bootstrap-datetimepicker-widget td.disabled:hover + { + background: 0; + color: #999; + cursor: not-allowed +} + +.bootstrap-datetimepicker-widget td span { + display: block; + width: 47px; + height: 54px; + line-height: 54px; + float: left; + margin: 2px; + cursor: pointer; + -webkit-border-radius: 4px; + -moz-border-radius: 4px; + border-radius: 4px +} + +.bootstrap-datetimepicker-widget td span:hover { + background: #eee +} + +.bootstrap-datetimepicker-widget td span.active { + color: #fff; + background-color: #006dcc; + background-image: -moz-linear-gradient(top, #08c, #04c); + background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#08c), + to(#04c)); + background-image: -webkit-linear-gradient(top, #08c, #04c); + background-image: -o-linear-gradient(top, #08c, #04c); + background-image: linear-gradient(to bottom, #08c, #04c); + background-repeat: repeat-x; + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff0088cc', + endColorstr='#ff0044cc', GradientType=0); + border-color: #04c #04c #002a80; + border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25); + *background-color: #04c; + filter: progid:DXImageTransform.Microsoft.gradient(enabled= false); + color: #fff; + text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25) +} + +.bootstrap-datetimepicker-widget td span.active:hover,.bootstrap-datetimepicker-widget td span.active:active,.bootstrap-datetimepicker-widget td span.active.active,.bootstrap-datetimepicker-widget td span.active.disabled,.bootstrap-datetimepicker-widget td span.active[disabled] + { + color: #fff; + background-color: #04c; + *background-color: #003bb3 +} + +.bootstrap-datetimepicker-widget td span.active:active,.bootstrap-datetimepicker-widget td span.active.active + { + background-color: #039 \9 +} + +.bootstrap-datetimepicker-widget td span.old { + color: #999 +} + +.bootstrap-datetimepicker-widget td span.disabled,.bootstrap-datetimepicker-widget td span.disabled:hover + { + background: 0; + color: #999; + cursor: not-allowed +} + +.bootstrap-datetimepicker-widget th.switch { + width: 145px +} + +.bootstrap-datetimepicker-widget th.next,.bootstrap-datetimepicker-widget th.prev + { + font-size: 21px +} + +.bootstrap-datetimepicker-widget th.disabled,.bootstrap-datetimepicker-widget th.disabled:hover + { + background: 0; + color: #999; + cursor: not-allowed +} + +.bootstrap-datetimepicker-widget thead tr:first-child th { + cursor: pointer +} + +.bootstrap-datetimepicker-widget thead tr:first-child th:hover { + background: #eee +} + +.input-append.date .add-on i,.input-prepend.date .add-on i { + display: block; + cursor: pointer; + width: 16px; + height: 16px +} \ No newline at end of file diff --git a/examples/widgetapp/assets/bootstrap-datetimepicker.js b/examples/widgetapp/assets/bootstrap-datetimepicker.js new file mode 100644 index 00000000..f804209c --- /dev/null +++ b/examples/widgetapp/assets/bootstrap-datetimepicker.js @@ -0,0 +1,1273 @@ +/** + * @license ========================================================= + * bootstrap-datetimepicker.js + * http://www.eyecon.ro/bootstrap-datepicker + * ========================================================= Copyright + * 2012 Stefan Petre + * + * Contributions: - Andrew Rowls - Thiago de Arruda + * + * Licensed under the Apache License, Version 2.0 (the "License"); you may not + * use this file except in compliance with the License. You may obtain a copy of + * the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT + * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the + * License for the specific language governing permissions and limitations under + * the License. ========================================================= + */ +(function($) { + var smartPhone = window.orientation != undefined; + var DateTimePicker = function(element, options) { + this.id = dpgId++; + this.init(element, options) + }; + var dateToDate = function(dt) { + if (typeof dt === "string") { + return new Date(dt) + } + return dt + }; + DateTimePicker.prototype = { + constructor : DateTimePicker, + init : function(element, options) { + var icon; + if (!(options.pickTime || options.pickDate)) + throw new Error("Must choose at least one picker"); + this.options = options; + this.$element = $(element); + this.language = options.language in dates ? options.language : "en"; + this.pickDate = options.pickDate; + this.pickTime = options.pickTime; + this.isInput = this.$element.is("input"); + this.component = false; + if (this.$element.is(".input-append") + || this.$element.is(".input-prepend")) + this.component = this.$element.find(".add-on"); + this.format = options.format; + if (!this.format) { + if (this.isInput) + this.format = this.$element.data("format"); + else + this.format = this.$element.find("input").data("format"); + if (!this.format) + this.format = "MM/dd/yyyy" + } + this._compileFormat(); + if (this.component) { + icon = this.component.find("i") + } + if (this.pickTime) { + if (icon && icon.length) + this.timeIcon = icon.data("time-icon"); + if (!this.timeIcon) + this.timeIcon = "icon-time"; + icon.addClass(this.timeIcon) + } + if (this.pickDate) { + if (icon && icon.length) + this.dateIcon = icon.data("date-icon"); + if (!this.dateIcon) + this.dateIcon = "icon-calendar"; + icon.removeClass(this.timeIcon); + icon.addClass(this.dateIcon) + } + this.widget = $( + getTemplate(this.timeIcon, options.pickDate, + options.pickTime, options.pick12HourFormat, + options.pickSeconds)).appendTo("body"); + this.minViewMode = options.minViewMode + || this.$element.data("date-minviewmode") || 0; + if (typeof this.minViewMode === "string") { + switch (this.minViewMode) { + case "months": + this.minViewMode = 1; + break; + case "years": + this.minViewMode = 2; + break; + default: + this.minViewMode = 0; + break + } + } + this.viewMode = options.viewMode + || this.$element.data("date-viewmode") || 0; + if (typeof this.viewMode === "string") { + switch (this.viewMode) { + case "months": + this.viewMode = 1; + break; + case "years": + this.viewMode = 2; + break; + default: + this.viewMode = 0; + break + } + } + this.startViewMode = this.viewMode; + this.weekStart = options.weekStart + || this.$element.data("date-weekstart") || 0; + this.weekEnd = this.weekStart === 0 ? 6 : this.weekStart - 1; + this.setStartDate(options.startDate + || this.$element.data("date-startdate")); + this.setEndDate(options.endDate + || this.$element.data("date-enddate")); + this.fillDow(); + this.fillMonths(); + this.fillHours(); + this.fillMinutes(); + this.fillSeconds(); + this.update(); + this.showMode(); + this._attachDatePickerEvents() + }, + show : function(e) { + this.widget.show(); + this.height = this.component ? this.component.outerHeight() + : this.$element.outerHeight(); + this.place(); + this.$element.trigger({ + type : "show", + date : this._date + }); + this._attachDatePickerGlobalEvents(); + if (e) { + e.stopPropagation(); + e.preventDefault() + } + }, + disable : function() { + this.$element.find("input").prop("disabled", true); + this._detachDatePickerEvents() + }, + enable : function() { + this.$element.find("input").prop("disabled", false); + this._attachDatePickerEvents() + }, + hide : function() { + var collapse = this.widget.find(".collapse"); + for ( var i = 0; i < collapse.length; i++) { + var collapseData = collapse.eq(i).data("collapse"); + if (collapseData && collapseData.transitioning) + return + + } + this.widget.hide(); + this.viewMode = this.startViewMode; + this.showMode(); + this.set(); + this.$element.trigger({ + type : "hide", + date : this._date + }); + this._detachDatePickerGlobalEvents() + }, + set : function() { + var formatted = ""; + if (!this._unset) + formatted = this.formatDate(this._date); + if (!this.isInput) { + if (this.component) { + var input = this.$element.find("input"); + input.val(formatted); + this._resetMaskPos(input) + } + this.$element.data("date", formatted) + } else { + this.$element.val(formatted); + this._resetMaskPos(this.$element) + } + }, + setValue : function(newDate) { + if (!newDate) { + this._unset = true + } else { + this._unset = false + } + if (typeof newDate === "string") { + this._date = this.parseDate(newDate) + } else if (newDate) { + this._date = new Date(newDate) + } + this.set(); + this.viewDate = UTCDate(this._date.getUTCFullYear(), this._date + .getUTCMonth(), 1, 0, 0, 0, 0); + this.fillDate(); + this.fillTime() + }, + getDate : function() { + if (this._unset) + return null; + return new Date(this._date.valueOf()) + }, + setDate : function(date) { + if (!date) + this.setValue(null); + else + this.setValue(date.valueOf()) + }, + setStartDate : function(date) { + if (date instanceof Date) { + this.startDate = date + } else if (typeof date === "string") { + this.startDate = new UTCDate(date); + if (!this.startDate.getUTCFullYear()) { + this.startDate = -Infinity + } + } else { + this.startDate = -Infinity + } + if (this.viewDate) { + this.update() + } + }, + setEndDate : function(date) { + if (date instanceof Date) { + this.endDate = date + } else if (typeof date === "string") { + this.endDate = new UTCDate(date); + if (!this.endDate.getUTCFullYear()) { + this.endDate = Infinity + } + } else { + this.endDate = Infinity + } + if (this.viewDate) { + this.update() + } + }, + getLocalDate : function() { + if (this._unset) + return null; + var d = this._date; + return new Date(d.getUTCFullYear(), d.getUTCMonth(), + d.getUTCDate(), d.getUTCHours(), d.getUTCMinutes(), d + .getUTCSeconds(), d.getUTCMilliseconds()) + }, + setLocalDate : function(localDate) { + if (!localDate) + this.setValue(null); + else + this.setValue(Date.UTC(localDate.getFullYear(), localDate + .getMonth(), localDate.getDate(), localDate.getHours(), + localDate.getMinutes(), localDate.getSeconds(), + localDate.getMilliseconds())) + }, + place : function() { + var offset = this.component ? this.component.offset() + : this.$element.offset(); + this.widget.css({ + top : offset.top + this.height, + left : offset.left + }) + }, + notifyChange : function() { + this.$element.trigger({ + type : "changeDate", + date : this.getDate(), + localDate : this.getLocalDate() + }) + }, + update : function(newDate) { + var dateStr = newDate; + if (!dateStr) { + if (this.isInput) { + dateStr = this.$element.val() + } else { + dateStr = this.$element.find("input").val() + } + if (!dateStr) { + var tmp = new Date; + this._date = UTCDate(tmp.getFullYear(), tmp.getMonth(), tmp + .getDate(), tmp.getHours(), tmp.getMinutes(), tmp + .getSeconds(), tmp.getMilliseconds()) + } else { + this._date = this.parseDate(dateStr) + } + } + this.viewDate = UTCDate(this._date.getUTCFullYear(), this._date + .getUTCMonth(), 1, 0, 0, 0, 0); + this.fillDate(); + this.fillTime() + }, + fillDow : function() { + var dowCnt = this.weekStart; + var html = ""; + while (dowCnt < this.weekStart + 7) { + html += '' + + dates[this.language].daysMin[dowCnt++ % 7] + "" + } + html += ""; + this.widget.find(".datepicker-days thead").append(html) + }, + fillMonths : function() { + var html = ""; + var i = 0; + while (i < 12) { + html += '' + + dates[this.language].monthsShort[i++] + "" + } + this.widget.find(".datepicker-months td").append(html) + }, + fillDate : function() { + var year = this.viewDate.getUTCFullYear(); + var month = this.viewDate.getUTCMonth(); + var currentDate = UTCDate(this._date.getUTCFullYear(), this._date + .getUTCMonth(), this._date.getUTCDate(), 0, 0, 0, 0); + var startYear = typeof this.startDate === "object" ? this.startDate + .getUTCFullYear() : -Infinity; + var startMonth = typeof this.startDate === "object" ? this.startDate + .getUTCMonth() + : -1; + var endYear = typeof this.endDate === "object" ? this.endDate + .getUTCFullYear() : Infinity; + var endMonth = typeof this.endDate === "object" ? this.endDate + .getUTCMonth() : 12; + this.widget.find(".datepicker-days").find(".disabled").removeClass( + "disabled"); + this.widget.find(".datepicker-months").find(".disabled") + .removeClass("disabled"); + this.widget.find(".datepicker-years").find(".disabled") + .removeClass("disabled"); + this.widget.find(".datepicker-days th:eq(1)").text( + dates[this.language].months[month] + " " + year); + var prevMonth = UTCDate(year, month - 1, 28, 0, 0, 0, 0); + var day = DPGlobal.getDaysInMonth(prevMonth.getUTCFullYear(), + prevMonth.getUTCMonth()); + prevMonth.setUTCDate(day); + prevMonth.setUTCDate(day + - (prevMonth.getUTCDay() - this.weekStart + 7) % 7); + if (year == startYear && month <= startMonth || year < startYear) { + this.widget.find(".datepicker-days th:eq(0)").addClass( + "disabled") + } + if (year == endYear && month >= endMonth || year > endYear) { + this.widget.find(".datepicker-days th:eq(2)").addClass( + "disabled") + } + var nextMonth = new Date(prevMonth.valueOf()); + nextMonth.setUTCDate(nextMonth.getUTCDate() + 42); + nextMonth = nextMonth.valueOf(); + var html = []; + var clsName; + while (prevMonth.valueOf() < nextMonth) { + if (prevMonth.getUTCDay() === this.weekStart) { + html.push("") + } + clsName = ""; + if (prevMonth.getUTCFullYear() < year + || prevMonth.getUTCFullYear() == year + && prevMonth.getUTCMonth() < month) { + clsName += " old" + } else if (prevMonth.getUTCFullYear() > year + || prevMonth.getUTCFullYear() == year + && prevMonth.getUTCMonth() > month) { + clsName += " new" + } + if (prevMonth.valueOf() === currentDate.valueOf()) { + clsName += " active" + } + if (prevMonth.valueOf() + 864e5 <= this.startDate) { + clsName += " disabled" + } + if (prevMonth.valueOf() > this.endDate) { + clsName += " disabled" + } + html.push('' + + prevMonth.getUTCDate() + ""); + if (prevMonth.getUTCDay() === this.weekEnd) { + html.push("") + } + prevMonth.setUTCDate(prevMonth.getUTCDate() + 1) + } + this.widget.find(".datepicker-days tbody").empty().append( + html.join("")); + var currentYear = this._date.getUTCFullYear(); + var months = this.widget.find(".datepicker-months") + .find("th:eq(1)").text(year).end().find("span") + .removeClass("active"); + if (currentYear === year) { + months.eq(this._date.getUTCMonth()).addClass("active") + } + if (currentYear - 1 < startYear) { + this.widget.find(".datepicker-months th:eq(0)").addClass( + "disabled") + } + if (currentYear + 1 > endYear) { + this.widget.find(".datepicker-months th:eq(2)").addClass( + "disabled") + } + for ( var i = 0; i < 12; i++) { + if (year == startYear && startMonth > i || year < startYear) { + $(months[i]).addClass("disabled") + } else if (year == endYear && endMonth < i || year > endYear) { + $(months[i]).addClass("disabled") + } + } + html = ""; + year = parseInt(year / 10, 10) * 10; + var yearCont = this.widget.find(".datepicker-years").find( + "th:eq(1)").text(year + "-" + (year + 9)).end().find("td"); + this.widget.find(".datepicker-years").find("th").removeClass( + "disabled"); + if (startYear > year) { + this.widget.find(".datepicker-years").find("th:eq(0)") + .addClass("disabled") + } + if (endYear < year + 9) { + this.widget.find(".datepicker-years").find("th:eq(2)") + .addClass("disabled") + } + year -= 1; + for ( var i = -1; i < 11; i++) { + html += ' endYear ? " disabled" + : "") + '">' + year + ""; + year += 1 + } + yearCont.html(html) + }, + fillHours : function() { + var table = this.widget.find(".timepicker .timepicker-hours table"); + table.parent().hide(); + var html = ""; + if (this.options.pick12HourFormat) { + var current = 1; + for ( var i = 0; i < 3; i += 1) { + html += ""; + for ( var j = 0; j < 4; j += 1) { + var c = current.toString(); + html += '' + padLeft(c, 2, "0") + + ""; + current++ + } + html += "" + } + } else { + var current = 0; + for ( var i = 0; i < 6; i += 1) { + html += ""; + for ( var j = 0; j < 4; j += 1) { + var c = current.toString(); + html += '' + padLeft(c, 2, "0") + + ""; + current++ + } + html += "" + } + } + table.html(html) + }, + fillMinutes : function() { + var table = this.widget + .find(".timepicker .timepicker-minutes table"); + table.parent().hide(); + var html = ""; + var current = 0; + for ( var i = 0; i < 5; i++) { + html += ""; + for ( var j = 0; j < 4; j += 1) { + var c = current.toString(); + html += '' + padLeft(c, 2, "0") + + ""; + current += 3 + } + html += "" + } + table.html(html) + }, + fillSeconds : function() { + var table = this.widget + .find(".timepicker .timepicker-seconds table"); + table.parent().hide(); + var html = ""; + var current = 0; + for ( var i = 0; i < 5; i++) { + html += ""; + for ( var j = 0; j < 4; j += 1) { + var c = current.toString(); + html += '' + padLeft(c, 2, "0") + + ""; + current += 3 + } + html += "" + } + table.html(html) + }, + fillTime : function() { + if (!this._date) + return; + var timeComponents = this.widget + .find(".timepicker span[data-time-component]"); + var table = timeComponents.closest("table"); + var is12HourFormat = this.options.pick12HourFormat; + var hour = this._date.getUTCHours(); + var period = "AM"; + if (is12HourFormat) { + if (hour >= 12) + period = "PM"; + if (hour === 0) + hour = 12; + else if (hour != 12) + hour = hour % 12; + this.widget.find(".timepicker [data-action=togglePeriod]") + .text(period) + } + hour = padLeft(hour.toString(), 2, "0"); + var minute = padLeft(this._date.getUTCMinutes().toString(), 2, "0"); + var second = padLeft(this._date.getUTCSeconds().toString(), 2, "0"); + timeComponents.filter("[data-time-component=hours]").text(hour); + timeComponents.filter("[data-time-component=minutes]").text(minute); + timeComponents.filter("[data-time-component=seconds]").text(second) + }, + click : function(e) { + e.stopPropagation(); + e.preventDefault(); + this._unset = false; + var target = $(e.target).closest("span, td, th"); + if (target.length === 1) { + if (!target.is(".disabled")) { + switch (target[0].nodeName.toLowerCase()) { + case "th": + switch (target[0].className) { + case "switch": + this.showMode(1); + break; + case "prev": + case "next": + var vd = this.viewDate; + var navFnc = DPGlobal.modes[this.viewMode].navFnc; + var step = DPGlobal.modes[this.viewMode].navStep; + if (target[0].className === "prev") + step = step * -1; + vd["set" + navFnc](vd["get" + navFnc]() + step); + this.fillDate(); + this.set(); + break + } + break; + case "span": + if (target.is(".month")) { + var month = target.parent().find("span").index( + target); + this.viewDate.setUTCMonth(month) + } else { + var year = parseInt(target.text(), 10) || 0; + this.viewDate.setUTCFullYear(year) + } + if (this.viewMode !== 0) { + this._date = UTCDate( + this.viewDate.getUTCFullYear(), + this.viewDate.getUTCMonth(), this.viewDate + .getUTCDate(), this._date + .getUTCHours(), this._date + .getUTCMinutes(), this._date + .getUTCSeconds(), this._date + .getUTCMilliseconds()); + this.notifyChange() + } + this.showMode(-1); + this.fillDate(); + this.set(); + break; + case "td": + if (target.is(".day")) { + var day = parseInt(target.text(), 10) || 1; + var month = this.viewDate.getUTCMonth(); + var year = this.viewDate.getUTCFullYear(); + if (target.is(".old")) { + if (month === 0) { + month = 11; + year -= 1 + } else { + month -= 1 + } + } else if (target.is(".new")) { + if (month == 11) { + month = 0; + year += 1 + } else { + month += 1 + } + } + this._date = UTCDate(year, month, day, this._date + .getUTCHours(), this._date.getUTCMinutes(), + this._date.getUTCSeconds(), this._date + .getUTCMilliseconds()); + this.viewDate = UTCDate(year, month, Math.min(28, + day), 0, 0, 0, 0); + this.fillDate(); + this.set(); + this.notifyChange() + } + break + } + } + } + }, + actions : { + incrementHours : function(e) { + this._date.setUTCHours(this._date.getUTCHours() + 1) + }, + incrementMinutes : function(e) { + this._date.setUTCMinutes(this._date.getUTCMinutes() + 1) + }, + incrementSeconds : function(e) { + this._date.setUTCSeconds(this._date.getUTCSeconds() + 1) + }, + decrementHours : function(e) { + this._date.setUTCHours(this._date.getUTCHours() - 1) + }, + decrementMinutes : function(e) { + this._date.setUTCMinutes(this._date.getUTCMinutes() - 1) + }, + decrementSeconds : function(e) { + this._date.setUTCSeconds(this._date.getUTCSeconds() - 1) + }, + togglePeriod : function(e) { + var hour = this._date.getUTCHours(); + if (hour >= 12) + hour -= 12; + else + hour += 12; + this._date.setUTCHours(hour) + }, + showPicker : function() { + this.widget.find(".timepicker > div:not(.timepicker-picker)") + .hide(); + this.widget.find(".timepicker .timepicker-picker").show() + }, + showHours : function() { + this.widget.find(".timepicker .timepicker-picker").hide(); + this.widget.find(".timepicker .timepicker-hours").show() + }, + showMinutes : function() { + this.widget.find(".timepicker .timepicker-picker").hide(); + this.widget.find(".timepicker .timepicker-minutes").show() + }, + showSeconds : function() { + this.widget.find(".timepicker .timepicker-picker").hide(); + this.widget.find(".timepicker .timepicker-seconds").show() + }, + selectHour : function(e) { + var tgt = $(e.target); + var value = parseInt(tgt.text(), 10); + if (this.options.pick12HourFormat) { + var current = this._date.getUTCHours(); + if (current >= 12) { + if (value != 12) + value = (value + 12) % 24 + } else { + if (value === 12) + value = 0; + else + value = value % 12 + } + } + this._date.setUTCHours(value); + this.actions.showPicker.call(this) + }, + selectMinute : function(e) { + var tgt = $(e.target); + var value = parseInt(tgt.text(), 10); + this._date.setUTCMinutes(value); + this.actions.showPicker.call(this) + }, + selectSecond : function(e) { + var tgt = $(e.target); + var value = parseInt(tgt.text(), 10); + this._date.setUTCSeconds(value); + this.actions.showPicker.call(this) + } + }, + doAction : function(e) { + e.stopPropagation(); + e.preventDefault(); + if (!this._date) + this._date = UTCDate(1970, 0, 0, 0, 0, 0, 0); + var action = $(e.currentTarget).data("action"); + var rv = this.actions[action].apply(this, arguments); + this.set(); + this.fillTime(); + this.notifyChange(); + return rv + }, + stopEvent : function(e) { + e.stopPropagation(); + e.preventDefault() + }, + keydown : function(e) { + var self = this, k = e.which, input = $(e.target); + if (k == 8 || k == 46) { + setTimeout(function() { + self._resetMaskPos(input) + }) + } + }, + keypress : function(e) { + var k = e.which; + if (k == 8 || k == 46) { + return + + } + var input = $(e.target); + var c = String.fromCharCode(k); + var val = input.val() || ""; + val += c; + var mask = this._mask[this._maskPos]; + if (!mask) { + return false + } + if (mask.end != val.length) { + return + + } + if (!mask.pattern.test(val.slice(mask.start))) { + val = val.slice(0, val.length - 1); + while ((mask = this._mask[this._maskPos]) && mask.character) { + val += mask.character; + this._maskPos++ + } + val += c; + if (mask.end != val.length) { + input.val(val); + return false + } else { + if (!mask.pattern.test(val.slice(mask.start))) { + input.val(val.slice(0, mask.start)); + return false + } else { + input.val(val); + this._maskPos++; + return false + } + } + } else { + this._maskPos++ + } + }, + change : function(e) { + var input = $(e.target); + var val = input.val(); + if (this._formatPattern.test(val)) { + this.update(); + this.setValue(this._date.getTime()); + this.notifyChange(); + this.set() + } else if (val && val.trim()) { + this.setValue(this._date.getTime()); + if (this._date) + this.set(); + else + input.val("") + } else { + if (this._date) { + this.setValue(null); + this.notifyChange(); + this._unset = true + } + } + this._resetMaskPos(input) + }, + showMode : function(dir) { + if (dir) { + this.viewMode = Math.max(this.minViewMode, Math.min(2, + this.viewMode + dir)) + } + this.widget.find(".datepicker > div").hide().filter( + ".datepicker-" + DPGlobal.modes[this.viewMode].clsName) + .show() + }, + destroy : function() { + this._detachDatePickerEvents(); + this._detachDatePickerGlobalEvents(); + this.widget.remove(); + this.$element.removeData("datetimepicker"); + this.component.removeData("datetimepicker") + }, + formatDate : function(d) { + return this.format.replace(formatReplacer, function(match) { + var methodName, property, rv, len = match.length; + if (match === "ms") + len = 1; + property = dateFormatComponents[match].property; + if (property === "Hours12") { + rv = d.getUTCHours(); + if (rv === 0) + rv = 12; + else if (rv !== 12) + rv = rv % 12 + } else if (property === "Period12") { + if (d.getUTCHours() >= 12) + return "PM"; + else + return "AM" + } else { + methodName = "get" + property; + rv = d[methodName]() + } + if (methodName === "getUTCMonth") + rv = rv + 1; + if (methodName === "getUTCYear") + rv = rv + 1900 - 2e3; + return padLeft(rv.toString(), len, "0") + }) + }, + parseDate : function(str) { + var match, i, property, methodName, value, parsed = {}; + if (!(match = this._formatPattern.exec(str))) + return null; + for (i = 1; i < match.length; i++) { + property = this._propertiesByIndex[i]; + if (!property) + continue; + value = match[i]; + if (/^\d+$/.test(value)) + value = parseInt(value, 10); + parsed[property] = value + } + return this._finishParsingDate(parsed) + }, + _resetMaskPos : function(input) { + var val = input.val(); + for ( var i = 0; i < this._mask.length; i++) { + if (this._mask[i].end > val.length) { + this._maskPos = i; + break + } else if (this._mask[i].end === val.length) { + this._maskPos = i + 1; + break + } + } + }, + _finishParsingDate : function(parsed) { + var year, month, date, hours, minutes, seconds, milliseconds; + year = parsed.UTCFullYear; + if (parsed.UTCYear) + year = 2e3 + parsed.UTCYear; + if (!year) + year = 1970; + if (parsed.UTCMonth) + month = parsed.UTCMonth - 1; + else + month = 0; + date = parsed.UTCDate || 1; + hours = parsed.UTCHours || 0; + minutes = parsed.UTCMinutes || 0; + seconds = parsed.UTCSeconds || 0; + milliseconds = parsed.UTCMilliseconds || 0; + if (parsed.Hours12) { + hours = parsed.Hours12 + } + if (parsed.Period12) { + if (/pm/i.test(parsed.Period12)) { + if (hours != 12) + hours = (hours + 12) % 24 + } else { + hours = hours % 12 + } + } + return UTCDate(year, month, date, hours, minutes, seconds, + milliseconds) + }, + _compileFormat : function() { + var match, component, components = [], mask = [], str = this.format, propertiesByIndex = {}, i = 0, pos = 0; + while (match = formatComponent.exec(str)) { + component = match[0]; + if (component in dateFormatComponents) { + i++; + propertiesByIndex[i] = dateFormatComponents[component].property; + components.push("\\s*" + + dateFormatComponents[component].getPattern(this) + + "\\s*"); + mask.push({ + pattern : new RegExp(dateFormatComponents[component] + .getPattern(this)), + property : dateFormatComponents[component].property, + start : pos, + end : pos += component.length + }) + } else { + components.push(escapeRegExp(component)); + mask.push({ + pattern : new RegExp(escapeRegExp(component)), + character : component, + start : pos, + end : ++pos + }) + } + str = str.slice(component.length) + } + this._mask = mask; + this._maskPos = 0; + this._formatPattern = new RegExp("^\\s*" + components.join("") + + "\\s*$"); + this._propertiesByIndex = propertiesByIndex + }, + _attachDatePickerEvents : function() { + var self = this; + this.widget.on("click", ".datepicker *", $.proxy(this.click, this)); + this.widget.on("click", "[data-action]", $.proxy(this.doAction, + this)); + this.widget.on("mousedown", $.proxy(this.stopEvent, this)); + if (this.pickDate && this.pickTime) { + this.widget.on("click.togglePicker", ".accordion-toggle", + function(e) { + e.stopPropagation(); + var $this = $(this); + var $parent = $this.closest("ul"); + var expanded = $parent.find(".collapse.in"); + var closed = $parent.find(".collapse:not(.in)"); + if (expanded && expanded.length) { + var collapseData = expanded.data("collapse"); + if (collapseData && collapseData.transitioning) + return; + expanded.collapse("hide"); + closed.collapse("show"); + $this.find("i").toggleClass( + self.timeIcon + " " + self.dateIcon); + self.$element.find(".add-on i").toggleClass( + self.timeIcon + " " + self.dateIcon) + } + }) + } + if (this.isInput) { + this.$element.on({ + focus : $.proxy(this.show, this), + change : $.proxy(this.change, this) + }); + if (this.options.maskInput) { + this.$element.on({ + keydown : $.proxy(this.keydown, this), + keypress : $.proxy(this.keypress, this) + }) + } + } else { + this.$element.on({ + change : $.proxy(this.change, this) + }, "input"); + if (this.options.maskInput) { + this.$element.on({ + keydown : $.proxy(this.keydown, this), + keypress : $.proxy(this.keypress, this) + }, "input") + } + if (this.component) { + this.component.on("click", $.proxy(this.show, this)) + } else { + this.$element.on("click", $.proxy(this.show, this)) + } + } + }, + _attachDatePickerGlobalEvents : function() { + $(window).on("resize.datetimepicker" + this.id, + $.proxy(this.place, this)); + if (!this.isInput) { + $(document).on("mousedown.datetimepicker" + this.id, + $.proxy(this.hide, this)) + } + }, + _detachDatePickerEvents : function() { + this.widget.off("click", ".datepicker *", this.click); + this.widget.off("click", "[data-action]"); + this.widget.off("mousedown", this.stopEvent); + if (this.pickDate && this.pickTime) { + this.widget.off("click.togglePicker") + } + if (this.isInput) { + this.$element.off({ + focus : this.show, + change : this.change + }); + if (this.options.maskInput) { + this.$element.off({ + keydown : this.keydown, + keypress : this.keypress + }) + } + } else { + this.$element.off({ + change : this.change + }, "input"); + if (this.options.maskInput) { + this.$element.off({ + keydown : this.keydown, + keypress : this.keypress + }, "input") + } + if (this.component) { + this.component.off("click", this.show) + } else { + this.$element.off("click", this.show) + } + } + }, + _detachDatePickerGlobalEvents : function() { + $(window).off("resize.datetimepicker" + this.id); + if (!this.isInput) { + $(document).off("mousedown.datetimepicker" + this.id) + } + } + }; + $.fn.datetimepicker = function(option, val) { + return this + .each(function() { + var $this = $(this), data = $this.data("datetimepicker"), options = typeof option === "object" + && option; + if (!data) { + $this + .data( + "datetimepicker", + data = new DateTimePicker( + this, + $ + .extend( + {}, + $.fn.datetimepicker.defaults, + options))) + } + if (typeof option === "string") + data[option](val) + }) + }; + $.fn.datetimepicker.defaults = { + maskInput : false, + pickDate : true, + pickTime : true, + pick12HourFormat : false, + pickSeconds : true, + startDate : -Infinity, + endDate : Infinity + }; + $.fn.datetimepicker.Constructor = DateTimePicker; + var dpgId = 0; + var dates = $.fn.datetimepicker.dates = { + en : { + days : [ "Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", + "Friday", "Saturday", "Sunday" ], + daysShort : [ "Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat", + "Sun" ], + daysMin : [ "Su", "Mo", "Tu", "We", "Th", "Fr", "Sa", "Su" ], + months : [ "January", "February", "March", "April", "May", "June", + "July", "August", "September", "October", "November", + "December" ], + monthsShort : [ "Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", + "Aug", "Sep", "Oct", "Nov", "Dec" ] + } + }; + var dateFormatComponents = { + dd : { + property : "UTCDate", + getPattern : function() { + return "(0?[1-9]|[1-2][0-9]|3[0-1])\\b" + } + }, + MM : { + property : "UTCMonth", + getPattern : function() { + return "(0?[1-9]|1[0-2])\\b" + } + }, + yy : { + property : "UTCYear", + getPattern : function() { + return "(\\d{2})\\b" + } + }, + yyyy : { + property : "UTCFullYear", + getPattern : function() { + return "(\\d{4})\\b" + } + }, + hh : { + property : "UTCHours", + getPattern : function() { + return "(0?[0-9]|1[0-9]|2[0-3])\\b" + } + }, + mm : { + property : "UTCMinutes", + getPattern : function() { + return "(0?[0-9]|[1-5][0-9])\\b" + } + }, + ss : { + property : "UTCSeconds", + getPattern : function() { + return "(0?[0-9]|[1-5][0-9])\\b" + } + }, + ms : { + property : "UTCMilliseconds", + getPattern : function() { + return "([0-9]{1,3})\\b" + } + }, + HH : { + property : "Hours12", + getPattern : function() { + return "(0?[1-9]|1[0-2])\\b" + } + }, + PP : { + property : "Period12", + getPattern : function() { + return "(AM|PM|am|pm|Am|aM|Pm|pM)\\b" + } + } + }; + var keys = []; + for ( var k in dateFormatComponents) + keys.push(k); + keys[keys.length - 1] += "\\b"; + keys.push("."); + var formatComponent = new RegExp(keys.join("\\b|")); + keys.pop(); + var formatReplacer = new RegExp(keys.join("\\b|"), "g"); + function escapeRegExp(str) { + return str.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, "\\$&") + } + function padLeft(s, l, c) { + if (l < s.length) + return s; + else + return Array(l - s.length + 1).join(c || " ") + s + } + function getTemplate(timeIcon, pickDate, pickTime, is12Hours, showSeconds) { + if (pickDate && pickTime) { + return '
' + + "
    " + + '
  • ' + + '
    ' + + DPGlobal.template + + "
    " + + "
    • " + + '
    • ' + + '
  • ' + + '
    ' + + TPGlobal.getTemplate(is12Hours, showSeconds) + + "
    " + + "
    • " + "
" + "
" + } else if (pickTime) { + return '
' + + '
' + + TPGlobal.getTemplate(is12Hours, showSeconds) + + "
" + + "
" + } else { + return '
' + + '
' + + DPGlobal.template + + "
" + + "
" + } + } + function UTCDate() { + return new Date(Date.UTC.apply(Date, arguments)) + } + var DPGlobal = { + modes : [ { + clsName : "days", + navFnc : "UTCMonth", + navStep : 1 + }, { + clsName : "months", + navFnc : "UTCFullYear", + navStep : 1 + }, { + clsName : "years", + navFnc : "UTCFullYear", + navStep : 10 + } ], + isLeapYear : function(year) { + return year % 4 === 0 && year % 100 !== 0 || year % 400 === 0 + }, + getDaysInMonth : function(year, month) { + return [ 31, DPGlobal.isLeapYear(year) ? 29 : 28, 31, 30, 31, 30, + 31, 31, 30, 31, 30, 31 ][month] + }, + headTemplate : "" + "" + '‹' + + '' + + '›' + "" + "", + contTemplate : '' + }; + DPGlobal.template = '
' + + '' + DPGlobal.headTemplate + + "" + "
" + "
" + + '
' + + '' + DPGlobal.headTemplate + + DPGlobal.contTemplate + "
" + "
" + + '
' + + '' + DPGlobal.headTemplate + + DPGlobal.contTemplate + "
" + "
"; + var TPGlobal = { + hourTemplate : '', + minuteTemplate : '', + secondTemplate : '' + }; + TPGlobal.getTemplate = function(is12Hours, showSeconds) { + return '
' + + '" + + "" + + '' + + '' + + '' + + (showSeconds ? '' + + '' + : "") + + (is12Hours ? '' : "") + + "" + + "" + + " " + + '' + + " " + + (showSeconds ? '' + "" : "") + + (is12Hours ? '' + + "" + : "") + + "" + + "" + + '' + + '' + + '' + + (showSeconds ? '' + + '' + : "") + + (is12Hours ? '' : "") + + "" + + "
" + + TPGlobal.hourTemplate + + ":" + + TPGlobal.minuteTemplate + + ":" + + TPGlobal.secondTemplate + "" + + '' + + "
" + + "
" + + '
' + + '' + + "
" + + "
" + + '
' + + '' + + "
" + + "
" + + (showSeconds ? '
' + + '' + + "
" + + "
" + : "") + } +})(window.jQuery); \ No newline at end of file diff --git a/examples/widgetapp/assets/bootstrap-formhelpers-countries-en-US.js b/examples/widgetapp/assets/bootstrap-formhelpers-countries-en-US.js new file mode 100644 index 00000000..6f9133e8 --- /dev/null +++ b/examples/widgetapp/assets/bootstrap-formhelpers-countries-en-US.js @@ -0,0 +1,261 @@ +/* ========================================================== + * bootstrap-formhelpers-countries.en_US.js + * https://github.com/vlamanna/BootstrapFormHelpers + * ========================================================== + * Copyright 2012 Vincent Lamanna + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + * ========================================================== */ + + var BFHCountriesList = { + 'AF': 'Afghanistan', + 'AL': 'Albania', + 'DZ': 'Algeria', + 'AS': 'American Samoa', + 'AD': 'Andorra', + 'AO': 'Angola', + 'AI': 'Anguilla', + 'AQ': 'Antarctica' , + 'AG': 'Antigua and Barbuda' , + 'AR': 'Argentina' , + 'AM': 'Armenia' , + 'AW': 'Aruba' , + 'AU': 'Australia' , + 'AT': 'Austria' , + 'AZ': 'Azerbaijan' , + 'BH': 'Bahrain' , + 'BD': 'Bangladesh', + 'BB': 'Barbados' , + 'BY': 'Belarus', + 'BE': 'Belgium', + 'BZ': 'Belize', + 'BJ': 'Benin', + 'BM': 'Bermuda', + 'BT': 'Bhutan', + 'BO': 'Bolivia', + 'BA': 'Bosnia and Herzegovina', + 'BW': 'Botswana', + 'BV': 'Bouvet Island', + 'BR': 'Brazil', + 'IO': 'British Indian Ocean Territory', + 'VG': 'British Virgin Islands', + 'BN': 'Brunei', + 'BG': 'Bulgaria', + 'BF': 'Burkina Faso', + 'BI': 'Burundi', + 'CI': 'Côte d\'Ivoire', + 'KH': 'Cambodia', + 'CM': 'Cameroon', + 'CA': 'Canada', + 'CV': 'Cape Verde', + 'KY': 'Cayman Islands', + 'CF': 'Central African Republic', + 'TD': 'Chad', + 'CL': 'Chile', + 'CN': 'China', + 'CX': 'Christmas Island', + 'CC': 'Cocos (Keeling) Islands', + 'CO': 'Colombia', + 'KM': 'Comoros', + 'CG': 'Congo', + 'CK': 'Cook Islands', + 'CR': 'Costa Rica', + 'HR': 'Croatia', + 'CU': 'Cuba', + 'CY': 'Cyprus', + 'CZ': 'Czech Republic', + 'CD': 'Democratic Republic of the Congo', + 'DK': 'Denmark', + 'DJ': 'Djibouti', + 'DM': 'Dominica', + 'DO': 'Dominican Republic', + 'TP': 'East Timor', + 'EC': 'Ecuador', + 'EG': 'Egypt', + 'SV': 'El Salvador', + 'GQ': 'Equatorial Guinea', + 'ER': 'Eritrea', + 'EE': 'Estonia', + 'ET': 'Ethiopia', + 'FO': 'Faeroe Islands', + 'FK': 'Falkland Islands', + 'FJ': 'Fiji', + 'FI': 'Finland', + 'MK': 'Former Yugoslav Republic of Macedonia', + 'FR': 'France', + 'FX': 'France, Metropolitan', + 'GF': 'French Guiana', + 'PF': 'French Polynesia', + 'TF': 'French Southern Territories', + 'GA': 'Gabon', + 'GE': 'Georgia', + 'DE': 'Germany', + 'GH': 'Ghana', + 'GI': 'Gibraltar', + 'GR': 'Greece', + 'GL': 'Greenland', + 'GD': 'Grenada', + 'GP': 'Guadeloupe', + 'GU': 'Guam', + 'GT': 'Guatemala', + 'GN': 'Guinea', + 'GW': 'Guinea-Bissau', + 'GY': 'Guyana', + 'HT': 'Haiti', + 'HM': 'Heard and Mc Donald Islands', + 'HN': 'Honduras', + 'HK': 'Hong Kong', + 'HU': 'Hungary', + 'IS': 'Iceland', + 'IN': 'India', + 'ID': 'Indonesia', + 'IR': 'Iran', + 'IQ': 'Iraq', + 'IE': 'Ireland', + 'IL': 'Israel', + 'IT': 'Italy', + 'JM': 'Jamaica', + 'JP': 'Japan', + 'JO': 'Jordan', + 'KZ': 'Kazakhstan', + 'KE': 'Kenya', + 'KI': 'Kiribati', + 'KW': 'Kuwait', + 'KG': 'Kyrgyzstan', + 'LA': 'Laos', + 'LV': 'Latvia', + 'LB': 'Lebanon', + 'LS': 'Lesotho', + 'LR': 'Liberia', + 'LY': 'Libya', + 'LI': 'Liechtenstein', + 'LT': 'Lithuania', + 'LU': 'Luxembourg', + 'MO': 'Macau', + 'MG': 'Madagascar', + 'MW': 'Malawi', + 'MY': 'Malaysia', + 'MV': 'Maldives', + 'ML': 'Mali', + 'MT': 'Malta', + 'MH': 'Marshall Islands', + 'MQ': 'Martinique', + 'MR': 'Mauritania', + 'MU': 'Mauritius', + 'MT': 'Mayotte', + 'MX': 'Mexico', + 'FM': 'Micronesia', + 'MD': 'Moldova', + 'MC': 'Monaco', + 'MN': 'Mongolia', + 'ME': 'Montenegro', + 'MS': 'Montserrat', + 'MA': 'Morocco', + 'MZ': 'Mozambique', + 'MM': 'Myanmar', + 'NA': 'Namibia', + 'NR': 'Nauru', + 'NP': 'Nepal', + 'NL': 'Netherlands', + 'AN': 'Netherlands Antilles', + 'NC': 'New Caledonia', + 'NZ': 'New Zealand', + 'NI': 'Nicaragua', + 'NE': 'Niger', + 'NG': 'Nigeria', + 'NU': 'Niue', + 'NF': 'Norfolk Island', + 'KP': 'North Korea', + 'MP': 'Northern Marianas', + 'NO': 'Norway', + 'OM': 'Oman', + 'PK': 'Pakistan', + 'PW': 'Palau', + 'PA': 'Panama', + 'PG': 'Papua New Guinea', + 'PY': 'Paraguay', + 'PE': 'Peru', + 'PH': 'Philippines', + 'PN': 'Pitcairn Islands', + 'PL': 'Poland', + 'PT': 'Portugal', + 'PR': 'Puerto Rico', + 'QA': 'Qatar', + 'RE': 'Reunion', + 'RO': 'Romania', + 'RU': 'Russia', + 'RW': 'Rwanda', + 'ST': 'São Tomé and Príncipe', + 'SH': 'Saint Helena', + 'PM': 'St. Pierre and Miquelon', + 'KN': 'Saint Kitts and Nevis', + 'LC': 'Saint Lucia', + 'VC': 'Saint Vincent and the Grenadines', + 'WS': 'Samoa', + 'SM': 'San Marino', + 'SA': 'Saudi Arabia', + 'SN': 'Senegal', + 'RS': 'Serbia', + 'SC': 'Seychelles', + 'SL': 'Sierra Leone', + 'SG': 'Singapore', + 'SK': 'Slovakia', + 'SI': 'Slovenia', + 'SB': 'Solomon Islands', + 'SO': 'Somalia', + 'ZA': 'South Africa', + 'GS': 'South Georgia and the South Sandwich Islands', + 'KR': 'South Korea', + 'ES': 'Spain', + 'LK': 'Sri Lanka', + 'SD': 'Sudan', + 'SR': 'Suriname', + 'SJ': 'Svalbard and Jan Mayen Islands', + 'SZ': 'Swaziland', + 'SE': 'Sweden', + 'CH': 'Switzerland', + 'SY': 'Syria', + 'TW': 'Taiwan', + 'TJ': 'Tajikistan', + 'TZ': 'Tanzania', + 'TH': 'Thailand', + 'BS': 'The Bahamas', + 'GM': 'The Gambia', + 'TG': 'Togo', + 'TK': 'Tokelau', + 'TO': 'Tonga', + 'TT': 'Trinidad and Tobago', + 'TN': 'Tunisia', + 'TR': 'Turkey', + 'TM': 'Turkmenistan', + 'TC': 'Turks and Caicos Islands', + 'TV': 'Tuvalu', + 'VI': 'US Virgin Islands', + 'UG': 'Uganda', + 'UA': 'Ukraine', + 'AE': 'United Arab Emirates', + 'GB': 'United Kingdom', + 'US': 'United States', + 'UM': 'United States Minor Outlying Islands', + 'UY': 'Uruguay', + 'UZ': 'Uzbekistan', + 'VU': 'Vanuatu', + 'VA': 'Vatican City', + 'VE': 'Venezuela', + 'VN': 'Vietnam', + 'WF': 'Wallis and Futuna Islands', + 'EH': 'Western Sahara', + 'YE': 'Yemen', + 'ZM': 'Zambia', + 'ZW': 'Zimbabwe' + } \ No newline at end of file diff --git a/examples/widgetapp/assets/bootstrap-formhelpers-countries.js b/examples/widgetapp/assets/bootstrap-formhelpers-countries.js new file mode 100644 index 00000000..e094fc7c --- /dev/null +++ b/examples/widgetapp/assets/bootstrap-formhelpers-countries.js @@ -0,0 +1,155 @@ +/* ========================================================== + * bootstrap-formhelpers-countries.js + * https://github.com/vlamanna/BootstrapFormHelpers + * ========================================================== + * Copyright 2012 Vincent Lamanna + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + * ========================================================== */ + + !function ($) { + + "use strict"; // jshint ;_; + + + /* COUNTRIES CLASS DEFINITION + * ====================== */ + + var BFHCountries = function (element, options) { + this.options = $.extend({}, $.fn.bfhcountries.defaults, options) + this.$element = $(element) + + if (this.options.countrylist) { + this.countryList = [] + this.options.countrylist = this.options.countrylist.split(',') + for (var country in BFHCountriesList) { + if ($.inArray(country, this.options.countrylist) >= 0) { + this.countryList[country] = BFHCountriesList[country] + } + } + } else { + this.countryList = BFHCountriesList + } + + if (this.$element.is("select")) { + this.addCountries() + } + + if (this.$element.is("span")) { + this.displayCountry() + } + + if (this.$element.hasClass("bfh-selectbox")) { + this.addBootstrapCountries() + } + } + + BFHCountries.prototype = { + + constructor: BFHCountries + + , addCountries: function () { + var value = this.options.country + + this.$element.html('') + this.$element.append('') + for (var country in this.countryList) { + this.$element.append('') + } + + this.$element.val(value) + } + + , addBootstrapCountries: function() { + var $input + , $toggle + , $options + + var value = this.options.country + + $input = this.$element.find('input[type="hidden"]') + $toggle = this.$element.find('.bfh-selectbox-option') + $options = this.$element.find('[role=option]') + + $options.html('') + $options.append('
    • ') + for (var country in this.countryList) { + if (this.options.flags == true) { + $options.append('
  • ' + this.countryList[country] + '
    • ') + } else { + $options.append('
  • ' + this.countryList[country] + '
    • ') + } + } + + $toggle.data('option', value) + + if (value) { + if (this.options.flags == true) { + $toggle.html(' ' + this.countryList[value]) + } else { + $toggle.html(this.countryList[value]) + } + } + + $input.val(value) + } + + , displayCountry: function () { + var value = this.options.country + + if (this.options.flags == true) { + this.$element.html(' ' + this.countryList[value]) + } else { + this.$element.html(this.countryList[value]) + } + } + + } + + + /* COUNTRY PLUGIN DEFINITION + * ======================= */ + + $.fn.bfhcountries = function (option) { + return this.each(function () { + var $this = $(this) + , data = $this.data('bfhcountries') + , options = typeof option == 'object' && option + + if (!data) $this.data('bfhcountries', (data = new BFHCountries(this, options))) + if (typeof option == 'string') data[option]() + }) + } + + $.fn.bfhcountries.Constructor = BFHCountries + + $.fn.bfhcountries.defaults = { + country: "", + countryList: "", + flags: false + } + + + /* COUNTRY DATA-API + * ============== */ + + $(window).on('load', function () { + $('form select.bfh-countries, span.bfh-countries, div.bfh-countries').each(function () { + var $countries = $(this) + + $countries.bfhcountries($countries.data()) + }) + }) + + +}(window.jQuery); diff --git a/examples/widgetapp/assets/bootstrap-formhelpers-selectbox.js b/examples/widgetapp/assets/bootstrap-formhelpers-selectbox.js new file mode 100644 index 00000000..f59f2d45 --- /dev/null +++ b/examples/widgetapp/assets/bootstrap-formhelpers-selectbox.js @@ -0,0 +1,244 @@ +/* ========================================================== + * bootstrap-formhelpers-selectbox.js + * https://github.com/vlamanna/BootstrapFormHelpers + * ========================================================== + * Copyright 2012 Vincent Lamanna + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + * ========================================================== */ + + +!function ($) { + + "use strict"; // jshint ;_; + + + /* SELECTBOX CLASS DEFINITION + * ========================= */ + + var toggle = '[data-toggle=bfh-selectbox]' + , BFHSelectBox = function (element) { + } + + BFHSelectBox.prototype = { + + constructor: BFHSelectBox + + , toggle: function (e) { + var $this = $(this) + , $parent + , isActive + + if ($this.is('.disabled, :disabled')) return false + + $parent = getParent($this) + + isActive = $parent.hasClass('open') + + clearMenus() + + if (!isActive) { + $parent.toggleClass('open') + + $parent.find('[role=option] > li > [data-option="' + $this.find('.bfh-selectbox-option').data('option') + '"]').focus() + } + + return false + } + + , filter: function(e) { + var $this + , $parent + , $items + + $this = $(this) + + $parent = $this.closest('.bfh-selectbox') + + $items = $('[role=option] li a', $parent) + + $items.hide() + + $items.filter(function() { return ($(this).text().toUpperCase().indexOf($this.val().toUpperCase()) != -1) }).show() + } + + , keydown: function (e) { + var $this + , $items + , $active + , $parent + , isActive + , index + + if (!/(38|40|27)/.test(e.keyCode) && !/[A-z]/.test(String.fromCharCode(e.which))) return + + $this = $(this) + + e.preventDefault() + e.stopPropagation() + + if ($this.is('.disabled, :disabled')) return false + + $parent = $this.closest('.bfh-selectbox') + + isActive = $parent.hasClass('open') + + if (!isActive || (isActive && e.keyCode == 27)) return $this.click() + + $items = $('[role=option] li a', $parent).filter(':visible') + + if (!$items.length) return + + $('body').off('mouseenter.bfh-selectbox.data-api', '[role=option] > li > a', BFHSelectBox.prototype.mouseenter) + + index = $items.index($items.filter(':focus')) + + if (e.keyCode == 38 && index > 0) index-- // up + if (e.keyCode == 40 && index < $items.length - 1) index++ // down + if (/[A-z]/.test(String.fromCharCode(e.which))) { + var $subItems = $items.filter(function() { return ($(this).text().charAt(0).toUpperCase() == String.fromCharCode(e.which)) }) + var selectedIndex = $subItems.index($subItems.filter(':focus')) + if (!~selectedIndex) index = $items.index($subItems) + else if (selectedIndex >= $subItems.length - 1) index = $items.index($subItems) + else index++ + } + if (!~index) index = 0 + + $items + .eq(index) + .focus() + + $('body').on('mouseenter.bfh-selectbox.data-api', '[role=option] > li > a', BFHSelectBox.prototype.mouseenter) + } + + , mouseenter: function (e) { + var $this + + $this = $(this) + + if ($this.is('.disabled, :disabled')) return false + + $this.focus() + } + + , select: function (e) { + var $this + , $parent + , $toggle + , $input + + $this = $(this) + + e.preventDefault() + e.stopPropagation() + + if ($this.is('.disabled, :disabled')) return false + + $parent = $this.closest('.bfh-selectbox') + $toggle = $parent.find('.bfh-selectbox-option') + $input = $parent.find('input[type="hidden"]') + + $toggle.data('option', $this.data('option')) + $toggle.html($this.html()) + + $input.removeData() + $input.val($this.data('option')) + $.each($this.data(), function(i,e) { + $input.data(i,e); + }); + $input.change() + + clearMenus() + } + + } + + function clearMenus() { + getParent($(toggle)) + .removeClass('open') + } + + function getParent($this) { + var selector = $this.attr('data-target') + , $parent + + if (!selector) { + selector = $this.attr('href') + selector = selector && /#/.test(selector) && selector.replace(/.*(?=#[^\s]*$)/, '') //strip for ie7 + } + + $parent = $(selector) + $parent.length || ($parent = $this.parent()) + + return $parent + } + + + /* SELECTBOX PLUGIN DEFINITION + * ========================== */ + + $.fn.bfhselectbox = function (option) { + return this.each(function () { + var $this = $(this) + , data = $this.data('bfhselectbox') + this.type = 'bfhselectbox'; + if (!data) $this.data('bfhselectbox', (data = new BFHSelectBox(this))) + if (typeof option == 'string') data[option].call($this) + }) + } + + $.fn.bfhselectbox.Constructor = BFHSelectBox + + var origHook + // There might already be valhooks for the "text" type + if ($.valHooks.div){ + // Preserve the original valhook function + origHook = $.valHooks.div + } + $.valHooks.div = { + get: function(el) { + if($(el).hasClass("bfh-selectbox")){ + return $(el).find('input[type="hidden"]').val() + }else if (origHook){ + return origHook.get(el) + } + }, + set: function(el, val) { + if($(el).hasClass("bfh-selectbox")){ + var $el = $(el) + , text = $el.find("li a[data-option='"+val+"']").text() + $el.find('input[type="hidden"]').val(val) + + $el.find('.bfh-selectbox-option').text(text) + }else if (origHook){ + return origHook.set(el,val) + } + } + } + + /* APPLY TO STANDARD SELECTBOX ELEMENTS + * =================================== */ + + $(function () { + $('html') + .on('click.bfhselectbox.data-api', clearMenus) + $('body') + .on('click.bfhselectbox.data-api touchstart.bfhselectbox.data-api' , toggle, BFHSelectBox.prototype.toggle) + .on('keydown.bfhselectbox.data-api', toggle + ', [role=option]' , BFHSelectBox.prototype.keydown) + .on('mouseenter.bfhselectbox.data-api', '[role=option] > li > a', BFHSelectBox.prototype.mouseenter) + .on('click.bfhselectbox.data-api', '[role=option] > li > a', BFHSelectBox.prototype.select) + .on('click.bfhselectbox.data-api', '.bfh-selectbox-filter', function (e) { return false }) + .on('propertychange.bfhselectbox.data-api change.bfhselectbox.data-api input.bfhselectbox.data-api paste.bfhselectbox.data-api', '.bfh-selectbox-filter', BFHSelectBox.prototype.filter) + }) + +}(window.jQuery); diff --git a/examples/widgetapp/assets/widget.coffee b/examples/widgetapp/assets/widget.coffee index 40d18030..0ad58f06 100644 --- a/examples/widgetapp/assets/widget.coffee +++ b/examples/widgetapp/assets/widget.coffee @@ -552,6 +552,23 @@ class WSF_AUTOCOMPLETE_CONTROL extends WSF_INPUT_CONTROL @$el.on 'typeahead:blured',()-> self.change() +class WSF_COUNTRY_CHOOSER_CONTROL extends WSF_INPUT_CONTROL + requirements: ['assets/bootstrap-formhelpers-countries.js', 'assets/bootstrap-formhelpers-countries-en-US.js', 'assets/bootstrap-formhelpers-selectbox.js'] + + +class WSF_DATETIME_PICKER_CONTROL extends WSF_INPUT_CONTROL + requirements: ['assets/bootstrap-datetimepicker.css', 'assets/bootstrap-datetimepicker.js'] + + attach_events: () -> + super + self = @ + console.log @$el + @$el.datetimepicker({ + language : 'en', + pick12HourFormat : false, + startDate : new Date() + }) + class WSF_CHECKBOX_CONTROL extends WSF_CONTROL attach_events: ()-> super diff --git a/examples/widgetapp/assets/widget.js b/examples/widgetapp/assets/widget.js index 9ee5396c..723694fd 100644 --- a/examples/widgetapp/assets/widget.js +++ b/examples/widgetapp/assets/widget.js @@ -1,1221 +1,1265 @@ // Generated by CoffeeScript 1.6.1 -var Mini, WSF_AUTOCOMPLETE_CONTROL, WSF_BUTTON_CONTROL, WSF_CHECKBOX_CONTROL, WSF_CHECKBOX_LIST_CONTROL, WSF_CODEVIEW_CONTROL, WSF_CONTROL, WSF_DROPDOWN_CONTROL, WSF_FILE_CONTROL, WSF_FORM_ELEMENT_CONTROL, WSF_GRID_CONTROL, WSF_HTML_CONTROL, WSF_INPUT_CONTROL, WSF_MAX_VALIDATOR, WSF_MIN_VALIDATOR, WSF_NAVLIST_ITEM_CONTROL, WSF_PAGE_CONTROL, WSF_PAGINATION_CONTROL, WSF_PASSWORD_CONTROL, WSF_PROGRESS_CONTROL, WSF_REGEXP_VALIDATOR, WSF_REPEATER_CONTROL, WSF_SLIDER_CONTROL, WSF_TEXTAREA_CONTROL, WSF_VALIDATOR, build_control, cache, controls, lazy_load, loaded, parseSuggestions, redirect, show_alert, start_modal, start_modal_big, template, tmpl, - __hasProp = {}.hasOwnProperty, - __extends = function(child, parent) { for (var key in parent) { if (__hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; }; +(function() { + var Mini, WSF_AUTOCOMPLETE_CONTROL, WSF_BUTTON_CONTROL, WSF_CHECKBOX_CONTROL, WSF_CHECKBOX_LIST_CONTROL, WSF_CODEVIEW_CONTROL, WSF_CONTROL, WSF_COUNTRY_CHOOSER_CONTROL, WSF_DATETIME_PICKER_CONTROL, WSF_DROPDOWN_CONTROL, WSF_FILE_CONTROL, WSF_FORM_ELEMENT_CONTROL, WSF_GRID_CONTROL, WSF_HTML_CONTROL, WSF_INPUT_CONTROL, WSF_MAX_VALIDATOR, WSF_MIN_VALIDATOR, WSF_NAVLIST_ITEM_CONTROL, WSF_PAGE_CONTROL, WSF_PAGINATION_CONTROL, WSF_PASSWORD_CONTROL, WSF_PROGRESS_CONTROL, WSF_REGEXP_VALIDATOR, WSF_REPEATER_CONTROL, WSF_SLIDER_CONTROL, WSF_TEXTAREA_CONTROL, WSF_VALIDATOR, build_control, cache, controls, lazy_load, loaded, parseSuggestions, redirect, show_alert, start_modal, start_modal_big, template, tmpl, + __hasProp = {}.hasOwnProperty, + __extends = function(child, parent) { for (var key in parent) { if (__hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; }; -cache = {}; + cache = {}; -jQuery.cachedAsset = function(url, options) { - var head, onload, script, success, successful, timeoutHandle; - if (/\.css$/.test(url)) { - $("", { - rel: "stylesheet", - type: "text/css", - href: url - }).appendTo("head"); - return { - done: function(fn) { - return fn(); - } - }; - } else { - success = []; - head = document.head || document.getElementsByTagName('head')[0] || document.documentElement; - script = document.createElement('script'); - script.async = 'async'; - script.src = url; - successful = false; - onload = function(_, aborted) { - var s, _i, _len; - if (aborted == null) { - aborted = false; - } - if (!(aborted || !script.readyState || script.readyState === 'complete')) { - return; - } - clearTimeout(timeoutHandle); - script.onload = script.onreadystatechange = script.onerror = null; - if (head && script.parentNode) { - head.removeChild(script); - } - script = void 0; - if (success && !aborted) { - successful = true; - for (_i = 0, _len = success.length; _i < _len; _i++) { - s = success[_i]; - s(); + jQuery.cachedAsset = function(url, options) { + var head, onload, script, success, successful, timeoutHandle; + if (/\.css$/.test(url)) { + $("", { + rel: "stylesheet", + type: "text/css", + href: url + }).appendTo("head"); + return { + done: function(fn) { + return fn(); } - return success = []; - } - }; - script.onload = script.onreadystatechange = onload; - script.onerror = function() { - return onload(null, true); - }; - timeoutHandle = setTimeout(script.onerror, 7500); - head.insertBefore(script, head.firstChild); - return { - done: function(fn) { - if (!successful) { - success.push(fn); - } else { - fn(); - } - } - }; - } -}; - -jQuery.unparam = function(value) { - var i, l, pair, params, pieces; - params = {}; - pieces = value.split("&"); - pair = void 0; - i = void 0; - l = void 0; - i = 0; - l = pieces.length; - while (i < l) { - pair = pieces[i].split("=", 2); - params[decodeURIComponent(pair[0])] = (pair.length === 2 ? decodeURIComponent(pair[1].replace(/\+/g, " ")) : true); - i++; - } - return params; -}; - -template = tmpl = function(str, data) { - var fn; - fn = (!/\W/.test(str) ? cache[str] = cache[str] || tmpl(str) : new Function("obj", "var p=[],print=function(){p.push.apply(p,arguments);};" + "with(obj){p.push('" + str.replace(/[\r\t\n]/g, " ").split("{{").join("\t").replace(/((^|}})[^\t]*)'/g, "$1\r").replace(/\t=(.*?)}}/g, "',$1,'").split("\t").join("');").split("}}").join("p.push('").split("\r").join("\\'") + "');}return p.join('');")); - if (data) { - return fn(data); - } else { - return fn; - } -}; - -Mini = { - compile: function(t) { - return { - render: template(t) - }; - } -}; - -parseSuggestions = function(data) { - var a, d; - for (a in data) { - if (a === 'suggestions') { - return data[a]; + }; } else { - d = parseSuggestions(data[a]); - if (d != null) { - return d; - } - } - } - return null; -}; - -loaded = {}; - -lazy_load = function(requirements, fn, that) { - if (requirements.length === 0) { - return function() { - var a; - a = arguments; - return fn.apply(that, a); - }; - } - if (that == null) { - that = window; - } - return function() { - var a, args, counter, done, r, self, _i, _len; - a = arguments; - if (typeof args === "undefined" || args === null) { - args = []; - } - counter = requirements.length + 1; - self = this; - done = function() { - counter = counter - 1; - if (counter === 0) { - fn.apply(that, a); - } - }; - for (_i = 0, _len = requirements.length; _i < _len; _i++) { - r = requirements[_i]; - if (loaded[r] == null) { - loaded[r] = $.cachedAsset(r); - } - loaded[r].done(done); - } - return done(); - }; -}; - -build_control = function(control_name, state, control) { - var $el, type, typeclass; - $el = control.$el.find('[data-name=' + control_name + ']').first(); - type = $el.data('type'); - typeclass = null; - try { - typeclass = eval(type); - } catch (e) { - typeclass = WSF_CONTROL; - } - if ((type != null) && (typeclass != null)) { - return new typeclass(control, $el, control_name, state); - } - return null; -}; - -WSF_VALIDATOR = (function() { - - function WSF_VALIDATOR(parent_control, settings) { - this.parent_control = parent_control; - this.settings = settings; - this.error = this.settings.error; - return; - } - - WSF_VALIDATOR.prototype.validate = function() { - return true; - }; - - return WSF_VALIDATOR; - -})(); - -WSF_REGEXP_VALIDATOR = (function(_super) { - - __extends(WSF_REGEXP_VALIDATOR, _super); - - function WSF_REGEXP_VALIDATOR() { - WSF_REGEXP_VALIDATOR.__super__.constructor.apply(this, arguments); - this.pattern = new RegExp(this.settings.expression, 'g'); - } - - WSF_REGEXP_VALIDATOR.prototype.validate = function() { - var res, val; - val = this.parent_control.value(); - res = val.match(this.pattern); - return res !== null; - }; - - return WSF_REGEXP_VALIDATOR; - -})(WSF_VALIDATOR); - -WSF_MIN_VALIDATOR = (function(_super) { - - __extends(WSF_MIN_VALIDATOR, _super); - - function WSF_MIN_VALIDATOR() { - return WSF_MIN_VALIDATOR.__super__.constructor.apply(this, arguments); - } - - WSF_MIN_VALIDATOR.prototype.validate = function() { - var val; - val = this.parent_control.value(); - return val.length >= this.settings.min; - }; - - return WSF_MIN_VALIDATOR; - -})(WSF_VALIDATOR); - -WSF_MAX_VALIDATOR = (function(_super) { - - __extends(WSF_MAX_VALIDATOR, _super); - - function WSF_MAX_VALIDATOR() { - return WSF_MAX_VALIDATOR.__super__.constructor.apply(this, arguments); - } - - WSF_MAX_VALIDATOR.prototype.validate = function() { - var val; - val = this.parent_control.value(); - return val.length <= this.settings.max; - }; - - return WSF_MAX_VALIDATOR; - -})(WSF_VALIDATOR); - -WSF_CONTROL = (function() { - - WSF_CONTROL.prototype.requirements = []; - - function WSF_CONTROL(parent_control, $el, control_name, fullstate) { - this.parent_control = parent_control; - this.$el = $el; - this.control_name = control_name; - this.fullstate = fullstate; - this.state = this.fullstate.state; - this.load_subcontrols(); - this.isolation = "" + this.$el.data('isolation') === "1"; - this.$el.data('control', this); - this.initialize = lazy_load(this.requirements, this.attach_events, this); - return; - } - - WSF_CONTROL.prototype.load_subcontrols = function() { - var control_name, state; - if (this.fullstate.controls != null) { - this.controls = (function() { - var _ref, _results; - _ref = this.fullstate.controls; - _results = []; - for (control_name in _ref) { - state = _ref[control_name]; - _results.push(build_control(control_name, state, this)); + success = []; + head = document.head || document.getElementsByTagName('head')[0] || document.documentElement; + script = document.createElement('script'); + script.async = 'async'; + script.src = url; + successful = false; + onload = function(_, aborted) { + var s, _i, _len; + if (aborted == null) { + aborted = false; } - return _results; - }).call(this); - } else { - this.controls = []; - } - }; - - WSF_CONTROL.prototype.attach_events = function() { - var control, _i, _len, _ref; - console.log("Attached " + this.control_name); - _ref = this.controls; - for (_i = 0, _len = _ref.length; _i < _len; _i++) { - control = _ref[_i]; - if (control != null) { - control.initialize(); - } - } - }; - - WSF_CONTROL.prototype.update = function(state) {}; - - WSF_CONTROL.prototype.process_actions = function(actions) { - var action, fn, _i, _len; - for (_i = 0, _len = actions.length; _i < _len; _i++) { - action = actions[_i]; - try { - fn = null; - if (this[action.type] != null) { - fn = this[action.type]; - fn.call(this, action); - } else { - fn = eval(action.type); - fn(action); + if (!(aborted || !script.readyState || script.readyState === 'complete')) { + return; } - } catch (e) { - console.log("Failed preforming action " + action.type); - } - } - }; - - WSF_CONTROL.prototype.process_update = function(new_states) { - var control, _i, _len, _ref; - try { - if (new_states.actions != null) { - this.process_actions(new_states.actions); - } - if (new_states[this.control_name] != null) { - this.update(new_states[this.control_name]); - _ref = this.controls; - for (_i = 0, _len = _ref.length; _i < _len; _i++) { - control = _ref[_i]; - if (control != null) { - control.process_update(new_states[this.control_name]['controls']); + clearTimeout(timeoutHandle); + script.onload = script.onreadystatechange = script.onerror = null; + if (head && script.parentNode) { + head.removeChild(script); + } + script = void 0; + if (success && !aborted) { + successful = true; + for (_i = 0, _len = success.length; _i < _len; _i++) { + s = success[_i]; + s(); + } + return success = []; + } + }; + script.onload = script.onreadystatechange = onload; + script.onerror = function() { + return onload(null, true); + }; + timeoutHandle = setTimeout(script.onerror, 7500); + head.insertBefore(script, head.firstChild); + return { + done: function(fn) { + if (!successful) { + success.push(fn); + } else { + fn(); } } - } - } catch (e) { - return; + }; } }; - WSF_CONTROL.prototype.get_context_state = function() { - if ((this.parent_control != null) && !this.isolation) { - return this.parent_control.get_context_state(); + jQuery.unparam = function(value) { + var i, l, pair, params, pieces; + params = {}; + pieces = value.split("&"); + pair = void 0; + i = void 0; + l = void 0; + i = 0; + l = pieces.length; + while (i < l) { + pair = pieces[i].split("=", 2); + params[decodeURIComponent(pair[0])] = (pair.length === 2 ? decodeURIComponent(pair[1].replace(/\+/g, " ")) : true); + i++; } - return this.wrap(this.control_name, this.fullstate); + return params; }; - WSF_CONTROL.prototype.get_full_control_name = function() { - var val; - if (this.parent_control != null) { - val = this.parent_control.get_full_control_name(); - if (val !== "") { - val = val + "-"; - } - return val + this.control_name; - } - return this.control_name; - }; - - WSF_CONTROL.prototype.wrap = function(cname, state) { - var ctrs; - ctrs = {}; - ctrs[cname] = state; - state = { - "controls": ctrs - }; - if (this.parent_control != null) { - return this.parent_control.wrap(this.parent_control.control_name, state); - } - return state; - }; - - WSF_CONTROL.prototype.callback_url = function(params) { - if (this.parent_control != null) { - return this.parent_control.callback_url(params); - } - $.extend(params, this.url_params); - return this.url + '?' + $.param(params); - }; - - WSF_CONTROL.prototype.trigger_callback = function(control_name, event, event_parameter) { - return this.run_trigger_callback(this.get_full_control_name(), event, event_parameter); - }; - - WSF_CONTROL.prototype.get_page = function() { - if (this.parent_control != null) { - return this.parent_control.get_page(); - } - return this; - }; - - WSF_CONTROL.prototype.run_trigger_callback = function(control_name, event, event_parameter) { - var self; - if ((this.parent_control != null) && !this.isolation) { - return this.parent_control.run_trigger_callback(control_name, event, event_parameter); - } - self = this; - return $.ajax({ - type: 'POST', - url: this.callback_url({ - control_name: control_name, - event: event, - event_parameter: event_parameter - }), - data: JSON.stringify(this.get_context_state()), - processData: false, - contentType: 'application/json', - cache: false - }).done(function(new_states) { - return self.get_page().process_update(new_states); - }); - }; - - WSF_CONTROL.prototype.on = function(name, callback, context) { - if (this._events == null) { - this._events = {}; - } - if (this._events[name] == null) { - this._events[name] = []; - } - this._events[name].push({ - callback: callback, - context: context - }); - return this; - }; - - WSF_CONTROL.prototype.trigger = function(name) { - var ev, _i, _len, _ref, _ref1; - if (((_ref = this._events) != null ? _ref[name] : void 0) == null) { - return this; - } - _ref1 = this._events[name]; - for (_i = 0, _len = _ref1.length; _i < _len; _i++) { - ev = _ref1[_i]; - ev.callback.call(ev.context); - } - return this; - }; - - WSF_CONTROL.prototype.remove = function() { - console.log("Removed " + this.control_name); - return this.$el.remove(); - }; - - return WSF_CONTROL; - -})(); - -WSF_PAGE_CONTROL = (function(_super) { - - __extends(WSF_PAGE_CONTROL, _super); - - function WSF_PAGE_CONTROL(fullstate) { - this.fullstate = fullstate; - this.state = this.fullstate.state; - this.parent_control = null; - this.$el = $('[data-name=' + this.state.id + ']'); - this.control_name = this.state.id; - this.url = this.state['url']; - this.url_params = jQuery.unparam(this.state['url_params']); - this.$el.data('control', this); - this.initialize = lazy_load(this.requirements, this.attach_events, this); - this.load_subcontrols(); - } - - WSF_PAGE_CONTROL.prototype.process_update = function(new_states) { - var control, _i, _len, _ref; - _ref = this.controls; - for (_i = 0, _len = _ref.length; _i < _len; _i++) { - control = _ref[_i]; - if (control != null) { - control.process_update(new_states); - } - } - }; - - WSF_PAGE_CONTROL.prototype.get_full_control_name = function() { - return ""; - }; - - WSF_PAGE_CONTROL.prototype.wrap = function(cname, state) { - return state; - }; - - WSF_PAGE_CONTROL.prototype.remove = function() { - console.log("Removed " + this.control_name); - return this.$el.remove(); - }; - - return WSF_PAGE_CONTROL; - -})(WSF_CONTROL); - -WSF_SLIDER_CONTROL = (function(_super) { - - __extends(WSF_SLIDER_CONTROL, _super); - - function WSF_SLIDER_CONTROL() { - return WSF_SLIDER_CONTROL.__super__.constructor.apply(this, arguments); - } - - WSF_SLIDER_CONTROL.prototype.requirements = ['/assets/bootstrap.min.js']; - - WSF_SLIDER_CONTROL.prototype.attach_events = function() { - var id; - WSF_SLIDER_CONTROL.__super__.attach_events.apply(this, arguments); - id = "slider" + Math.round(Math.random() * 10000); - this.$el.attr("id", id); - this.$el.find("ol li").attr("data-target", "#" + id); - return this.$el.find(".carousel-control").attr("href", "#" + id); - }; - - return WSF_SLIDER_CONTROL; - -})(WSF_CONTROL); - -WSF_DROPDOWN_CONTROL = (function(_super) { - - __extends(WSF_DROPDOWN_CONTROL, _super); - - function WSF_DROPDOWN_CONTROL() { - return WSF_DROPDOWN_CONTROL.__super__.constructor.apply(this, arguments); - } - - WSF_DROPDOWN_CONTROL.prototype.requirements = ['/assets/bootstrap.min.js']; - - return WSF_DROPDOWN_CONTROL; - -})(WSF_CONTROL); - -controls = {}; - -WSF_BUTTON_CONTROL = (function(_super) { - - __extends(WSF_BUTTON_CONTROL, _super); - - function WSF_BUTTON_CONTROL() { - return WSF_BUTTON_CONTROL.__super__.constructor.apply(this, arguments); - } - - WSF_BUTTON_CONTROL.prototype.attach_events = function() { - var self; - WSF_BUTTON_CONTROL.__super__.attach_events.apply(this, arguments); - self = this; - return this.$el.click(function(e) { - e.preventDefault(); - return self.click(); - }); - }; - - WSF_BUTTON_CONTROL.prototype.click = function() { - if (this.state['callback_click']) { - return this.trigger_callback(this.control_name, 'click'); - } - }; - - WSF_BUTTON_CONTROL.prototype.update = function(state) { - if (state.disabled !== void 0) { - this.state['disabled'] = state.disabled; - this.$el.prop('disabled', state.disabled); - } - if (state.text != null) { - this.state['text'] = state.text; - return this.$el.text(state.text); - } - }; - - return WSF_BUTTON_CONTROL; - -})(WSF_CONTROL); - -WSF_INPUT_CONTROL = (function(_super) { - - __extends(WSF_INPUT_CONTROL, _super); - - function WSF_INPUT_CONTROL() { - return WSF_INPUT_CONTROL.__super__.constructor.apply(this, arguments); - } - - WSF_INPUT_CONTROL.prototype.attach_events = function() { - var self; - WSF_INPUT_CONTROL.__super__.attach_events.apply(this, arguments); - self = this; - return this.$el.change(function() { - return self.change(); - }); - }; - - WSF_INPUT_CONTROL.prototype.change = function() { - this.state['text'] = this.$el.val(); - if (this.state['callback_change']) { - this.trigger_callback(this.control_name, 'change'); - } - return this.trigger('change'); - }; - - WSF_INPUT_CONTROL.prototype.value = function() { - return this.$el.val(); - }; - - WSF_INPUT_CONTROL.prototype.update = function(state) { - if (state.disabled !== void 0) { - this.state['disabled'] = state.disabled; - this.$el.prop('disabled', state.disabled); - } - if (state.text != null) { - this.state['text'] = state.text; - return this.$el.val(state.text); - } - }; - - return WSF_INPUT_CONTROL; - -})(WSF_CONTROL); - -WSF_FILE_CONTROL = (function(_super) { - - __extends(WSF_FILE_CONTROL, _super); - - function WSF_FILE_CONTROL() { - WSF_FILE_CONTROL.__super__.constructor.apply(this, arguments); - this.uploading = false; - } - - WSF_FILE_CONTROL.prototype.start_upload = function() { - var action, file, formData; - if (this.$el[0].files.length === 0) { - return; - } - if (this.uploading) { - return; - } - this.uploading = true; - this.$el.hide(); - this.progressbar = $("
    "); - this.$el.parent().append(this.progressbar); - formData = new FormData(); - action = this.callback_url({ - control_name: this.get_full_control_name(), - event: "uploadfile", - event_parameter: "" - }); - file = this.$el[0].files[0]; - formData.append('file', file); - formData.append('state', JSON.stringify(this.get_context_state())); - return this.sendXHRequest(formData, action); - }; - - WSF_FILE_CONTROL.prototype.sendXHRequest = function(formData, uri) { - var onprogressHandler, onstatechange, self, xhr; - xhr = new XMLHttpRequest(); - self = this; - onprogressHandler = function(evt) { - var percent; - percent = evt.loaded / evt.total * 100; - return self.progressbar.find('.progress-bar').css({ - 'width': percent + "%" - }); - }; - onstatechange = function(evt) { - if (xhr.readyState === 4 && xhr.status === 200) { - return self.get_page().process_update(JSON.parse(xhr.responseText)); - } - }; - xhr.upload.addEventListener('progress', onprogressHandler, false); - xhr.addEventListener('readystatechange', onstatechange, false); - xhr.open('POST', uri, true); - return xhr.send(formData); - }; - - WSF_FILE_CONTROL.prototype.attach_events = function() { - var self; - WSF_FILE_CONTROL.__super__.attach_events.apply(this, arguments); - self = this; - return this.$el.change(function() { - return self.change(); - }); - }; - - WSF_FILE_CONTROL.prototype.change = function() { - var file; - this.state['file_name'] = null; - this.state['file_type'] = null; - this.state['file_size'] = null; - this.state['file_id'] = null; - if (this.$el[0].files.length > 0) { - file = this.$el[0].files[0]; - this.state['file_name'] = file.name; - this.state['file_type'] = file.type; - this.state['file_size'] = file.size; - } - if (this.state['callback_change']) { - this.trigger_callback(this.control_name, 'change'); - } - return this.trigger('change'); - }; - - WSF_FILE_CONTROL.prototype.value = function() { - return this.$el.val(); - }; - - WSF_FILE_CONTROL.prototype.update = function(state) { - if (state.disabled !== void 0) { - this.state['disabled'] = state.disabled; - this.$el.prop('disabled', state.disabled); - this.refresh(); - } - if (state.file_name !== void 0) { - this.state['file_name'] = state.file_name; - } - if (state.file_type !== void 0) { - this.state['file_type'] = state.file_type; - } - if (state.file_size !== void 0) { - this.state['file_size'] = state.file_size; - } - if (state.file_id !== void 0) { - if (this.state['file_id'] !== state.file_id) { - this.state['file_id'] = state.file_id; - if (this.state['callback_uploaddone']) { - this.trigger_callback(this.control_name, 'uploaddone'); - } - this.uploading = false; - } - return this.refresh(); - } - }; - - WSF_FILE_CONTROL.prototype.refresh = function() { - var fname, removebtn, self; - if (this.uploading) { - return; - } - this.progressbar.remove(); - this.$el.parent().find("p").remove(); - if (this.state['file_id'] !== null) { - this.$el.hide(); - fname = $("

    ").addClass("form-control-static").text(this.state['file_name']); - this.$el.parent().append(fname); - if (!this.state['disabled']) { - fname.append(" "); - removebtn = $("\n

    " + action.title + "

    \n \n
    \n \n
    \n \n\n"); + modal.appendTo('body'); + modal.modal('show'); + modal.on('hidden.bs.modal', function() { + $(modal.find('[data-name]').get().reverse()).each(function(i, value) { + $(value).data('control').remove(); + }); }); - }; - - WSF_PAGINATION_CONTROL.prototype.click = function(e) { - var nr; - nr = $(e.target).data('nr'); - if (nr === "next") { - return this.trigger_callback(this.control_name, "next"); - } else if (nr === "prev") { - return this.trigger_callback(this.control_name, "prev"); - } else { - return this.trigger_callback(this.control_name, "goto", nr); - } - }; - - WSF_PAGINATION_CONTROL.prototype.update = function(state) { - if (state._html != null) { - return this.$el.html($(state._html).html()); - } - }; - - return WSF_PAGINATION_CONTROL; - -})(WSF_CONTROL); - -WSF_GRID_CONTROL = (function(_super) { - - __extends(WSF_GRID_CONTROL, _super); - - function WSF_GRID_CONTROL() { - return WSF_GRID_CONTROL.__super__.constructor.apply(this, arguments); - } - - WSF_GRID_CONTROL.prototype.attach_events = function() { - var self; - WSF_GRID_CONTROL.__super__.attach_events.apply(this, arguments); - return self = this; - }; - - WSF_GRID_CONTROL.prototype.update = function(state) { - if (state.datasource != null) { - this.state['datasource'] = state.datasource; - } - if (state._body != null) { - return this.$el.find('tbody').html(state._body); - } - }; - - return WSF_GRID_CONTROL; - -})(WSF_CONTROL); - -WSF_REPEATER_CONTROL = (function(_super) { - - __extends(WSF_REPEATER_CONTROL, _super); - - function WSF_REPEATER_CONTROL() { - return WSF_REPEATER_CONTROL.__super__.constructor.apply(this, arguments); - } - - WSF_REPEATER_CONTROL.prototype.attach_events = function() { - var self; - WSF_REPEATER_CONTROL.__super__.attach_events.apply(this, arguments); - return self = this; - }; - - WSF_REPEATER_CONTROL.prototype.update = function(state) { - if (state.datasource != null) { - this.state['datasource'] = state.datasource; - } - if (state._body != null) { - this.$el.find('.repeater_content').html(state._body); - return console.log(state._body); - } - }; - - return WSF_REPEATER_CONTROL; - -})(WSF_CONTROL); - -redirect = function(action) { - return document.location.href = action.url; -}; - -show_alert = function(action) { - return alert(action.message); -}; - -start_modal = lazy_load(['/assets/bootstrap.min.js'], function(action) { - var cssclass, modal; - cssclass = ""; - if (action.type === "start_modal_big") { - cssclass = " big"; - } - modal = $("
    \n
    \n
    \n
    \n \n

    " + action.title + "

    \n
    \n
    \n \n
    \n
    \n
    \n
    "); - modal.appendTo('body'); - modal.modal('show'); - modal.on('hidden.bs.modal', function() { - $(modal.find('[data-name]').get().reverse()).each(function(i, value) { - $(value).data('control').remove(); + return $.get(action.url, { + ajax: 1 + }).done(function(data) { + return modal.find('.modal-body').append(data); }); }); - return $.get(action.url, { - ajax: 1 - }).done(function(data) { - return modal.find('.modal-body').append(data); - }); -}); -start_modal_big = start_modal; + start_modal_big = start_modal; + +}).call(this);