/*
* Copyright (C) eZ Systems AS. All rights reserved.
* For full copyright and license information view LICENSE file distributed with this source code.
*/
YUI.add('ez-time-editview', function (Y) {
"use strict";
/**
* Provides the field edit view for the time fields
*
* @module ez-time-editview
*/
Y.namespace('eZ');
var FIELDTYPE_IDENTIFIER = 'eztime';
/**
* Time edit view
*
* @namespace eZ
* @class timeEditView
* @constructor
* @extends eZ.FieldEditView
*/
Y.eZ.TimeEditView = Y.Base.create('timeEditView', Y.eZ.FieldEditView, [], {
events: {
'.ez-time-input-ui input': {
'blur': 'validate',
'valuechange': 'validate',
},
},
/**
* Check if browser supports time input
*
* @method _detectInputTimeSupport
* @private
*/
_detectInputTimeSupport: function () {
var i = document.createElement("input");
i.setAttribute("type", "time");
return i.type === "time";
},
/**
* Validation for browsers supporting time input
*
* @protected
* @method _supportedTimeInputValidate
*/
_supportedTimeInputValidate: function () {
var validity = this._getInputValidity();
if ( validity.valueMissing ) {
this.set('errorStatus', Y.eZ.trans('this.field.is.required', {}, 'fieldedit'));
} else if ( validity.badInput ) {
this.set('errorStatus', Y.eZ.trans('invalid.input', {}, 'fieldedit'));
} else {
this.set('errorStatus', false);
}
},
/**
* Validation for browsers NOT supporting time input
*
* @protected
* @method _unsupportedTimeInputValidate
*/
_unsupportedTimeInputValidate: function () {
var validity = this._getInputValidity();
if ( validity.valueMissing ) {
this.set('errorStatus', Y.eZ.trans('this.field.is.required', {}, 'fieldedit'));
} else if ( validity.patternMismatch ) {
this.set('errorStatus', Y.eZ.trans('time.not.valid.enter.format', {}, 'fieldedit'));
} else {
this.set('errorStatus', false);
}
},
/**
* Validates the current input of time field
*
* @method validate
*/
validate: function () {
if (this.get('supportsTimeInput')) {
this._supportedTimeInputValidate();
} else {
this._unsupportedTimeInputValidate();
}
},
/**
* Returns a timestamps in UTC
*
* @protected
* @method _getUtcTimeStamp
* @param {Number} localizedTimestamp
* @return {Number} Timestamp converted to UTC in millisecond
*/
_getUtcTimeStamp: function (localizedTimestamp) {
var tzOffset = new Date(localizedTimestamp).getTimezoneOffset() * 60000;
return localizedTimestamp + tzOffset;
},
/**
* Defines the variables to import in the field edit template for time
*
* @protected
* @method _variables
* @return {Object} {Object} holding the variables for the template
*/
_variables: function () {
var def = this.get('fieldDefinition'),
field = this.get('field'),
time = '';
if (!this._isFieldEmpty()) {
if (!this.get('supportsTimeInput') && !def.fieldSettings.useSeconds) {
time = Y.Date.format(new Date(this._getUtcTimeStamp(field.fieldValue * 1000)), {format:"%R"});
} else {
time = Y.Date.format(new Date(this._getUtcTimeStamp(field.fieldValue * 1000)), {format:"%T"});
}
}
return {
"isRequired": def.isRequired,
"supportsTimeInput": this.get('supportsTimeInput'),
"time": time,
"useSeconds": def.fieldSettings.useSeconds,
};
},
/**
* Returns the time input node of the time template
*
*
* @protected
* @method _getInputNode
* @return {Y.Node}
*/
_getInputNode: function () {
return this.get('container').one('.ez-time-input-ui input');
},
/**
* Returns the input validity state object for the input generated by
* the time template
*
* See https://developer.mozilla.org/en-US/docs/Web/API/ValidityState
*
* @protected
* @method _getInputValidity
* @return {ValidityState}
*/
_getInputValidity: function () {
return this._getInputNode().get('validity');
},
/**
* Returns the currently filled time value for browsers which support Time input
*
* @protected
* @method _supportedTimeInputGetFieldValue
* @return {Number|null}
*/
_supportedTimeInputGetFieldValue: function () {
var valueOfInput;
valueOfInput = this._getInputNode().get('valueAsNumber');
if (isNaN(valueOfInput)) {
return null;
}
return valueOfInput/1000;
},
/**
* Returns the currently filled time value for browsers which DO NOT support Time input
*
* @protected
* @method _unsupportedTimeInputGetFieldValue
* @return {Number}
*/
_unsupportedTimeInputGetFieldValue: function () {
var time = this._getInputNode().get('value').split(":"),
hours,
minutes,
seconds;
if ( time.length >= 2 ) {
hours = parseInt(time[0], 10)*3600;
minutes = parseInt(time[1], 10)*60;
seconds = 0;
if ( time.length > 2 ) {
seconds = parseInt(time[2], 10);
}
time = hours + minutes + seconds;
return time;
}
return null;
},
/**
* Returns the currently filled time value
*
* @protected
* @method _getFieldValue
* @return {Number}
*/
_getFieldValue: function () {
if (this.get('supportsTimeInput')) {
return this._supportedTimeInputGetFieldValue();
} else {
return this._unsupportedTimeInputGetFieldValue();
}
},
/**
* Whether the field is empty or not
*
* @protected
* @method _isFieldEmpty
* @return {Boolean}
*/
_isFieldEmpty: function () {
var field = this.get('field');
return (!field || isNaN(field.fieldValue));
},
},{
ATTRS: {
/**
* Checks if browser supports HTML5 time input
*
* @attribute supportsTimeInput
* @readOnly
*/
supportsTimeInput: {
valueFn: '_detectInputTimeSupport',
readOnly: true
},
}
});
Y.eZ.FieldEditView.registerFieldEditView(FIELDTYPE_IDENTIFIER, Y.eZ.TimeEditView);
});