vuetify eingebunden + erster Versuch Combobox
This commit is contained in:
+53
@@ -0,0 +1,53 @@
|
||||
// linear
|
||||
export var linear = function linear(t) {
|
||||
return t;
|
||||
};
|
||||
// accelerating from zero velocity
|
||||
export var easeInQuad = function easeInQuad(t) {
|
||||
return t * t;
|
||||
};
|
||||
// decelerating to zero velocity
|
||||
export var easeOutQuad = function easeOutQuad(t) {
|
||||
return t * (2 - t);
|
||||
};
|
||||
// acceleration until halfway, then deceleration
|
||||
export var easeInOutQuad = function easeInOutQuad(t) {
|
||||
return t < 0.5 ? 2 * t * t : -1 + (4 - 2 * t) * t;
|
||||
};
|
||||
// accelerating from zero velocity
|
||||
export var easeInCubic = function easeInCubic(t) {
|
||||
return t * t * t;
|
||||
};
|
||||
// decelerating to zero velocity
|
||||
export var easeOutCubic = function easeOutCubic(t) {
|
||||
return --t * t * t + 1;
|
||||
};
|
||||
// acceleration until halfway, then deceleration
|
||||
export var easeInOutCubic = function easeInOutCubic(t) {
|
||||
return t < 0.5 ? 4 * t * t * t : (t - 1) * (2 * t - 2) * (2 * t - 2) + 1;
|
||||
};
|
||||
// accelerating from zero velocity
|
||||
export var easeInQuart = function easeInQuart(t) {
|
||||
return t * t * t * t;
|
||||
};
|
||||
// decelerating to zero velocity
|
||||
export var easeOutQuart = function easeOutQuart(t) {
|
||||
return 1 - --t * t * t * t;
|
||||
};
|
||||
// acceleration until halfway, then deceleration
|
||||
export var easeInOutQuart = function easeInOutQuart(t) {
|
||||
return t < 0.5 ? 8 * t * t * t * t : 1 - 8 * --t * t * t * t;
|
||||
};
|
||||
// accelerating from zero velocity
|
||||
export var easeInQuint = function easeInQuint(t) {
|
||||
return t * t * t * t * t;
|
||||
};
|
||||
// decelerating to zero velocity
|
||||
export var easeOutQuint = function easeOutQuint(t) {
|
||||
return 1 + --t * t * t * t * t;
|
||||
};
|
||||
// acceleration until halfway, then deceleration
|
||||
export var easeInOutQuint = function easeInOutQuint(t) {
|
||||
return t < 0.5 ? 16 * t * t * t * t * t : 1 + 16 * --t * t * t * t * t;
|
||||
};
|
||||
//# sourceMappingURL=easing-patterns.js.map
|
||||
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"sources":["../../../../src/components/Vuetify/goTo/easing-patterns.ts"],"names":[],"mappings":";AAGA,OAAO,IAAM,SAAS,SAAT,MAAS,CAAC,CAAD;AAAA,SAAe,CAAf;AAAA,CAAf;AACP;AACA,OAAO,IAAM,aAAa,SAAb,UAAa,CAAC,CAAD;AAAA,SAAe,IAAI,CAAnB;AAAA,CAAnB;AACP;AACA,OAAO,IAAM,cAAc,SAAd,WAAc,CAAC,CAAD;AAAA,SAAe,KAAK,IAAI,CAAT,CAAf;AAAA,CAApB;AACP;AACA,OAAO,IAAM,gBAAgB,SAAhB,aAAgB,CAAC,CAAD;AAAA,SAAgB,IAAI,GAAJ,GAAU,IAAI,CAAJ,GAAQ,CAAlB,GAAsB,CAAC,CAAD,GAAK,CAAC,IAAI,IAAI,CAAT,IAAc,CAAzD;AAAA,CAAtB;AACP;AACA,OAAO,IAAM,cAAc,SAAd,WAAc,CAAC,CAAD;AAAA,SAAe,IAAI,CAAJ,GAAQ,CAAvB;AAAA,CAApB;AACP;AACA,OAAO,IAAM,eAAe,SAAf,YAAe,CAAC,CAAD;AAAA,SAAe,EAAE,CAAF,GAAM,CAAN,GAAU,CAAV,GAAc,CAA7B;AAAA,CAArB;AACP;AACA,OAAO,IAAM,iBAAiB,SAAjB,cAAiB,CAAC,CAAD;AAAA,SAAe,IAAI,GAAJ,GAAU,IAAI,CAAJ,GAAQ,CAAR,GAAY,CAAtB,GAA0B,CAAC,IAAI,CAAL,KAAW,IAAI,CAAJ,GAAQ,CAAnB,KAAyB,IAAI,CAAJ,GAAQ,CAAjC,IAAsC,CAA/E;AAAA,CAAvB;AACP;AACA,OAAO,IAAM,cAAc,SAAd,WAAc,CAAC,CAAD;AAAA,SAAe,IAAI,CAAJ,GAAQ,CAAR,GAAY,CAA3B;AAAA,CAApB;AACP;AACA,OAAO,IAAM,eAAe,SAAf,YAAe,CAAC,CAAD;AAAA,SAAe,IAAI,EAAE,CAAF,GAAM,CAAN,GAAU,CAAV,GAAc,CAAjC;AAAA,CAArB;AACP;AACA,OAAO,IAAM,iBAAiB,SAAjB,cAAiB,CAAC,CAAD;AAAA,SAAgB,IAAI,GAAJ,GAAU,IAAI,CAAJ,GAAQ,CAAR,GAAY,CAAZ,GAAgB,CAA1B,GAA8B,IAAI,IAAI,EAAE,CAAN,GAAU,CAAV,GAAc,CAAd,GAAkB,CAApE;AAAA,CAAvB;AACP;AACA,OAAO,IAAM,cAAc,SAAd,WAAc,CAAC,CAAD;AAAA,SAAe,IAAI,CAAJ,GAAQ,CAAR,GAAY,CAAZ,GAAgB,CAA/B;AAAA,CAApB;AACP;AACA,OAAO,IAAM,eAAe,SAAf,YAAe,CAAC,CAAD;AAAA,SAAe,IAAI,EAAE,CAAF,GAAM,CAAN,GAAU,CAAV,GAAc,CAAd,GAAkB,CAArC;AAAA,CAArB;AACP;AACA,OAAO,IAAM,iBAAiB,SAAjB,cAAiB,CAAC,CAAD;AAAA,SAAe,IAAI,GAAJ,GAAU,KAAK,CAAL,GAAS,CAAT,GAAa,CAAb,GAAiB,CAAjB,GAAqB,CAA/B,GAAmC,IAAI,KAAK,EAAE,CAAP,GAAW,CAAX,GAAe,CAAf,GAAmB,CAAnB,GAAuB,CAA7E;AAAA,CAAvB","sourcesContent":["export type EasingFunction = (t: number) => number\n\n// linear\nexport const linear = (t: number) => t\n// accelerating from zero velocity\nexport const easeInQuad = (t: number) => t * t\n// decelerating to zero velocity\nexport const easeOutQuad = (t: number) => t * (2 - t)\n// acceleration until halfway, then deceleration\nexport const easeInOutQuad = (t: number) => (t < 0.5 ? 2 * t * t : -1 + (4 - 2 * t) * t)\n// accelerating from zero velocity\nexport const easeInCubic = (t: number) => t * t * t\n// decelerating to zero velocity\nexport const easeOutCubic = (t: number) => --t * t * t + 1\n// acceleration until halfway, then deceleration\nexport const easeInOutCubic = (t: number) => t < 0.5 ? 4 * t * t * t : (t - 1) * (2 * t - 2) * (2 * t - 2) + 1\n// accelerating from zero velocity\nexport const easeInQuart = (t: number) => t * t * t * t\n// decelerating to zero velocity\nexport const easeOutQuart = (t: number) => 1 - --t * t * t * t\n// acceleration until halfway, then deceleration\nexport const easeInOutQuart = (t: number) => (t < 0.5 ? 8 * t * t * t * t : 1 - 8 * --t * t * t * t)\n// accelerating from zero velocity\nexport const easeInQuint = (t: number) => t * t * t * t * t\n// decelerating to zero velocity\nexport const easeOutQuint = (t: number) => 1 + --t * t * t * t * t\n// acceleration until halfway, then deceleration\nexport const easeInOutQuint = (t: number) => t < 0.5 ? 16 * t * t * t * t * t : 1 + 16 * --t * t * t * t * t\n"],"sourceRoot":""}
|
||||
+42
@@ -0,0 +1,42 @@
|
||||
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
|
||||
|
||||
import * as easingPatterns from './easing-patterns';
|
||||
import { getContainer, getOffset } from './util';
|
||||
import Vue from 'vue';
|
||||
export default function goTo(_target) {
|
||||
var _settings = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
||||
|
||||
var settings = _extends({
|
||||
container: document.scrollingElement || document.body || document.documentElement,
|
||||
duration: 500,
|
||||
offset: 0,
|
||||
easing: 'easeInOutCubic',
|
||||
appOffset: true
|
||||
}, _settings);
|
||||
var container = getContainer(settings.container);
|
||||
if (settings.appOffset) {
|
||||
var isDrawer = container.classList.contains('v-navigation-drawer');
|
||||
var isClipped = container.classList.contains('v-navigation-drawer--clipped');
|
||||
settings.offset += Vue.prototype.$vuetify.application.bar;
|
||||
if (!isDrawer || isClipped) settings.offset += Vue.prototype.$vuetify.application.top;
|
||||
}
|
||||
var startTime = performance.now();
|
||||
var targetLocation = getOffset(_target) - settings.offset;
|
||||
var startLocation = container.scrollTop;
|
||||
if (targetLocation === startLocation) return Promise.resolve(targetLocation);
|
||||
var ease = typeof settings.easing === 'function' ? settings.easing : easingPatterns[settings.easing];
|
||||
if (!ease) throw new TypeError('Easing function "' + settings.easing + '" not found.');
|
||||
// tslint:disable-next-line:promise-must-complete
|
||||
return new Promise(function (resolve) {
|
||||
return requestAnimationFrame(function step(currentTime) {
|
||||
var timeElapsed = currentTime - startTime;
|
||||
var progress = Math.abs(settings.duration ? Math.min(timeElapsed / settings.duration, 1) : 1);
|
||||
container.scrollTop = Math.floor(startLocation + (targetLocation - startLocation) * ease(progress));
|
||||
if (progress === 1 || container.clientHeight + container.scrollTop === container.scrollHeight) {
|
||||
return resolve(targetLocation);
|
||||
}
|
||||
requestAnimationFrame(step);
|
||||
});
|
||||
});
|
||||
}
|
||||
//# sourceMappingURL=index.js.map
|
||||
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"sources":["../../../../src/components/Vuetify/goTo/index.ts"],"names":[],"mappings":";;AAAA,OAAO,KAAK,cAAZ,MAAgC,mBAAhC;AACA,SACE,YADF,EAEE,SAFF,QAGO,QAHP;AAIA,OAAO,GAAP,MAAgB,KAAhB;AAWA,eAAc,SAAU,IAAV,CAAgB,OAAhB,EAA0E;AAAA,QAArC,SAAqC,uEAAF,EAAE;;AACtF,QAAM;AACJ,mBAAY,SAAS,gBAAT,IAAoD,SAAS,IAA7D,IAAqE,SAAS,eADtF;AAEJ,kBAAU,GAFN;AAGJ,gBAAQ,CAHJ;AAIJ,gBAAQ,gBAJJ;AAKJ,mBAAW;AALP,OAMD,SANC,CAAN;AAQA,QAAM,YAAY,aAAa,SAAS,SAAtB,CAAlB;AAEA,QAAI,SAAS,SAAb,EAAwB;AACtB,YAAM,WAAW,UAAU,SAAV,CAAoB,QAApB,CAA6B,qBAA7B,CAAjB;AACA,YAAM,YAAY,UAAU,SAAV,CAAoB,QAApB,CAA6B,8BAA7B,CAAlB;AAEA,iBAAS,MAAT,IAAmB,IAAI,SAAJ,CAAc,QAAd,CAAuB,WAAvB,CAAmC,GAAtD;AACA,YAAI,CAAC,QAAD,IAAa,SAAjB,EAA4B,SAAS,MAAT,IAAmB,IAAI,SAAJ,CAAc,QAAd,CAAuB,WAAvB,CAAmC,GAAtD;AAC7B;AAED,QAAM,YAAY,YAAY,GAAZ,EAAlB;AACA,QAAM,iBAAiB,UAAU,OAAV,IAAqB,SAAS,MAArD;AACA,QAAM,gBAAgB,UAAU,SAAhC;AACA,QAAI,mBAAmB,aAAvB,EAAsC,OAAO,QAAQ,OAAR,CAAgB,cAAhB,CAAP;AAEtC,QAAM,OAAO,OAAO,SAAS,MAAhB,KAA2B,UAA3B,GACT,SAAS,MADA,GAER,eAA6D,SAAS,MAAtE,CAFL;AAGA,QAAI,CAAC,IAAL,EAAW,MAAM,IAAI,SAAJ,uBAAkC,SAAS,MAA3C,kBAAN;AAEX;AACA,WAAO,IAAI,OAAJ,CAAY;AAAA,eAAW,sBAAsB,SAAS,IAAT,CAAe,WAAf,EAAkC;AACpF,gBAAM,cAAc,cAAc,SAAlC;AACA,gBAAM,WAAW,KAAK,GAAL,CAAS,SAAS,QAAT,GAAoB,KAAK,GAAL,CAAS,cAAc,SAAS,QAAhC,EAA0C,CAA1C,CAApB,GAAmE,CAA5E,CAAjB;AAEA,sBAAU,SAAV,GAAsB,KAAK,KAAL,CAAW,gBAAgB,CAAC,iBAAiB,aAAlB,IAAmC,KAAK,QAAL,CAA9D,CAAtB;AAEA,gBAAI,aAAa,CAAb,IAAkB,UAAU,YAAV,GAAyB,UAAU,SAAnC,KAAiD,UAAU,YAAjF,EAA+F;AAC7F,uBAAO,QAAQ,cAAR,CAAP;AACD;AAED,kCAAsB,IAAtB;AACD,SAX6B,CAAX;AAAA,KAAZ,CAAP;AAYD","sourcesContent":["import * as easingPatterns from './easing-patterns'\nimport {\n getContainer,\n getOffset\n} from './util'\nimport Vue from 'vue'\n\ntype GoToTarget = number | string | HTMLElement | Vue\ninterface GoToSettings {\n container: string | HTMLElement | Vue\n duration: number\n offset: number\n easing: string | easingPatterns.EasingFunction\n appOffset: boolean\n}\n\nexport default function goTo (_target: GoToTarget, _settings: Partial<GoToSettings> = {}): Promise<number> {\n const settings: GoToSettings = {\n container: (document.scrollingElement as HTMLElement | null) || document.body || document.documentElement,\n duration: 500,\n offset: 0,\n easing: 'easeInOutCubic',\n appOffset: true,\n ..._settings\n }\n const container = getContainer(settings.container)\n\n if (settings.appOffset) {\n const isDrawer = container.classList.contains('v-navigation-drawer')\n const isClipped = container.classList.contains('v-navigation-drawer--clipped')\n\n settings.offset += Vue.prototype.$vuetify.application.bar\n if (!isDrawer || isClipped) settings.offset += Vue.prototype.$vuetify.application.top\n }\n\n const startTime = performance.now()\n const targetLocation = getOffset(_target) - settings.offset\n const startLocation = container.scrollTop\n if (targetLocation === startLocation) return Promise.resolve(targetLocation)\n\n const ease = typeof settings.easing === 'function'\n ? settings.easing\n : (easingPatterns as Dictionary<easingPatterns.EasingFunction>)[settings.easing]\n if (!ease) throw new TypeError(`Easing function \"${settings.easing}\" not found.`)\n\n // tslint:disable-next-line:promise-must-complete\n return new Promise(resolve => requestAnimationFrame(function step (currentTime: number) {\n const timeElapsed = currentTime - startTime\n const progress = Math.abs(settings.duration ? Math.min(timeElapsed / settings.duration, 1) : 1)\n\n container.scrollTop = Math.floor(startLocation + (targetLocation - startLocation) * ease(progress))\n\n if (progress === 1 || container.clientHeight + container.scrollTop === container.scrollHeight) {\n return resolve(targetLocation)\n }\n\n requestAnimationFrame(step)\n }))\n}\n"],"sourceRoot":""}
|
||||
+36
@@ -0,0 +1,36 @@
|
||||
// Return target's cumulative offset from the top
|
||||
export function getOffset(target) {
|
||||
if (typeof target === 'number') {
|
||||
return target;
|
||||
}
|
||||
var el = $(target);
|
||||
if (!el) {
|
||||
throw typeof target === 'string' ? new Error('Target element "' + target + '" not found.') : new TypeError('Target must be a Number/Selector/HTMLElement/VueComponent, received ' + type(target) + ' instead.');
|
||||
}
|
||||
var totalOffset = 0;
|
||||
while (el) {
|
||||
totalOffset += el.offsetTop;
|
||||
el = el.offsetParent;
|
||||
}
|
||||
return totalOffset;
|
||||
}
|
||||
export function getContainer(container) {
|
||||
var el = $(container);
|
||||
if (el) return el;
|
||||
throw typeof container === 'string' ? new Error('Container element "' + container + '" not found.') : new TypeError('Container must be a Selector/HTMLElement/VueComponent, received ' + type(container) + ' instead.');
|
||||
}
|
||||
function type(el) {
|
||||
return el == null ? el : el.constructor.name;
|
||||
}
|
||||
function $(el) {
|
||||
if (typeof el === 'string') {
|
||||
return document.querySelector(el);
|
||||
} else if (el && el._isVue) {
|
||||
return el.$el;
|
||||
} else if (el instanceof HTMLElement) {
|
||||
return el;
|
||||
} else {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
//# sourceMappingURL=util.js.map
|
||||
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"sources":["../../../../src/components/Vuetify/goTo/util.ts"],"names":[],"mappings":";AAGA,OAAM,SAAU,SAAV,CAAqB,MAArB,EAAgC;AACpC,QAAI,OAAO,MAAP,KAAkB,QAAtB,EAAgC;AAC9B,eAAO,MAAP;AACD;AAED,QAAI,KAAK,EAAE,MAAF,CAAT;AACA,QAAI,CAAC,EAAL,EAAS;AACP,cAAM,OAAO,MAAP,KAAkB,QAAlB,GACF,IAAI,KAAJ,sBAA6B,MAA7B,kBADE,GAEF,IAAI,SAAJ,0EAAqF,KAAK,MAAL,CAArF,eAFJ;AAGD;AAED,QAAI,cAAc,CAAlB;AACA,WAAO,EAAP,EAAW;AACT,uBAAe,GAAG,SAAlB;AACA,aAAK,GAAG,YAAR;AACD;AAED,WAAO,WAAP;AACD;AAED,OAAM,SAAU,YAAV,CAAwB,SAAxB,EAAsC;AAC1C,QAAM,KAAK,EAAE,SAAF,CAAX;AAEA,QAAI,EAAJ,EAAQ,OAAO,EAAP;AAER,UAAM,OAAO,SAAP,KAAqB,QAArB,GACF,IAAI,KAAJ,yBAAgC,SAAhC,kBADE,GAEF,IAAI,SAAJ,sEAAiF,KAAK,SAAL,CAAjF,eAFJ;AAGD;AAED,SAAS,IAAT,CAAe,EAAf,EAAsB;AACpB,WAAO,MAAM,IAAN,GAAa,EAAb,GAAkB,GAAG,WAAH,CAAe,IAAxC;AACD;AAED,SAAS,CAAT,CAAY,EAAZ,EAAmB;AACjB,QAAI,OAAO,EAAP,KAAc,QAAlB,EAA4B;AAC1B,eAAO,SAAS,aAAT,CAAoC,EAApC,CAAP;AACD,KAFD,MAEO,IAAI,MAAM,GAAG,MAAb,EAAqB;AAC1B,eAAQ,GAAW,GAAnB;AACD,KAFM,MAEA,IAAI,cAAc,WAAlB,EAA+B;AACpC,eAAO,EAAP;AACD,KAFM,MAEA;AACL,eAAO,IAAP;AACD;AACF","sourcesContent":["import Vue from 'vue'\n\n// Return target's cumulative offset from the top\nexport function getOffset (target: any): number {\n if (typeof target === 'number') {\n return target\n }\n\n let el = $(target)\n if (!el) {\n throw typeof target === 'string'\n ? new Error(`Target element \"${target}\" not found.`)\n : new TypeError(`Target must be a Number/Selector/HTMLElement/VueComponent, received ${type(target)} instead.`)\n }\n\n let totalOffset = 0\n while (el) {\n totalOffset += el.offsetTop\n el = el.offsetParent as HTMLElement\n }\n\n return totalOffset\n}\n\nexport function getContainer (container: any): HTMLElement {\n const el = $(container)\n\n if (el) return el\n\n throw typeof container === 'string'\n ? new Error(`Container element \"${container}\" not found.`)\n : new TypeError(`Container must be a Selector/HTMLElement/VueComponent, received ${type(container)} instead.`)\n}\n\nfunction type (el: any) {\n return el == null ? el : el.constructor.name\n}\n\nfunction $ (el: any): HTMLElement | null {\n if (typeof el === 'string') {\n return document.querySelector<HTMLElement>(el)\n } else if (el && el._isVue) {\n return (el as Vue).$el as HTMLElement\n } else if (el instanceof HTMLElement) {\n return el\n } else {\n return null\n }\n}\n"],"sourceRoot":""}
|
||||
Reference in New Issue
Block a user