a zip code crypto-currency system good for red ONLY

alert-component.js 15KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301
  1. (function (factory) {
  2. if (typeof module === "object" && typeof module.exports === "object") {
  3. var v = factory(require, exports);
  4. if (v !== undefined) module.exports = v;
  5. }
  6. else if (typeof define === "function" && define.amd) {
  7. define(["require", "exports", "@angular/core", "../../config/config", "../../util/dom", "../../gestures/gesture-controller", "../../util/util", "../../platform/key", "../../navigation/nav-params", "../../platform/platform", "../../navigation/view-controller"], factory);
  8. }
  9. })(function (require, exports) {
  10. "use strict";
  11. Object.defineProperty(exports, "__esModule", { value: true });
  12. var core_1 = require("@angular/core");
  13. var config_1 = require("../../config/config");
  14. var dom_1 = require("../../util/dom");
  15. var gesture_controller_1 = require("../../gestures/gesture-controller");
  16. var util_1 = require("../../util/util");
  17. var key_1 = require("../../platform/key");
  18. var nav_params_1 = require("../../navigation/nav-params");
  19. var platform_1 = require("../../platform/platform");
  20. var view_controller_1 = require("../../navigation/view-controller");
  21. /**
  22. * @hidden
  23. */
  24. var AlertCmp = (function () {
  25. function AlertCmp(_viewCtrl, _elementRef, config, gestureCtrl, params, _renderer, _plt) {
  26. this._viewCtrl = _viewCtrl;
  27. this._elementRef = _elementRef;
  28. this._renderer = _renderer;
  29. this._plt = _plt;
  30. // gesture blocker is used to disable gestures dynamically
  31. this.gestureBlocker = gestureCtrl.createBlocker(gesture_controller_1.BLOCK_ALL);
  32. this.d = params.data;
  33. this.mode = this.d.mode || config.get('mode');
  34. this.keyboardResizes = config.getBoolean('keyboardResizes', false);
  35. _renderer.setElementClass(_elementRef.nativeElement, "alert-" + this.mode, true);
  36. if (this.d.cssClass) {
  37. this.d.cssClass.split(' ').forEach(function (cssClass) {
  38. // Make sure the class isn't whitespace, otherwise it throws exceptions
  39. if (cssClass.trim() !== '')
  40. _renderer.setElementClass(_elementRef.nativeElement, cssClass, true);
  41. });
  42. }
  43. this.id = (++alertIds);
  44. this.descId = '';
  45. this.hdrId = 'alert-hdr-' + this.id;
  46. this.subHdrId = 'alert-subhdr-' + this.id;
  47. this.msgId = 'alert-msg-' + this.id;
  48. this.activeId = '';
  49. this.lastClick = 0;
  50. if (this.d.message) {
  51. this.descId = this.msgId;
  52. }
  53. else if (this.d.subTitle) {
  54. this.descId = this.subHdrId;
  55. }
  56. if (!this.d.message) {
  57. this.d.message = '';
  58. }
  59. }
  60. AlertCmp.prototype.ionViewDidLoad = function () {
  61. var _this = this;
  62. // normalize the data
  63. var data = this.d;
  64. data.buttons = data.buttons.map(function (button) {
  65. if (typeof button === 'string') {
  66. return { text: button };
  67. }
  68. return button;
  69. });
  70. data.inputs = data.inputs.map(function (input, index) {
  71. var r = {
  72. type: input.type || 'text',
  73. name: util_1.isPresent(input.name) ? input.name : index + '',
  74. placeholder: util_1.isPresent(input.placeholder) ? input.placeholder : '',
  75. value: util_1.isPresent(input.value) ? input.value : '',
  76. label: input.label,
  77. checked: !!input.checked,
  78. disabled: !!input.disabled,
  79. id: util_1.isPresent(input.id) ? input.id : "alert-input-" + _this.id + "-" + index,
  80. handler: util_1.isPresent(input.handler) ? input.handler : null,
  81. min: util_1.isPresent(input.min) ? input.min : null,
  82. max: util_1.isPresent(input.max) ? input.max : null
  83. };
  84. return r;
  85. });
  86. // An alert can be created with several different inputs. Radios,
  87. // checkboxes and inputs are all accepted, but they cannot be mixed.
  88. var inputTypes = [];
  89. data.inputs.forEach(function (input) {
  90. if (inputTypes.indexOf(input.type) < 0) {
  91. inputTypes.push(input.type);
  92. }
  93. });
  94. if (inputTypes.length > 1 && (inputTypes.indexOf('checkbox') > -1 || inputTypes.indexOf('radio') > -1)) {
  95. console.warn("Alert cannot mix input types: " + (inputTypes.join('/')) + ". Please see alert docs for more info.");
  96. }
  97. this.inputType = inputTypes.length ? inputTypes[0] : null;
  98. var checkedInput = this.d.inputs.find(function (input) { return input.checked; });
  99. if (checkedInput) {
  100. this.activeId = checkedInput.id;
  101. }
  102. var hasTextInput = (this.d.inputs.length && this.d.inputs.some(function (i) { return !(dom_1.NON_TEXT_INPUT_REGEX.test(i.type)); }));
  103. if (!this.keyboardResizes && hasTextInput && this._plt.is('mobile')) {
  104. // this alert has a text input and it's on a mobile device so we should align
  105. // the alert up high because we need to leave space for the virtual keboard
  106. // this also helps prevent the layout getting all messed up from
  107. // the browser trying to scroll the input into a safe area
  108. this._renderer.setElementClass(this._elementRef.nativeElement, 'alert-top', true);
  109. }
  110. };
  111. AlertCmp.prototype.ionViewWillEnter = function () {
  112. this.gestureBlocker.block();
  113. };
  114. AlertCmp.prototype.ionViewDidLeave = function () {
  115. this.gestureBlocker.unblock();
  116. };
  117. AlertCmp.prototype.ionViewDidEnter = function () {
  118. // set focus on the first input or button in the alert
  119. // note that this does not always work and bring up the keyboard on
  120. // devices since the focus command must come from the user's touch event
  121. // and ionViewDidEnter is not in the same callstack as the touch event :(
  122. var focusableEle = this._elementRef.nativeElement.querySelector('input,button');
  123. if (focusableEle) {
  124. setTimeout(function () { return focusableEle.focus(); });
  125. }
  126. this.enabled = true;
  127. };
  128. AlertCmp.prototype.keyUp = function (ev) {
  129. if (this.enabled && this._viewCtrl.isLast()) {
  130. if (ev.keyCode === key_1.KEY_ENTER) {
  131. if (this.lastClick + 1000 < Date.now()) {
  132. // do not fire this click if there recently was already a click
  133. // this can happen when the button has focus and used the enter
  134. // key to click the button. However, both the click handler and
  135. // this keyup event will fire, so only allow one of them to go.
  136. (void 0) /* console.debug */;
  137. var button = this.d.buttons[this.d.buttons.length - 1];
  138. this.btnClick(button);
  139. }
  140. }
  141. else if (ev.keyCode === key_1.KEY_ESCAPE) {
  142. (void 0) /* console.debug */;
  143. this.bdClick();
  144. }
  145. }
  146. };
  147. AlertCmp.prototype.btnClick = function (button) {
  148. if (!this.enabled) {
  149. return;
  150. }
  151. // keep the time of the most recent button click
  152. this.lastClick = Date.now();
  153. var shouldDismiss = true;
  154. if (button.handler) {
  155. // a handler has been provided, execute it
  156. // pass the handler the values from the inputs
  157. if (button.handler(this.getValues()) === false) {
  158. // if the return value of the handler is false then do not dismiss
  159. shouldDismiss = false;
  160. }
  161. }
  162. if (shouldDismiss) {
  163. this.dismiss(button.role);
  164. }
  165. };
  166. AlertCmp.prototype.rbClick = function (checkedInput) {
  167. if (this.enabled) {
  168. this.d.inputs.forEach(function (input) {
  169. input.checked = (checkedInput === input);
  170. });
  171. this.activeId = checkedInput.id;
  172. if (checkedInput.handler) {
  173. checkedInput.handler(checkedInput);
  174. }
  175. }
  176. };
  177. AlertCmp.prototype.cbClick = function (checkedInput) {
  178. if (this.enabled) {
  179. checkedInput.checked = !checkedInput.checked;
  180. if (checkedInput.handler) {
  181. checkedInput.handler(checkedInput);
  182. }
  183. }
  184. };
  185. AlertCmp.prototype.bdClick = function () {
  186. if (this.enabled && this.d.enableBackdropDismiss) {
  187. var cancelBtn = this.d.buttons.find(function (b) { return b.role === 'cancel'; });
  188. if (cancelBtn) {
  189. this.btnClick(cancelBtn);
  190. }
  191. else {
  192. this.dismiss('backdrop');
  193. }
  194. }
  195. };
  196. AlertCmp.prototype.dismiss = function (role) {
  197. var opts = {
  198. minClickBlockDuration: 400
  199. };
  200. return this._viewCtrl.dismiss(this.getValues(), role, opts);
  201. };
  202. AlertCmp.prototype.getValues = function () {
  203. if (this.inputType === 'radio') {
  204. // this is an alert with radio buttons (single value select)
  205. // return the one value which is checked, otherwise undefined
  206. var checkedInput = this.d.inputs.find(function (i) { return i.checked; });
  207. return checkedInput ? checkedInput.value : undefined;
  208. }
  209. if (this.inputType === 'checkbox') {
  210. // this is an alert with checkboxes (multiple value select)
  211. // return an array of all the checked values
  212. return this.d.inputs.filter(function (i) { return i.checked; }).map(function (i) { return i.value; });
  213. }
  214. if (this.d.inputs.length === 0) {
  215. // this is an alert without any options/inputs at all
  216. return undefined;
  217. }
  218. // this is an alert with text inputs
  219. // return an object of all the values with the input name as the key
  220. var values = {};
  221. this.d.inputs.forEach(function (i) {
  222. values[i.name] = i.value;
  223. });
  224. return values;
  225. };
  226. AlertCmp.prototype.ngOnDestroy = function () {
  227. (void 0) /* assert */;
  228. this.gestureBlocker.destroy();
  229. };
  230. AlertCmp.decorators = [
  231. { type: core_1.Component, args: [{
  232. selector: 'ion-alert',
  233. template: '<ion-backdrop (click)="bdClick()" [class.backdrop-no-tappable]="!d.enableBackdropDismiss"></ion-backdrop>' +
  234. '<div class="alert-wrapper">' +
  235. '<div class="alert-head">' +
  236. '<h2 id="{{hdrId}}" class="alert-title" *ngIf="d.title" [innerHTML]="d.title"></h2>' +
  237. '<h3 id="{{subHdrId}}" class="alert-sub-title" *ngIf="d.subTitle" [innerHTML]="d.subTitle"></h3>' +
  238. '</div>' +
  239. '<div id="{{msgId}}" class="alert-message" [innerHTML]="d.message"></div>' +
  240. '<div *ngIf="d.inputs.length" [ngSwitch]="inputType">' +
  241. '<ng-template ngSwitchCase="radio">' +
  242. '<div class="alert-radio-group" role="radiogroup" [attr.aria-labelledby]="hdrId" [attr.aria-activedescendant]="activeId">' +
  243. '<button ion-button="alert-radio-button" *ngFor="let i of d.inputs" (click)="rbClick(i)" [attr.aria-checked]="i.checked" [disabled]="i.disabled" [attr.id]="i.id" class="alert-tappable alert-radio" role="radio">' +
  244. '<div class="alert-radio-icon"><div class="alert-radio-inner"></div></div>' +
  245. '<div class="alert-radio-label">' +
  246. '{{i.label}}' +
  247. '</div>' +
  248. '</button>' +
  249. '</div>' +
  250. '</ng-template>' +
  251. '<ng-template ngSwitchCase="checkbox">' +
  252. '<div class="alert-checkbox-group">' +
  253. '<button ion-button="alert-checkbox-button" *ngFor="let i of d.inputs" (click)="cbClick(i)" [attr.aria-checked]="i.checked" [attr.id]="i.id" [disabled]="i.disabled" class="alert-tappable alert-checkbox" role="checkbox">' +
  254. '<div class="alert-checkbox-icon"><div class="alert-checkbox-inner"></div></div>' +
  255. '<div class="alert-checkbox-label">' +
  256. '{{i.label}}' +
  257. '</div>' +
  258. '</button>' +
  259. '</div>' +
  260. '</ng-template>' +
  261. '<ng-template ngSwitchDefault>' +
  262. '<div class="alert-input-group">' +
  263. '<div *ngFor="let i of d.inputs" class="alert-input-wrapper">' +
  264. '<input [placeholder]="i.placeholder" [(ngModel)]="i.value" [type]="i.type" dir="auto" [min]="i.min" [max]="i.max" [attr.id]="i.id" class="alert-input">' +
  265. '</div>' +
  266. '</div>' +
  267. '</ng-template>' +
  268. '</div>' +
  269. '<div class="alert-button-group" [ngClass]="{\'alert-button-group-vertical\':d.buttons.length>2}">' +
  270. '<button ion-button="alert-button" *ngFor="let b of d.buttons" (click)="btnClick(b)" [ngClass]="b.cssClass">' +
  271. '{{b.text}}' +
  272. '</button>' +
  273. '</div>' +
  274. '</div>',
  275. host: {
  276. 'role': 'dialog',
  277. '[attr.aria-labelledby]': 'hdrId',
  278. '[attr.aria-describedby]': 'descId'
  279. },
  280. encapsulation: core_1.ViewEncapsulation.None,
  281. },] },
  282. ];
  283. /** @nocollapse */
  284. AlertCmp.ctorParameters = function () { return [
  285. { type: view_controller_1.ViewController, },
  286. { type: core_1.ElementRef, },
  287. { type: config_1.Config, },
  288. { type: gesture_controller_1.GestureController, },
  289. { type: nav_params_1.NavParams, },
  290. { type: core_1.Renderer, },
  291. { type: platform_1.Platform, },
  292. ]; };
  293. AlertCmp.propDecorators = {
  294. 'keyUp': [{ type: core_1.HostListener, args: ['body:keyup', ['$event'],] },],
  295. };
  296. return AlertCmp;
  297. }());
  298. exports.AlertCmp = AlertCmp;
  299. var alertIds = -1;
  300. });
  301. //# sourceMappingURL=alert-component.js.map