diff --git a/app/assets/javascripts/app/controllers/_application_controller_form.js.coffee b/app/assets/javascripts/app/controllers/_application_controller_form.js.coffee index 5ff075c71..5098c777e 100644 --- a/app/assets/javascripts/app/controllers/_application_controller_form.js.coffee +++ b/app/assets/javascripts/app/controllers/_application_controller_form.js.coffee @@ -282,14 +282,133 @@ class App.ControllerForm extends App.Controller # date else if attribute.tag is 'date' - attribute.type = 'text' - #item.datetimepicker({ - # format: 'Y.m.d' - #}); + + # set data type + if attribute.name + attribute.nameRaw = attribute.name + attribute.name = '{date}' + attribute.name + if attribute.value + if typeof( attribute.value ) is 'string' + unixtime = new Date( Date.parse( "#{attribute.value}T00:00:00Z" ) ) + else + unixtime = new Date( attribute.value ) + year = unixtime.getYear() + 1900 + month = unixtime.getMonth() + 1 + day = unixtime.getDate() + hour = unixtime.getHours() + minute = unixtime.getMinutes() + item = $( App.view('generic/date')( + attribute: attribute + year: year + month: month + day: day + ) ) + + setNewTime = (diff, el, reset) -> + name = $(el).closest('.form-group').find('[data-name]').attr('data-name') + + # remove old validation + item.find('.has-error').removeClass('has-error') + item.closest('.form-group').find('.help-inline').html('') + + day = item.closest('.form-group').find("[name=\"{date}#{name}___day\"]").val() + month = item.closest('.form-group').find("[name=\"{date}#{name}___month\"]").val() + year = item.closest('.form-group').find("[name=\"{date}#{name}___year\"]").val() + format = (number) -> + if parseInt(number) < 10 + number = "0#{number}" + number + if !reset && (year isnt '' && month isnt '' && day isnt '') + time = new Date( Date.parse( "#{year}-#{format(month)}-#{format(day)}T00:00:00Z" ) ) + else + time = new Date() + time.setMinutes( time.getMinutes() + diff + time.getTimezoneOffset() ) + item.closest('.form-group').find("[name=\"{date}#{name}___day\"]").val( time.getDate() ) + item.closest('.form-group').find("[name=\"{date}#{name}___month\"]").val( time.getMonth()+1 ) + item.closest('.form-group').find("[name=\"{date}#{name}___year\"]").val( time.getFullYear() ) + + item.find('.js-today').bind('click', (e) -> + e.preventDefault() + setNewTime(0, @, true) + ) + item.find('.js-plus-day').bind('click', (e) -> + e.preventDefault() + setNewTime(60 * 24, @) + ) + item.find('.js-minus-day').bind('click', (e) -> + e.preventDefault() + setNewTime(-60 * 24, @) + ) + item.find('.js-plus-week').bind('click', (e) -> + e.preventDefault() + setNewTime(60 * 24 * 7, @) + ) + item.find('.js-minus-week').bind('click', (e) -> + e.preventDefault() + setNewTime(-60 * 24 * 7, @) + ) + + item.find('input').bind('keyup blur focus change', (e) -> + + # do validation + name = $(@).attr('name') + if name + fieldPrefix = name.split('___')[0] + + # remove old validation + item.find('.has-error').removeClass('has-error') + item.closest('.form-group').find('.help-inline').html('') + + day = item.closest('.form-group').find("[name=\"#{fieldPrefix}___day\"]").val() + month = item.closest('.form-group').find("[name=\"#{fieldPrefix}___month\"]").val() + year = item.closest('.form-group').find("[name=\"#{fieldPrefix}___year\"]").val() + + # validate exists + errors = {} + if !day + errors.day = 'missing' + if !month + errors.month = 'missing' + if !year + errors.year = 'missing' + + # ranges + if day + daysInMonth = 31 + if month && year + daysInMonth = new Date(year, month, 0).getDate(); + + if parseInt(day).toString() is 'NaN' + errors.day = 'invalid' + else if parseInt(day) > daysInMonth || parseInt(day) < 1 + errors.day = 'invalid' + + if month + if parseInt(month).toString() is 'NaN' + errors.month = 'invalid' + else if parseInt(month) > 12 || parseInt(month) < 1 + errors.month = 'invalid' + + if year + if parseInt(year).toString() is 'NaN' + errors.year = 'invalid' + else if parseInt(year) > 2100 || parseInt(year) < 2001 + errors.year = 'invalid' + + if !_.isEmpty(errors) + for key, value of errors + item.closest('.form-group').addClass('has-error') + item.closest('.form-group').find("[name=\"#{fieldPrefix}___#{key}\"]").addClass('has-error') + #item.closest('.form-group').find('.help-inline').text( value ) + + e.preventDefault() + e.stopPropagation() + return + ) + # date else if attribute.tag is 'datetime' - attribute.type = 'text' # set data type if attribute.name @@ -313,20 +432,14 @@ class App.ControllerForm extends App.Controller hour: hour minute: minute ) ) - item.find('.js-today').bind('click', (e) -> - e.preventDefault() - name = $(@).closest('.form-group').find('[data-name]').attr('data-name') - today = new Date(); - item.closest('.form-group').find("[name=\"{datetime}#{name}___day\"]").val( today.getDate() ) - item.closest('.form-group').find("[name=\"{datetime}#{name}___month\"]").val( today.getMonth()+1 ) - item.closest('.form-group').find("[name=\"{datetime}#{name}___year\"]").val( today.getFullYear() ) - item.closest('.form-group').find("[name=\"{datetime}#{name}___hour\"]").val( today.getHours() ) - item.closest('.form-group').find("[name=\"{datetime}#{name}___minute\"]").val( today.getMinutes() ) - ) - setNewTime = (diff, el) -> + setNewTime = (diff, el, reset) -> name = $(el).closest('.form-group').find('[data-name]').attr('data-name') + # remove old validation + item.find('.has-error').removeClass('has-error') + item.closest('.form-group').find('.help-inline').html('') + day = item.closest('.form-group').find("[name=\"{datetime}#{name}___day\"]").val() month = item.closest('.form-group').find("[name=\"{datetime}#{name}___month\"]").val() year = item.closest('.form-group').find("[name=\"{datetime}#{name}___year\"]").val() @@ -336,8 +449,10 @@ class App.ControllerForm extends App.Controller if parseInt(number) < 10 number = "0#{number}" number - #console.log('ph', diff, "#{year}-#{format(month)}-#{format(day)}T#{format(hour)}:#{format(minute)}:00Z") - time = new Date( Date.parse( "#{year}-#{format(month)}-#{format(day)}T#{format(hour)}:#{format(minute)}:00Z" ) ) + if !reset && (year isnt '' && month isnt '' && day isnt '' && hour isnt '' && day isnt '') + time = new Date( Date.parse( "#{year}-#{format(month)}-#{format(day)}T#{format(hour)}:#{format(minute)}:00Z" ) ) + else + time = new Date() time.setMinutes( time.getMinutes() + diff + time.getTimezoneOffset() ) #console.log('T', time, time.getHours(), time.getMinutes()) item.closest('.form-group').find("[name=\"{datetime}#{name}___day\"]").val( time.getDate() ) @@ -346,6 +461,10 @@ class App.ControllerForm extends App.Controller item.closest('.form-group').find("[name=\"{datetime}#{name}___hour\"]").val( time.getHours() ) item.closest('.form-group').find("[name=\"{datetime}#{name}___minute\"]").val( time.getMinutes() ) + item.find('.js-today').bind('click', (e) -> + e.preventDefault() + setNewTime(0, @, true) + ) item.find('.js-plus-hour').bind('click', (e) -> e.preventDefault() setNewTime(60, @) @@ -371,7 +490,7 @@ class App.ControllerForm extends App.Controller setNewTime(-60 * 24 * 7, @) ) - item.find('input').bind('keyup blur focus', (e) -> + item.find('input').bind('keyup blur focus change', (e) -> # do validation name = $(@).attr('name') @@ -406,7 +525,6 @@ class App.ControllerForm extends App.Controller daysInMonth = 31 if month && year daysInMonth = new Date(year, month, 0).getDate(); - console.log('222', month, year, daysInMonth) if parseInt(day).toString() is 'NaN' errors.day = 'invalid' @@ -2173,6 +2291,35 @@ class App.ControllerForm extends App.Controller else param[ newKey ] = false + # get {date} + else if key.substr(0,6) is '{date}' + newKey = key.substr( 6, key.length ) + namespace = newKey.split '___' + + if !param[ namespace[0] ] + dateKey = "{date}#{namespace[0]}___" + year = param[ "#{dateKey}year" ] + month = param[ "#{dateKey}month" ] + day = param[ "#{dateKey}day" ] + timezone = (new Date()).getTimezoneOffset()/60 + if year && month && day + format = (number) -> + if parseInt(number) < 10 + number = "0#{number}" + number + try + time = new Date( Date.parse( "#{year}-#{format(month)}-#{format(day)}T00:00:00Z" ) ) + time.setMinutes( time.getMinutes() + time.getTimezoneOffset() ) + param[ namespace[0] ] = time.toISOString() + catch err + console.log('ERR', err) + + #console.log('T', time, time.getHours(), time.getMinutes()) + + delete param[ "#{dateKey}year" ] + delete param[ "#{dateKey}month" ] + delete param[ "#{dateKey}day" ] + # get {datetime} else if key.substr(0,10) is '{datetime}' newKey = key.substr( 10, key.length ) diff --git a/app/assets/javascripts/app/views/generic/date.jst.eco b/app/assets/javascripts/app/views/generic/date.jst.eco index 724d3f226..014edc103 100644 --- a/app/assets/javascripts/app/views/generic/date.jst.eco +++ b/app/assets/javascripts/app/views/generic/date.jst.eco @@ -1 +1,14 @@ -> \ No newline at end of file +
+ + . + + . + +
+
+<%- @T('today') %> +| +<%- @T('-1') %> <%- @T('+1') %> <%- @T('day') %> +| +<%- @T('-7') %> <%- @T('+7') %> <%- @T('days') %> +
\ No newline at end of file diff --git a/public/assets/tests/form-validation.js b/public/assets/tests/form-validation.js index bca5d6f2c..514c8dc3b 100644 --- a/public/assets/tests/form-validation.js +++ b/public/assets/tests/form-validation.js @@ -8,15 +8,16 @@ test( "form validation check", function() { el: el, model: { configure_attributes: [ - { name: 'input1', display: 'Input1', tag: 'input', type: 'text', limit: 100, null: false }, - { name: 'password1', display: 'Password1', tag: 'input', type: 'password', limit: 100, null: false }, - { name: 'textarea1', display: 'Textarea1', tag: 'textarea', rows: 6, limit: 100, null: false, upload: true }, - { name: 'select1', display: 'Select1', tag: 'select', null: false, nulloption: true, options: { true: 'internal', false: 'public' } }, - { name: 'selectmulti1', display: 'SelectMulti1', tag: 'select', null: false, nulloption: true, multiple: true, options: { true: 'internal', false: 'public' } }, - { name: 'autocompletion1', display: 'AutoCompletion1', tag: 'autocompletion', null: false, options: { true: 'internal', false: 'public' }, source: [ { label: "Choice1", value: "value1", id: "id1" }, { label: "Choice2", value: "value2", id: "id2" }, ], minLength: 1 }, - { name: 'richtext1', display: 'Richtext1', tag: 'richtext', maxlength: 100, null: false, type: 'richtext', multiline: true, upload: true, default: defaults['richtext1'] }, - { name: 'datetime1', display: 'Datetime1', tag: 'datetime', null: false, default: defaults['datetime1'] }, - { name: 'active1', display: 'Active1', tag: 'boolean', type: 'boolean', default: defaults['active1'], null: false }, + { name: 'input1', display: 'Input1', tag: 'input', type: 'text', limit: 100, null: false }, + { name: 'password1', display: 'Password1', tag: 'input', type: 'password', limit: 100, null: false }, + { name: 'textarea1', display: 'Textarea1', tag: 'textarea', rows: 6, limit: 100, null: false, upload: true }, + { name: 'select1', display: 'Select1', tag: 'select', null: false, nulloption: true, options: { true: 'internal', false: 'public' } }, + { name: 'selectmulti1', display: 'SelectMulti1', tag: 'select', null: false, nulloption: true, multiple: true, options: { true: 'internal', false: 'public' } }, + { name: 'autocompletion1', display: 'AutoCompletion1', tag: 'autocompletion', null: false, options: { true: 'internal', false: 'public' }, source: [ { label: "Choice1", value: "value1", id: "id1" }, { label: "Choice2", value: "value2", id: "id2" }, ], minLength: 1 }, + { name: 'richtext1', display: 'Richtext1', tag: 'richtext', maxlength: 100, null: false, type: 'richtext', multiline: true, upload: true, default: defaults['richtext1'] }, + { name: 'datetime1', display: 'Datetime1', tag: 'datetime', null: false, default: defaults['datetime1'] }, + { name: 'date1', display: 'Date1', tag: 'date', null: false, default: defaults['date1'] }, + { name: 'active1', display: 'Active1', tag: 'boolean', type: 'boolean', default: defaults['active1'], null: false }, ], }, params: defaults, @@ -58,6 +59,7 @@ test( "form validation check", function() { autocompletion1: "is required", richtext1: "is required", datetime1: "is required", + date1: "is required", } deepEqual( errors, test_errors, 'validation errors check' ) @@ -87,6 +89,9 @@ test( "form validation check", function() { equal( el.find('[data-name="datetime1"]').closest('.form-group').hasClass('has-error'), true, 'check datetime1 has-error') equal( el.find('[data-name="datetime1"]').closest('.form-group').find('.help-inline').text(), 'is required', 'check datetime1 error message') + equal( el.find('[data-name="date1"]').closest('.form-group').hasClass('has-error'), true, 'check date1 has-error') + equal( el.find('[data-name="date1"]').closest('.form-group').find('.help-inline').text(), 'is required', 'check date1 error message') + }); test( "datetime validation check", function() { @@ -99,7 +104,7 @@ test( "datetime validation check", function() { el: el, model: { configure_attributes: [ - { name: 'datetime1', display: 'Datetime1', tag: 'datetime', null: false, default: defaults['datetime1'] }, + { name: 'datetime1', display: 'Datetime1', tag: 'datetime', null: false, default: defaults['datetime1'] }, ], }, params: defaults, @@ -115,18 +120,20 @@ test( "datetime validation check", function() { equal( el.find('[data-name="datetime1"]').closest('.form-group').hasClass('has-error'), true, 'check datetime1 has-error') equal( el.find('[data-name="datetime1"]').closest('.form-group').find('.help-inline').text(), 'is required', 'check datetime1 error message') + //equal( el.find('[data-name="datetime1"]').closest('.form-group').find('.help-inline').text(), '', 'check datetime1 error message') + // set new values el.find('[name="{datetime}datetime1___day"]').val('1') el.find('[name="{datetime}datetime1___month"]').val('1') el.find('[name="{datetime}datetime1___year"]').val('2015') el.find('[name="{datetime}datetime1___hour"]').val('12') el.find('[name="{datetime}datetime1___minute"]').val('42') + params = App.ControllerForm.params( el ) errors = form.validate(params) test_errors = undefined -// datetime1: "invalid", -// } deepEqual( errors, test_errors, 'validation errors check' ) + App.ControllerForm.validate( { errors: errors, form: el } ) equal( el.find('[data-name="datetime1"]').closest('.form-group').hasClass('has-error'), false, 'check datetime1 has-error') equal( el.find('[data-name="datetime1"]').closest('.form-group').find('.help-inline').text(), '', 'check datetime1 error message') @@ -146,4 +153,59 @@ test( "datetime validation check", function() { equal( el.find('[data-name="datetime1"]').closest('.form-group').hasClass('has-error'), true, 'check datetime1 has-error') equal( el.find('[data-name="datetime1"]').closest('.form-group').find('.help-inline').text(), '', 'check datetime1 error message') +}); + +test( "date validation check", function() { + + $('#forms').append('

date validation check

') + + var el = $('#form3') + var defaults = {} + var form = new App.ControllerForm({ + el: el, + model: { + configure_attributes: [ + { name: 'date1', display: 'Date1', tag: 'date', null: false, default: defaults['time1'] }, + ], + }, + params: defaults, + }); + + params = App.ControllerForm.params( el ) + errors = form.validate(params) + test_errors = { + date1: "is required", + } + deepEqual( errors, test_errors, 'validation errors check' ) + App.ControllerForm.validate( { errors: errors, form: el } ) + + equal( el.find('[data-name="date1"]').closest('.form-group').hasClass('has-error'), true, 'check date1 has-error') + equal( el.find('[data-name="date1"]').closest('.form-group').find('.help-inline').text(), 'is required', 'check date1 error message') + + + // set new values + el.find('[name="{date}date1___day"]').val('1') + el.find('[name="{date}date1___month"]').val('1') + el.find('[name="{date}date1___year"]').val('2015') + params = App.ControllerForm.params( el ) + errors = form.validate(params) + test_errors = undefined + deepEqual( errors, test_errors, 'validation errors check' ) + + App.ControllerForm.validate( { errors: errors, form: el } ) + + equal( el.find('[data-name="date1"]').closest('.form-group').hasClass('has-error'), false, 'check date1 has-error') + equal( el.find('[data-name="date1"]').closest('.form-group').find('.help-inline').text(), '', 'check date1 error message') + + el.find('[name="{date}date1___day"]').val('47') + el.find('[name="{date}date1___month"]').val('1') + el.find('[name="{date}date1___year"]').val('2015') + params = App.ControllerForm.params( el ) + errors = form.validate(params) + test_errors = { + date1: "is required", + } + deepEqual( errors, test_errors, 'validation errors check' ) + App.ControllerForm.validate( { errors: errors, form: el } ) + }); \ No newline at end of file