mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-22 21:48:42 +08:00
chore(tslint): update tslint rules and autofix lint errors
This commit is contained in:
Brandy Carney
@ -94,17 +94,17 @@ export class ActionSheet {
|
||||
/**
|
||||
* If true, the action-sheet will be dismissed when the backdrop is clicked.
|
||||
*/
|
||||
@Prop() enableBackdropDismiss: boolean = true;
|
||||
@Prop() enableBackdropDismiss = true;
|
||||
|
||||
/**
|
||||
* If true, action-sheet will become translucent. Requires support for backdrop-filters.
|
||||
*/
|
||||
@Prop() translucent: boolean = false;
|
||||
@Prop() translucent = false;
|
||||
|
||||
/**
|
||||
* Enable action-sheet animations. If false, action-sheet will not animate in
|
||||
*/
|
||||
@Prop() willAnimate: boolean = true;
|
||||
@Prop() willAnimate = true;
|
||||
|
||||
/**
|
||||
* Animation to use when the action-sheet is created
|
||||
@ -209,12 +209,12 @@ export class ActionSheet {
|
||||
}
|
||||
|
||||
buttonClass(button: ActionSheetButton): CssClassMap {
|
||||
let buttonClass: string[] = !button.role
|
||||
const buttonClass: string[] = !button.role
|
||||
? ['action-sheet-button']
|
||||
: [`action-sheet-button`, `action-sheet-${button.role}`];
|
||||
|
||||
if (button.cssClass) {
|
||||
let customClass = button.cssClass.split(' ').filter(b => b.trim() !== '').join(' ');
|
||||
const customClass = button.cssClass.split(' ').filter(b => b.trim() !== '').join(' ');
|
||||
buttonClass.push(customClass);
|
||||
}
|
||||
|
||||
@ -256,7 +256,7 @@ export class ActionSheet {
|
||||
}
|
||||
|
||||
let cancelButton: ActionSheetButton;
|
||||
let buttons = this.buttons
|
||||
const buttons = this.buttons
|
||||
.map(b => {
|
||||
if (typeof b === 'string') {
|
||||
b = { text: b };
|
||||
|
||||
@ -100,17 +100,17 @@ export class Alert {
|
||||
/**
|
||||
* If true, the alert will be dismissed when the backdrop is clicked.
|
||||
*/
|
||||
@Prop() enableBackdropDismiss: boolean = true;
|
||||
@Prop() enableBackdropDismiss = true;
|
||||
|
||||
/**
|
||||
* If true, alert will become translucent. Requires support for backdrop-filters.
|
||||
*/
|
||||
@Prop() translucent: boolean = false;
|
||||
@Prop() translucent = false;
|
||||
|
||||
/**
|
||||
* Enable alert animations. If false, alert will not animate in
|
||||
*/
|
||||
@Prop() willAnimate: boolean = true;
|
||||
@Prop() willAnimate = true;
|
||||
|
||||
/**
|
||||
* Animation to be used when the alert is shown
|
||||
@ -148,7 +148,7 @@ export class Alert {
|
||||
return playAnimationAsync(animation);
|
||||
}).then((animation) => {
|
||||
animation.destroy();
|
||||
const firstInput = this.el.querySelector('[tabindex]') as HTMLElement;
|
||||
const firstInput = this.el.querySelector('[tabindex]');
|
||||
if (firstInput) {
|
||||
firstInput.focus();
|
||||
}
|
||||
@ -286,10 +286,10 @@ export class Alert {
|
||||
}
|
||||
|
||||
buttonClass(button: AlertButton): CssClassMap {
|
||||
let buttonClass: string[] = ['alert-button'];
|
||||
const buttonClass: string[] = ['alert-button'];
|
||||
|
||||
if (button.cssClass) {
|
||||
let customClass = button.cssClass.split(' ').filter(b => b.trim() !== '').join(' ');
|
||||
const customClass = button.cssClass.split(' ').filter(b => b.trim() !== '').join(' ');
|
||||
buttonClass.push(customClass);
|
||||
}
|
||||
|
||||
@ -412,7 +412,7 @@ export class Alert {
|
||||
|
||||
this.inputs = this.inputs
|
||||
.map((i, index) => {
|
||||
let r: AlertInput = {
|
||||
const r: AlertInput = {
|
||||
type: i.type || 'text',
|
||||
name: i.name ? i.name : index + '',
|
||||
placeholder: i.placeholder ? i.placeholder : '',
|
||||
|
||||
@ -30,18 +30,18 @@ export class Animator {
|
||||
private _timerId: any;
|
||||
private _unregisterTrnsEnd: Function;
|
||||
private _writeCallbacks: Function[];
|
||||
private _destroyed: boolean = false;
|
||||
private _destroyed = false;
|
||||
|
||||
parent: Animator;
|
||||
opts: AnimationOptions;
|
||||
hasChildren: boolean = false;
|
||||
isPlaying: boolean = false;
|
||||
hasCompleted: boolean = false;
|
||||
hasChildren = false;
|
||||
isPlaying = false;
|
||||
hasCompleted = false;
|
||||
|
||||
addElement(elm: Node|Node[]|NodeList): Animator {
|
||||
if (elm) {
|
||||
if ((elm as NodeList).length) {
|
||||
for (var i = 0; i < (elm as NodeList).length; i++) {
|
||||
for (let i = 0; i < (elm as NodeList).length; i++) {
|
||||
this._addElm((elm as any)[i]);
|
||||
}
|
||||
|
||||
@ -141,7 +141,7 @@ export class Animator {
|
||||
* Add the "to" value for a specific property.
|
||||
*/
|
||||
to(prop: string, val: any, clearProperyAfterTransition?: boolean): Animator {
|
||||
var fx = this._addProp('to', prop, val);
|
||||
let fx = this._addProp('to', prop, val);
|
||||
|
||||
if (clearProperyAfterTransition) {
|
||||
// if this effect is a transform then clear the transform effect
|
||||
@ -174,11 +174,11 @@ export class Animator {
|
||||
}
|
||||
|
||||
private _addProp(state: string, prop: string, val: any): EffectProperty {
|
||||
var fxProp = this._getProp(prop);
|
||||
let fxProp = this._getProp(prop);
|
||||
|
||||
if (!fxProp) {
|
||||
// first time we've see this EffectProperty
|
||||
var shouldTrans = (TRANSFORM_PROPS[prop] === 1);
|
||||
let shouldTrans = (TRANSFORM_PROPS[prop] === 1);
|
||||
fxProp = {
|
||||
effectName: prop,
|
||||
trans: shouldTrans,
|
||||
@ -190,7 +190,7 @@ export class Animator {
|
||||
}
|
||||
|
||||
// add from/to EffectState to the EffectProperty
|
||||
var fxState: EffectState = {
|
||||
let fxState: EffectState = {
|
||||
val: val,
|
||||
num: null,
|
||||
effectUnit: '',
|
||||
@ -198,8 +198,8 @@ export class Animator {
|
||||
fxProp[state] = fxState;
|
||||
|
||||
if (typeof val === 'string' && val.indexOf(' ') < 0) {
|
||||
var r = val.match(CSS_VALUE_REGEX);
|
||||
var num = parseFloat(r[1]);
|
||||
let r = val.match(CSS_VALUE_REGEX);
|
||||
let num = parseFloat(r[1]);
|
||||
|
||||
if (!isNaN(num)) {
|
||||
fxState.num = num;
|
||||
@ -246,7 +246,7 @@ export class Animator {
|
||||
*/
|
||||
beforeClearStyles(propertyNames: string[]): Animator {
|
||||
this._beforeStyles = this._beforeStyles || {};
|
||||
for (var i = 0; i < propertyNames.length; i++) {
|
||||
for (let i = 0; i < propertyNames.length; i++) {
|
||||
this._beforeStyles[propertyNames[i]] = '';
|
||||
}
|
||||
return this;
|
||||
@ -303,7 +303,7 @@ export class Animator {
|
||||
*/
|
||||
afterClearStyles(propertyNames: string[]): Animator {
|
||||
this._afterStyles = this._afterStyles || {};
|
||||
for (var i = 0; i < propertyNames.length; i++) {
|
||||
for (let i = 0; i < propertyNames.length; i++) {
|
||||
this._afterStyles[propertyNames[i]] = '';
|
||||
}
|
||||
return this;
|
||||
@ -313,7 +313,7 @@ export class Animator {
|
||||
* Play the animation.
|
||||
*/
|
||||
play(opts?: PlayOptions) {
|
||||
var self = this;
|
||||
let self = this;
|
||||
|
||||
// If the animation was already invalidated (it did finish), do nothing
|
||||
if (self._destroyed) {
|
||||
@ -349,7 +349,7 @@ export class Animator {
|
||||
syncPlay() {
|
||||
// If the animation was already invalidated (it did finish), do nothing
|
||||
if (!this._destroyed) {
|
||||
var opts = { duration: 0 };
|
||||
let opts = { duration: 0 };
|
||||
this._isAsync = false;
|
||||
this._clearAsync();
|
||||
this._playInit(opts);
|
||||
@ -371,8 +371,8 @@ export class Animator {
|
||||
this.hasCompleted = false;
|
||||
this._hasDur = (this.getDuration(opts) > DURATION_MIN);
|
||||
|
||||
var children = this._childAnimations;
|
||||
for (var i = 0; i < this._childAnimationTotal; i++) {
|
||||
let children = this._childAnimations;
|
||||
for (let i = 0; i < this._childAnimationTotal; i++) {
|
||||
// ******** DOM WRITE ****************
|
||||
children[i]._playInit(opts);
|
||||
}
|
||||
@ -394,7 +394,7 @@ export class Animator {
|
||||
* ROOT ANIMATION
|
||||
*/
|
||||
_playDomInspect(opts: PlayOptions) {
|
||||
var self = this;
|
||||
let self = this;
|
||||
// fire off all the "before" function that have DOM READS in them
|
||||
// elements will be in the DOM, however visibily hidden
|
||||
// so we can read their dimensions if need be
|
||||
@ -405,7 +405,7 @@ export class Animator {
|
||||
// for the root animation only
|
||||
// set the async TRANSITION END event
|
||||
// and run onFinishes when the transition ends
|
||||
var dur = self.getDuration(opts);
|
||||
let dur = self.getDuration(opts);
|
||||
if (self._isAsync) {
|
||||
self._asyncEnd(dur, true);
|
||||
}
|
||||
@ -427,8 +427,8 @@ export class Animator {
|
||||
* RECURSION
|
||||
*/
|
||||
_playProgress(opts: PlayOptions) {
|
||||
var children = this._childAnimations;
|
||||
for (var i = 0; i < this._childAnimationTotal; i++) {
|
||||
let children = this._childAnimations;
|
||||
for (let i = 0; i < this._childAnimationTotal; i++) {
|
||||
// ******** DOM WRITE ****************
|
||||
children[i]._playProgress(opts);
|
||||
}
|
||||
@ -460,8 +460,8 @@ export class Animator {
|
||||
*/
|
||||
_playToStep(stepValue: number) {
|
||||
if (!this._destroyed) {
|
||||
var children = this._childAnimations;
|
||||
for (var i = 0; i < this._childAnimationTotal; i++) {
|
||||
let children = this._childAnimations;
|
||||
for (let i = 0; i < this._childAnimationTotal; i++) {
|
||||
// ******** DOM WRITE ****************
|
||||
children[i]._playToStep(stepValue);
|
||||
}
|
||||
@ -482,7 +482,7 @@ export class Animator {
|
||||
* ROOT ANIMATION
|
||||
*/
|
||||
_asyncEnd(dur: number, shouldComplete: boolean) {
|
||||
var self = this;
|
||||
let self = this;
|
||||
|
||||
function onTransitionEnd() {
|
||||
// congrats! a successful transition completed!
|
||||
@ -527,8 +527,8 @@ export class Animator {
|
||||
* RECURSION
|
||||
*/
|
||||
_playEnd(stepValue?: number) {
|
||||
var children = this._childAnimations;
|
||||
for (var i = 0; i < this._childAnimationTotal; i++) {
|
||||
let children = this._childAnimations;
|
||||
for (let i = 0; i < this._childAnimationTotal; i++) {
|
||||
// ******** DOM WRITE ****************
|
||||
children[i]._playEnd(stepValue);
|
||||
}
|
||||
@ -563,8 +563,8 @@ export class Animator {
|
||||
return true;
|
||||
}
|
||||
|
||||
var children = this._childAnimations;
|
||||
for (var i = 0; i < this._childAnimationTotal; i++) {
|
||||
let children = this._childAnimations;
|
||||
for (let i = 0; i < this._childAnimationTotal; i++) {
|
||||
if (children[i]._hasDuration(opts)) {
|
||||
return true;
|
||||
}
|
||||
@ -581,8 +581,8 @@ export class Animator {
|
||||
return true;
|
||||
}
|
||||
|
||||
var children = this._childAnimations;
|
||||
for (var i = 0; i < this._childAnimationTotal; i++) {
|
||||
let children = this._childAnimations;
|
||||
for (let i = 0; i < this._childAnimationTotal; i++) {
|
||||
if (children[i]._hasDomReads()) {
|
||||
return true;
|
||||
}
|
||||
@ -619,9 +619,9 @@ export class Animator {
|
||||
*/
|
||||
_progress(stepValue: number) {
|
||||
// bread 'n butter
|
||||
var val: any;
|
||||
var effects = this._fxProperties;
|
||||
var nuElements = this._elementTotal;
|
||||
let val: any;
|
||||
let effects = this._fxProperties;
|
||||
let nuElements = this._elementTotal;
|
||||
|
||||
if (!effects || !nuElements || this._destroyed) {
|
||||
return;
|
||||
@ -631,19 +631,19 @@ export class Animator {
|
||||
if (this._isReverse) {
|
||||
stepValue = 1 - stepValue;
|
||||
}
|
||||
var i = 0;
|
||||
var j = 0;
|
||||
var finalTransform = '';
|
||||
var elements = this._elements;
|
||||
var fx: EffectProperty;
|
||||
let i = 0;
|
||||
let j = 0;
|
||||
let finalTransform = '';
|
||||
let elements = this._elements;
|
||||
let fx: EffectProperty;
|
||||
|
||||
for (i = 0; i < effects.length; i++) {
|
||||
fx = effects[i];
|
||||
|
||||
if (fx.from && fx.to) {
|
||||
var fromNum = fx.from.num;
|
||||
var toNum = fx.to.num;
|
||||
var tweenEffect = (fromNum !== toNum);
|
||||
let fromNum = fx.from.num;
|
||||
let toNum = fx.to.num;
|
||||
let tweenEffect = (fromNum !== toNum);
|
||||
|
||||
if (tweenEffect) {
|
||||
this._hasTweenEffect = true;
|
||||
@ -659,8 +659,8 @@ export class Animator {
|
||||
|
||||
} else if (tweenEffect) {
|
||||
// EVERYTHING IN BETWEEN
|
||||
var valNum = (((toNum - fromNum) * stepValue) + fromNum);
|
||||
var unit = fx.to.effectUnit;
|
||||
let valNum = (((toNum - fromNum) * stepValue) + fromNum);
|
||||
let unit = fx.to.effectUnit;
|
||||
if (unit === 'px') {
|
||||
valNum = Math.round(valNum);
|
||||
}
|
||||
@ -668,7 +668,7 @@ export class Animator {
|
||||
}
|
||||
|
||||
if (val !== null) {
|
||||
var prop = fx.effectName;
|
||||
let prop = fx.effectName;
|
||||
if (fx.trans) {
|
||||
finalTransform += prop + '(' + val + ') ';
|
||||
|
||||
@ -706,15 +706,15 @@ export class Animator {
|
||||
}
|
||||
|
||||
// set the TRANSITION properties inline on the element
|
||||
var elements = this._elements;
|
||||
var easing = (forcedLinearEasing ? 'linear' : this.getEasing());
|
||||
var durString = dur + 'ms';
|
||||
var cssTransform = CSS_PROP.transitionProp;
|
||||
var cssTransitionDuration = CSS_PROP.transitionDurationProp;
|
||||
var cssTransitionTimingFn = CSS_PROP.transitionTimingFnProp;
|
||||
let elements = this._elements;
|
||||
let easing = (forcedLinearEasing ? 'linear' : this.getEasing());
|
||||
let durString = dur + 'ms';
|
||||
let cssTransform = CSS_PROP.transitionProp;
|
||||
let cssTransitionDuration = CSS_PROP.transitionDurationProp;
|
||||
let cssTransitionTimingFn = CSS_PROP.transitionTimingFnProp;
|
||||
|
||||
var eleStyle: any;
|
||||
for (var i = 0; i < this._elementTotal; i++) {
|
||||
let eleStyle: any;
|
||||
for (let i = 0; i < this._elementTotal; i++) {
|
||||
eleStyle = elements[i].style;
|
||||
if (dur > 0) {
|
||||
// ******** DOM WRITE ****************
|
||||
@ -760,8 +760,8 @@ export class Animator {
|
||||
* RECURSION
|
||||
*/
|
||||
_setBeforeStyles() {
|
||||
var i: number, j: number;
|
||||
var children = this._childAnimations;
|
||||
let i: number, j: number;
|
||||
let children = this._childAnimations;
|
||||
for (i = 0; i < this._childAnimationTotal; i++) {
|
||||
children[i]._setBeforeStyles();
|
||||
}
|
||||
@ -771,12 +771,12 @@ export class Animator {
|
||||
if (this._isReverse) {
|
||||
return;
|
||||
}
|
||||
var addClasses = this._beforeAddClasses;
|
||||
var removeClasses = this._beforeRemoveClasses;
|
||||
let addClasses = this._beforeAddClasses;
|
||||
let removeClasses = this._beforeRemoveClasses;
|
||||
|
||||
var elm: HTMLElement;
|
||||
var elementClassList: DOMTokenList;
|
||||
var prop: string;
|
||||
let elm: HTMLElement;
|
||||
let elementClassList: DOMTokenList;
|
||||
let prop: string;
|
||||
for (i = 0; i < this._elementTotal; i++) {
|
||||
elm = this._elements[i];
|
||||
elementClassList = elm.classList;
|
||||
@ -812,15 +812,15 @@ export class Animator {
|
||||
* RECURSION
|
||||
*/
|
||||
_fireBeforeReadFunc() {
|
||||
var children = this._childAnimations;
|
||||
var i = 0;
|
||||
let children = this._childAnimations;
|
||||
let i = 0;
|
||||
|
||||
for (i = 0; i < this._childAnimationTotal; i++) {
|
||||
// ******** DOM READ ****************
|
||||
children[i]._fireBeforeReadFunc();
|
||||
}
|
||||
|
||||
var readFunctions = this._readCallbacks;
|
||||
let readFunctions = this._readCallbacks;
|
||||
if (readFunctions) {
|
||||
for (i = 0; i < readFunctions.length; i++) {
|
||||
// ******** DOM READ ****************
|
||||
@ -834,15 +834,15 @@ export class Animator {
|
||||
* RECURSION
|
||||
*/
|
||||
_fireBeforeWriteFunc() {
|
||||
var children = this._childAnimations;
|
||||
var i = 0;
|
||||
let children = this._childAnimations;
|
||||
let i = 0;
|
||||
|
||||
for (i = 0; i < this._childAnimationTotal; i++) {
|
||||
// ******** DOM WRITE ****************
|
||||
children[i]._fireBeforeWriteFunc();
|
||||
}
|
||||
|
||||
var writeFunctions = this._writeCallbacks;
|
||||
let writeFunctions = this._writeCallbacks;
|
||||
if (this._writeCallbacks) {
|
||||
for (i = 0; i < writeFunctions.length; i++) {
|
||||
// ******** DOM WRITE ****************
|
||||
@ -855,11 +855,11 @@ export class Animator {
|
||||
* DOM WRITE
|
||||
*/
|
||||
_setAfterStyles() {
|
||||
var i: number, j: number;
|
||||
var elm: HTMLElement;
|
||||
var elementClassList: DOMTokenList;
|
||||
var elements = this._elements;
|
||||
var prop: string;
|
||||
let i: number, j: number;
|
||||
let elm: HTMLElement;
|
||||
let elementClassList: DOMTokenList;
|
||||
let elements = this._elements;
|
||||
let prop: string;
|
||||
|
||||
for (i = 0; i < this._elementTotal; i++) {
|
||||
elm = elements[i];
|
||||
@ -931,15 +931,15 @@ export class Animator {
|
||||
* NO RECURSION
|
||||
*/
|
||||
_willChange(addWillChange: boolean) {
|
||||
var i = 0;
|
||||
var wc: string[];
|
||||
var effects = this._fxProperties;
|
||||
var willChange: string;
|
||||
let i = 0;
|
||||
let wc: string[];
|
||||
let effects = this._fxProperties;
|
||||
let willChange: string;
|
||||
|
||||
if (addWillChange && effects) {
|
||||
wc = [];
|
||||
for (i = 0; i < effects.length; i++) {
|
||||
var propWC = effects[i].wc;
|
||||
let propWC = effects[i].wc;
|
||||
if (propWC === 'webkitTransform') {
|
||||
wc.push('transform', '-webkit-transform');
|
||||
|
||||
@ -978,8 +978,8 @@ export class Animator {
|
||||
* RECURSION
|
||||
*/
|
||||
_progressStart() {
|
||||
var children = this._childAnimations;
|
||||
for (var i = 0; i < this._childAnimationTotal; i++) {
|
||||
let children = this._childAnimations;
|
||||
for (let i = 0; i < this._childAnimationTotal; i++) {
|
||||
// ******** DOM WRITE ****************
|
||||
children[i]._progressStart();
|
||||
}
|
||||
@ -999,8 +999,8 @@ export class Animator {
|
||||
// only update if the last update was more than 16ms ago
|
||||
stepValue = Math.min(1, Math.max(0, stepValue));
|
||||
|
||||
var children = this._childAnimations;
|
||||
for (var i = 0; i < this._childAnimationTotal; i++) {
|
||||
let children = this._childAnimations;
|
||||
for (let i = 0; i < this._childAnimationTotal; i++) {
|
||||
// ******** DOM WRITE ****************
|
||||
children[i].progressStep(stepValue);
|
||||
}
|
||||
@ -1013,7 +1013,7 @@ export class Animator {
|
||||
* End the progress animation.
|
||||
*/
|
||||
progressEnd(shouldComplete: boolean, currentStepValue: number, dur: number) {
|
||||
var self = this;
|
||||
let self = this;
|
||||
if (dur === undefined) {
|
||||
dur = -1;
|
||||
}
|
||||
@ -1023,9 +1023,9 @@ export class Animator {
|
||||
// flip the step value: 0 becomes 1, 1 becomes 0
|
||||
currentStepValue = ((currentStepValue * -1) + 1);
|
||||
}
|
||||
var stepValue = shouldComplete ? 1 : 0;
|
||||
let stepValue = shouldComplete ? 1 : 0;
|
||||
|
||||
var diff = Math.abs(currentStepValue - stepValue);
|
||||
let diff = Math.abs(currentStepValue - stepValue);
|
||||
if (diff < 0.05) {
|
||||
dur = 0;
|
||||
} else if (dur < 0) {
|
||||
@ -1058,8 +1058,8 @@ export class Animator {
|
||||
* RECURSION
|
||||
*/
|
||||
_progressEnd(shouldComplete: boolean, stepValue: number, dur: number, isAsync: boolean) {
|
||||
var children = this._childAnimations;
|
||||
for (var i = 0; i < this._childAnimationTotal; i++) {
|
||||
let children = this._childAnimations;
|
||||
for (let i = 0; i < this._childAnimationTotal; i++) {
|
||||
// ******** DOM WRITE ****************
|
||||
children[i]._progressEnd(shouldComplete, stepValue, dur, isAsync);
|
||||
}
|
||||
@ -1108,8 +1108,8 @@ export class Animator {
|
||||
* RECURSION
|
||||
*/
|
||||
_didFinishAll(hasCompleted: boolean, finishAsyncAnimations: boolean, finishNoDurationAnimations: boolean) {
|
||||
var children = this._childAnimations;
|
||||
for (var i = 0; i < this._childAnimationTotal; i++) {
|
||||
let children = this._childAnimations;
|
||||
for (let i = 0; i < this._childAnimationTotal; i++) {
|
||||
children[i]._didFinishAll(hasCompleted, finishAsyncAnimations, finishNoDurationAnimations);
|
||||
}
|
||||
|
||||
@ -1124,7 +1124,7 @@ export class Animator {
|
||||
_didFinish(hasCompleted: boolean) {
|
||||
this.isPlaying = false;
|
||||
this.hasCompleted = hasCompleted;
|
||||
var i = 0;
|
||||
let i = 0;
|
||||
|
||||
if (this._onFinishCallbacks) {
|
||||
// run all finish callbacks
|
||||
@ -1149,8 +1149,8 @@ export class Animator {
|
||||
if (shouldReverse === undefined) {
|
||||
shouldReverse = true;
|
||||
}
|
||||
var children = this._childAnimations;
|
||||
for (var i = 0; i < this._childAnimationTotal; i++) {
|
||||
let children = this._childAnimations;
|
||||
for (let i = 0; i < this._childAnimationTotal; i++) {
|
||||
children[i].reverse(shouldReverse);
|
||||
}
|
||||
this._isReverse = shouldReverse;
|
||||
@ -1163,8 +1163,8 @@ export class Animator {
|
||||
destroy() {
|
||||
this._destroyed = true;
|
||||
|
||||
var children = this._childAnimations;
|
||||
for (var i = 0; i < this._childAnimationTotal; i++) {
|
||||
let children = this._childAnimations;
|
||||
for (let i = 0; i < this._childAnimationTotal; i++) {
|
||||
children[i].destroy();
|
||||
}
|
||||
|
||||
@ -1200,9 +1200,9 @@ export class Animator {
|
||||
*/
|
||||
_transEl(): HTMLElement {
|
||||
// get the lowest level element that has an Animation
|
||||
var targetEl: HTMLElement;
|
||||
let targetEl: HTMLElement;
|
||||
|
||||
for (var i = 0; i < this._childAnimationTotal; i++) {
|
||||
for (let i = 0; i < this._childAnimationTotal; i++) {
|
||||
targetEl = this._childAnimations[i]._transEl();
|
||||
if (targetEl) {
|
||||
return targetEl;
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
|
||||
export var CSS_PROP = function(docEle: HTMLElement) {
|
||||
var css: {
|
||||
export let CSS_PROP = function(docEle: HTMLElement) {
|
||||
let css: {
|
||||
transformProp?: string;
|
||||
transitionProp?: string;
|
||||
transitionDurationProp?: string;
|
||||
@ -8,8 +8,8 @@ export var CSS_PROP = function(docEle: HTMLElement) {
|
||||
} = {};
|
||||
|
||||
// transform
|
||||
var i: number;
|
||||
var keys = ['webkitTransform', '-webkit-transform', 'webkit-transform', 'transform'];
|
||||
let i: number;
|
||||
let keys = ['webkitTransform', '-webkit-transform', 'webkit-transform', 'transform'];
|
||||
|
||||
for (i = 0; i < keys.length; i++) {
|
||||
if ((docEle.style as any)[keys[i]] !== undefined) {
|
||||
@ -28,7 +28,7 @@ export var CSS_PROP = function(docEle: HTMLElement) {
|
||||
}
|
||||
|
||||
// The only prefix we care about is webkit for transitions.
|
||||
var prefix = css.transitionProp.indexOf('webkit') > -1 ? '-webkit-' : '';
|
||||
let prefix = css.transitionProp.indexOf('webkit') > -1 ? '-webkit-' : '';
|
||||
|
||||
// transition duration
|
||||
css.transitionDurationProp = prefix + 'transition-duration';
|
||||
@ -41,7 +41,7 @@ export var CSS_PROP = function(docEle: HTMLElement) {
|
||||
}(document.documentElement);
|
||||
|
||||
|
||||
export var TRANSFORM_PROPS: {[key: string]: number} = {
|
||||
export let TRANSFORM_PROPS: {[key: string]: number} = {
|
||||
'translateX': 1,
|
||||
'translateY': 1,
|
||||
'translateZ': 1,
|
||||
@ -61,6 +61,6 @@ export var TRANSFORM_PROPS: {[key: string]: number} = {
|
||||
'perspective': 1
|
||||
};
|
||||
|
||||
export var CSS_VALUE_REGEX = /(^-?\d*\.?\d*)(.*)/;
|
||||
export var DURATION_MIN = 32;
|
||||
export var TRANSITION_END_FALLBACK_PADDING_MS = 400;
|
||||
export let CSS_VALUE_REGEX = /(^-?\d*\.?\d*)(.*)/;
|
||||
export let DURATION_MIN = 32;
|
||||
export let TRANSITION_END_FALLBACK_PADDING_MS = 400;
|
||||
|
||||
@ -1,9 +1,9 @@
|
||||
|
||||
|
||||
export function transitionEnd(elm: HTMLElement, callback: {(ev?: TransitionEvent): void}) {
|
||||
var unRegTrans: Function;
|
||||
var unRegWKTrans: Function;
|
||||
var opts: any = { passive: true };
|
||||
let unRegTrans: Function;
|
||||
let unRegWKTrans: Function;
|
||||
let opts: any = { passive: true };
|
||||
|
||||
function unregister() {
|
||||
unRegWKTrans && unRegWKTrans();
|
||||
|
||||
@ -19,8 +19,8 @@ export class App {
|
||||
@Element() element: HTMLElement;
|
||||
|
||||
@State() modeCode: string;
|
||||
@State() hoverCSS: boolean = false;
|
||||
@State() useRouter: boolean = false;
|
||||
@State() hoverCSS = false;
|
||||
@State() useRouter = false;
|
||||
|
||||
@Prop({ context: 'config' }) config: Config;
|
||||
|
||||
|
||||
@ -25,7 +25,7 @@ export class Button {
|
||||
* The type of button.
|
||||
* Possible values are: `"button"`, `"bar-button"`.
|
||||
*/
|
||||
@Prop() buttonType: string = 'button';
|
||||
@Prop() buttonType = 'button';
|
||||
|
||||
/**
|
||||
* The button size.
|
||||
@ -36,7 +36,7 @@ export class Button {
|
||||
/**
|
||||
* If true, sets the button into a disabled state.
|
||||
*/
|
||||
@Prop() disabled: boolean = false;
|
||||
@Prop() disabled = false;
|
||||
|
||||
/**
|
||||
* Set to `"clear"` for a transparent button, to `"outline"` for a transparent
|
||||
@ -48,7 +48,7 @@ export class Button {
|
||||
/**
|
||||
* If true, activates a button with rounded corners.
|
||||
*/
|
||||
@Prop() round: boolean = false;
|
||||
@Prop() round = false;
|
||||
|
||||
/**
|
||||
* Set to `"block"` for a full-width button or to `"full"` for a full-width button
|
||||
@ -59,7 +59,7 @@ export class Button {
|
||||
/**
|
||||
* If true, activates a button with a heavier font weight.
|
||||
*/
|
||||
@Prop() strong: boolean = false;
|
||||
@Prop() strong = false;
|
||||
|
||||
/**
|
||||
* The color to use from your Sass `$colors` map.
|
||||
|
||||
@ -12,7 +12,7 @@ export class Buttons {
|
||||
|
||||
componentDidLoad() {
|
||||
const buttons = this.el.querySelectorAll('ion-button') as any;
|
||||
for (var i = 0; i < buttons.length; i++) {
|
||||
for (let i = 0; i < buttons.length; i++) {
|
||||
buttons[i].setAttribute('button-type', 'bar-button');
|
||||
}
|
||||
}
|
||||
|
||||
@ -29,7 +29,7 @@ export class CardHeader {
|
||||
* If true, adds transparency to the card header.
|
||||
* Only affects `ios` mode. Defaults to `false`.
|
||||
*/
|
||||
@Prop() translucent: boolean = false;
|
||||
@Prop() translucent = false;
|
||||
|
||||
hostData() {
|
||||
const themedClasses = this.translucent ? createThemedClasses(this.mode, this.color, 'card-header-translucent') : {};
|
||||
|
||||
@ -40,7 +40,7 @@ export class ChipButton {
|
||||
/**
|
||||
* @input {boolean} If true, sets the button into a disabled state.
|
||||
*/
|
||||
@Prop() disabled: boolean = false;
|
||||
@Prop() disabled = false;
|
||||
|
||||
/**
|
||||
* Get the classes based on the button type
|
||||
@ -60,7 +60,7 @@ export class ChipButton {
|
||||
* Get the classes for the color
|
||||
*/
|
||||
private getColorClassList(color: string, buttonType: string, style: string, mode: string): string[] {
|
||||
let className = (style === 'default') ? `${buttonType}` : `${buttonType}-${style}`;
|
||||
const className = (style === 'default') ? `${buttonType}` : `${buttonType}-${style}`;
|
||||
|
||||
return [`${className}-${mode}`].concat(
|
||||
style !== 'default' ? `${className}` : [],
|
||||
|
||||
@ -45,7 +45,7 @@ export class Content {
|
||||
* and footers. This effect can easily be seen by setting the toolbar
|
||||
* to transparent.
|
||||
*/
|
||||
@Prop() fullscreen: boolean = false;
|
||||
@Prop() fullscreen = false;
|
||||
|
||||
@Listen('body:ionNavChanged')
|
||||
onNavChanged() {
|
||||
@ -53,7 +53,7 @@ export class Content {
|
||||
}
|
||||
|
||||
componentDidLoad() {
|
||||
this.scrollEl = this.el.querySelector('ion-scroll') as HTMLIonScrollElement;
|
||||
this.scrollEl = this.el.querySelector('ion-scroll');
|
||||
this.resize();
|
||||
}
|
||||
|
||||
@ -81,7 +81,7 @@ export class Content {
|
||||
* @returns {Promise} Returns a promise which is resolved when the scroll has completed.
|
||||
*/
|
||||
@Method()
|
||||
scrollToTop(duration: number = 300) {
|
||||
scrollToTop(duration = 300) {
|
||||
return this.scrollEl.scrollToTop(duration);
|
||||
}
|
||||
|
||||
@ -92,7 +92,7 @@ export class Content {
|
||||
* @returns {Promise} Returns a promise which is resolved when the scroll has completed.
|
||||
*/
|
||||
@Method()
|
||||
scrollToBottom(duration: number = 300) {
|
||||
scrollToBottom(duration = 300) {
|
||||
return this.scrollEl.scrollToBottom(duration);
|
||||
}
|
||||
|
||||
|
||||
@ -6,12 +6,12 @@ export function renderDatetime(template: string, value: DatetimeData, locale: Lo
|
||||
return '';
|
||||
}
|
||||
|
||||
let tokens: string[] = [];
|
||||
const tokens: string[] = [];
|
||||
let hasText = false;
|
||||
FORMAT_KEYS.forEach((format, index) => {
|
||||
if (template.indexOf(format.f) > -1) {
|
||||
var token = '{' + index + '}';
|
||||
var text = renderTextFormat(format.f, (value as any)[format.k], value, locale);
|
||||
const token = '{' + index + '}';
|
||||
const text = renderTextFormat(format.f, (value as any)[format.k], value, locale);
|
||||
|
||||
if (!hasText && text && (value as any)[format.k]) {
|
||||
hasText = true;
|
||||
@ -27,7 +27,7 @@ export function renderDatetime(template: string, value: DatetimeData, locale: Lo
|
||||
return '';
|
||||
}
|
||||
|
||||
for (var i = 0; i < tokens.length; i += 2) {
|
||||
for (let i = 0; i < tokens.length; i += 2) {
|
||||
template = template.replace(tokens[i], tokens[i + 1]);
|
||||
}
|
||||
|
||||
@ -99,7 +99,7 @@ export function renderTextFormat(format: string, value: any, date: DatetimeData,
|
||||
|
||||
|
||||
export function dateValueRange(format: string, min: DatetimeData, max: DatetimeData): any[] {
|
||||
let opts: any[] = [];
|
||||
const opts: any[] = [];
|
||||
let i: number;
|
||||
|
||||
if (format === FORMAT_YYYY || format === FORMAT_YY) {
|
||||
@ -150,7 +150,7 @@ export function dateValueRange(format: string, min: DatetimeData, max: DatetimeD
|
||||
return opts;
|
||||
}
|
||||
|
||||
export function dateSortValue(year: number, month: number, day: number, hour: number = 0, minute: number = 0): number {
|
||||
export function dateSortValue(year: number, month: number, day: number, hour = 0, minute = 0): number {
|
||||
return parseInt(`1${fourDigit(year)}${twoDigit(month)}${twoDigit(day)}${twoDigit(hour)}${twoDigit(minute)}`, 10);
|
||||
}
|
||||
|
||||
@ -198,11 +198,11 @@ export function parseDate(val: any): DatetimeData {
|
||||
}
|
||||
|
||||
// ensure all the parse values exist with at least 0
|
||||
for (var i = 1; i < 8; i++) {
|
||||
for (let i = 1; i < 8; i++) {
|
||||
parse[i] = (parse[i] !== undefined ? parseInt(parse[i], 10) : null);
|
||||
}
|
||||
|
||||
var tzOffset = 0;
|
||||
let tzOffset = 0;
|
||||
if (parse[9] && parse[10]) {
|
||||
// hours
|
||||
tzOffset = parseInt(parse[10], 10) * 60;
|
||||
@ -258,7 +258,7 @@ export function updateDate(existingData: DatetimeData, newData: any): boolean {
|
||||
|
||||
// merge new values from the picker's selection
|
||||
// to the existing DatetimeData values
|
||||
for (var k in newData) {
|
||||
for (const k in newData) {
|
||||
(existingData as any)[k] = newData[k].value;
|
||||
}
|
||||
|
||||
@ -270,7 +270,7 @@ export function updateDate(existingData: DatetimeData, newData: any): boolean {
|
||||
|
||||
} else {
|
||||
// blank data, clear everything out
|
||||
for (let k in existingData) {
|
||||
for (const k in existingData) {
|
||||
delete (existingData as any)[k];
|
||||
}
|
||||
}
|
||||
@ -324,7 +324,7 @@ export function getValueFromFormat(date: DatetimeData, format: string) {
|
||||
|
||||
|
||||
export function convertFormatToKey(format: string): string {
|
||||
for (var k in FORMAT_KEYS) {
|
||||
for (const k in FORMAT_KEYS) {
|
||||
if (FORMAT_KEYS[k].f === format) {
|
||||
return FORMAT_KEYS[k].k;
|
||||
}
|
||||
@ -406,7 +406,7 @@ export function convertToArrayOfStrings(input: any, type: string): string[] {
|
||||
input = input.replace(/\[|\]/g, '').split(',');
|
||||
}
|
||||
|
||||
var values: string[];
|
||||
let values: string[];
|
||||
if (isArray(input)) {
|
||||
// trim up each string value
|
||||
values = input.map((val: string) => val.trim());
|
||||
|
||||
@ -50,7 +50,7 @@ export class Datetime {
|
||||
/**
|
||||
* @input {boolean} If true, the user cannot interact with the datetime. Defaults to `false`.
|
||||
*/
|
||||
@Prop() disabled: boolean = false;
|
||||
@Prop() disabled = false;
|
||||
|
||||
/**
|
||||
* @input {string} The minimum datetime allowed. Value must be a date string
|
||||
@ -79,7 +79,7 @@ export class Datetime {
|
||||
* the datetime picker's columns. See the `pickerFormat` input description for
|
||||
* more info. Defaults to `MMM D, YYYY`.
|
||||
*/
|
||||
@Prop() displayFormat: string = 'MMM D, YYYY';
|
||||
@Prop() displayFormat = 'MMM D, YYYY';
|
||||
|
||||
/**
|
||||
* @input {string} The format of the date and time picker columns the user selects.
|
||||
@ -94,12 +94,12 @@ export class Datetime {
|
||||
/**
|
||||
* @input {string} The text to display on the picker's cancel button. Default: `Cancel`.
|
||||
*/
|
||||
@Prop() cancelText: string = 'Cancel';
|
||||
@Prop() cancelText = 'Cancel';
|
||||
|
||||
/**
|
||||
* @input {string} The text to display on the picker's "Done" button. Default: `Done`.
|
||||
*/
|
||||
@Prop() doneText: string = 'Done';
|
||||
@Prop() doneText = 'Done';
|
||||
|
||||
/**
|
||||
* @input {array | string} Values used to create the list of selectable years. By default
|
||||
@ -311,7 +311,7 @@ export class Datetime {
|
||||
parseTemplate(template).forEach((format: any) => {
|
||||
// loop through each format in the template
|
||||
// create a new picker column to build up with data
|
||||
let key = convertFormatToKey(format);
|
||||
const key = convertFormatToKey(format);
|
||||
let values: any[];
|
||||
|
||||
// first see if they have exact values to use for this input
|
||||
@ -379,7 +379,7 @@ export class Datetime {
|
||||
selectedYear = yearCol.options[0].value;
|
||||
}
|
||||
|
||||
var yearOpt = yearCol.options[yearCol.selectedIndex];
|
||||
const yearOpt = yearCol.options[yearCol.selectedIndex];
|
||||
if (yearOpt) {
|
||||
// they have a selected year value
|
||||
selectedYear = yearOpt.value;
|
||||
@ -423,7 +423,7 @@ export class Datetime {
|
||||
const todaysYear = (now || new Date()).getFullYear();
|
||||
|
||||
if (this.yearValues) {
|
||||
var years = convertToArrayOfNumbers(this.yearValues, 'year');
|
||||
const years = convertToArrayOfNumbers(this.yearValues, 'year');
|
||||
if (isBlank(this.min)) {
|
||||
this.min = Math.min.apply(Math, years);
|
||||
}
|
||||
@ -486,13 +486,13 @@ export class Datetime {
|
||||
let indexMin = options.length - 1;
|
||||
let indexMax = 0;
|
||||
|
||||
for (var i = 0; i < options.length; i++) {
|
||||
var opt = options[i];
|
||||
var value = opt.value;
|
||||
for (let i = 0; i < options.length; i++) {
|
||||
const opt = options[i];
|
||||
const value = opt.value;
|
||||
lb[index] = opt.value;
|
||||
ub[index] = opt.value;
|
||||
|
||||
var disabled = opt.disabled = (
|
||||
const disabled = opt.disabled = (
|
||||
value < lowerBounds[index] ||
|
||||
value > upperBounds[index] ||
|
||||
dateSortValue(ub[0], ub[1], ub[2], ub[3], ub[4]) < min ||
|
||||
@ -503,7 +503,7 @@ export class Datetime {
|
||||
indexMax = Math.max(indexMax, i);
|
||||
}
|
||||
}
|
||||
let selectedIndex = column.selectedIndex = clamp(indexMin, column.selectedIndex, indexMax);
|
||||
const selectedIndex = column.selectedIndex = clamp(indexMin, column.selectedIndex, indexMax);
|
||||
opt = column.options[selectedIndex];
|
||||
if (opt) {
|
||||
return opt.value;
|
||||
@ -516,14 +516,14 @@ export class Datetime {
|
||||
*/
|
||||
divyColumns(columns: PickerColumn[]): PickerColumn[] {
|
||||
const pickerColumns = columns;
|
||||
let columnsWidth: number[] = [];
|
||||
const columnsWidth: number[] = [];
|
||||
let col: PickerColumn;
|
||||
let width: number;
|
||||
for (var i = 0; i < pickerColumns.length; i++) {
|
||||
for (let i = 0; i < pickerColumns.length; i++) {
|
||||
col = pickerColumns[i];
|
||||
columnsWidth.push(0);
|
||||
|
||||
for (var j = 0; j < col.options.length; j++) {
|
||||
for (let j = 0; j < col.options.length; j++) {
|
||||
width = col.options[j].text.length;
|
||||
if (width > columnsWidth[i]) {
|
||||
columnsWidth[i] = width;
|
||||
|
||||
@ -36,20 +36,20 @@ export class FabButton {
|
||||
* @input {boolean} If true, adds transparency to the fab.
|
||||
* Only affects `ios` mode. Defaults to `false`.
|
||||
*/
|
||||
@Prop() translucent: boolean = false;
|
||||
@Prop() translucent = false;
|
||||
|
||||
@Prop() activated: boolean = false;
|
||||
@Prop() activated = false;
|
||||
@Prop() toggleActive: Function = () => {};
|
||||
|
||||
@Prop() show: boolean = false;
|
||||
@Prop() show = false;
|
||||
|
||||
@State() private inContainer: boolean = false;
|
||||
@State() private inList: boolean = false;
|
||||
@State() private inContainer = false;
|
||||
@State() private inList = false;
|
||||
|
||||
/**
|
||||
* @input {boolean} If true, sets the button into a disabled state.
|
||||
*/
|
||||
@Prop() disabled: boolean = false;
|
||||
@Prop() disabled = false;
|
||||
|
||||
componentDidLoad() {
|
||||
const parentNode = this.el.parentNode.nodeName;
|
||||
@ -72,7 +72,7 @@ export class FabButton {
|
||||
if (!this.inList) {
|
||||
return [];
|
||||
}
|
||||
let listClasses = [
|
||||
const listClasses = [
|
||||
`fab-button-in-list`,
|
||||
`fab-button-${this.mode}-in-list`
|
||||
];
|
||||
|
||||
@ -8,15 +8,15 @@ import { Component, Element, Prop, Watch } from '@stencil/core';
|
||||
export class FabList {
|
||||
@Element() private el: HTMLIonFabElement;
|
||||
|
||||
@Prop() activated: boolean = false;
|
||||
@Prop() activated = false;
|
||||
|
||||
@Watch('activated')
|
||||
protected activatedChanged(activated: boolean) {
|
||||
const fabs = this.el.querySelectorAll('ion-fab-button');
|
||||
|
||||
// if showing the fabs add a timeout, else show immediately
|
||||
var timeout = activated ? 30 : 0;
|
||||
for (var i = 0; i < fabs.length; i++) {
|
||||
let timeout = activated ? 30 : 0;
|
||||
for (let i = 0; i < fabs.length; i++) {
|
||||
const fab = fabs[i];
|
||||
setTimeout(() => fab.show = activated, i * timeout);
|
||||
}
|
||||
|
||||
@ -22,7 +22,7 @@ export class Footer {
|
||||
* attribute needs to be set on the content.
|
||||
* Only affects `ios` mode. Defaults to `false`.
|
||||
*/
|
||||
@Prop() translucent: boolean = false;
|
||||
@Prop() translucent = false;
|
||||
|
||||
hostData() {
|
||||
const themedClasses = this.translucent ? createThemedClasses(this.mode, this.color, 'header-translucent') : {};
|
||||
|
||||
@ -5,7 +5,7 @@ import { Component } from '@stencil/core';
|
||||
tag: 'ion-gesture-controller'
|
||||
})
|
||||
export class GestureController {
|
||||
private gestureId: number = 0;
|
||||
private gestureId = 0;
|
||||
private requestedStart: { [eventId: number]: number } = {};
|
||||
private disabledGestures: { [eventName: string]: Set<number> } = {};
|
||||
private disabledScroll: Set<number> = new Set<number>();
|
||||
@ -41,9 +41,9 @@ export class GestureController {
|
||||
if (!this.start(gestureName, id, priority)) {
|
||||
return false;
|
||||
}
|
||||
let requestedStart = this.requestedStart;
|
||||
const requestedStart = this.requestedStart;
|
||||
let maxPriority = -10000;
|
||||
for (let gestureID in requestedStart) {
|
||||
for (const gestureID in requestedStart) {
|
||||
maxPriority = Math.max(maxPriority, requestedStart[gestureID]);
|
||||
}
|
||||
|
||||
@ -75,7 +75,7 @@ export class GestureController {
|
||||
}
|
||||
|
||||
enableGesture(gestureName: string, id: number) {
|
||||
let set = this.disabledGestures[gestureName];
|
||||
const set = this.disabledGestures[gestureName];
|
||||
if (set) {
|
||||
set.delete(id);
|
||||
}
|
||||
@ -121,7 +121,7 @@ export class GestureController {
|
||||
}
|
||||
|
||||
isDisabled(gestureName: string): boolean {
|
||||
let disabled = this.disabledGestures[gestureName];
|
||||
const disabled = this.disabledGestures[gestureName];
|
||||
if (disabled && disabled.size > 0) {
|
||||
return true;
|
||||
}
|
||||
@ -162,7 +162,7 @@ export class GestureDelegate {
|
||||
return false;
|
||||
}
|
||||
|
||||
let captured = this.ctrl.capture(this.name, this.gestureDelegateId, this.priority);
|
||||
const captured = this.ctrl.capture(this.name, this.gestureDelegateId, this.priority);
|
||||
if (captured && this.disableScroll) {
|
||||
this.ctrl.disableScroll(this.gestureDelegateId);
|
||||
}
|
||||
@ -190,7 +190,7 @@ export class GestureDelegate {
|
||||
|
||||
export class BlockerDelegate {
|
||||
|
||||
blocked: boolean = false;
|
||||
blocked = false;
|
||||
|
||||
constructor(
|
||||
private blockerDelegateId: number,
|
||||
|
||||
@ -30,17 +30,17 @@ export class Gesture {
|
||||
@Prop({ context: 'dom' }) dom: DomController;
|
||||
@Prop({ context: 'enableListener' }) enableListener: any;
|
||||
|
||||
@Prop() enabled: boolean = true;
|
||||
@Prop() enabled = true;
|
||||
@Prop() attachTo: ElementRef = 'child';
|
||||
@Prop() autoBlockAll: boolean = false;
|
||||
@Prop() autoBlockAll = false;
|
||||
@Prop() block: string = null;
|
||||
@Prop() disableScroll: boolean = false;
|
||||
@Prop() direction: string = 'x';
|
||||
@Prop() gestureName: string = '';
|
||||
@Prop() gesturePriority: number = 0;
|
||||
@Prop() maxAngle: number = 40;
|
||||
@Prop() threshold: number = 10;
|
||||
@Prop() type: string = 'pan';
|
||||
@Prop() disableScroll = false;
|
||||
@Prop() direction = 'x';
|
||||
@Prop() gestureName = '';
|
||||
@Prop() gesturePriority = 0;
|
||||
@Prop() maxAngle = 40;
|
||||
@Prop() threshold = 10;
|
||||
@Prop() type = 'pan';
|
||||
|
||||
@Prop() canStart: GestureCallback;
|
||||
@Prop() onWillStart: (_: GestureDetail) => Promise<void>;
|
||||
@ -277,9 +277,9 @@ export class Gesture {
|
||||
|
||||
if (startPos > 1) {
|
||||
// compute relative movement between these two points
|
||||
var frequency = 1 / (positions[startPos] - timestamp);
|
||||
var movedY = positions[startPos - 1] - currentY;
|
||||
var movedX = positions[startPos - 2] - currentX;
|
||||
let frequency = 1 / (positions[startPos] - timestamp);
|
||||
let movedY = positions[startPos - 1] - currentY;
|
||||
let movedX = positions[startPos - 2] - currentX;
|
||||
|
||||
// based on XXms compute the movement to apply for each render step
|
||||
// velocity = space/time = s*(1/t) = s*frequency
|
||||
|
||||
@ -4,7 +4,7 @@ export class PanRecognizer {
|
||||
private startX: number;
|
||||
private startY: number;
|
||||
|
||||
private dirty: boolean = false;
|
||||
private dirty = false;
|
||||
private threshold: number;
|
||||
private maxCosine: number;
|
||||
private isDirX: boolean;
|
||||
|
||||
@ -22,7 +22,7 @@ export class Header {
|
||||
* attribute needs to be set on the content.
|
||||
* Only affects `ios` mode. Defaults to `false`.
|
||||
*/
|
||||
@Prop() translucent: boolean = false;
|
||||
@Prop() translucent = false;
|
||||
|
||||
hostData() {
|
||||
const themedClasses = this.translucent ? createThemedClasses(this.mode, this.color, 'header-translucent') : {};
|
||||
|
||||
@ -13,15 +13,15 @@ const enum Position {
|
||||
})
|
||||
export class InfiniteScroll {
|
||||
|
||||
private thrPx: number = 0;
|
||||
private thrPc: number = 0.15;
|
||||
private thrPx = 0;
|
||||
private thrPc = 0.15;
|
||||
private scrollEl: HTMLIonScrollElement;
|
||||
private didFire = false;
|
||||
private isBusy = false;
|
||||
private init = false;
|
||||
|
||||
@Element() private el: HTMLElement;
|
||||
@State() isLoading: boolean = false;
|
||||
@State() isLoading = false;
|
||||
|
||||
@Prop({ context: 'dom' }) dom: DomController;
|
||||
@Prop({ context: 'enableListener' }) enableListener: any;
|
||||
@ -36,7 +36,7 @@ export class InfiniteScroll {
|
||||
* scroll is within 100 pixels from the bottom of the page.
|
||||
* Default is `15%`.
|
||||
*/
|
||||
@Prop() threshold: string = '15%';
|
||||
@Prop() threshold = '15%';
|
||||
|
||||
@Watch('threshold')
|
||||
protected thresholdChanged(val: string) {
|
||||
@ -64,7 +64,7 @@ export class InfiniteScroll {
|
||||
* enabled or not. Setting to `false` will remove scroll event listeners
|
||||
* and hide the display.
|
||||
*/
|
||||
@Prop() enabled: boolean = true;
|
||||
@Prop() enabled = true;
|
||||
|
||||
@Watch('enabled')
|
||||
protected enabledChanged(val: boolean) {
|
||||
|
||||
@ -52,27 +52,27 @@ export class Input implements InputComponent {
|
||||
/**
|
||||
* @input {string} Indicates whether and how the text value should be automatically capitalized as it is entered/edited by the user. Defaults to `"none"`.
|
||||
*/
|
||||
@Prop() autocapitalize: string = 'none';
|
||||
@Prop() autocapitalize = 'none';
|
||||
|
||||
/**
|
||||
* @input {string} Indicates whether the value of the control can be automatically completed by the browser. Defaults to `"off"`.
|
||||
*/
|
||||
@Prop() autocomplete: string = 'off';
|
||||
@Prop() autocomplete = 'off';
|
||||
|
||||
/**
|
||||
* @input {string} Whether autocorrection should be enabled when the user is entering/editing the text value. Defaults to `"off"`.
|
||||
*/
|
||||
@Prop() autocorrect: string = 'off';
|
||||
@Prop() autocorrect = 'off';
|
||||
|
||||
/**
|
||||
* @input {string} This Boolean attribute lets you specify that a form control should have input focus when the page loads. Defaults to `false`.
|
||||
*/
|
||||
@Prop() autofocus: boolean = false;
|
||||
@Prop() autofocus = false;
|
||||
|
||||
/**
|
||||
* @input {boolean} If true and the type is `checkbox` or `radio`, the control is selected by default. Defaults to `false`.
|
||||
*/
|
||||
@Prop() checked: boolean = false;
|
||||
@Prop() checked = false;
|
||||
|
||||
@Watch('checked')
|
||||
protected checkedChanged() {
|
||||
@ -82,7 +82,7 @@ export class Input implements InputComponent {
|
||||
/**
|
||||
* @input {boolean} If true, a clear icon will appear in the input when there is a value. Clicking it clears the input. Defaults to `false`.
|
||||
*/
|
||||
@Prop() clearInput: boolean = false;
|
||||
@Prop() clearInput = false;
|
||||
|
||||
/**
|
||||
* @input {boolean} If true, the value will be cleared after focus upon edit. Defaults to `true` when `type` is `"password"`, `false` for all other types.
|
||||
@ -92,7 +92,7 @@ export class Input implements InputComponent {
|
||||
/**
|
||||
* @input {number} Set the amount of time, in milliseconds, to wait to trigger the `ionInput` event after each keystroke. Default `0`.
|
||||
*/
|
||||
@Prop() debounce: number = 0;
|
||||
@Prop() debounce = 0;
|
||||
|
||||
@Watch('debounce')
|
||||
private debounceInput() {
|
||||
@ -105,7 +105,7 @@ export class Input implements InputComponent {
|
||||
/**
|
||||
* @input {boolean} If true, the user cannot interact with the input. Defaults to `false`.
|
||||
*/
|
||||
@Prop() disabled: boolean = false;
|
||||
@Prop() disabled = false;
|
||||
|
||||
@Watch('disabled')
|
||||
protected disabledChanged() {
|
||||
@ -160,12 +160,12 @@ export class Input implements InputComponent {
|
||||
/**
|
||||
* @input {boolean} If true, the user cannot modify the value. Defaults to `false`.
|
||||
*/
|
||||
@Prop() readonly: boolean = false;
|
||||
@Prop() readonly = false;
|
||||
|
||||
/**
|
||||
* @input {boolean} If true, the user must fill in a value before submitting a form.
|
||||
*/
|
||||
@Prop() required: boolean = false;
|
||||
@Prop() required = false;
|
||||
|
||||
/**
|
||||
* @input {number} This is a nonstandard attribute supported by Safari that only applies when the type is `"search"`. Its value should be a nonnegative decimal integer.
|
||||
@ -175,7 +175,7 @@ export class Input implements InputComponent {
|
||||
/**
|
||||
* @input {string} If true, the element will have its spelling and grammar checked. Defaults to `false`.
|
||||
*/
|
||||
@Prop() spellcheck: boolean = false;
|
||||
@Prop() spellcheck = false;
|
||||
|
||||
/**
|
||||
* @input {string} Works with the min and max attributes to limit the increments at which a value can be set. Possible values are: `"any"` or a positive floating point number.
|
||||
@ -190,7 +190,7 @@ export class Input implements InputComponent {
|
||||
/**
|
||||
* @input {string} The type of control to display. The default type is text. Possible values are: `"text"`, `"password"`, `"email"`, `"number"`, `"search"`, `"tel"`, or `"url"`.
|
||||
*/
|
||||
@Prop() type: string = 'text';
|
||||
@Prop() type = 'text';
|
||||
|
||||
/**
|
||||
* @input {string} The value of the input.
|
||||
@ -223,7 +223,7 @@ export class Input implements InputComponent {
|
||||
private emitStyle() {
|
||||
clearTimeout(this.styleTmr);
|
||||
|
||||
let styles = {
|
||||
const styles = {
|
||||
'input': true,
|
||||
'input-checked': this.checked,
|
||||
'input-disabled': this.disabled,
|
||||
|
||||
@ -31,7 +31,7 @@ export class ItemOption {
|
||||
/**
|
||||
* @input {boolean} If true, sets the button into a disabled state.
|
||||
*/
|
||||
@Prop() disabled: boolean = false;
|
||||
@Prop() disabled = false;
|
||||
|
||||
notCaptured() {
|
||||
// if (!clickedOptionButton(ev)) {
|
||||
@ -40,7 +40,7 @@ export class ItemOption {
|
||||
}
|
||||
|
||||
clickedOptionButton(ev: any): boolean {
|
||||
let el = ev.target.closest('ion-item-option');
|
||||
const el = ev.target.closest('ion-item-option');
|
||||
return !!el;
|
||||
}
|
||||
|
||||
|
||||
@ -45,7 +45,7 @@ export class ItemSliding {
|
||||
private tmr: any = null;
|
||||
private leftOptions: ItemOptions;
|
||||
private rightOptions: ItemOptions;
|
||||
private optsDirty: boolean = true;
|
||||
private optsDirty = true;
|
||||
private gestureOptions: any;
|
||||
|
||||
@Element() private el: HTMLElement;
|
||||
@ -172,8 +172,8 @@ export class ItemSliding {
|
||||
// Reset left and right options in case they were removed
|
||||
this.leftOptions = this.rightOptions = null;
|
||||
|
||||
for (var i = 0; i < options.length; i++) {
|
||||
let option = options.item(i);
|
||||
for (let i = 0; i < options.length; i++) {
|
||||
const option = options.item(i);
|
||||
|
||||
if (option.isRightSide()) {
|
||||
this.rightOptions = option;
|
||||
|
||||
@ -43,10 +43,10 @@ export class Item {
|
||||
|
||||
let hasChildStyleChange = false;
|
||||
|
||||
let tagName: string = (ev.target as HTMLElement).tagName;
|
||||
let updatedStyles: any = ev.detail;
|
||||
const tagName: string = (ev.target as HTMLElement).tagName;
|
||||
const updatedStyles: any = ev.detail;
|
||||
|
||||
for (var key in updatedStyles) {
|
||||
for (const key in updatedStyles) {
|
||||
if (('item-' + key) !== key) {
|
||||
Object.defineProperty(updatedStyles, 'item-' + key, Object.getOwnPropertyDescriptor(updatedStyles, key));
|
||||
delete updatedStyles[key];
|
||||
@ -65,7 +65,7 @@ export class Item {
|
||||
// Change the button size to small for each ion-button in the item
|
||||
// unless the size is explicitly set
|
||||
const buttons = this.el.querySelectorAll('ion-button');
|
||||
for (var i = 0; i < buttons.length; i++) {
|
||||
for (let i = 0; i < buttons.length; i++) {
|
||||
if (!buttons[i].size) {
|
||||
buttons[i].size = 'small';
|
||||
}
|
||||
@ -75,11 +75,11 @@ export class Item {
|
||||
render() {
|
||||
let childStyles = {};
|
||||
|
||||
for (var key in this.itemStyles) {
|
||||
for (const key in this.itemStyles) {
|
||||
childStyles = Object.assign(childStyles, this.itemStyles[key]);
|
||||
}
|
||||
|
||||
let themedClasses = {
|
||||
const themedClasses = {
|
||||
...childStyles,
|
||||
...createThemedClasses(this.mode, this.color, 'item'),
|
||||
'item-block': true
|
||||
|
||||
@ -38,17 +38,17 @@ export class Label {
|
||||
/**
|
||||
* @output {Event} If true, the label will sit alongside an input. Defaults to `false`.
|
||||
*/
|
||||
@Prop() fixed: boolean = false;
|
||||
@Prop() fixed = false;
|
||||
|
||||
/**
|
||||
* @output {Event} If true, the label will float above an input when the value is empty or the input is focused. Defaults to `false`.
|
||||
*/
|
||||
@Prop() floating: boolean = false;
|
||||
@Prop() floating = false;
|
||||
|
||||
/**
|
||||
* @output {Event} If true, the label will be stacked above an input. Defaults to `false`.
|
||||
*/
|
||||
@Prop() stacked: boolean = false;
|
||||
@Prop() stacked = false;
|
||||
|
||||
@Method()
|
||||
getText(): string {
|
||||
@ -62,7 +62,7 @@ export class Label {
|
||||
emitStyle() {
|
||||
clearTimeout(this.styleTmr);
|
||||
|
||||
let styles = {
|
||||
const styles = {
|
||||
'label-fixed': this.fixed,
|
||||
'label-floating': this.floating,
|
||||
'label-stacked': this.stacked
|
||||
|
||||
@ -86,7 +86,7 @@ export class Loading {
|
||||
/**
|
||||
* Dismiss the loading indicator if the page is changed
|
||||
*/
|
||||
@Prop() dismissOnPageChange: boolean = false;
|
||||
@Prop() dismissOnPageChange = false;
|
||||
|
||||
/**
|
||||
* Number of milliseconds to wait before dismissing the loading indicator
|
||||
@ -96,12 +96,12 @@ export class Loading {
|
||||
/**
|
||||
* If true, the background will be translucent. Browser support for backdrop-filter is required for the full effect
|
||||
*/
|
||||
@Prop() translucent: boolean = false;
|
||||
@Prop() translucent = false;
|
||||
|
||||
/**
|
||||
* Show the backdrop of not
|
||||
*/
|
||||
@Prop() showBackdrop: boolean = true;
|
||||
@Prop() showBackdrop = true;
|
||||
|
||||
/**
|
||||
* Animation to use when loading indicator is presented
|
||||
@ -116,7 +116,7 @@ export class Loading {
|
||||
/**
|
||||
* Toggles whether animation should occur or not
|
||||
*/
|
||||
@Prop() willAnimate: boolean = true;
|
||||
@Prop() willAnimate = true;
|
||||
|
||||
/**
|
||||
* Present a loading overlay after it has been created
|
||||
|
||||
@ -30,7 +30,7 @@ export class MenuController {
|
||||
open(menuId?: string): Promise<boolean> {
|
||||
const menu = this.get(menuId);
|
||||
if (menu && !this.isAnimating()) {
|
||||
let openedMenu = this.getOpen();
|
||||
const openedMenu = this.getOpen();
|
||||
if (openedMenu && menu !== openedMenu) {
|
||||
openedMenu.setOpen(false, false);
|
||||
}
|
||||
@ -69,7 +69,7 @@ export class MenuController {
|
||||
toggle(menuId?: string): Promise<boolean> {
|
||||
const menu = this.get(menuId);
|
||||
if (menu && !this.isAnimating()) {
|
||||
var openedMenu = this.getOpen();
|
||||
const openedMenu = this.getOpen();
|
||||
if (openedMenu && menu !== openedMenu) {
|
||||
openedMenu.setOpen(false, false);
|
||||
}
|
||||
@ -118,7 +118,7 @@ export class MenuController {
|
||||
@Method()
|
||||
isOpen(menuId?: string): boolean {
|
||||
if (menuId) {
|
||||
var menu = this.get(menuId);
|
||||
const menu = this.get(menuId);
|
||||
return menu && menu.isOpen() || false;
|
||||
}
|
||||
return !!this.getOpen();
|
||||
@ -148,7 +148,7 @@ export class MenuController {
|
||||
*/
|
||||
@Method()
|
||||
get(menuId?: string): HTMLIonMenuElement {
|
||||
var menu: Menu;
|
||||
let menu: Menu;
|
||||
|
||||
if (menuId === 'left' || menuId === 'right') {
|
||||
// there could be more than one menu on the same side
|
||||
|
||||
@ -17,13 +17,13 @@ export class Menu {
|
||||
private gestureBlocker: string;
|
||||
private animation: Animation;
|
||||
private isPane = false;
|
||||
private _isOpen: boolean = false;
|
||||
private _isOpen = false;
|
||||
private lastOnEnd = 0;
|
||||
|
||||
mode: string;
|
||||
color: string;
|
||||
isAnimating: boolean = false;
|
||||
isRightSide: boolean = false;
|
||||
isAnimating = false;
|
||||
isRightSide = false;
|
||||
width: number = null;
|
||||
|
||||
backdropEl: HTMLElement;
|
||||
@ -52,7 +52,7 @@ export class Menu {
|
||||
* see the `menuType` in the [config](../../config/Config). Available options:
|
||||
* `"overlay"`, `"reveal"`, `"push"`.
|
||||
*/
|
||||
@Prop({ mutable: true }) type: string = 'overlay';
|
||||
@Prop({ mutable: true }) type = 'overlay';
|
||||
|
||||
@Watch('type')
|
||||
typeChanged(type: string) {
|
||||
@ -91,7 +91,7 @@ export class Menu {
|
||||
/**
|
||||
* @input {boolean} If true, swiping the menu is enabled. Default `true`.
|
||||
*/
|
||||
@Prop() swipeEnabled: boolean = true;
|
||||
@Prop() swipeEnabled = true;
|
||||
|
||||
@Watch('swipeEnabled')
|
||||
protected swipeEnabledChanged() {
|
||||
@ -101,9 +101,9 @@ export class Menu {
|
||||
/**
|
||||
* @input {boolean} If true, the menu will persist on child pages.
|
||||
*/
|
||||
@Prop() persistent: boolean = false;
|
||||
@Prop() persistent = false;
|
||||
|
||||
@Prop() maxEdgeStart: number = 50;
|
||||
@Prop() maxEdgeStart = 50;
|
||||
|
||||
/**
|
||||
* @output {Event} Emitted when the sliding position changes.
|
||||
@ -135,13 +135,13 @@ export class Menu {
|
||||
? '#' + this.content
|
||||
: '[main]';
|
||||
const parent = el.parentElement;
|
||||
const content = this.contentEl = parent.querySelector(contentQuery) as HTMLElement;
|
||||
const content = this.contentEl = parent.querySelector(contentQuery);
|
||||
if (!content || !content.tagName) {
|
||||
// requires content element
|
||||
return console.error('Menu: must have a "content" element to listen for drag events on.');
|
||||
}
|
||||
this.menuInnerEl = el.querySelector('.menu-inner') as HTMLElement;
|
||||
this.backdropEl = el.querySelector('.menu-backdrop') as HTMLElement;
|
||||
this.menuInnerEl = el.querySelector('.menu-inner');
|
||||
this.backdropEl = el.querySelector('.menu-backdrop');
|
||||
|
||||
// add menu's content classes
|
||||
content.classList.add('menu-content');
|
||||
@ -197,7 +197,7 @@ export class Menu {
|
||||
}
|
||||
|
||||
@Method()
|
||||
setOpen(shouldOpen: boolean, animated: boolean = true): Promise<boolean> {
|
||||
setOpen(shouldOpen: boolean, animated = true): Promise<boolean> {
|
||||
// If the menu is disabled or it is currenly being animated, let's do nothing
|
||||
if (!this.isActive() || this.isAnimating || (shouldOpen === this._isOpen)) {
|
||||
return Promise.resolve(this._isOpen);
|
||||
|
||||
@ -29,7 +29,7 @@ export class ModalController {
|
||||
}
|
||||
|
||||
@Method()
|
||||
dismiss(data?: any, role?: any, modalId: number = -1) {
|
||||
dismiss(data?: any, role?: any, modalId = -1) {
|
||||
modalId = modalId >= 0 ? modalId : getHighestId();
|
||||
const modal = modals.get(modalId);
|
||||
return modal.dismiss(data, role);
|
||||
|
||||
@ -71,14 +71,14 @@ export class Modal {
|
||||
@Prop() component: any;
|
||||
@Prop() data: any = {};
|
||||
@Prop() cssClass: string;
|
||||
@Prop() enableBackdropDismiss: boolean = true;
|
||||
@Prop() enableBackdropDismiss = true;
|
||||
|
||||
@Prop() modalId: number;
|
||||
@Prop() showBackdrop: boolean = true;
|
||||
@Prop() showBackdrop = true;
|
||||
|
||||
@Prop() enterAnimation: AnimationBuilder;
|
||||
@Prop() leaveAnimation: AnimationBuilder;
|
||||
@Prop() willAnimate: boolean = true;
|
||||
@Prop() willAnimate = true;
|
||||
@Prop({ mutable: true }) delegate: FrameworkDelegate;
|
||||
|
||||
private animation: Animation;
|
||||
|
||||
@ -21,7 +21,7 @@ export let NAV_ID_START = 1000;
|
||||
export let VIEW_ID_START = 2000;
|
||||
|
||||
let transitionIds = 0;
|
||||
let activeTransitions = new Map<number, any>();
|
||||
const activeTransitions = new Map<number, any>();
|
||||
|
||||
let portalZindex = 9999;
|
||||
|
||||
|
||||
@ -415,7 +415,7 @@ export function popTo(nav: Nav, delegate: FrameworkDelegate, animation: Animatio
|
||||
return queueTransaction(config, done);
|
||||
}
|
||||
|
||||
export function remove(nav: Nav, delegate: FrameworkDelegate, animation: Animation, startIndex: number, removeCount: number = 1, opts?: NavOptions, done?: () => void): Promise<any> {
|
||||
export function remove(nav: Nav, delegate: FrameworkDelegate, animation: Animation, startIndex: number, removeCount = 1, opts?: NavOptions, done?: () => void): Promise<any> {
|
||||
return queueTransaction({
|
||||
removeStart: startIndex,
|
||||
removeCount: removeCount,
|
||||
@ -1017,7 +1017,7 @@ export function getEnteringView(ti: TransitionInstruction, nav: Nav, leavingView
|
||||
return ti.insertViews[ti.insertViews.length - 1];
|
||||
}
|
||||
if (isDef(ti.removeStart)) {
|
||||
var removeEnd = ti.removeStart + ti.removeCount;
|
||||
let removeEnd = ti.removeStart + ti.removeCount;
|
||||
for (let i = nav.views.length - 1; i >= 0; i--) {
|
||||
if ((i < ti.removeStart || i >= removeEnd) && nav.views[i] !== leavingView) {
|
||||
return nav.views[i];
|
||||
|
||||
@ -15,10 +15,10 @@ export class Navbar {
|
||||
color: string;
|
||||
|
||||
@Prop({ context: 'config' }) config: Config;
|
||||
@Prop() hideBackButton: boolean = false;
|
||||
@Prop() hideBackButton = false;
|
||||
@Prop() backButtonText: string;
|
||||
@Prop() backButtonIcon: string;
|
||||
@Prop() hidden: boolean = false;
|
||||
@Prop() hidden = false;
|
||||
|
||||
backButtonClick(ev: UIEvent) {
|
||||
ev.preventDefault();
|
||||
@ -29,7 +29,7 @@ export class Navbar {
|
||||
|
||||
componentDidLoad() {
|
||||
const buttons = this.el.querySelectorAll('ion-button');
|
||||
for (var i = 0; i < buttons.length; i++) {
|
||||
for (let i = 0; i < buttons.length; i++) {
|
||||
buttons[i].setAttribute('button-type', 'bar-button');
|
||||
}
|
||||
}
|
||||
|
||||
@ -23,7 +23,7 @@ export class PickerColumnCmp {
|
||||
private scaleFactor: number;
|
||||
private startY: number;
|
||||
private velocity: number;
|
||||
private y: number = 0;
|
||||
private y = 0;
|
||||
|
||||
private activeBlock: string;
|
||||
|
||||
@ -48,7 +48,7 @@ export class PickerColumnCmp {
|
||||
|
||||
componentDidLoad() {
|
||||
// get the scrollable element within the column
|
||||
let colEle = this.el.querySelector('.picker-opts');
|
||||
const colEle = this.el.querySelector('.picker-opts');
|
||||
|
||||
// get the height of one option
|
||||
this.optHeight = (colEle.firstElementChild ? colEle.firstElementChild.clientHeight : 0);
|
||||
@ -76,7 +76,7 @@ export class PickerColumnCmp {
|
||||
setSelected(selectedIndex: number, duration: number) {
|
||||
// if there is a selected index, then figure out it's y position
|
||||
// if there isn't a selected index, then just use the top y position
|
||||
let y = (selectedIndex > -1) ? ((selectedIndex * this.optHeight) * -1) : 0;
|
||||
const y = (selectedIndex > -1) ? ((selectedIndex * this.optHeight) * -1) : 0;
|
||||
|
||||
this.velocity = 0;
|
||||
|
||||
@ -214,7 +214,7 @@ export class PickerColumnCmp {
|
||||
this.velocity = 0;
|
||||
}
|
||||
|
||||
var notLockedIn = (y % this.optHeight !== 0 || Math.abs(this.velocity) > 1);
|
||||
const notLockedIn = (y % this.optHeight !== 0 || Math.abs(this.velocity) > 1);
|
||||
|
||||
this.update(y, 0, true, !notLockedIn);
|
||||
|
||||
@ -225,7 +225,7 @@ export class PickerColumnCmp {
|
||||
|
||||
} else if (this.y % this.optHeight !== 0) {
|
||||
// needs to still get locked into a position so options line up
|
||||
var currentPos = Math.abs(this.y % this.optHeight);
|
||||
const currentPos = Math.abs(this.y % this.optHeight);
|
||||
|
||||
// create a velocity in the direction it needs to scroll
|
||||
this.velocity = (currentPos > (this.optHeight / 2) ? 1 : -1);
|
||||
@ -233,7 +233,7 @@ export class PickerColumnCmp {
|
||||
this.decelerate();
|
||||
}
|
||||
|
||||
let currentIndex = Math.max(Math.abs(Math.round(y / this.optHeight)), 0);
|
||||
const currentIndex = Math.max(Math.abs(Math.round(y / this.optHeight)), 0);
|
||||
|
||||
// TODO
|
||||
// if (currentIndex !== this.lastTempIndex) {
|
||||
@ -267,10 +267,10 @@ export class PickerColumnCmp {
|
||||
this.pos.length = 0;
|
||||
this.pos.push(this.startY, Date.now());
|
||||
|
||||
let options = this.col.options;
|
||||
const options = this.col.options;
|
||||
let minY = (options.length - 1);
|
||||
let maxY = 0;
|
||||
for (var i = 0; i < options.length; i++) {
|
||||
for (let i = 0; i < options.length; i++) {
|
||||
if (!options[i].disabled) {
|
||||
minY = Math.min(minY, i);
|
||||
maxY = Math.max(maxY, i);
|
||||
@ -290,7 +290,7 @@ export class PickerColumnCmp {
|
||||
|
||||
console.debug('picker, onDragMove', detail);
|
||||
|
||||
let currentY = detail.currentY;
|
||||
const currentY = detail.currentY;
|
||||
this.pos.push(currentY, Date.now());
|
||||
|
||||
if (this.startY === null) {
|
||||
@ -316,7 +316,7 @@ export class PickerColumnCmp {
|
||||
|
||||
this.update(y, 0, false, false);
|
||||
|
||||
let currentIndex = Math.max(Math.abs(Math.round(y / this.optHeight)), 0);
|
||||
const currentIndex = Math.max(Math.abs(Math.round(y / this.optHeight)), 0);
|
||||
if (currentIndex !== this.lastTempIndex) {
|
||||
this.lastTempIndex = currentIndex;
|
||||
}
|
||||
@ -341,31 +341,31 @@ export class PickerColumnCmp {
|
||||
return;
|
||||
}
|
||||
|
||||
let endY = detail.currentY;
|
||||
const endY = detail.currentY;
|
||||
|
||||
this.pos.push(endY, Date.now());
|
||||
|
||||
let endPos = (this.pos.length - 1);
|
||||
const endPos = (this.pos.length - 1);
|
||||
let startPos = endPos;
|
||||
let timeRange = (Date.now() - 100);
|
||||
const timeRange = (Date.now() - 100);
|
||||
|
||||
// move pointer to position measured 100ms ago
|
||||
for (var i = endPos; i > 0 && this.pos[i] > timeRange; i -= 2) {
|
||||
for (let i = endPos; i > 0 && this.pos[i] > timeRange; i -= 2) {
|
||||
startPos = i;
|
||||
}
|
||||
|
||||
if (startPos !== endPos) {
|
||||
// compute relative movement between these two points
|
||||
var timeOffset = (this.pos[endPos] - this.pos[startPos]);
|
||||
var movedTop = (this.pos[startPos - 1] - this.pos[endPos - 1]);
|
||||
const timeOffset = (this.pos[endPos] - this.pos[startPos]);
|
||||
const movedTop = (this.pos[startPos - 1] - this.pos[endPos - 1]);
|
||||
|
||||
// based on XXms compute the movement to apply for each render step
|
||||
var velocity = ((movedTop / timeOffset) * FRAME_MS);
|
||||
const velocity = ((movedTop / timeOffset) * FRAME_MS);
|
||||
this.velocity = clamp(-MAX_PICKER_SPEED, velocity, MAX_PICKER_SPEED);
|
||||
}
|
||||
|
||||
if (Math.abs(endY - this.startY) > 3) {
|
||||
var y = this.y + (endY - this.startY);
|
||||
const y = this.y + (endY - this.startY);
|
||||
this.update(y, 0, true, true);
|
||||
}
|
||||
|
||||
@ -377,7 +377,7 @@ export class PickerColumnCmp {
|
||||
let min = this.col.options.length - 1;
|
||||
let max = 0;
|
||||
const options = this.col.options;
|
||||
for (var i = 0; i < options.length; i++) {
|
||||
for (let i = 0; i < options.length; i++) {
|
||||
if (!options[i].disabled) {
|
||||
min = Math.min(min, i);
|
||||
max = Math.max(max, i);
|
||||
@ -386,7 +386,7 @@ export class PickerColumnCmp {
|
||||
|
||||
const selectedIndex = clamp(min, this.col.selectedIndex, max);
|
||||
if (this.col.prevSelected !== selectedIndex) {
|
||||
var y = (selectedIndex * this.optHeight) * -1;
|
||||
const y = (selectedIndex * this.optHeight) * -1;
|
||||
this.velocity = 0;
|
||||
this.update(y, 150, true, false);
|
||||
}
|
||||
@ -405,9 +405,9 @@ export class PickerColumnCmp {
|
||||
}
|
||||
|
||||
render() {
|
||||
let col = this.col;
|
||||
const col = this.col;
|
||||
|
||||
let options = this.col.options
|
||||
const options = this.col.options
|
||||
.map(o => {
|
||||
if (typeof o === 'string') {
|
||||
o = { text: o };
|
||||
@ -416,7 +416,7 @@ export class PickerColumnCmp {
|
||||
})
|
||||
.filter(clientInformation => clientInformation !== null);
|
||||
|
||||
let results: any[] = [];
|
||||
const results: any[] = [];
|
||||
|
||||
if (col.prefix) {
|
||||
results.push(
|
||||
|
||||
@ -71,14 +71,14 @@ export class Picker {
|
||||
|
||||
@Prop() cssClass: string;
|
||||
@Prop() content: string;
|
||||
@Prop() dismissOnPageChange: boolean = false;
|
||||
@Prop() dismissOnPageChange = false;
|
||||
@Prop() duration: number;
|
||||
@Prop() enterAnimation: AnimationBuilder;
|
||||
@Prop() leaveAnimation: AnimationBuilder;
|
||||
@Prop() pickerId: string;
|
||||
@Prop() showBackdrop: boolean = true;
|
||||
@Prop() enableBackdropDismiss: boolean = true;
|
||||
@Prop() willAnimate: boolean = true;
|
||||
@Prop() showBackdrop = true;
|
||||
@Prop() enableBackdropDismiss = true;
|
||||
@Prop() willAnimate = true;
|
||||
|
||||
@Prop() buttons: PickerButton[] = [];
|
||||
@Prop() columns: PickerColumn[] = [];
|
||||
@ -210,9 +210,9 @@ export class Picker {
|
||||
}
|
||||
|
||||
getSelected(): any {
|
||||
let selected: {[k: string]: any} = {};
|
||||
const selected: {[k: string]: any} = {};
|
||||
this.columns.forEach((col, index) => {
|
||||
let selectedColumn = col.options[col.selectedIndex];
|
||||
const selectedColumn = col.options[col.selectedIndex];
|
||||
selected[col.name] = {
|
||||
text: selectedColumn ? selectedColumn.text : null,
|
||||
value: selectedColumn ? selectedColumn.value : null,
|
||||
@ -251,7 +251,7 @@ export class Picker {
|
||||
protected backdropClick() {
|
||||
// TODO this.enabled
|
||||
if (this.enableBackdropDismiss) {
|
||||
let cancelBtn = this.buttons.find(b => b.role === 'cancel');
|
||||
const cancelBtn = this.buttons.find(b => b.role === 'cancel');
|
||||
if (cancelBtn) {
|
||||
this.buttonClick(cancelBtn);
|
||||
} else {
|
||||
@ -263,7 +263,7 @@ export class Picker {
|
||||
render() {
|
||||
// TODO: cssClass
|
||||
|
||||
let buttons = this.buttons
|
||||
const buttons = this.buttons
|
||||
.map(b => {
|
||||
if (typeof b === 'string') {
|
||||
b = { text: b };
|
||||
@ -275,7 +275,7 @@ export class Picker {
|
||||
})
|
||||
.filter(b => b !== null);
|
||||
|
||||
let columns = this.columns;
|
||||
const columns = this.columns;
|
||||
|
||||
// // clean up dat data
|
||||
// data.columns = data.columns.map(column => {
|
||||
@ -353,7 +353,7 @@ export class Picker {
|
||||
}
|
||||
|
||||
buttonWrapperClass(button: PickerButton): CssClassMap {
|
||||
let buttonClass: string[] = !button.role
|
||||
const buttonClass: string[] = !button.role
|
||||
? ['picker-toolbar-button']
|
||||
: [`picker-toolbar-button`, `picker-toolbar-${button.role}`];
|
||||
return buttonClass.reduce((prevValue: any, cssClass: any) => {
|
||||
@ -363,7 +363,7 @@ export class Picker {
|
||||
}
|
||||
|
||||
buttonClass(button: PickerButton): CssClassMap {
|
||||
let buttonClass: string[] = !button.cssClass
|
||||
const buttonClass: string[] = !button.cssClass
|
||||
? ['picker-button']
|
||||
: [`picker-button`, `${button.cssClass}`];
|
||||
return buttonClass.reduce((prevValue: any, cssClass: any) => {
|
||||
|
||||
@ -7,43 +7,43 @@ export default function iosEnterAnimation(Animation: Animation, baseElm: HTMLEle
|
||||
let originY = 'top';
|
||||
let originX = 'left';
|
||||
|
||||
let contentEl = baseElm.querySelector('.popover-content') as HTMLElement;
|
||||
let contentDimentions = contentEl.getBoundingClientRect();
|
||||
let contentWidth = contentDimentions.width;
|
||||
let contentHeight = contentDimentions.height;
|
||||
const contentEl = baseElm.querySelector('.popover-content');
|
||||
const contentDimentions = contentEl.getBoundingClientRect();
|
||||
const contentWidth = contentDimentions.width;
|
||||
const contentHeight = contentDimentions.height;
|
||||
|
||||
let bodyWidth = window.innerWidth;
|
||||
let bodyHeight = window.innerHeight;
|
||||
const bodyWidth = window.innerWidth;
|
||||
const bodyHeight = window.innerHeight;
|
||||
|
||||
// If ev was passed, use that for target element
|
||||
let targetDim =
|
||||
const targetDim =
|
||||
ev && ev.target && (ev.target as HTMLElement).getBoundingClientRect();
|
||||
|
||||
let targetTop =
|
||||
const targetTop =
|
||||
targetDim && 'top' in targetDim
|
||||
? targetDim.top
|
||||
: bodyHeight / 2 - contentHeight / 2;
|
||||
let targetLeft =
|
||||
const targetLeft =
|
||||
targetDim && 'left' in targetDim ? targetDim.left : bodyWidth / 2;
|
||||
let targetWidth = (targetDim && targetDim.width) || 0;
|
||||
let targetHeight = (targetDim && targetDim.height) || 0;
|
||||
const targetWidth = (targetDim && targetDim.width) || 0;
|
||||
const targetHeight = (targetDim && targetDim.height) || 0;
|
||||
|
||||
let arrowEl = baseElm.querySelector('.popover-arrow') as HTMLElement;
|
||||
const arrowEl = baseElm.querySelector('.popover-arrow');
|
||||
|
||||
let arrowDim = arrowEl.getBoundingClientRect();
|
||||
let arrowWidth = arrowDim.width;
|
||||
let arrowHeight = arrowDim.height;
|
||||
const arrowDim = arrowEl.getBoundingClientRect();
|
||||
const arrowWidth = arrowDim.width;
|
||||
const arrowHeight = arrowDim.height;
|
||||
|
||||
if (!targetDim) {
|
||||
arrowEl.style.display = 'none';
|
||||
}
|
||||
|
||||
let arrowCSS = {
|
||||
const arrowCSS = {
|
||||
top: targetTop + targetHeight,
|
||||
left: targetLeft + targetWidth / 2 - arrowWidth / 2
|
||||
};
|
||||
|
||||
let popoverCSS: { top: any; left: any } = {
|
||||
const popoverCSS: { top: any; left: any } = {
|
||||
top: targetTop + targetHeight + (arrowHeight - 1),
|
||||
left: targetLeft + targetWidth / 2 - contentWidth / 2
|
||||
};
|
||||
|
||||
@ -7,31 +7,31 @@ export default function mdEnterAnimation(Animation: Animation, baseElm: HTMLElem
|
||||
let originY = 'top';
|
||||
let originX = 'left';
|
||||
|
||||
let contentEl = baseElm.querySelector('.popover-content') as HTMLElement;
|
||||
let contentDimentions = contentEl.getBoundingClientRect();
|
||||
let contentWidth = contentDimentions.width;
|
||||
let contentHeight = contentDimentions.height;
|
||||
const contentEl = baseElm.querySelector('.popover-content');
|
||||
const contentDimentions = contentEl.getBoundingClientRect();
|
||||
const contentWidth = contentDimentions.width;
|
||||
const contentHeight = contentDimentions.height;
|
||||
|
||||
let bodyWidth = window.innerWidth;
|
||||
let bodyHeight = window.innerHeight;
|
||||
const bodyWidth = window.innerWidth;
|
||||
const bodyHeight = window.innerHeight;
|
||||
|
||||
// If ev was passed, use that for target element
|
||||
let targetDim =
|
||||
const targetDim =
|
||||
ev && ev.target && (ev.target as HTMLElement).getBoundingClientRect();
|
||||
|
||||
let targetTop =
|
||||
const targetTop =
|
||||
targetDim && 'top' in targetDim
|
||||
? targetDim.top
|
||||
: bodyHeight / 2 - contentHeight / 2;
|
||||
|
||||
let targetLeft =
|
||||
const targetLeft =
|
||||
targetDim && 'left' in targetDim
|
||||
? targetDim.left
|
||||
: bodyWidth / 2 - contentWidth / 2;
|
||||
|
||||
let targetHeight = (targetDim && targetDim.height) || 0;
|
||||
const targetHeight = (targetDim && targetDim.height) || 0;
|
||||
|
||||
let popoverCSS: { top: any; left: any } = {
|
||||
const popoverCSS: { top: any; left: any } = {
|
||||
top: targetTop,
|
||||
left: targetLeft
|
||||
};
|
||||
|
||||
@ -72,14 +72,14 @@ export class Popover {
|
||||
@Prop() component: string;
|
||||
@Prop() data: any = {};
|
||||
@Prop() cssClass: string;
|
||||
@Prop() enableBackdropDismiss: boolean = true;
|
||||
@Prop() enableBackdropDismiss = true;
|
||||
@Prop() enterAnimation: AnimationBuilder;
|
||||
@Prop() leaveAnimation: AnimationBuilder;
|
||||
@Prop() ev: Event;
|
||||
@Prop() popoverId: string;
|
||||
@Prop() showBackdrop: boolean = true;
|
||||
@Prop() translucent: boolean = false;
|
||||
@Prop() willAnimate: boolean = true;
|
||||
@Prop() showBackdrop = true;
|
||||
@Prop() translucent = false;
|
||||
@Prop() willAnimate = true;
|
||||
@Prop({ mutable: true }) delegate: FrameworkDelegate;
|
||||
|
||||
private animation: Animation;
|
||||
|
||||
@ -16,18 +16,18 @@ export class Range implements BaseInputComponent {
|
||||
|
||||
private styleTmr: any;
|
||||
|
||||
activated: boolean = false;
|
||||
hasFocus: boolean = false;
|
||||
activated = false;
|
||||
hasFocus = false;
|
||||
startX: number;
|
||||
|
||||
@Element() private el: HTMLElement;
|
||||
|
||||
@State() barL: string;
|
||||
@State() barR: string;
|
||||
@State() valA: number = 0;
|
||||
@State() valB: number = 0;
|
||||
@State() ratioA: number = 0;
|
||||
@State() ratioB: number = 0;
|
||||
@State() valA = 0;
|
||||
@State() valB = 0;
|
||||
@State() ratioA = 0;
|
||||
@State() ratioB = 0;
|
||||
@State() ticks: any[] = [];
|
||||
@State() activeB: boolean;
|
||||
@State() rect: ClientRect;
|
||||
@ -74,7 +74,7 @@ export class Range implements BaseInputComponent {
|
||||
* @input {number} How long, in milliseconds, to wait to trigger the
|
||||
* `ionChange` event after each change in the range value. Default `0`.
|
||||
*/
|
||||
@Prop() debounce: number = 0;
|
||||
@Prop() debounce = 0;
|
||||
|
||||
@Watch('debounce')
|
||||
private debounceChange() {
|
||||
@ -87,39 +87,39 @@ export class Range implements BaseInputComponent {
|
||||
/*
|
||||
* @input {boolean} If true, the user cannot interact with the range. Default false.
|
||||
*/
|
||||
@Prop() disabled: boolean = false;
|
||||
@Prop() disabled = false;
|
||||
|
||||
/**
|
||||
* @input {boolean} Show two knobs. Defaults to `false`.
|
||||
*/
|
||||
@Prop() dualKnobs: boolean = false;
|
||||
@Prop() dualKnobs = false;
|
||||
|
||||
/**
|
||||
* @input {number} Maximum integer value of the range. Defaults to `100`.
|
||||
*/
|
||||
@Prop() max: number = 100;
|
||||
@Prop() max = 100;
|
||||
|
||||
/**
|
||||
* @input {number} Minimum integer value of the range. Defaults to `0`.
|
||||
*/
|
||||
@Prop() min: number = 0;
|
||||
@Prop() min = 0;
|
||||
|
||||
/**
|
||||
* @input {boolean} If true, a pin with integer value is shown when the knob
|
||||
* is pressed. Defaults to `false`.
|
||||
*/
|
||||
@Prop() pin: boolean = false;
|
||||
@Prop() pin = false;
|
||||
|
||||
/**
|
||||
* @input {boolean} If true, the knob snaps to tick marks evenly spaced based
|
||||
* on the step property value. Defaults to `false`.
|
||||
*/
|
||||
@Prop() snaps: boolean = false;
|
||||
@Prop() snaps = false;
|
||||
|
||||
/**
|
||||
* @input {number} Specifies the value granularity. Defaults to `1`.
|
||||
*/
|
||||
@Prop() step: number = 1;
|
||||
@Prop() step = 1;
|
||||
|
||||
/**
|
||||
* @input {string} the value of the range.
|
||||
@ -203,7 +203,7 @@ export class Range implements BaseInputComponent {
|
||||
createTicks() {
|
||||
if (this.snaps) {
|
||||
for (let value = this.min; value <= this.max; value += this.step) {
|
||||
let ratio = this.valueToRatio(value);
|
||||
const ratio = this.valueToRatio(value);
|
||||
this.ticks.push({
|
||||
ratio,
|
||||
left: `${ratio * 100}%`
|
||||
@ -218,7 +218,7 @@ export class Range implements BaseInputComponent {
|
||||
const ratio = this.ratio;
|
||||
if (this.snaps && ticks) {
|
||||
if (this.dualKnobs) {
|
||||
let upperRatio = this.ratioUpper();
|
||||
const upperRatio = this.ratioUpper();
|
||||
|
||||
ticks.forEach(t => {
|
||||
t.active = t.ratio >= ratio && t.ratio <= upperRatio;
|
||||
@ -256,7 +256,7 @@ export class Range implements BaseInputComponent {
|
||||
// figure out where the pointer is currently at
|
||||
// update the knob being interacted with
|
||||
let ratio = clamp(0, (current.x - rect.left) / rect.width, 1);
|
||||
let val = this.ratioToValue(ratio);
|
||||
const val = this.ratioToValue(ratio);
|
||||
|
||||
if (this.snaps) {
|
||||
// snaps the ratio to the current value
|
||||
|
||||
@ -39,15 +39,15 @@ export class ReorderGroup {
|
||||
private containerTop: number;
|
||||
private containerBottom: number;
|
||||
|
||||
@State() _enabled: boolean = false;
|
||||
@State() _iconVisible: boolean = false;
|
||||
@State() _actived: boolean = false;
|
||||
@State() _enabled = false;
|
||||
@State() _iconVisible = false;
|
||||
@State() _actived = false;
|
||||
|
||||
@Element() private el: HTMLElement;
|
||||
|
||||
@Prop({ context: 'dom' }) dom: DomController;
|
||||
|
||||
@Prop() enabled: boolean = false;
|
||||
@Prop() enabled = false;
|
||||
|
||||
/**
|
||||
* @input {string} Which side of the view the ion-reorder should be placed. Default `"end"`.
|
||||
@ -108,8 +108,8 @@ export class ReorderGroup {
|
||||
}
|
||||
|
||||
let sum = 0;
|
||||
for (var i = 0, ilen = children.length; i < ilen; i++) {
|
||||
var child = children[i];
|
||||
for (let i = 0, ilen = children.length; i < ilen; i++) {
|
||||
const child = children[i];
|
||||
sum += child.offsetHeight;
|
||||
heights.push(sum);
|
||||
child.$ionIndex = i;
|
||||
@ -120,7 +120,7 @@ export class ReorderGroup {
|
||||
this.containerBottom = box.bottom;
|
||||
|
||||
if (this.scrollEl) {
|
||||
var scrollBox = this.scrollEl.getBoundingClientRect();
|
||||
const scrollBox = this.scrollEl.getBoundingClientRect();
|
||||
this.scrollElInitial = this.scrollEl.scrollTop;
|
||||
this.scrollElTop = scrollBox.top + AUTO_SCROLL_MARGIN;
|
||||
this.scrollElBottom = scrollBox.bottom - AUTO_SCROLL_MARGIN;
|
||||
@ -155,7 +155,7 @@ export class ReorderGroup {
|
||||
const normalizedY = currentY - top;
|
||||
const toIndex = this.itemIndexForTop(normalizedY);
|
||||
if (toIndex !== undefined && (toIndex !== this.lastToIndex)) {
|
||||
let fromIndex = indexForItem(selectedItem);
|
||||
const fromIndex = indexForItem(selectedItem);
|
||||
this.lastToIndex = toIndex;
|
||||
|
||||
hapticSelectionChanged();
|
||||
@ -224,9 +224,9 @@ export class ReorderGroup {
|
||||
const itemHeight = this.selectedItemHeight;
|
||||
const children = this.containerEl.children;
|
||||
const transform = CSS_PROP.transformProp;
|
||||
for (var i = 0; i < children.length; i++) {
|
||||
var style = (children[i] as any).style;
|
||||
var value = '';
|
||||
for (let i = 0; i < children.length; i++) {
|
||||
const style = (children[i] as any).style;
|
||||
let value = '';
|
||||
if (i > fromIndex && i <= toIndex) {
|
||||
value = `translateY(${-itemHeight}px)`;
|
||||
} else if (i < fromIndex && i >= toIndex) {
|
||||
|
||||
@ -117,7 +117,7 @@ describe('matchRoute', () => {
|
||||
{ id: 4, path: '' },
|
||||
];
|
||||
const seg = new RouterSegments(['hola', 'manu', 'adam']);
|
||||
let match = matchRoute(seg, routes);
|
||||
const match = matchRoute(seg, routes);
|
||||
expect(match).toBeNull();
|
||||
});
|
||||
|
||||
@ -171,7 +171,7 @@ describe('matchRoute', () => {
|
||||
{ id: 3, path: 'adam/manu' },
|
||||
];
|
||||
const seg = new RouterSegments(['adam', 'manu', 'hello', 'menu', 'hello']);
|
||||
let match = matchRoute(seg, routes);
|
||||
const match = matchRoute(seg, routes);
|
||||
expect(match.id).toEqual(1);
|
||||
expect(matchRoute(seg, routes)).toBeNull();
|
||||
});
|
||||
|
||||
@ -10,7 +10,7 @@ export class RouterController {
|
||||
|
||||
private busy = false;
|
||||
private enabled = false;
|
||||
private basePrefix: string = '#';
|
||||
private basePrefix = '#';
|
||||
|
||||
@Prop({ context: 'config' }) config: Config;
|
||||
@Prop({ context: 'dom' }) dom: DomController;
|
||||
@ -88,7 +88,7 @@ export class RouterController {
|
||||
}
|
||||
|
||||
private readNavState() {
|
||||
let root = document.querySelector('ion-app') as HTMLElement;
|
||||
const root = document.querySelector('ion-app') as HTMLElement;
|
||||
return readNavState(root);
|
||||
}
|
||||
|
||||
|
||||
@ -80,7 +80,7 @@ export function readNavState(node: HTMLElement) {
|
||||
function mustMatchRoute(segments: RouterSegments, routes: RouterEntries) {
|
||||
const r = matchRoute(segments, routes);
|
||||
if (!r) {
|
||||
throw 'no route found';
|
||||
throw new Error('no route found');
|
||||
}
|
||||
return r;
|
||||
}
|
||||
@ -121,7 +121,7 @@ export function matchRoute(segments: RouterSegments, routes: RouterEntries): Rou
|
||||
|
||||
export function generateURL(stack: NavState[]): string {
|
||||
const segments: string[] = [];
|
||||
for (let state of stack) {
|
||||
for (const state of stack) {
|
||||
segments.push(...parseURL(state.path));
|
||||
}
|
||||
const path = segments
|
||||
|
||||
@ -17,7 +17,7 @@ export class Scroll {
|
||||
private tmr: any;
|
||||
private queued = false;
|
||||
|
||||
isScrolling: boolean = false;
|
||||
isScrolling = false;
|
||||
detail: ScrollDetail = {};
|
||||
|
||||
@Element() private el: HTMLElement;
|
||||
@ -26,13 +26,13 @@ export class Scroll {
|
||||
@Prop({ context: 'dom' }) dom: DomController;
|
||||
@Prop({ context: 'isServer' }) isServer: boolean;
|
||||
|
||||
@Prop() enabled: boolean = true;
|
||||
@Prop() jsScroll: boolean = false;
|
||||
@Prop() enabled = true;
|
||||
@Prop() jsScroll = false;
|
||||
|
||||
@Watch('jsScroll')
|
||||
jsScrollChanged(js: boolean) {
|
||||
if (js) {
|
||||
throw 'jsScroll: TODO!';
|
||||
throw new Error('jsScroll: TODO!');
|
||||
}
|
||||
}
|
||||
|
||||
@ -136,7 +136,7 @@ export class Scroll {
|
||||
|
||||
// where .5 would be 50% of time on a linear scale easedT gives a
|
||||
// fraction based on the easing method
|
||||
let easedT = (--time) * time * time + 1;
|
||||
const easedT = (--time) * time * time + 1;
|
||||
|
||||
if (fromY !== y) {
|
||||
self.setTop((easedT * (y - fromY)) + fromY);
|
||||
@ -228,20 +228,20 @@ export class Scroll {
|
||||
detail.deltaY = (detail.scrollTop - detail.startY);
|
||||
detail.deltaX = (detail.scrollLeft - detail.startX);
|
||||
|
||||
var endPos = (positions.length - 1);
|
||||
var startPos = endPos;
|
||||
var timeRange = (detail.timeStamp - 100);
|
||||
const endPos = (positions.length - 1);
|
||||
let startPos = endPos;
|
||||
const timeRange = (detail.timeStamp - 100);
|
||||
|
||||
// move pointer to position measured 100ms ago
|
||||
for (var i = endPos; i > 0 && positions[i] > timeRange; i -= 3) {
|
||||
for (let i = endPos; i > 0 && positions[i] > timeRange; i -= 3) {
|
||||
startPos = i;
|
||||
}
|
||||
|
||||
if (startPos !== endPos) {
|
||||
// compute relative movement between these two points
|
||||
var deltaY = (positions[startPos - 2] - positions[endPos - 2]);
|
||||
var deltaX = (positions[startPos - 1] - positions[endPos - 1]);
|
||||
var factor = 1 / (positions[startPos] - positions[endPos]);
|
||||
const deltaY = (positions[startPos - 2] - positions[endPos - 2]);
|
||||
const deltaX = (positions[startPos - 1] - positions[endPos - 1]);
|
||||
const factor = 1 / (positions[startPos] - positions[endPos]);
|
||||
|
||||
// based on XXms compute the movement to apply for each render step
|
||||
detail.velocityY = deltaY * factor;
|
||||
|
||||
@ -13,15 +13,15 @@ import { debounce } from '../../utils/helpers';
|
||||
}
|
||||
})
|
||||
export class Searchbar {
|
||||
private _isCancelVisible: boolean = false;
|
||||
private _shouldBlur: boolean = true;
|
||||
private _shouldAlignLeft: boolean = true;
|
||||
private _isCancelVisible = false;
|
||||
private _shouldBlur = true;
|
||||
private _shouldAlignLeft = true;
|
||||
|
||||
@Element() private el: HTMLElement;
|
||||
|
||||
@State() activated: boolean = false;
|
||||
@State() activated = false;
|
||||
|
||||
@State() focused: boolean = false;
|
||||
@State() focused = false;
|
||||
|
||||
|
||||
/**
|
||||
@ -66,27 +66,27 @@ export class Searchbar {
|
||||
/**
|
||||
* @input {boolean} If true, enable searchbar animation. Default `false`.
|
||||
*/
|
||||
@Prop({ mutable: true }) animated: boolean = false;
|
||||
@Prop({ mutable: true }) animated = false;
|
||||
|
||||
/**
|
||||
* @input {string} Set the input's autocomplete property. Values: `"on"`, `"off"`. Default `"off"`.
|
||||
*/
|
||||
@Prop({ mutable: true }) autocomplete: string = 'off';
|
||||
@Prop({ mutable: true }) autocomplete = 'off';
|
||||
|
||||
/**
|
||||
* @input {string} Set the input's autocorrect property. Values: `"on"`, `"off"`. Default `"off"`.
|
||||
*/
|
||||
@Prop({ mutable: true }) autocorrect: string = 'off';
|
||||
@Prop({ mutable: true }) autocorrect = 'off';
|
||||
|
||||
/**
|
||||
* @input {string} Set the the cancel button text. Default: `"Cancel"`.
|
||||
*/
|
||||
@Prop({ mutable: true }) cancelButtonText: string = 'Cancel';
|
||||
@Prop({ mutable: true }) cancelButtonText = 'Cancel';
|
||||
|
||||
/**
|
||||
* @input {number} Set the amount of time, in milliseconds, to wait to trigger the `ionInput` event after each keystroke. Default `250`.
|
||||
*/
|
||||
@Prop({ mutable: true }) debounce: number = 250;
|
||||
@Prop({ mutable: true }) debounce = 250;
|
||||
|
||||
@Watch('debounce')
|
||||
private debounceInput() {
|
||||
@ -99,22 +99,22 @@ export class Searchbar {
|
||||
/**
|
||||
* @input {string} Set the input's placeholder. Default `"Search"`.
|
||||
*/
|
||||
@Prop({ mutable: true }) placeholder: string = 'Search';
|
||||
@Prop({ mutable: true }) placeholder = 'Search';
|
||||
|
||||
/**
|
||||
* @input {boolean} If true, show the cancel button. Default `false`.
|
||||
*/
|
||||
@Prop({ mutable: true }) showCancelButton: boolean = false;
|
||||
@Prop({ mutable: true }) showCancelButton = false;
|
||||
|
||||
/**
|
||||
* @input {boolean} If true, enable spellcheck on the input. Default `false`.
|
||||
*/
|
||||
@Prop({ mutable: true }) spellcheck: boolean = false;
|
||||
@Prop({ mutable: true }) spellcheck = false;
|
||||
|
||||
/**
|
||||
* @input {string} Set the type of the input. Values: `"text"`, `"password"`, `"email"`, `"number"`, `"search"`, `"tel"`, `"url"`. Default `"search"`.
|
||||
*/
|
||||
@Prop({ mutable: true }) type: string = 'search';
|
||||
@Prop({ mutable: true }) type = 'search';
|
||||
|
||||
/**
|
||||
* @input {string} the value of the searchbar.
|
||||
@ -136,7 +136,7 @@ export class Searchbar {
|
||||
// setTimeout() fixes https://github.com/ionic-team/ionic/issues/7527
|
||||
// wait for 4 frames
|
||||
setTimeout(() => {
|
||||
let value = this.value;
|
||||
const value = this.value;
|
||||
if (value !== undefined && value !== '') {
|
||||
this.value = '';
|
||||
this.ionInput.emit({event: ev});
|
||||
@ -184,7 +184,7 @@ export class Searchbar {
|
||||
* based on whether there is a value in the searchbar or not.
|
||||
*/
|
||||
inputBlurred() {
|
||||
const inputEle = this.el.querySelector('.searchbar-input') as HTMLElement;
|
||||
const inputEle = this.el.querySelector('.searchbar-input');
|
||||
|
||||
// _shouldBlur determines if it should blur
|
||||
// if we are clearing the input we still want to stay focused in the input
|
||||
@ -240,8 +240,8 @@ export class Searchbar {
|
||||
*/
|
||||
positionPlaceholder() {
|
||||
const isRTL = document.dir === 'rtl';
|
||||
const inputEle = this.el.querySelector('.searchbar-input') as HTMLElement;
|
||||
const iconEle = this.el.querySelector('.searchbar-search-icon') as HTMLElement;
|
||||
const inputEle = this.el.querySelector('.searchbar-input');
|
||||
const iconEle = this.el.querySelector('.searchbar-search-icon');
|
||||
|
||||
if (this._shouldAlignLeft) {
|
||||
inputEle.removeAttribute('style');
|
||||
@ -249,19 +249,19 @@ export class Searchbar {
|
||||
|
||||
} else {
|
||||
// Create a dummy span to get the placeholder width
|
||||
var tempSpan = document.createElement('span');
|
||||
const tempSpan = document.createElement('span');
|
||||
tempSpan.innerHTML = this.placeholder;
|
||||
document.body.appendChild(tempSpan);
|
||||
|
||||
// Get the width of the span then remove it
|
||||
var textWidth = tempSpan.offsetWidth;
|
||||
const textWidth = tempSpan.offsetWidth;
|
||||
document.body.removeChild(tempSpan);
|
||||
|
||||
// Calculate the input padding
|
||||
var inputLeft = 'calc(50% - ' + (textWidth / 2) + 'px)';
|
||||
const inputLeft = 'calc(50% - ' + (textWidth / 2) + 'px)';
|
||||
|
||||
// Calculate the icon margin
|
||||
var iconLeft = 'calc(50% - ' + ((textWidth / 2) + 30) + 'px)';
|
||||
const iconLeft = 'calc(50% - ' + ((textWidth / 2) + 30) + 'px)';
|
||||
|
||||
// Set the input padding start and icon margin start
|
||||
if (isRTL) {
|
||||
@ -279,11 +279,11 @@ export class Searchbar {
|
||||
*/
|
||||
positionCancelButton() {
|
||||
const isRTL = document.dir === 'rtl';
|
||||
const cancelButton = this.el.querySelector('.searchbar-ios-cancel') as HTMLElement;
|
||||
const cancelButton = this.el.querySelector('.searchbar-ios-cancel');
|
||||
const shouldShowCancel = this.focused;
|
||||
|
||||
if (shouldShowCancel !== this._isCancelVisible) {
|
||||
var cancelStyle = cancelButton.style;
|
||||
const cancelStyle = cancelButton.style;
|
||||
this._isCancelVisible = shouldShowCancel;
|
||||
if (shouldShowCancel) {
|
||||
if (isRTL) {
|
||||
@ -292,7 +292,7 @@ export class Searchbar {
|
||||
cancelStyle.marginRight = '0';
|
||||
}
|
||||
} else {
|
||||
var offset = cancelButton.offsetWidth;
|
||||
const offset = cancelButton.offsetWidth;
|
||||
if (offset > 0) {
|
||||
if (isRTL) {
|
||||
cancelStyle.marginLeft = -offset + 'px';
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { Component, Element, Event, EventEmitter, Prop, State } from '@stencil/core';
|
||||
import { Component, Element, Event, EventEmitter, Prop } from '@stencil/core';
|
||||
import { CssClassMap } from '../../index';
|
||||
import { createThemedClasses, getElementClassObject } from '../../utils/theme';
|
||||
|
||||
@ -16,7 +16,7 @@ export class SegmentButton {
|
||||
*/
|
||||
@Event() ionClick: EventEmitter<SegmentButtonEventDetail>;
|
||||
|
||||
@Prop({mutable: true}) activated: boolean = false;
|
||||
@Prop({mutable: true}) activated = false;
|
||||
|
||||
/**
|
||||
* The color to use for the text color.
|
||||
@ -33,12 +33,12 @@ export class SegmentButton {
|
||||
/**
|
||||
* If true, the segment button is selected. Defaults to `false`.
|
||||
*/
|
||||
@Prop({ mutable: true }) checked: boolean = false;
|
||||
@Prop({ mutable: true }) checked = false;
|
||||
|
||||
/*
|
||||
* If true, the user cannot interact with the segment button. Default false.
|
||||
*/
|
||||
@Prop({ mutable: true }) disabled: boolean = false;
|
||||
@Prop({ mutable: true }) disabled = false;
|
||||
|
||||
/**
|
||||
* The value of the segment button.
|
||||
@ -68,7 +68,7 @@ export class SegmentButton {
|
||||
* Get the classes for the segment button state
|
||||
*/
|
||||
getElementClassList() {
|
||||
let classList = [].concat(
|
||||
const classList = [].concat(
|
||||
this.disabled ? 'segment-button-disabled' : [],
|
||||
this.activated ? 'segment-activated' : [],
|
||||
);
|
||||
|
||||
@ -37,7 +37,7 @@ export class Segment {
|
||||
/*
|
||||
* If true, the user cannot interact with the segment. Default false.
|
||||
*/
|
||||
@Prop({ mutable: true }) disabled: boolean = false;
|
||||
@Prop({ mutable: true }) disabled = false;
|
||||
|
||||
/**
|
||||
* the value of the segment.
|
||||
@ -51,7 +51,8 @@ export class Segment {
|
||||
|
||||
componentDidLoad() {
|
||||
this.buttons = this.el.querySelectorAll('ion-segment-button');
|
||||
for (var i = 0; i < this.buttons.length; i++) {
|
||||
|
||||
for (let i = 0; i < this.buttons.length; i++) {
|
||||
const button = this.buttons[i];
|
||||
|
||||
button.activated = (button.value === this.value);
|
||||
@ -76,7 +77,7 @@ export class Segment {
|
||||
}
|
||||
|
||||
selectButton(val: string) {
|
||||
for (var i = 0; i < this.buttons.length; i++) {
|
||||
for (let i = 0; i < this.buttons.length; i++) {
|
||||
const button = this.buttons[i];
|
||||
button.activated = (button.value === val);
|
||||
}
|
||||
|
||||
@ -304,7 +304,7 @@ export class Select {
|
||||
}
|
||||
|
||||
openPopover(ev: UIEvent) {
|
||||
let interfaceOptions = {...this.interfaceOptions};
|
||||
const interfaceOptions = {...this.interfaceOptions};
|
||||
|
||||
const popoverOpts: PopoverOptions = Object.assign(interfaceOptions, {
|
||||
component: 'ion-select-popover',
|
||||
@ -343,7 +343,7 @@ export class Select {
|
||||
}
|
||||
|
||||
openActionSheet() {
|
||||
let interfaceOptions = {...this.interfaceOptions};
|
||||
const interfaceOptions = {...this.interfaceOptions};
|
||||
|
||||
const actionSheetButtons: ActionSheetButton[] = this.childOpts.map(option => {
|
||||
return {
|
||||
@ -379,7 +379,7 @@ export class Select {
|
||||
}
|
||||
|
||||
openAlert() {
|
||||
let interfaceOptions = {...this.interfaceOptions};
|
||||
const interfaceOptions = {...this.interfaceOptions};
|
||||
|
||||
const label = this.getLabel();
|
||||
let labelText: string = null;
|
||||
|
||||
@ -6,7 +6,7 @@ import { Component, Prop } from '@stencil/core';
|
||||
styleUrl: 'skeleton-text.scss'
|
||||
})
|
||||
export class SkeletonText {
|
||||
@Prop() width: string = '100%';
|
||||
@Prop() width = '100%';
|
||||
|
||||
render() {
|
||||
return <span style={{width: this.width}}> </span>;
|
||||
|
||||
@ -90,7 +90,7 @@ export class Slides {
|
||||
|
||||
@Watch('options')
|
||||
updateSwiperOptions() {
|
||||
let newOptions = this.normalizeOptions();
|
||||
const newOptions = this.normalizeOptions();
|
||||
this.swiper.params = Object.assign({}, this.swiper.params, newOptions);
|
||||
this.update();
|
||||
}
|
||||
@ -98,7 +98,7 @@ export class Slides {
|
||||
/**
|
||||
* Show or hide the pager
|
||||
*/
|
||||
@Prop() pager: boolean = true;
|
||||
@Prop() pager = true;
|
||||
|
||||
render() {
|
||||
return (
|
||||
@ -141,7 +141,7 @@ export class Slides {
|
||||
|
||||
normalizeOptions() {
|
||||
// Base options, can be changed
|
||||
var swiperOptions = {
|
||||
const swiperOptions = {
|
||||
effect: 'slide',
|
||||
autoplay: 0,
|
||||
direction: 'horizontal',
|
||||
@ -234,7 +234,7 @@ export class Slides {
|
||||
|
||||
// Keep the event options separate, we dont want users
|
||||
// overwriting these
|
||||
var eventOptions = {
|
||||
const eventOptions = {
|
||||
onSlideChangeStart: this.ionSlideWillChange.emit,
|
||||
onSlideChangeEnd: this.ionSlideDidChange.emit,
|
||||
onSlideNextStart: this.ionSlideNextStart.emit,
|
||||
|
||||
@ -44,7 +44,7 @@ export class Spinner {
|
||||
/**
|
||||
* @input {boolean} If true, pause the animation.
|
||||
*/
|
||||
@Prop() paused: boolean = false;
|
||||
@Prop() paused = false;
|
||||
|
||||
|
||||
private getName(): string {
|
||||
|
||||
@ -27,13 +27,13 @@ export class SplitPane {
|
||||
private rmL: any;
|
||||
|
||||
@Element() private el: HTMLElement;
|
||||
@State() private visible: boolean = false;
|
||||
@State() private visible = false;
|
||||
|
||||
/**
|
||||
* @input {boolean} If `false`, the split-pane is disabled, ie. the side pane will
|
||||
* never be displayed. Default `true`.
|
||||
*/
|
||||
@Prop() enabled: boolean = true;
|
||||
@Prop() enabled = true;
|
||||
|
||||
/**
|
||||
* @input {string | boolean} When the split-pane should be shown.
|
||||
@ -66,9 +66,9 @@ export class SplitPane {
|
||||
const children = this.el.children;
|
||||
const nu = this.el.childElementCount;
|
||||
let foundMain = false;
|
||||
for (var i = 0; i < nu; i++) {
|
||||
var child = children[i] as HTMLElement;
|
||||
var isMain = child.hasAttribute('main');
|
||||
for (let i = 0; i < nu; i++) {
|
||||
let child = children[i] as HTMLElement;
|
||||
let isMain = child.hasAttribute('main');
|
||||
if (isMain) {
|
||||
if (foundMain) {
|
||||
console.warn('split pane can not have more than one main node');
|
||||
|
||||
@ -39,7 +39,7 @@ export class Tab {
|
||||
/**
|
||||
* @input {string} The badge color for the tab button.
|
||||
*/
|
||||
@Prop() badgeStyle: string = 'default';
|
||||
@Prop() badgeStyle = 'default';
|
||||
|
||||
/**
|
||||
* @input {boolean} If true, enable the tab. If false,
|
||||
|
||||
@ -14,8 +14,8 @@ export class Tabbar {
|
||||
|
||||
@Element() el: HTMLElement;
|
||||
|
||||
@State() canScrollLeft: boolean = false;
|
||||
@State() canScrollRight: boolean = false;
|
||||
@State() canScrollLeft = false;
|
||||
@State() canScrollRight = false;
|
||||
|
||||
@State() hidden = false;
|
||||
|
||||
@ -33,9 +33,9 @@ export class Tabbar {
|
||||
this.highlight && this.updateHighlight();
|
||||
}
|
||||
|
||||
@Prop() layout: string = 'icon-top';
|
||||
@Prop() highlight: boolean = false;
|
||||
@Prop() translucent: boolean = false;
|
||||
@Prop() layout = 'icon-top';
|
||||
@Prop() highlight = false;
|
||||
@Prop() translucent = false;
|
||||
|
||||
@Listen('body:keyboardWillHide')
|
||||
protected onKeyboardWillHide() {
|
||||
@ -77,7 +77,7 @@ export class Tabbar {
|
||||
}
|
||||
|
||||
if (!next && right > (tabsWidth + scrollLeft)) {
|
||||
let amount = right - tabsWidth;
|
||||
const amount = right - tabsWidth;
|
||||
next = {tab, amount};
|
||||
}
|
||||
});
|
||||
@ -189,7 +189,7 @@ export class Tabbar {
|
||||
updateHighlight() {
|
||||
this.dom.read(() => {
|
||||
const btn = this.getSelectedButton(),
|
||||
ionTabbarHighlight: HTMLElement = this.highlight && this.el.querySelector('div.tabbar-highlight') as HTMLElement;
|
||||
ionTabbarHighlight: HTMLElement = this.highlight && this.el.querySelector('div.tabbar-highlight');
|
||||
|
||||
if (btn && ionTabbarHighlight) {
|
||||
ionTabbarHighlight.style.transform = `translate3d(${btn.offsetLeft}px,0,0) scaleX(${btn.offsetWidth})`;
|
||||
|
||||
@ -10,7 +10,7 @@ import { Config } from '../../index';
|
||||
}
|
||||
})
|
||||
export class Tabs {
|
||||
private ids: number = -1;
|
||||
private ids = -1;
|
||||
private tabsId: number = (++tabIds);
|
||||
|
||||
@Element() el: HTMLElement;
|
||||
@ -51,9 +51,9 @@ export class Tabs {
|
||||
* attribute needs to be set on the content.
|
||||
* Only affects `ios` mode. Defaults to `false`.
|
||||
*/
|
||||
@Prop() translucent: boolean = false;
|
||||
@Prop() translucent = false;
|
||||
|
||||
@Prop() scrollable: boolean = false;
|
||||
@Prop() scrollable = false;
|
||||
|
||||
/**
|
||||
* @output {any} Emitted when the tab changes.
|
||||
@ -91,7 +91,7 @@ export class Tabs {
|
||||
}
|
||||
|
||||
// Reset rest of tabs
|
||||
for (let tab of this.tabs) {
|
||||
for (const tab of this.tabs) {
|
||||
if (selectedTab !== tab) {
|
||||
tab.selected = false;
|
||||
}
|
||||
|
||||
@ -52,17 +52,17 @@ export class Textarea implements TextareaComponent {
|
||||
/**
|
||||
* @input {string} Indicates whether and how the text value should be automatically capitalized as it is entered/edited by the user. Defaults to `"none"`.
|
||||
*/
|
||||
@Prop() autocapitalize: string = 'none';
|
||||
@Prop() autocapitalize = 'none';
|
||||
|
||||
/**
|
||||
* @input {string} Indicates whether the value of the control can be automatically completed by the browser. Defaults to `"off"`.
|
||||
*/
|
||||
@Prop() autocomplete: string = 'off';
|
||||
@Prop() autocomplete = 'off';
|
||||
|
||||
/**
|
||||
* @input {string} This Boolean attribute lets you specify that a form control should have input focus when the page loads. Defaults to `false`.
|
||||
*/
|
||||
@Prop() autofocus: boolean = false;
|
||||
@Prop() autofocus = false;
|
||||
|
||||
/**
|
||||
* @input {boolean} If true, the value will be cleared after focus upon edit. Defaults to `true` when `type` is `"password"`, `false` for all other types.
|
||||
@ -72,7 +72,7 @@ export class Textarea implements TextareaComponent {
|
||||
/**
|
||||
* @input {number} Set the amount of time, in milliseconds, to wait to trigger the `ionInput` event after each keystroke. Default `0`.
|
||||
*/
|
||||
@Prop() debounce: number = 0;
|
||||
@Prop() debounce = 0;
|
||||
|
||||
@Watch('debounce')
|
||||
private debounceInput() {
|
||||
@ -85,7 +85,7 @@ export class Textarea implements TextareaComponent {
|
||||
/**
|
||||
* @input {boolean} If true, the user cannot interact with the textarea. Defaults to `false`.
|
||||
*/
|
||||
@Prop() disabled: boolean = false;
|
||||
@Prop() disabled = false;
|
||||
|
||||
@Watch('disabled')
|
||||
protected disabledChanged() {
|
||||
@ -115,17 +115,17 @@ export class Textarea implements TextareaComponent {
|
||||
/**
|
||||
* @input {boolean} If true, the user cannot modify the value. Defaults to `false`.
|
||||
*/
|
||||
@Prop() readonly: boolean = false;
|
||||
@Prop() readonly = false;
|
||||
|
||||
/**
|
||||
* @input {boolean} If true, the user must fill in a value before submitting a form.
|
||||
*/
|
||||
@Prop() required: boolean = false;
|
||||
@Prop() required = false;
|
||||
|
||||
/**
|
||||
* @input {string} If true, the element will have its spelling and grammar checked. Defaults to `false`.
|
||||
*/
|
||||
@Prop() spellcheck: boolean = false;
|
||||
@Prop() spellcheck = false;
|
||||
|
||||
/**
|
||||
* @input {number} The visible width of the text control, in average character widths. If it is specified, it must be a positive integer.
|
||||
@ -166,7 +166,7 @@ export class Textarea implements TextareaComponent {
|
||||
private emitStyle() {
|
||||
clearTimeout(this.styleTmr);
|
||||
|
||||
let styles = {
|
||||
const styles = {
|
||||
'textarea': true,
|
||||
'input': true,
|
||||
'input-disabled': this.disabled,
|
||||
|
||||
@ -7,7 +7,7 @@ export default function iosEnterAnimation(Animation: Animation, baseElm: HTMLEle
|
||||
const baseAnimation = new Animation();
|
||||
|
||||
const wrapperAnimation = new Animation();
|
||||
const wrapperEle = baseElm.querySelector('.toast-wrapper') as HTMLElement;
|
||||
const wrapperEle = baseElm.querySelector('.toast-wrapper');
|
||||
wrapperAnimation.addElement(wrapperEle);
|
||||
|
||||
switch (position) {
|
||||
@ -15,7 +15,7 @@ export default function iosEnterAnimation(Animation: Animation, baseElm: HTMLEle
|
||||
wrapperAnimation.fromTo('translateY', '-100%', '10px');
|
||||
break;
|
||||
case 'middle':
|
||||
let topPosition = Math.floor(
|
||||
const topPosition = Math.floor(
|
||||
baseElm.clientHeight / 2 - wrapperEle.clientHeight / 2
|
||||
);
|
||||
wrapperEle.style.top = `${topPosition}px`;
|
||||
|
||||
@ -7,7 +7,7 @@ export default function iosLeaveAnimation(Animation: Animation, baseElm: HTMLEle
|
||||
const baseAnimation = new Animation();
|
||||
|
||||
const wrapperAnimation = new Animation();
|
||||
const wrapperEle = baseElm.querySelector('.toast-wrapper') as HTMLElement;
|
||||
const wrapperEle = baseElm.querySelector('.toast-wrapper');
|
||||
wrapperAnimation.addElement(wrapperEle);
|
||||
switch (position) {
|
||||
case 'top':
|
||||
|
||||
@ -7,7 +7,7 @@ export default function mdEnterAnimation(Animation: Animation, baseElm: HTMLElem
|
||||
const baseAnimation = new Animation();
|
||||
|
||||
const wrapperAnimation = new Animation();
|
||||
const wrapperEle = baseElm.querySelector('.toast-wrapper') as HTMLElement;
|
||||
const wrapperEle = baseElm.querySelector('.toast-wrapper');
|
||||
wrapperAnimation.addElement(wrapperEle);
|
||||
|
||||
switch (position) {
|
||||
@ -15,7 +15,7 @@ export default function mdEnterAnimation(Animation: Animation, baseElm: HTMLElem
|
||||
wrapperAnimation.fromTo('translateY', '-100%', '0%');
|
||||
break;
|
||||
case 'middle':
|
||||
let topPosition = Math.floor(
|
||||
const topPosition = Math.floor(
|
||||
baseElm.clientHeight / 2 - wrapperEle.clientHeight / 2
|
||||
);
|
||||
wrapperEle.style.top = `${topPosition}px`;
|
||||
|
||||
@ -7,7 +7,7 @@ export default function mdLeaveAnimation(Animation: Animation, baseElm: HTMLElem
|
||||
const baseAnimation = new Animation();
|
||||
|
||||
const wrapperAnimation = new Animation();
|
||||
const wrapperEle = baseElm.querySelector('.toast-wrapper') as HTMLElement;
|
||||
const wrapperEle = baseElm.querySelector('.toast-wrapper');
|
||||
wrapperAnimation.addElement(wrapperEle);
|
||||
|
||||
switch (position) {
|
||||
|
||||
@ -69,9 +69,9 @@ export class Toast {
|
||||
@Prop() closeButtonText: string;
|
||||
@Prop() dismissOnPageChange: boolean;
|
||||
@Prop() position: string;
|
||||
@Prop() translucent: boolean = false;
|
||||
@Prop() translucent = false;
|
||||
@Prop() toastId: string;
|
||||
@Prop() willAnimate: boolean = true;
|
||||
@Prop() willAnimate = true;
|
||||
|
||||
@Prop() enterAnimation: AnimationBuilder;
|
||||
@Prop() leaveAnimation: AnimationBuilder;
|
||||
@ -158,7 +158,7 @@ export class Toast {
|
||||
}
|
||||
|
||||
wrapperClass(): CssClassMap {
|
||||
let wrapperClass: string[] = !this.position
|
||||
const wrapperClass: string[] = !this.position
|
||||
? ['toast-wrapper', 'toast-bottom']
|
||||
: [`toast-wrapper`, `toast-${this.position}`];
|
||||
return wrapperClass.reduce((prevValue: any, cssClass: any) => {
|
||||
|
||||
@ -49,12 +49,12 @@ export class Toggle implements CheckboxInput {
|
||||
/**
|
||||
* @input {boolean} If true, the toggle is selected. Defaults to `false`.
|
||||
*/
|
||||
@Prop({ mutable: true }) checked: boolean = false;
|
||||
@Prop({ mutable: true }) checked = false;
|
||||
|
||||
/*
|
||||
* @input {boolean} If true, the user cannot interact with the toggle. Default false.
|
||||
*/
|
||||
@Prop({ mutable: true }) disabled: boolean = false;
|
||||
@Prop({ mutable: true }) disabled = false;
|
||||
|
||||
/**
|
||||
* @input {string} the value of the toggle.
|
||||
|
||||
@ -38,11 +38,11 @@ export class Toolbar {
|
||||
* attribute needs to be set on the content.
|
||||
* Only affects `ios` mode. Defaults to `false`.
|
||||
*/
|
||||
@Prop() translucent: boolean = false;
|
||||
@Prop() translucent = false;
|
||||
|
||||
componentDidLoad() {
|
||||
const buttons = this.el.querySelectorAll('ion-button') as any;
|
||||
for (var i = 0; i < buttons.length; i++) {
|
||||
for (let i = 0; i < buttons.length; i++) {
|
||||
buttons[i].setAttribute('button-type', 'bar-button');
|
||||
}
|
||||
}
|
||||
|
||||
@ -7,7 +7,7 @@ export function createConfigController(configObj: any, platforms: PlatformConfig
|
||||
|
||||
function get(key: string, fallback?: any): any {
|
||||
|
||||
let queryValue = queryParam(window.location.href, `ionic${key}`);
|
||||
const queryValue = queryParam(window.location.href, `ionic${key}`);
|
||||
if (isDef(queryValue)) {
|
||||
return configObj[key] = (queryValue === 'true' ? true : queryValue === 'false' ? false : queryValue);
|
||||
}
|
||||
|
||||
@ -67,9 +67,9 @@ export function isPlatformMatch(url: string, userAgent: string, platformName: st
|
||||
if (userAgent) {
|
||||
userAgent = userAgent.toLowerCase();
|
||||
|
||||
for (var i = 0; i < userAgentAtLeastHas.length; i++) {
|
||||
for (let i = 0; i < userAgentAtLeastHas.length; i++) {
|
||||
if (userAgent.indexOf(userAgentAtLeastHas[i]) > -1) {
|
||||
for (var j = 0; j < userAgentMustNotHave.length; j++) {
|
||||
for (let j = 0; j < userAgentMustNotHave.length; j++) {
|
||||
if (userAgent.indexOf(userAgentMustNotHave[j]) > -1) {
|
||||
return false;
|
||||
}
|
||||
@ -85,8 +85,8 @@ export function isPlatformMatch(url: string, userAgent: string, platformName: st
|
||||
|
||||
export function queryParam(url: string, key: string) {
|
||||
key = key.replace(/[\[]/, '\\[').replace(/[\]]/, '\\]');
|
||||
var regex = new RegExp('[\\?&]' + key + '=([^&#]*)');
|
||||
var results = regex.exec(url);
|
||||
let regex = new RegExp('[\\?&]' + key + '=([^&#]*)');
|
||||
let results = regex.exec(url);
|
||||
return results ? decodeURIComponent(results[1].replace(/\+/g, ' ')) : null;
|
||||
}
|
||||
|
||||
|
||||
@ -2,7 +2,7 @@ import { createConfigController } from '../config-controller';
|
||||
|
||||
describe('Config', () => {
|
||||
it('should get a value from the config', () => {
|
||||
let config = createConfigController({ name: 'Doc Brown' }, null);
|
||||
const config = createConfigController({ name: 'Doc Brown' }, null);
|
||||
expect(config.get('name')).toEqual('Doc Brown');
|
||||
});
|
||||
});
|
||||
|
||||
@ -2,18 +2,18 @@ import { queryParam } from '../platform-configs';
|
||||
|
||||
describe('QueryParam', () => {
|
||||
it('should read the url for a queryParam', () => {
|
||||
let qp = queryParam('?boolean=false', 'boolean');
|
||||
const qp = queryParam('?boolean=false', 'boolean');
|
||||
expect(qp).toBeDefined();
|
||||
expect(qp).toEqual('false');
|
||||
});
|
||||
|
||||
it('should get the value of queryParam', () => {
|
||||
let qp = queryParam('?keyValue=b', 'keyValue');
|
||||
const qp = queryParam('?keyValue=b', 'keyValue');
|
||||
expect(qp).toEqual('b');
|
||||
});
|
||||
|
||||
it('should show nullfor a queryParam this is not passed', () => {
|
||||
let qp = queryParam('', 'ionicanimate');
|
||||
const qp = queryParam('', 'ionicanimate');
|
||||
expect(qp).toBeNull();
|
||||
});
|
||||
});
|
||||
|
||||
@ -5,7 +5,7 @@ export class DomFrameworkDelegate implements FrameworkDelegate {
|
||||
|
||||
attachViewToDom(parentElement: HTMLElement, tagOrElement: string | HTMLElement, propsOrDataObj: any = {}, classesToAdd: string[] = []): Promise<FrameworkMountingData> {
|
||||
return new Promise((resolve) => {
|
||||
const usersElement = (isString(tagOrElement) ? document.createElement(tagOrElement) : tagOrElement) as HTMLElement;
|
||||
const usersElement = (isString(tagOrElement) ? document.createElement(tagOrElement) : tagOrElement);
|
||||
Object.assign(usersElement, propsOrDataObj);
|
||||
|
||||
if (classesToAdd.length) {
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { Animation, DomController, StencilElement } from '../index';
|
||||
import { Animation, StencilElement } from '../index';
|
||||
|
||||
export function clamp(min: number, n: number, max: number) {
|
||||
return Math.max(min, Math.min(n, max));
|
||||
@ -59,7 +59,7 @@ export function pointerCoordX(ev: any): number {
|
||||
// get X coordinates for either a mouse click
|
||||
// or a touch depending on the given event
|
||||
if (ev) {
|
||||
var changedTouches = ev.changedTouches;
|
||||
let changedTouches = ev.changedTouches;
|
||||
if (changedTouches && changedTouches.length > 0) {
|
||||
return changedTouches[0].clientX;
|
||||
}
|
||||
@ -76,9 +76,9 @@ export function updateDetail(ev: any, detail: any) {
|
||||
let x = 0;
|
||||
let y = 0;
|
||||
if (ev) {
|
||||
var changedTouches = ev.changedTouches;
|
||||
let changedTouches = ev.changedTouches;
|
||||
if (changedTouches && changedTouches.length > 0) {
|
||||
var touch = changedTouches[0];
|
||||
let touch = changedTouches[0];
|
||||
x = touch.clientX;
|
||||
y = touch.clientY;
|
||||
} else if (ev.pageX !== undefined) {
|
||||
@ -94,7 +94,7 @@ export function pointerCoordY(ev: any): number {
|
||||
// get Y coordinates for either a mouse click
|
||||
// or a touch depending on the given event
|
||||
if (ev) {
|
||||
var changedTouches = ev.changedTouches;
|
||||
let changedTouches = ev.changedTouches;
|
||||
if (changedTouches && changedTouches.length > 0) {
|
||||
return changedTouches[0].clientY;
|
||||
}
|
||||
@ -154,7 +154,7 @@ export function applyStyles(elm: HTMLElement, styles: {[styleProp: string]: stri
|
||||
const styleProps = Object.keys(styles);
|
||||
|
||||
if (elm) {
|
||||
for (var i = 0; i < styleProps.length; i++) {
|
||||
for (let i = 0; i < styleProps.length; i++) {
|
||||
(elm.style as any)[styleProps[i]] = styles[styleProps[i]];
|
||||
}
|
||||
}
|
||||
@ -179,7 +179,7 @@ export function checkEdgeSide(posX: number, isRightSide: boolean, maxEdgeStart:
|
||||
* @param isRTL whether the application dir is rtl
|
||||
* @param defaultRight whether the default side is right
|
||||
*/
|
||||
export function isRightSide(side: Side, defaultRight: boolean = false): boolean {
|
||||
export function isRightSide(side: Side, defaultRight = false): boolean {
|
||||
const isRTL = document.dir === 'rtl';
|
||||
switch (side) {
|
||||
case 'right': return true;
|
||||
@ -288,7 +288,7 @@ export function domControllerAsync(domControllerFunction: Function, callback?: F
|
||||
});
|
||||
}
|
||||
|
||||
export function debounce(func: Function, wait: number = 250) {
|
||||
export function debounce(func: Function, wait = 250) {
|
||||
let timer: number;
|
||||
return (...args: any[]): void => {
|
||||
clearTimeout(timer);
|
||||
|
||||
@ -4,7 +4,7 @@ import { CssClassMap } from '@stencil/core';
|
||||
* Create the mode and color classes for the component based on the classes passed in
|
||||
*/
|
||||
export function createThemedClasses(mode: string, color: string, classes: string): CssClassMap {
|
||||
let classObj: CssClassMap = {};
|
||||
const classObj: CssClassMap = {};
|
||||
|
||||
return classes.split(' ')
|
||||
.reduce((classObj: CssClassMap, classString: string): CssClassMap => {
|
||||
@ -27,9 +27,9 @@ export function createThemedClasses(mode: string, color: string, classes: string
|
||||
* Get the classes from a class list and return them as an object
|
||||
*/
|
||||
export function getElementClassObject(classList: DOMTokenList | string[]): CssClassMap {
|
||||
let classObj: CssClassMap = {};
|
||||
const classObj: CssClassMap = {};
|
||||
|
||||
for (var i = 0; i < classList.length; i++) {
|
||||
for (let i = 0; i < classList.length; i++) {
|
||||
classObj[classList[i]] = true;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user