define('application/components/preconnect', [
'rofl/widgets/component',
'rofl/lib/utils',
'antie/runtimecontext',
'rofl/widgets/container',
'rofl/widgets/verticallist',
'application/widgets/login/inputfield',
'application/widgets/button',
'rofl/lib/l10n',
'rofl/widgets/image',
'application/widgets/login/keyboard',
'rofl/widgets/label',
'application/managers/session',
'antie/events/keyevent'
], function (
Component,
Utils,
RuntimeContext,
Container,
VerticalList,
InputField,
KPNButton,
L10N,
Image,
Keyboard,
Label,
SessionManager,
KeyEvent
) {
'use strict';
var l10n = L10N.getInstance(),
application = RuntimeContext.getCurrentApplication(),
ENTRY_CODE = '76343227',
sessionManager = SessionManager.getInstance();
return Component.extend({
/**
* Initialises the component.
*/
init: function init () {
init.base.call(this, 'preconnect');
this._onSelectBound = Utils.bind(this._onSelect, this);
this._onTextValidatedBound = Utils.bind(this._onValidated, this);
this._onKeyDownBound = Utils.bind(this._onKeyDown, this);
this._build();
},
/**
* Builds the component.
*
* @private
*/
_build: function () {
this._buildHeader();
this._buildInput();
this._buildList();
this._buildKeyboard();
this._buildLogin();
this._buildErrorMessage();
},
/**
* Builds the text container.
*
* @private
*/
_buildHeader: function () {
var header = new Container('header'),
headerText = new Label({ text: l10n.get('preconnect.header'), enableHTML: true });
header.appendChildWidget(headerText);
this.appendChildWidget(header);
},
/**
* Builds the list.
*
* @private
*/
_buildList: function () {
var list = this._list = new VerticalList();
this.appendChildWidget(list);
},
/**
* Builds the input.
*
* @private
*/
_buildInput: function () {
var inputField = this._inputField = new InputField({
type: InputField.TYPES.PASSWORD,
title: '',
opts: {
placeholder: l10n.get('preconnect.placeholder'),
maxLength: 8,
validateLength: true
}
});
this.appendChildWidget(inputField);
},
/**
* Builds the keyboard.
*
* @private
*/
_buildKeyboard: function () {
var keyboard = this._keyboard = new Keyboard({
opts: {
maxLength: 8
}
});
this._inputField.setKeyboard(this._keyboard.getKeyboard());
this._list.appendChildWidget(keyboard);
},
/**
* Builds the login button.
*
* @private
*/
_buildLogin: function () {
var button = this._button = new KPNButton(l10n.get('preconnect.button'), 'next');
this._list.appendChildWidget(button);
},
/**
* Builds the error message.
*
* @private
*/
_buildErrorMessage: function () {
var error = this._error = new Label({ classNames: ['error'] });
this.appendChildWidget(error);
},
/**
* BeforeShow event.
*/
onBeforeShow: function () {
this.focus();
this.addEventListener('select', this._onSelectBound);
this.addEventListener('textvalidated', this._onTextValidatedBound);
this.addEventListener('keydown', this._onKeyDownBound);
},
/**
* AfterShow event.
*/
onAfterShow: function () {
var inputField = this._inputField;
inputField.showCursorBlink();
inputField.animateFocusBar();
},
/**
* BeforeHide event.
*/
onBeforeHide: function () {
this.removeEventListener('select', this._onSelectBound);
this.removeEventListener('textvalidated', this._onTextValidatedBound);
this.removeEventListener('keydown', this._onKeyDownBound);
},
/**
* Select event.
*
* @param {Object} e - The event data.
* @private
*/
_onSelect: function (e) {
var target = e.target.id;
switch (target) {
case 'next':
this._onNext();
break;
// No default.
}
},
/**
* Next handler.
*
* @private
*/
_onNext: function () {
var text = this._inputField.getValue();
if (text !== ENTRY_CODE) {
this._error.setText(l10n.get('preconnect.error'));
} else {
this._error.setText('');
sessionManager.setEntryConfirmed();
application.route('init');
}
},
/**
* Validate handler.
*
* @private
*/
_onValidated: function () {
this._button.focus();
},
/**
* KeyDown handler.
*
* @param {Object} e - Input.
* @private
*/
_onKeyDown: function (e) {
if (e.keyCode === KeyEvent.VK_BACK) {
this._onBack();
} else {
e.preventDefault();
e.stopPropagation();
}
},
/**
* Back handler.
*
* @private
*/
_onBack: function () {
application.route('error', {
type: 'exit-popup',
title: l10n.get('errors.exit_confirmation'),
button: [
{name: 'confirmbtn', id: 'exit-confirm-button', label: l10n.get('preconnect.confirm_close')},
{name: 'rejectbtn', id: 'exit-reject-button', label: l10n.get('preconnect.reject_close')}
]
});
}
});
});