a new start
This commit is contained in:
20
packages/hydecorp/component/.gitignore
vendored
Normal file
20
packages/hydecorp/component/.gitignore
vendored
Normal file
@@ -0,0 +1,20 @@
|
||||
# Logs
|
||||
logs
|
||||
*.log
|
||||
|
||||
# Dependency directory
|
||||
# https://www.npmjs.org/doc/misc/npm-faq.html#should-i-check-my-node_modules-folder-into-git
|
||||
node_modules
|
||||
|
||||
# Remove some common IDE working directories
|
||||
.idea
|
||||
.vscode
|
||||
|
||||
# macOS
|
||||
.DS_Store
|
||||
|
||||
# Packages
|
||||
*.tgz
|
||||
|
||||
# Build artifacts
|
||||
lib
|
||||
32
packages/hydecorp/component/package.json
Normal file
32
packages/hydecorp/component/package.json
Normal file
@@ -0,0 +1,32 @@
|
||||
{
|
||||
"name": "@hydecorp/component",
|
||||
"version": "1.0.0",
|
||||
"description": "",
|
||||
"type": "module",
|
||||
"main": "lib/index.js",
|
||||
"module": "lib/index.js",
|
||||
"files": [
|
||||
"src",
|
||||
"lib",
|
||||
"typings",
|
||||
"tsconfig.json"
|
||||
],
|
||||
"publishConfig": {
|
||||
"access": "public"
|
||||
},
|
||||
"scripts": {
|
||||
"clean": "rm -rf lib",
|
||||
"test": "exit 0",
|
||||
"build": "tsc --outDir lib",
|
||||
"watch": "tsc --outDir lib -w",
|
||||
"prepack": "pnpm run clean && pnpm run build"
|
||||
},
|
||||
"dependencies": {
|
||||
"@types/resize-observer-browser": "^0.1.7"
|
||||
},
|
||||
"author": "Florian Klampfer <mail@qwtel.com> (https://qwtel.com/)",
|
||||
"license": "MIT",
|
||||
"devDependencies": {
|
||||
"typescript": "^4.5.5"
|
||||
}
|
||||
}
|
||||
54
packages/hydecorp/component/src/creators.ts
Normal file
54
packages/hydecorp/component/src/creators.ts
Normal file
@@ -0,0 +1,54 @@
|
||||
import { Observable, animationFrames } from "rxjs";
|
||||
import { map, takeWhile, endWith } from "rxjs/operators";
|
||||
|
||||
export function fetchRx(
|
||||
input: RequestInfo,
|
||||
init?: RequestInit,
|
||||
): Observable<Response> {
|
||||
return new Observable((observer) => {
|
||||
const controller = new AbortController();
|
||||
const { signal } = controller;
|
||||
|
||||
let response: Response | null = null;
|
||||
fetch(input, { ...init, signal })
|
||||
.then((r) => {
|
||||
response = r;
|
||||
observer.next(r);
|
||||
observer.complete();
|
||||
})
|
||||
.catch((x) => observer.error(x));
|
||||
|
||||
return () => {
|
||||
if (!response) controller.abort();
|
||||
};
|
||||
});
|
||||
}
|
||||
|
||||
export function fromMediaQuery(
|
||||
mql: MediaQueryList,
|
||||
): Observable<MediaQueryListEvent> {
|
||||
return new Observable((o) => {
|
||||
const l = o.next.bind(o);
|
||||
if (mql.onchange) mql.addEventListener("change", l);
|
||||
else mql.addListener(l);
|
||||
return () => {
|
||||
if (mql.onchange) mql.removeEventListener("change", l);
|
||||
else mql.removeListener(l);
|
||||
};
|
||||
});
|
||||
}
|
||||
|
||||
export function tween(
|
||||
easingFn: (t: number, b: number, c: number, d: number, s?: number) => number,
|
||||
b: number,
|
||||
c: number,
|
||||
d: number,
|
||||
s?: number,
|
||||
): Observable<number> {
|
||||
return animationFrames().pipe(
|
||||
map(({ elapsed }) => elapsed),
|
||||
takeWhile((t) => t < d),
|
||||
endWith(d),
|
||||
map((t) => easingFn(t, b, c, d, s)),
|
||||
);
|
||||
}
|
||||
51
packages/hydecorp/component/src/element.ts
Normal file
51
packages/hydecorp/component/src/element.ts
Normal file
@@ -0,0 +1,51 @@
|
||||
import { LitElement } from "lit";
|
||||
import { Subject } from "rxjs";
|
||||
|
||||
export class RxLitElement extends LitElement {
|
||||
$connected = new Subject<boolean>();
|
||||
|
||||
connectedCallback() {
|
||||
super.connectedCallback();
|
||||
this.$connected.next(true);
|
||||
}
|
||||
|
||||
disconnectedCallback() {
|
||||
super.disconnectedCallback();
|
||||
this.$connected.next(false);
|
||||
}
|
||||
|
||||
#firstUpdate!: boolean;
|
||||
|
||||
$: any = {};
|
||||
|
||||
firstUpdated() {
|
||||
this.#firstUpdate = true;
|
||||
}
|
||||
|
||||
updated(changedProperties: Map<string, any>) {
|
||||
if (!this.#firstUpdate)
|
||||
for (const prop of changedProperties.keys()) {
|
||||
if (prop in this.$) this.$[prop].next((<any>this)[prop]);
|
||||
}
|
||||
this.#firstUpdate = false;
|
||||
}
|
||||
|
||||
fireEvent<T>(name: string, eventInitDict?: CustomEventInit<T>) {
|
||||
this.dispatchEvent(new CustomEvent(name, eventInitDict));
|
||||
this.dispatchEvent(
|
||||
new CustomEvent(`${this.tagName.toLowerCase()}-${name}`, eventInitDict),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export function applyMixins<T>(
|
||||
derivedCtor: Constructor<T>,
|
||||
baseCtors: Constructor<any>[],
|
||||
) {
|
||||
baseCtors.forEach((baseCtor) => {
|
||||
Object.getOwnPropertyNames(baseCtor.prototype).forEach((name) => {
|
||||
derivedCtor.prototype[name] = baseCtor.prototype[name];
|
||||
});
|
||||
});
|
||||
return derivedCtor;
|
||||
}
|
||||
5
packages/hydecorp/component/src/index.ts
Normal file
5
packages/hydecorp/component/src/index.ts
Normal file
@@ -0,0 +1,5 @@
|
||||
export * from "./creators";
|
||||
export * from "./element";
|
||||
export * from "./observers";
|
||||
export * from "./operators";
|
||||
export * from "./util";
|
||||
45
packages/hydecorp/component/src/observers.ts
Normal file
45
packages/hydecorp/component/src/observers.ts
Normal file
@@ -0,0 +1,45 @@
|
||||
import { Observable } from "rxjs";
|
||||
|
||||
export function createResizeObservable(
|
||||
el: HTMLElement,
|
||||
): Observable<ResizeObserverEntry> {
|
||||
return new Observable((obs) => {
|
||||
const observer = new ResizeObserver((xs) => xs.forEach((x) => obs.next(x)));
|
||||
observer.observe(el);
|
||||
return () => {
|
||||
observer.unobserve(el);
|
||||
};
|
||||
});
|
||||
}
|
||||
|
||||
export function createMutationObservable(
|
||||
el: HTMLElement,
|
||||
options?: MutationObserverInit,
|
||||
): Observable<MutationRecord> {
|
||||
return new Observable((obs) => {
|
||||
const observer = new MutationObserver((xs) =>
|
||||
xs.forEach((x) => obs.next(x)),
|
||||
);
|
||||
observer.observe(el, options);
|
||||
return () => {
|
||||
observer.disconnect();
|
||||
};
|
||||
});
|
||||
}
|
||||
|
||||
export function createIntersectionObservable(
|
||||
els: HTMLElement | HTMLElement[],
|
||||
options?: IntersectionObserverInit,
|
||||
): Observable<IntersectionObserverEntry[]> {
|
||||
return new Observable((obs) => {
|
||||
const observer = new IntersectionObserver((xs) => obs.next(xs), options);
|
||||
|
||||
if (Array.isArray(els)) els.forEach((el) => observer.observe(el));
|
||||
else observer.observe(els);
|
||||
|
||||
return () => {
|
||||
if (Array.isArray(els)) els.forEach((el) => observer.unobserve(el));
|
||||
else observer.unobserve(els);
|
||||
};
|
||||
});
|
||||
}
|
||||
67
packages/hydecorp/component/src/operators.ts
Normal file
67
packages/hydecorp/component/src/operators.ts
Normal file
@@ -0,0 +1,67 @@
|
||||
import { Observable, NEVER, OperatorFunction } from "rxjs";
|
||||
import {
|
||||
filter,
|
||||
map,
|
||||
switchMap,
|
||||
withLatestFrom,
|
||||
tap,
|
||||
debounceTime,
|
||||
} from "rxjs/operators";
|
||||
|
||||
export function subscribeWhen<T>(p$: Observable<boolean>) {
|
||||
return (source: Observable<T>) => {
|
||||
return p$.pipe(switchMap((p) => (p ? source : NEVER)));
|
||||
};
|
||||
}
|
||||
|
||||
export function unsubscribeWhen<T>(p$: Observable<boolean>) {
|
||||
return (source: Observable<T>) => {
|
||||
return p$.pipe(switchMap((p) => (p ? NEVER : source)));
|
||||
};
|
||||
}
|
||||
|
||||
// export function filterWhen<T>(p$: Observable<boolean>) {
|
||||
// return (source: Observable<T>) => {
|
||||
// return source.pipe(
|
||||
// withLatestFrom(p$),
|
||||
// filter(([, p]) => p),
|
||||
// map(([x]) => x)
|
||||
// );
|
||||
// };
|
||||
// };
|
||||
|
||||
export function filterWhen<T>(
|
||||
p$: Observable<boolean>,
|
||||
...others: Observable<boolean>[]
|
||||
) {
|
||||
return (source: Observable<T>) => {
|
||||
if (others.length === 0) {
|
||||
return source.pipe(
|
||||
withLatestFrom(p$),
|
||||
filter(([, p]) => p),
|
||||
map(([x]) => x),
|
||||
);
|
||||
}
|
||||
|
||||
return source.pipe(
|
||||
withLatestFrom(p$, ...others),
|
||||
filter(([, ...ps]) => ps.every((p) => p)),
|
||||
map(([x]) => x as T),
|
||||
);
|
||||
};
|
||||
}
|
||||
|
||||
export function bufferDebounceTime<T>(
|
||||
time: number = 0,
|
||||
): OperatorFunction<T, T[]> {
|
||||
return (source: Observable<T>) => {
|
||||
let bufferedValues: T[] = [];
|
||||
|
||||
return source.pipe(
|
||||
tap((value) => bufferedValues.push(value)),
|
||||
debounceTime(time),
|
||||
map(() => bufferedValues),
|
||||
tap(() => (bufferedValues = [])),
|
||||
);
|
||||
};
|
||||
}
|
||||
51
packages/hydecorp/component/src/util.ts
Normal file
51
packages/hydecorp/component/src/util.ts
Normal file
@@ -0,0 +1,51 @@
|
||||
export function getScrollHeight() {
|
||||
const h = document.documentElement;
|
||||
const b = document.body;
|
||||
const sh = "scrollHeight";
|
||||
return h[sh] || b[sh];
|
||||
}
|
||||
|
||||
export function getScrollLeft() {
|
||||
return window.pageXOffset || document.body.scrollLeft;
|
||||
}
|
||||
|
||||
export function getScrollTop() {
|
||||
return window.pageYOffset || document.body.scrollTop;
|
||||
}
|
||||
|
||||
export const matches = (el: Element, selector: string) =>
|
||||
(el.matches || (<any>el)["msMatchesSelector"]).call(el, selector);
|
||||
|
||||
// Checks if this element or any of its parents matches a given `selector`.
|
||||
export function matchesAncestors(
|
||||
el: Element | null,
|
||||
selector: string,
|
||||
): Element | null {
|
||||
let curr = el;
|
||||
while (curr != null) {
|
||||
if (matches(curr, selector)) return curr;
|
||||
curr = curr.parentNode instanceof Element ? curr.parentNode : null;
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
export function fragmentFromString(strHTML: string): DocumentFragment {
|
||||
return document.createRange().createContextualFragment(strHTML);
|
||||
}
|
||||
|
||||
type Resolver<T> = (value: T | PromiseLike<T>) => void;
|
||||
type Rejector = (reason?: any) => void;
|
||||
type ResolvablePromise<T> = Promise<T> & {
|
||||
resolve: Resolver<T>;
|
||||
reject: Rejector;
|
||||
};
|
||||
export function createResolvablePromise<T>(): ResolvablePromise<T> {
|
||||
let res!: Resolver<T>;
|
||||
let rej!: Rejector;
|
||||
const promise = new Promise(
|
||||
(r, s) => ((res = r), (rej = s)),
|
||||
) as ResolvablePromise<T>;
|
||||
promise.resolve = res;
|
||||
promise.reject = rej;
|
||||
return promise;
|
||||
}
|
||||
17
packages/hydecorp/component/tsconfig.json
Normal file
17
packages/hydecorp/component/tsconfig.json
Normal file
@@ -0,0 +1,17 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"experimentalDecorators": true,
|
||||
"lib": ["DOM", "DOM.Iterable", "ES2020"],
|
||||
"moduleResolution": "Node",
|
||||
"module": "ES2020",
|
||||
"target": "ES2018",
|
||||
"outDir": "lib",
|
||||
"declaration": true,
|
||||
"declarationMap": true,
|
||||
"sourceMap": true,
|
||||
"inlineSources": true,
|
||||
"strict": true,
|
||||
"importHelpers": true
|
||||
},
|
||||
"include": ["typings/**/*.ts", "src/**/*.ts"]
|
||||
}
|
||||
21
packages/hydecorp/component/typings/Decorators.d.ts
vendored
Normal file
21
packages/hydecorp/component/typings/Decorators.d.ts
vendored
Normal file
@@ -0,0 +1,21 @@
|
||||
type Constructor<T> = {
|
||||
new (...args: unknown[]): T;
|
||||
};
|
||||
|
||||
// From the TC39 Decorators proposal
|
||||
interface ClassDescriptor {
|
||||
kind: "class";
|
||||
elements: ClassElement[];
|
||||
finisher?: <T>(clazz: Constructor<T>) => undefined | Constructor<T>;
|
||||
}
|
||||
|
||||
// From the TC39 Decorators proposal
|
||||
interface ClassElement {
|
||||
kind: "field" | "method";
|
||||
key: PropertyKey;
|
||||
placement: "static" | "prototype" | "own";
|
||||
initializer?: Function;
|
||||
extras?: ClassElement[];
|
||||
finisher?: <T>(clazz: Constructor<T>) => undefined | Constructor<T>;
|
||||
descriptor?: PropertyDescriptor;
|
||||
}
|
||||
22
packages/hydecorp/drawer/.gitignore
vendored
Normal file
22
packages/hydecorp/drawer/.gitignore
vendored
Normal file
@@ -0,0 +1,22 @@
|
||||
# Logs
|
||||
logs
|
||||
*.log
|
||||
|
||||
# Dependency directory
|
||||
# https://www.npmjs.org/doc/misc/npm-faq.html#should-i-check-my-node_modules-folder-into-git
|
||||
node_modules
|
||||
|
||||
# Remove some common IDE working directories
|
||||
.idea
|
||||
.vscode
|
||||
|
||||
# macOS
|
||||
.DS_Store
|
||||
|
||||
# Packages
|
||||
*.tgz
|
||||
|
||||
# Build artifacts
|
||||
lib
|
||||
module
|
||||
docs/assets/hy-*
|
||||
674
packages/hydecorp/drawer/LICENSE
Normal file
674
packages/hydecorp/drawer/LICENSE
Normal file
@@ -0,0 +1,674 @@
|
||||
GNU GENERAL PUBLIC LICENSE
|
||||
Version 3, 29 June 2007
|
||||
|
||||
Copyright (C) 2007 Free Software Foundation, Inc. <https://fsf.org/>
|
||||
Everyone is permitted to copy and distribute verbatim copies
|
||||
of this license document, but changing it is not allowed.
|
||||
|
||||
Preamble
|
||||
|
||||
The GNU General Public License is a free, copyleft license for
|
||||
software and other kinds of works.
|
||||
|
||||
The licenses for most software and other practical works are designed
|
||||
to take away your freedom to share and change the works. By contrast,
|
||||
the GNU General Public License is intended to guarantee your freedom to
|
||||
share and change all versions of a program--to make sure it remains free
|
||||
software for all its users. We, the Free Software Foundation, use the
|
||||
GNU General Public License for most of our software; it applies also to
|
||||
any other work released this way by its authors. You can apply it to
|
||||
your programs, too.
|
||||
|
||||
When we speak of free software, we are referring to freedom, not
|
||||
price. Our General Public Licenses are designed to make sure that you
|
||||
have the freedom to distribute copies of free software (and charge for
|
||||
them if you wish), that you receive source code or can get it if you
|
||||
want it, that you can change the software or use pieces of it in new
|
||||
free programs, and that you know you can do these things.
|
||||
|
||||
To protect your rights, we need to prevent others from denying you
|
||||
these rights or asking you to surrender the rights. Therefore, you have
|
||||
certain responsibilities if you distribute copies of the software, or if
|
||||
you modify it: responsibilities to respect the freedom of others.
|
||||
|
||||
For example, if you distribute copies of such a program, whether
|
||||
gratis or for a fee, you must pass on to the recipients the same
|
||||
freedoms that you received. You must make sure that they, too, receive
|
||||
or can get the source code. And you must show them these terms so they
|
||||
know their rights.
|
||||
|
||||
Developers that use the GNU GPL protect your rights with two steps:
|
||||
(1) assert copyright on the software, and (2) offer you this License
|
||||
giving you legal permission to copy, distribute and/or modify it.
|
||||
|
||||
For the developers' and authors' protection, the GPL clearly explains
|
||||
that there is no warranty for this free software. For both users' and
|
||||
authors' sake, the GPL requires that modified versions be marked as
|
||||
changed, so that their problems will not be attributed erroneously to
|
||||
authors of previous versions.
|
||||
|
||||
Some devices are designed to deny users access to install or run
|
||||
modified versions of the software inside them, although the manufacturer
|
||||
can do so. This is fundamentally incompatible with the aim of
|
||||
protecting users' freedom to change the software. The systematic
|
||||
pattern of such abuse occurs in the area of products for individuals to
|
||||
use, which is precisely where it is most unacceptable. Therefore, we
|
||||
have designed this version of the GPL to prohibit the practice for those
|
||||
products. If such problems arise substantially in other domains, we
|
||||
stand ready to extend this provision to those domains in future versions
|
||||
of the GPL, as needed to protect the freedom of users.
|
||||
|
||||
Finally, every program is threatened constantly by software patents.
|
||||
States should not allow patents to restrict development and use of
|
||||
software on general-purpose computers, but in those that do, we wish to
|
||||
avoid the special danger that patents applied to a free program could
|
||||
make it effectively proprietary. To prevent this, the GPL assures that
|
||||
patents cannot be used to render the program non-free.
|
||||
|
||||
The precise terms and conditions for copying, distribution and
|
||||
modification follow.
|
||||
|
||||
TERMS AND CONDITIONS
|
||||
|
||||
0. Definitions.
|
||||
|
||||
"This License" refers to version 3 of the GNU General Public License.
|
||||
|
||||
"Copyright" also means copyright-like laws that apply to other kinds of
|
||||
works, such as semiconductor masks.
|
||||
|
||||
"The Program" refers to any copyrightable work licensed under this
|
||||
License. Each licensee is addressed as "you". "Licensees" and
|
||||
"recipients" may be individuals or organizations.
|
||||
|
||||
To "modify" a work means to copy from or adapt all or part of the work
|
||||
in a fashion requiring copyright permission, other than the making of an
|
||||
exact copy. The resulting work is called a "modified version" of the
|
||||
earlier work or a work "based on" the earlier work.
|
||||
|
||||
A "covered work" means either the unmodified Program or a work based
|
||||
on the Program.
|
||||
|
||||
To "propagate" a work means to do anything with it that, without
|
||||
permission, would make you directly or secondarily liable for
|
||||
infringement under applicable copyright law, except executing it on a
|
||||
computer or modifying a private copy. Propagation includes copying,
|
||||
distribution (with or without modification), making available to the
|
||||
public, and in some countries other activities as well.
|
||||
|
||||
To "convey" a work means any kind of propagation that enables other
|
||||
parties to make or receive copies. Mere interaction with a user through
|
||||
a computer network, with no transfer of a copy, is not conveying.
|
||||
|
||||
An interactive user interface displays "Appropriate Legal Notices"
|
||||
to the extent that it includes a convenient and prominently visible
|
||||
feature that (1) displays an appropriate copyright notice, and (2)
|
||||
tells the user that there is no warranty for the work (except to the
|
||||
extent that warranties are provided), that licensees may convey the
|
||||
work under this License, and how to view a copy of this License. If
|
||||
the interface presents a list of user commands or options, such as a
|
||||
menu, a prominent item in the list meets this criterion.
|
||||
|
||||
1. Source Code.
|
||||
|
||||
The "source code" for a work means the preferred form of the work
|
||||
for making modifications to it. "Object code" means any non-source
|
||||
form of a work.
|
||||
|
||||
A "Standard Interface" means an interface that either is an official
|
||||
standard defined by a recognized standards body, or, in the case of
|
||||
interfaces specified for a particular programming language, one that
|
||||
is widely used among developers working in that language.
|
||||
|
||||
The "System Libraries" of an executable work include anything, other
|
||||
than the work as a whole, that (a) is included in the normal form of
|
||||
packaging a Major Component, but which is not part of that Major
|
||||
Component, and (b) serves only to enable use of the work with that
|
||||
Major Component, or to implement a Standard Interface for which an
|
||||
implementation is available to the public in source code form. A
|
||||
"Major Component", in this context, means a major essential component
|
||||
(kernel, window system, and so on) of the specific operating system
|
||||
(if any) on which the executable work runs, or a compiler used to
|
||||
produce the work, or an object code interpreter used to run it.
|
||||
|
||||
The "Corresponding Source" for a work in object code form means all
|
||||
the source code needed to generate, install, and (for an executable
|
||||
work) run the object code and to modify the work, including scripts to
|
||||
control those activities. However, it does not include the work's
|
||||
System Libraries, or general-purpose tools or generally available free
|
||||
programs which are used unmodified in performing those activities but
|
||||
which are not part of the work. For example, Corresponding Source
|
||||
includes interface definition files associated with source files for
|
||||
the work, and the source code for shared libraries and dynamically
|
||||
linked subprograms that the work is specifically designed to require,
|
||||
such as by intimate data communication or control flow between those
|
||||
subprograms and other parts of the work.
|
||||
|
||||
The Corresponding Source need not include anything that users
|
||||
can regenerate automatically from other parts of the Corresponding
|
||||
Source.
|
||||
|
||||
The Corresponding Source for a work in source code form is that
|
||||
same work.
|
||||
|
||||
2. Basic Permissions.
|
||||
|
||||
All rights granted under this License are granted for the term of
|
||||
copyright on the Program, and are irrevocable provided the stated
|
||||
conditions are met. This License explicitly affirms your unlimited
|
||||
permission to run the unmodified Program. The output from running a
|
||||
covered work is covered by this License only if the output, given its
|
||||
content, constitutes a covered work. This License acknowledges your
|
||||
rights of fair use or other equivalent, as provided by copyright law.
|
||||
|
||||
You may make, run and propagate covered works that you do not
|
||||
convey, without conditions so long as your license otherwise remains
|
||||
in force. You may convey covered works to others for the sole purpose
|
||||
of having them make modifications exclusively for you, or provide you
|
||||
with facilities for running those works, provided that you comply with
|
||||
the terms of this License in conveying all material for which you do
|
||||
not control copyright. Those thus making or running the covered works
|
||||
for you must do so exclusively on your behalf, under your direction
|
||||
and control, on terms that prohibit them from making any copies of
|
||||
your copyrighted material outside their relationship with you.
|
||||
|
||||
Conveying under any other circumstances is permitted solely under
|
||||
the conditions stated below. Sublicensing is not allowed; section 10
|
||||
makes it unnecessary.
|
||||
|
||||
3. Protecting Users' Legal Rights From Anti-Circumvention Law.
|
||||
|
||||
No covered work shall be deemed part of an effective technological
|
||||
measure under any applicable law fulfilling obligations under article
|
||||
11 of the WIPO copyright treaty adopted on 20 December 1996, or
|
||||
similar laws prohibiting or restricting circumvention of such
|
||||
measures.
|
||||
|
||||
When you convey a covered work, you waive any legal power to forbid
|
||||
circumvention of technological measures to the extent such circumvention
|
||||
is effected by exercising rights under this License with respect to
|
||||
the covered work, and you disclaim any intention to limit operation or
|
||||
modification of the work as a means of enforcing, against the work's
|
||||
users, your or third parties' legal rights to forbid circumvention of
|
||||
technological measures.
|
||||
|
||||
4. Conveying Verbatim Copies.
|
||||
|
||||
You may convey verbatim copies of the Program's source code as you
|
||||
receive it, in any medium, provided that you conspicuously and
|
||||
appropriately publish on each copy an appropriate copyright notice;
|
||||
keep intact all notices stating that this License and any
|
||||
non-permissive terms added in accord with section 7 apply to the code;
|
||||
keep intact all notices of the absence of any warranty; and give all
|
||||
recipients a copy of this License along with the Program.
|
||||
|
||||
You may charge any price or no price for each copy that you convey,
|
||||
and you may offer support or warranty protection for a fee.
|
||||
|
||||
5. Conveying Modified Source Versions.
|
||||
|
||||
You may convey a work based on the Program, or the modifications to
|
||||
produce it from the Program, in the form of source code under the
|
||||
terms of section 4, provided that you also meet all of these conditions:
|
||||
|
||||
a) The work must carry prominent notices stating that you modified
|
||||
it, and giving a relevant date.
|
||||
|
||||
b) The work must carry prominent notices stating that it is
|
||||
released under this License and any conditions added under section
|
||||
7. This requirement modifies the requirement in section 4 to
|
||||
"keep intact all notices".
|
||||
|
||||
c) You must license the entire work, as a whole, under this
|
||||
License to anyone who comes into possession of a copy. This
|
||||
License will therefore apply, along with any applicable section 7
|
||||
additional terms, to the whole of the work, and all its parts,
|
||||
regardless of how they are packaged. This License gives no
|
||||
permission to license the work in any other way, but it does not
|
||||
invalidate such permission if you have separately received it.
|
||||
|
||||
d) If the work has interactive user interfaces, each must display
|
||||
Appropriate Legal Notices; however, if the Program has interactive
|
||||
interfaces that do not display Appropriate Legal Notices, your
|
||||
work need not make them do so.
|
||||
|
||||
A compilation of a covered work with other separate and independent
|
||||
works, which are not by their nature extensions of the covered work,
|
||||
and which are not combined with it such as to form a larger program,
|
||||
in or on a volume of a storage or distribution medium, is called an
|
||||
"aggregate" if the compilation and its resulting copyright are not
|
||||
used to limit the access or legal rights of the compilation's users
|
||||
beyond what the individual works permit. Inclusion of a covered work
|
||||
in an aggregate does not cause this License to apply to the other
|
||||
parts of the aggregate.
|
||||
|
||||
6. Conveying Non-Source Forms.
|
||||
|
||||
You may convey a covered work in object code form under the terms
|
||||
of sections 4 and 5, provided that you also convey the
|
||||
machine-readable Corresponding Source under the terms of this License,
|
||||
in one of these ways:
|
||||
|
||||
a) Convey the object code in, or embodied in, a physical product
|
||||
(including a physical distribution medium), accompanied by the
|
||||
Corresponding Source fixed on a durable physical medium
|
||||
customarily used for software interchange.
|
||||
|
||||
b) Convey the object code in, or embodied in, a physical product
|
||||
(including a physical distribution medium), accompanied by a
|
||||
written offer, valid for at least three years and valid for as
|
||||
long as you offer spare parts or customer support for that product
|
||||
model, to give anyone who possesses the object code either (1) a
|
||||
copy of the Corresponding Source for all the software in the
|
||||
product that is covered by this License, on a durable physical
|
||||
medium customarily used for software interchange, for a price no
|
||||
more than your reasonable cost of physically performing this
|
||||
conveying of source, or (2) access to copy the
|
||||
Corresponding Source from a network server at no charge.
|
||||
|
||||
c) Convey individual copies of the object code with a copy of the
|
||||
written offer to provide the Corresponding Source. This
|
||||
alternative is allowed only occasionally and noncommercially, and
|
||||
only if you received the object code with such an offer, in accord
|
||||
with subsection 6b.
|
||||
|
||||
d) Convey the object code by offering access from a designated
|
||||
place (gratis or for a charge), and offer equivalent access to the
|
||||
Corresponding Source in the same way through the same place at no
|
||||
further charge. You need not require recipients to copy the
|
||||
Corresponding Source along with the object code. If the place to
|
||||
copy the object code is a network server, the Corresponding Source
|
||||
may be on a different server (operated by you or a third party)
|
||||
that supports equivalent copying facilities, provided you maintain
|
||||
clear directions next to the object code saying where to find the
|
||||
Corresponding Source. Regardless of what server hosts the
|
||||
Corresponding Source, you remain obligated to ensure that it is
|
||||
available for as long as needed to satisfy these requirements.
|
||||
|
||||
e) Convey the object code using peer-to-peer transmission, provided
|
||||
you inform other peers where the object code and Corresponding
|
||||
Source of the work are being offered to the general public at no
|
||||
charge under subsection 6d.
|
||||
|
||||
A separable portion of the object code, whose source code is excluded
|
||||
from the Corresponding Source as a System Library, need not be
|
||||
included in conveying the object code work.
|
||||
|
||||
A "User Product" is either (1) a "consumer product", which means any
|
||||
tangible personal property which is normally used for personal, family,
|
||||
or household purposes, or (2) anything designed or sold for incorporation
|
||||
into a dwelling. In determining whether a product is a consumer product,
|
||||
doubtful cases shall be resolved in favor of coverage. For a particular
|
||||
product received by a particular user, "normally used" refers to a
|
||||
typical or common use of that class of product, regardless of the status
|
||||
of the particular user or of the way in which the particular user
|
||||
actually uses, or expects or is expected to use, the product. A product
|
||||
is a consumer product regardless of whether the product has substantial
|
||||
commercial, industrial or non-consumer uses, unless such uses represent
|
||||
the only significant mode of use of the product.
|
||||
|
||||
"Installation Information" for a User Product means any methods,
|
||||
procedures, authorization keys, or other information required to install
|
||||
and execute modified versions of a covered work in that User Product from
|
||||
a modified version of its Corresponding Source. The information must
|
||||
suffice to ensure that the continued functioning of the modified object
|
||||
code is in no case prevented or interfered with solely because
|
||||
modification has been made.
|
||||
|
||||
If you convey an object code work under this section in, or with, or
|
||||
specifically for use in, a User Product, and the conveying occurs as
|
||||
part of a transaction in which the right of possession and use of the
|
||||
User Product is transferred to the recipient in perpetuity or for a
|
||||
fixed term (regardless of how the transaction is characterized), the
|
||||
Corresponding Source conveyed under this section must be accompanied
|
||||
by the Installation Information. But this requirement does not apply
|
||||
if neither you nor any third party retains the ability to install
|
||||
modified object code on the User Product (for example, the work has
|
||||
been installed in ROM).
|
||||
|
||||
The requirement to provide Installation Information does not include a
|
||||
requirement to continue to provide support service, warranty, or updates
|
||||
for a work that has been modified or installed by the recipient, or for
|
||||
the User Product in which it has been modified or installed. Access to a
|
||||
network may be denied when the modification itself materially and
|
||||
adversely affects the operation of the network or violates the rules and
|
||||
protocols for communication across the network.
|
||||
|
||||
Corresponding Source conveyed, and Installation Information provided,
|
||||
in accord with this section must be in a format that is publicly
|
||||
documented (and with an implementation available to the public in
|
||||
source code form), and must require no special password or key for
|
||||
unpacking, reading or copying.
|
||||
|
||||
7. Additional Terms.
|
||||
|
||||
"Additional permissions" are terms that supplement the terms of this
|
||||
License by making exceptions from one or more of its conditions.
|
||||
Additional permissions that are applicable to the entire Program shall
|
||||
be treated as though they were included in this License, to the extent
|
||||
that they are valid under applicable law. If additional permissions
|
||||
apply only to part of the Program, that part may be used separately
|
||||
under those permissions, but the entire Program remains governed by
|
||||
this License without regard to the additional permissions.
|
||||
|
||||
When you convey a copy of a covered work, you may at your option
|
||||
remove any additional permissions from that copy, or from any part of
|
||||
it. (Additional permissions may be written to require their own
|
||||
removal in certain cases when you modify the work.) You may place
|
||||
additional permissions on material, added by you to a covered work,
|
||||
for which you have or can give appropriate copyright permission.
|
||||
|
||||
Notwithstanding any other provision of this License, for material you
|
||||
add to a covered work, you may (if authorized by the copyright holders of
|
||||
that material) supplement the terms of this License with terms:
|
||||
|
||||
a) Disclaiming warranty or limiting liability differently from the
|
||||
terms of sections 15 and 16 of this License; or
|
||||
|
||||
b) Requiring preservation of specified reasonable legal notices or
|
||||
author attributions in that material or in the Appropriate Legal
|
||||
Notices displayed by works containing it; or
|
||||
|
||||
c) Prohibiting misrepresentation of the origin of that material, or
|
||||
requiring that modified versions of such material be marked in
|
||||
reasonable ways as different from the original version; or
|
||||
|
||||
d) Limiting the use for publicity purposes of names of licensors or
|
||||
authors of the material; or
|
||||
|
||||
e) Declining to grant rights under trademark law for use of some
|
||||
trade names, trademarks, or service marks; or
|
||||
|
||||
f) Requiring indemnification of licensors and authors of that
|
||||
material by anyone who conveys the material (or modified versions of
|
||||
it) with contractual assumptions of liability to the recipient, for
|
||||
any liability that these contractual assumptions directly impose on
|
||||
those licensors and authors.
|
||||
|
||||
All other non-permissive additional terms are considered "further
|
||||
restrictions" within the meaning of section 10. If the Program as you
|
||||
received it, or any part of it, contains a notice stating that it is
|
||||
governed by this License along with a term that is a further
|
||||
restriction, you may remove that term. If a license document contains
|
||||
a further restriction but permits relicensing or conveying under this
|
||||
License, you may add to a covered work material governed by the terms
|
||||
of that license document, provided that the further restriction does
|
||||
not survive such relicensing or conveying.
|
||||
|
||||
If you add terms to a covered work in accord with this section, you
|
||||
must place, in the relevant source files, a statement of the
|
||||
additional terms that apply to those files, or a notice indicating
|
||||
where to find the applicable terms.
|
||||
|
||||
Additional terms, permissive or non-permissive, may be stated in the
|
||||
form of a separately written license, or stated as exceptions;
|
||||
the above requirements apply either way.
|
||||
|
||||
8. Termination.
|
||||
|
||||
You may not propagate or modify a covered work except as expressly
|
||||
provided under this License. Any attempt otherwise to propagate or
|
||||
modify it is void, and will automatically terminate your rights under
|
||||
this License (including any patent licenses granted under the third
|
||||
paragraph of section 11).
|
||||
|
||||
However, if you cease all violation of this License, then your
|
||||
license from a particular copyright holder is reinstated (a)
|
||||
provisionally, unless and until the copyright holder explicitly and
|
||||
finally terminates your license, and (b) permanently, if the copyright
|
||||
holder fails to notify you of the violation by some reasonable means
|
||||
prior to 60 days after the cessation.
|
||||
|
||||
Moreover, your license from a particular copyright holder is
|
||||
reinstated permanently if the copyright holder notifies you of the
|
||||
violation by some reasonable means, this is the first time you have
|
||||
received notice of violation of this License (for any work) from that
|
||||
copyright holder, and you cure the violation prior to 30 days after
|
||||
your receipt of the notice.
|
||||
|
||||
Termination of your rights under this section does not terminate the
|
||||
licenses of parties who have received copies or rights from you under
|
||||
this License. If your rights have been terminated and not permanently
|
||||
reinstated, you do not qualify to receive new licenses for the same
|
||||
material under section 10.
|
||||
|
||||
9. Acceptance Not Required for Having Copies.
|
||||
|
||||
You are not required to accept this License in order to receive or
|
||||
run a copy of the Program. Ancillary propagation of a covered work
|
||||
occurring solely as a consequence of using peer-to-peer transmission
|
||||
to receive a copy likewise does not require acceptance. However,
|
||||
nothing other than this License grants you permission to propagate or
|
||||
modify any covered work. These actions infringe copyright if you do
|
||||
not accept this License. Therefore, by modifying or propagating a
|
||||
covered work, you indicate your acceptance of this License to do so.
|
||||
|
||||
10. Automatic Licensing of Downstream Recipients.
|
||||
|
||||
Each time you convey a covered work, the recipient automatically
|
||||
receives a license from the original licensors, to run, modify and
|
||||
propagate that work, subject to this License. You are not responsible
|
||||
for enforcing compliance by third parties with this License.
|
||||
|
||||
An "entity transaction" is a transaction transferring control of an
|
||||
organization, or substantially all assets of one, or subdividing an
|
||||
organization, or merging organizations. If propagation of a covered
|
||||
work results from an entity transaction, each party to that
|
||||
transaction who receives a copy of the work also receives whatever
|
||||
licenses to the work the party's predecessor in interest had or could
|
||||
give under the previous paragraph, plus a right to possession of the
|
||||
Corresponding Source of the work from the predecessor in interest, if
|
||||
the predecessor has it or can get it with reasonable efforts.
|
||||
|
||||
You may not impose any further restrictions on the exercise of the
|
||||
rights granted or affirmed under this License. For example, you may
|
||||
not impose a license fee, royalty, or other charge for exercise of
|
||||
rights granted under this License, and you may not initiate litigation
|
||||
(including a cross-claim or counterclaim in a lawsuit) alleging that
|
||||
any patent claim is infringed by making, using, selling, offering for
|
||||
sale, or importing the Program or any portion of it.
|
||||
|
||||
11. Patents.
|
||||
|
||||
A "contributor" is a copyright holder who authorizes use under this
|
||||
License of the Program or a work on which the Program is based. The
|
||||
work thus licensed is called the contributor's "contributor version".
|
||||
|
||||
A contributor's "essential patent claims" are all patent claims
|
||||
owned or controlled by the contributor, whether already acquired or
|
||||
hereafter acquired, that would be infringed by some manner, permitted
|
||||
by this License, of making, using, or selling its contributor version,
|
||||
but do not include claims that would be infringed only as a
|
||||
consequence of further modification of the contributor version. For
|
||||
purposes of this definition, "control" includes the right to grant
|
||||
patent sublicenses in a manner consistent with the requirements of
|
||||
this License.
|
||||
|
||||
Each contributor grants you a non-exclusive, worldwide, royalty-free
|
||||
patent license under the contributor's essential patent claims, to
|
||||
make, use, sell, offer for sale, import and otherwise run, modify and
|
||||
propagate the contents of its contributor version.
|
||||
|
||||
In the following three paragraphs, a "patent license" is any express
|
||||
agreement or commitment, however denominated, not to enforce a patent
|
||||
(such as an express permission to practice a patent or covenant not to
|
||||
sue for patent infringement). To "grant" such a patent license to a
|
||||
party means to make such an agreement or commitment not to enforce a
|
||||
patent against the party.
|
||||
|
||||
If you convey a covered work, knowingly relying on a patent license,
|
||||
and the Corresponding Source of the work is not available for anyone
|
||||
to copy, free of charge and under the terms of this License, through a
|
||||
publicly available network server or other readily accessible means,
|
||||
then you must either (1) cause the Corresponding Source to be so
|
||||
available, or (2) arrange to deprive yourself of the benefit of the
|
||||
patent license for this particular work, or (3) arrange, in a manner
|
||||
consistent with the requirements of this License, to extend the patent
|
||||
license to downstream recipients. "Knowingly relying" means you have
|
||||
actual knowledge that, but for the patent license, your conveying the
|
||||
covered work in a country, or your recipient's use of the covered work
|
||||
in a country, would infringe one or more identifiable patents in that
|
||||
country that you have reason to believe are valid.
|
||||
|
||||
If, pursuant to or in connection with a single transaction or
|
||||
arrangement, you convey, or propagate by procuring conveyance of, a
|
||||
covered work, and grant a patent license to some of the parties
|
||||
receiving the covered work authorizing them to use, propagate, modify
|
||||
or convey a specific copy of the covered work, then the patent license
|
||||
you grant is automatically extended to all recipients of the covered
|
||||
work and works based on it.
|
||||
|
||||
A patent license is "discriminatory" if it does not include within
|
||||
the scope of its coverage, prohibits the exercise of, or is
|
||||
conditioned on the non-exercise of one or more of the rights that are
|
||||
specifically granted under this License. You may not convey a covered
|
||||
work if you are a party to an arrangement with a third party that is
|
||||
in the business of distributing software, under which you make payment
|
||||
to the third party based on the extent of your activity of conveying
|
||||
the work, and under which the third party grants, to any of the
|
||||
parties who would receive the covered work from you, a discriminatory
|
||||
patent license (a) in connection with copies of the covered work
|
||||
conveyed by you (or copies made from those copies), or (b) primarily
|
||||
for and in connection with specific products or compilations that
|
||||
contain the covered work, unless you entered into that arrangement,
|
||||
or that patent license was granted, prior to 28 March 2007.
|
||||
|
||||
Nothing in this License shall be construed as excluding or limiting
|
||||
any implied license or other defenses to infringement that may
|
||||
otherwise be available to you under applicable patent law.
|
||||
|
||||
12. No Surrender of Others' Freedom.
|
||||
|
||||
If conditions are imposed on you (whether by court order, agreement or
|
||||
otherwise) that contradict the conditions of this License, they do not
|
||||
excuse you from the conditions of this License. If you cannot convey a
|
||||
covered work so as to satisfy simultaneously your obligations under this
|
||||
License and any other pertinent obligations, then as a consequence you may
|
||||
not convey it at all. For example, if you agree to terms that obligate you
|
||||
to collect a royalty for further conveying from those to whom you convey
|
||||
the Program, the only way you could satisfy both those terms and this
|
||||
License would be to refrain entirely from conveying the Program.
|
||||
|
||||
13. Use with the GNU Affero General Public License.
|
||||
|
||||
Notwithstanding any other provision of this License, you have
|
||||
permission to link or combine any covered work with a work licensed
|
||||
under version 3 of the GNU Affero General Public License into a single
|
||||
combined work, and to convey the resulting work. The terms of this
|
||||
License will continue to apply to the part which is the covered work,
|
||||
but the special requirements of the GNU Affero General Public License,
|
||||
section 13, concerning interaction through a network will apply to the
|
||||
combination as such.
|
||||
|
||||
14. Revised Versions of this License.
|
||||
|
||||
The Free Software Foundation may publish revised and/or new versions of
|
||||
the GNU General Public License from time to time. Such new versions will
|
||||
be similar in spirit to the present version, but may differ in detail to
|
||||
address new problems or concerns.
|
||||
|
||||
Each version is given a distinguishing version number. If the
|
||||
Program specifies that a certain numbered version of the GNU General
|
||||
Public License "or any later version" applies to it, you have the
|
||||
option of following the terms and conditions either of that numbered
|
||||
version or of any later version published by the Free Software
|
||||
Foundation. If the Program does not specify a version number of the
|
||||
GNU General Public License, you may choose any version ever published
|
||||
by the Free Software Foundation.
|
||||
|
||||
If the Program specifies that a proxy can decide which future
|
||||
versions of the GNU General Public License can be used, that proxy's
|
||||
public statement of acceptance of a version permanently authorizes you
|
||||
to choose that version for the Program.
|
||||
|
||||
Later license versions may give you additional or different
|
||||
permissions. However, no additional obligations are imposed on any
|
||||
author or copyright holder as a result of your choosing to follow a
|
||||
later version.
|
||||
|
||||
15. Disclaimer of Warranty.
|
||||
|
||||
THERE IS NO WARRANTY FOR THE PROGRAM, TO THE EXTENT PERMITTED BY
|
||||
APPLICABLE LAW. EXCEPT WHEN OTHERWISE STATED IN WRITING THE COPYRIGHT
|
||||
HOLDERS AND/OR OTHER PARTIES PROVIDE THE PROGRAM "AS IS" WITHOUT WARRANTY
|
||||
OF ANY KIND, EITHER EXPRESSED OR IMPLIED, INCLUDING, BUT NOT LIMITED TO,
|
||||
THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
|
||||
PURPOSE. THE ENTIRE RISK AS TO THE QUALITY AND PERFORMANCE OF THE PROGRAM
|
||||
IS WITH YOU. SHOULD THE PROGRAM PROVE DEFECTIVE, YOU ASSUME THE COST OF
|
||||
ALL NECESSARY SERVICING, REPAIR OR CORRECTION.
|
||||
|
||||
16. Limitation of Liability.
|
||||
|
||||
IN NO EVENT UNLESS REQUIRED BY APPLICABLE LAW OR AGREED TO IN WRITING
|
||||
WILL ANY COPYRIGHT HOLDER, OR ANY OTHER PARTY WHO MODIFIES AND/OR CONVEYS
|
||||
THE PROGRAM AS PERMITTED ABOVE, BE LIABLE TO YOU FOR DAMAGES, INCLUDING ANY
|
||||
GENERAL, SPECIAL, INCIDENTAL OR CONSEQUENTIAL DAMAGES ARISING OUT OF THE
|
||||
USE OR INABILITY TO USE THE PROGRAM (INCLUDING BUT NOT LIMITED TO LOSS OF
|
||||
DATA OR DATA BEING RENDERED INACCURATE OR LOSSES SUSTAINED BY YOU OR THIRD
|
||||
PARTIES OR A FAILURE OF THE PROGRAM TO OPERATE WITH ANY OTHER PROGRAMS),
|
||||
EVEN IF SUCH HOLDER OR OTHER PARTY HAS BEEN ADVISED OF THE POSSIBILITY OF
|
||||
SUCH DAMAGES.
|
||||
|
||||
17. Interpretation of Sections 15 and 16.
|
||||
|
||||
If the disclaimer of warranty and limitation of liability provided
|
||||
above cannot be given local legal effect according to their terms,
|
||||
reviewing courts shall apply local law that most closely approximates
|
||||
an absolute waiver of all civil liability in connection with the
|
||||
Program, unless a warranty or assumption of liability accompanies a
|
||||
copy of the Program in return for a fee.
|
||||
|
||||
END OF TERMS AND CONDITIONS
|
||||
|
||||
How to Apply These Terms to Your New Programs
|
||||
|
||||
If you develop a new program, and you want it to be of the greatest
|
||||
possible use to the public, the best way to achieve this is to make it
|
||||
free software which everyone can redistribute and change under these terms.
|
||||
|
||||
To do so, attach the following notices to the program. It is safest
|
||||
to attach them to the start of each source file to most effectively
|
||||
state the exclusion of warranty; and each file should have at least
|
||||
the "copyright" line and a pointer to where the full notice is found.
|
||||
|
||||
<one line to give the program's name and a brief idea of what it does.>
|
||||
Copyright (C) <year> <name of author>
|
||||
|
||||
This program is free software: you can redistribute it and/or modify
|
||||
it under the terms of the GNU General Public License as published by
|
||||
the Free Software Foundation, either version 3 of the License, or
|
||||
(at your option) any later version.
|
||||
|
||||
This program is distributed in the hope that it will be useful,
|
||||
but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
GNU General Public License for more details.
|
||||
|
||||
You should have received a copy of the GNU General Public License
|
||||
along with this program. If not, see <https://www.gnu.org/licenses/>.
|
||||
|
||||
Also add information on how to contact you by electronic and paper mail.
|
||||
|
||||
If the program does terminal interaction, make it output a short
|
||||
notice like this when it starts in an interactive mode:
|
||||
|
||||
<program> Copyright (C) <year> <name of author>
|
||||
This program comes with ABSOLUTELY NO WARRANTY; for details type `show w'.
|
||||
This is free software, and you are welcome to redistribute it
|
||||
under certain conditions; type `show c' for details.
|
||||
|
||||
The hypothetical commands `show w' and `show c' should show the appropriate
|
||||
parts of the General Public License. Of course, your program's commands
|
||||
might be different; for a GUI interface, you would use an "about box".
|
||||
|
||||
You should also get your employer (if you work as a programmer) or school,
|
||||
if any, to sign a "copyright disclaimer" for the program, if necessary.
|
||||
For more information on this, and how to apply and follow the GNU GPL, see
|
||||
<https://www.gnu.org/licenses/>.
|
||||
|
||||
The GNU General Public License does not permit incorporating your program
|
||||
into proprietary programs. If your program is a subroutine library, you
|
||||
may consider it more useful to permit linking proprietary applications with
|
||||
the library. If this is what you want to do, use the GNU Lesser General
|
||||
Public License instead of this License. But first, please read
|
||||
<https://www.gnu.org/licenses/why-not-lgpl.html>.
|
||||
70
packages/hydecorp/drawer/package.json
Normal file
70
packages/hydecorp/drawer/package.json
Normal file
@@ -0,0 +1,70 @@
|
||||
{
|
||||
"name": "@hydecorp/drawer",
|
||||
"version": "1.0.0",
|
||||
"description": "A touch-enabled drawer component for the modern web",
|
||||
"type": "module",
|
||||
"main": "lib/index.js",
|
||||
"module": "lib/index.js",
|
||||
"files": [
|
||||
"src",
|
||||
"lib",
|
||||
"module",
|
||||
"tsconfig.json"
|
||||
],
|
||||
"publishConfig": {
|
||||
"access": "public"
|
||||
},
|
||||
"scripts": {
|
||||
"clean": "rm -rf lib module",
|
||||
"test": "exit 0",
|
||||
"build:tsc": "tsc -d",
|
||||
"watch:tsc": "tsc -d -w",
|
||||
"build:rollup": "rollup -c",
|
||||
"watch:rollup": "rollup -c -w",
|
||||
"build": "pnpm run build:tsc & pnpm run build:rollup & wait",
|
||||
"watch": "pnpm run watch:tsc & pnpm run watch:rollup",
|
||||
"serve": "serve -l 3337",
|
||||
"dev": "pnpm run watch & pnpm run serve",
|
||||
"preversion": "sed -i '' -E 's:^(lib|docs/assets/hy-\\*)$:#<removed temporarily>\\1:' .gitignore",
|
||||
"version": "pnpm run build && git add .",
|
||||
"postversion": "sed -i '' -E 's:^#<removed temporarily>(lib|docs/assets/hy-\\*)$:\\1:' .gitignore && git rm --cached -r lib docs/assets/hy-* && git add . && git commit -m 'Restore preversion .gitignore'",
|
||||
"prepack": "pnpm run clean && pnpm run build"
|
||||
},
|
||||
"author": "Florian Klampfer <mail@qwtel.com> (https://qwtel.com/)",
|
||||
"license": "GPL-3.0",
|
||||
"dependencies": {
|
||||
"@hydecorp/component": "^1.0.0",
|
||||
"@types/resize-observer-browser": "^0.1.7",
|
||||
"@types/w3c-css-typed-object-model-level-1": "20180410.0.4"
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git+https://github.com/hydecorp/drawer.git"
|
||||
},
|
||||
"bugs": {
|
||||
"url": "https://github.com/hydecorp/drawer/issues"
|
||||
},
|
||||
"homepage": "https://hydecorp.github.io/drawer/",
|
||||
"tags": [
|
||||
"drawer",
|
||||
"touch-events",
|
||||
"swipe-gestures",
|
||||
"webcomponent",
|
||||
"jquery",
|
||||
"rxjs",
|
||||
"pivoine",
|
||||
"jquery-plugin",
|
||||
"vanilla-js",
|
||||
"drawer-layout",
|
||||
"custom-element",
|
||||
"vanilla",
|
||||
"web-components",
|
||||
"ui-component",
|
||||
"reactive",
|
||||
"menu",
|
||||
"menu-navigation"
|
||||
],
|
||||
"devDependencies": {
|
||||
"rollup": "^4.40.1"
|
||||
}
|
||||
}
|
||||
23
packages/hydecorp/drawer/rollup.config.js
Normal file
23
packages/hydecorp/drawer/rollup.config.js
Normal file
@@ -0,0 +1,23 @@
|
||||
import resolve from "@rollup/plugin-node-resolve";
|
||||
import commonjs from "@rollup/plugin-commonjs";
|
||||
import typescript from "@rollup/plugin-typescript";
|
||||
import terser from "@rollup/plugin-terser";
|
||||
|
||||
export default [
|
||||
{
|
||||
input: "src/index.ts",
|
||||
output: [
|
||||
{
|
||||
file: `docs/assets/hy-drawer.js`,
|
||||
format: "es",
|
||||
sourcemap: true,
|
||||
},
|
||||
{
|
||||
file: `module/index.js`,
|
||||
format: "es",
|
||||
sourcemap: true,
|
||||
},
|
||||
],
|
||||
plugins: [typescript(), resolve(), commonjs(), terser()],
|
||||
},
|
||||
];
|
||||
86
packages/hydecorp/drawer/src/calc.ts
Normal file
86
packages/hydecorp/drawer/src/calc.ts
Normal file
@@ -0,0 +1,86 @@
|
||||
import { VELOCITY_THRESHOLD } from "./constants";
|
||||
|
||||
import { Coord } from "./observables";
|
||||
|
||||
// Using shorthands for common functions
|
||||
const min = Math.min.bind(Math);
|
||||
const max = Math.max.bind(Math);
|
||||
|
||||
export class CalcMixin {
|
||||
side!: "left" | "right";
|
||||
range!: [number, number];
|
||||
|
||||
calcIsInRange({ clientX }: Coord, opened: boolean) {
|
||||
// console.log(this.range, this.align);
|
||||
switch (this.side) {
|
||||
case "left": {
|
||||
const [lower, upper] = this.range;
|
||||
return clientX > lower && (opened || clientX < upper);
|
||||
}
|
||||
case "right": {
|
||||
const upper = window.innerWidth - this.range[0];
|
||||
const lower = window.innerWidth - this.range[1];
|
||||
return clientX < upper && (opened || clientX > lower);
|
||||
}
|
||||
default:
|
||||
throw Error();
|
||||
}
|
||||
}
|
||||
|
||||
calcIsSwipe(
|
||||
{ clientX: startX }: Coord,
|
||||
{ clientX: endX }: Coord,
|
||||
translateX: number,
|
||||
drawerWidth: number,
|
||||
_: number,
|
||||
): boolean {
|
||||
return endX !== startX || (translateX > 0 && translateX < drawerWidth);
|
||||
}
|
||||
|
||||
calcWillOpen(
|
||||
_: {},
|
||||
__: {},
|
||||
translateX: number,
|
||||
drawerWidth: number,
|
||||
velocity: number,
|
||||
): boolean {
|
||||
switch (this.side) {
|
||||
case "left": {
|
||||
if (velocity > VELOCITY_THRESHOLD) return true;
|
||||
else if (velocity < -VELOCITY_THRESHOLD) return false;
|
||||
else if (translateX >= drawerWidth / 2) return true;
|
||||
else return false;
|
||||
}
|
||||
case "right": {
|
||||
if (-velocity > VELOCITY_THRESHOLD) return true;
|
||||
else if (-velocity < -VELOCITY_THRESHOLD) return false;
|
||||
else if (translateX <= -drawerWidth / 2) return true;
|
||||
else return false;
|
||||
}
|
||||
default:
|
||||
throw Error();
|
||||
}
|
||||
}
|
||||
|
||||
calcTranslateX(
|
||||
{ clientX: moveX }: Coord,
|
||||
{ clientX: startX }: Coord,
|
||||
startTranslateX: number,
|
||||
drawerWidth: number,
|
||||
): number {
|
||||
switch (this.side) {
|
||||
case "left": {
|
||||
const deltaX = moveX - startX;
|
||||
const translateX = startTranslateX + deltaX;
|
||||
return max(0, min(drawerWidth, translateX));
|
||||
}
|
||||
case "right": {
|
||||
const deltaX = moveX - startX;
|
||||
const translateX = startTranslateX + deltaX;
|
||||
return min(0, max(-drawerWidth, translateX));
|
||||
}
|
||||
default:
|
||||
throw Error();
|
||||
}
|
||||
}
|
||||
}
|
||||
42
packages/hydecorp/drawer/src/common.ts
Normal file
42
packages/hydecorp/drawer/src/common.ts
Normal file
@@ -0,0 +1,42 @@
|
||||
import { Observable, of } from "rxjs";
|
||||
import { map } from "rxjs/operators";
|
||||
import { createResizeObservable } from "@hydecorp/component";
|
||||
import { ComplexAttributeConverter } from "lit";
|
||||
|
||||
export {
|
||||
applyMixins,
|
||||
subscribeWhen,
|
||||
filterWhen,
|
||||
tween,
|
||||
} from "@hydecorp/component";
|
||||
|
||||
export function easeOutSine(t: number, b: number, c: number, d: number) {
|
||||
return c * Math.sin((t / d) * (Math.PI / 2)) + b;
|
||||
}
|
||||
|
||||
export function observeWidth(el: HTMLElement) {
|
||||
// This component should have at least basic support without `ResizeObserver` support,
|
||||
// so we pass a one-time measurement when it's missing. Obviously this won't update, so BYO polyfill.
|
||||
const resize$: Observable<{ contentRect: { width: number } }> =
|
||||
"ResizeObserver" in window
|
||||
? createResizeObservable(el)
|
||||
: of({ contentRect: { width: el.clientWidth } });
|
||||
return resize$.pipe(map((rect) => rect.contentRect.width));
|
||||
}
|
||||
|
||||
export const rangeConverter: ComplexAttributeConverter<number[]> = {
|
||||
fromAttribute(attr) {
|
||||
return (attr ?? "")
|
||||
.replace(/[\[\]]/g, "")
|
||||
.split(",")
|
||||
.map(Number);
|
||||
},
|
||||
|
||||
toAttribute(range) {
|
||||
return range.join(",");
|
||||
},
|
||||
};
|
||||
|
||||
export function rangeHasChanged(curr: number[], prev: number[] = []) {
|
||||
return curr.length !== prev.length || curr.some((v, i) => v !== prev[i]);
|
||||
}
|
||||
12
packages/hydecorp/drawer/src/constants.ts
Normal file
12
packages/hydecorp/drawer/src/constants.ts
Normal file
@@ -0,0 +1,12 @@
|
||||
// The base duration of the fling animation.
|
||||
export const BASE_DURATION = 200;
|
||||
|
||||
// We adjust the duration of the animation using the width of the drawer.
|
||||
// There is no physics to this, but we know from testing that the animation starts to feel bad
|
||||
// when the drawer increases in size.
|
||||
// From testing we know that, if we increase the duration as a fraction of the drawer width,
|
||||
// the animation stays smooth across common display sizes.
|
||||
export const WIDTH_CONTRIBUTION = 0.15;
|
||||
|
||||
// Minimum velocity of the drawer (in px/ms) when releasing to make it fling to opened/closed state.
|
||||
export const VELOCITY_THRESHOLD = 0.15;
|
||||
485
packages/hydecorp/drawer/src/index.ts
Normal file
485
packages/hydecorp/drawer/src/index.ts
Normal file
@@ -0,0 +1,485 @@
|
||||
/**
|
||||
* Copyright (c) 2020 Florian Klampfer <https://qwtel.com/>
|
||||
*
|
||||
* This program is free software: you can redistribute it and/or modify
|
||||
* it under the terms of the GNU General Public License as published by
|
||||
* the Free Software Foundation, either version 3 of the License, or
|
||||
* (at your option) any later version.
|
||||
*
|
||||
* This program is distributed in the hope that it will be useful,
|
||||
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
* GNU General Public License for more details.
|
||||
*
|
||||
* You should have received a copy of the GNU General Public License
|
||||
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||
*
|
||||
* @license
|
||||
* @nocompile
|
||||
*/
|
||||
import { html, ReactiveElement } from "lit";
|
||||
import { property, customElement, query } from "lit/decorators.js";
|
||||
import { classMap } from "lit/directives/class-map.js";
|
||||
import { styleMap } from "lit/directives/style-map.js";
|
||||
|
||||
import {
|
||||
Observable,
|
||||
Subject,
|
||||
BehaviorSubject,
|
||||
combineLatest,
|
||||
merge,
|
||||
NEVER,
|
||||
defer,
|
||||
fromEvent,
|
||||
} from "rxjs";
|
||||
import {
|
||||
startWith,
|
||||
takeUntil,
|
||||
map,
|
||||
share,
|
||||
withLatestFrom,
|
||||
tap,
|
||||
sample,
|
||||
timestamp,
|
||||
pairwise,
|
||||
filter,
|
||||
switchMap,
|
||||
skip,
|
||||
finalize,
|
||||
} from "rxjs/operators";
|
||||
|
||||
import { RxLitElement, createResolvablePromise } from "@hydecorp/component";
|
||||
|
||||
import { BASE_DURATION, WIDTH_CONTRIBUTION } from "./constants";
|
||||
import {
|
||||
applyMixins,
|
||||
filterWhen,
|
||||
easeOutSine,
|
||||
observeWidth,
|
||||
rangeConverter,
|
||||
rangeHasChanged,
|
||||
tween,
|
||||
} from "./common";
|
||||
import { ObservablesMixin, Coord } from "./observables";
|
||||
import { CalcMixin } from "./calc";
|
||||
import { UpdateMixin, DOMUpdater } from "./update";
|
||||
import { styles } from "./styles";
|
||||
|
||||
@customElement("hy-drawer")
|
||||
export class HyDrawer
|
||||
extends applyMixins(RxLitElement, [ObservablesMixin, UpdateMixin, CalcMixin])
|
||||
implements ObservablesMixin, UpdateMixin, CalcMixin
|
||||
{
|
||||
static styles = styles;
|
||||
|
||||
@query(".scrim") scrimEl!: HTMLElement;
|
||||
@query(".wrapper") contentEl!: HTMLElement;
|
||||
@query(".peek") peekEl!: HTMLElement;
|
||||
|
||||
@property({ type: Boolean, reflect: true }) opened: boolean = false;
|
||||
@property({ type: String, reflect: true }) side: "left" | "right" = "left";
|
||||
@property({ type: Boolean, reflect: true }) persistent: boolean = false;
|
||||
@property({ type: Number, reflect: true }) threshold: number = 10;
|
||||
@property({ type: Boolean, reflect: true }) noScroll: boolean = false;
|
||||
@property({ type: Boolean, reflect: true }) mouseEvents: boolean = false;
|
||||
// @property({ type: Boolean, reflect: true }) hashChange: boolean = false;
|
||||
@property({
|
||||
reflect: true,
|
||||
converter: rangeConverter,
|
||||
hasChanged: rangeHasChanged,
|
||||
})
|
||||
range: [number, number] = [0, 100];
|
||||
|
||||
// State
|
||||
@property() scrimClickable!: boolean;
|
||||
@property() grabbing!: boolean;
|
||||
@property() willChange: boolean = false;
|
||||
|
||||
#initialized = createResolvablePromise();
|
||||
get initialized() {
|
||||
return this.#initialized;
|
||||
}
|
||||
|
||||
// get histId() { return this.id || this.tagName; }
|
||||
// get hashId() { return `#${this.histId}--opened`; }
|
||||
|
||||
translateX!: number;
|
||||
opacity!: number;
|
||||
isSliding!: boolean;
|
||||
|
||||
$!: {
|
||||
opened: Subject<boolean>;
|
||||
side: Subject<"left" | "right">;
|
||||
persistent: Subject<boolean>;
|
||||
preventDefault: Subject<boolean>;
|
||||
mouseEvents: Subject<boolean>;
|
||||
// hashChange: Subject<boolean>;
|
||||
};
|
||||
|
||||
animateTo$!: Subject<boolean>;
|
||||
|
||||
// TODO: Prefer composition to mixins...
|
||||
// ObservablesMixin
|
||||
getStartObservable!: () => Observable<Coord>;
|
||||
getMoveObservable!: (
|
||||
start: Observable<Coord>,
|
||||
end: Observable<Coord>,
|
||||
) => Observable<Coord>;
|
||||
getEndObservable!: () => Observable<Coord>;
|
||||
getIsSlidingObservable!: (
|
||||
move: Observable<Coord>,
|
||||
start: Observable<Coord>,
|
||||
end: Observable<Coord>,
|
||||
) => Observable<boolean>;
|
||||
getIsSlidingObservableInner!: (
|
||||
move: Observable<Coord>,
|
||||
start: Observable<Coord>,
|
||||
) => Observable<boolean>;
|
||||
|
||||
// CalcMixin
|
||||
calcIsInRange!: (start: Coord, opened: boolean) => boolean;
|
||||
calcIsSwipe!: (
|
||||
start: Coord,
|
||||
end: Coord,
|
||||
translateX: number,
|
||||
drawerWidth: number,
|
||||
_: number,
|
||||
) => boolean;
|
||||
calcWillOpen!: (
|
||||
start: {},
|
||||
end: {},
|
||||
translateX: number,
|
||||
drawerWidth: number,
|
||||
velocity: number,
|
||||
) => boolean;
|
||||
calcTranslateX!: (
|
||||
move: Coord,
|
||||
start: Coord,
|
||||
startTranslateX: number,
|
||||
drawerWidth: number,
|
||||
) => number;
|
||||
|
||||
// UpdateMixin
|
||||
updateDOM!: (translateX: number, drawerWidth: number) => void;
|
||||
updater!: DOMUpdater;
|
||||
|
||||
// HyDrawer
|
||||
getDrawerWidth(): Observable<number> {
|
||||
const content$ = observeWidth(this.contentEl).pipe(
|
||||
tap((px) => this.fireEvent("content-width-change", { detail: px })),
|
||||
);
|
||||
const peek$ = observeWidth(this.peekEl).pipe(
|
||||
tap((px) => this.fireEvent("peek-width-change", { detail: px })),
|
||||
);
|
||||
|
||||
return combineLatest([content$, peek$]).pipe(
|
||||
// takeUntil(this.subjects.disconnect),
|
||||
map(([contentWidth, peekWidth]) => contentWidth - peekWidth),
|
||||
share(),
|
||||
);
|
||||
}
|
||||
|
||||
// private consolidateState() {
|
||||
// const hashOpened = location.hash === this.hashId;
|
||||
// const isReload = history.state && history.state[this.histId];
|
||||
// if (isReload) {
|
||||
// if (hashOpened !== this.opened) {
|
||||
// this.opened = hashOpened;
|
||||
// }
|
||||
// } else {
|
||||
// const url = new URL(location.href);
|
||||
// const newState = { ...history.state, [this.histId]: { backable: false } };
|
||||
// if (hashOpened && !this.opened) {
|
||||
// url.hash = '';
|
||||
// history.replaceState(newState, document.title, url.href);
|
||||
|
||||
// url.hash = this.hashId;
|
||||
// history.pushState({ [this.histId]: { backable: true } }, document.title, url.href);
|
||||
|
||||
// this.opened = true;
|
||||
// }
|
||||
// else if (!hashOpened && this.opened) {
|
||||
// history.replaceState(newState, document.title, url.href);
|
||||
|
||||
// url.hash = this.hashId;
|
||||
// history.pushState({ [this.histId]: { backable: true } }, document.title, url.href);
|
||||
// }
|
||||
// else {
|
||||
// history.replaceState(newState, document.title, url.href);
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
|
||||
connectedCallback() {
|
||||
super.connectedCallback();
|
||||
|
||||
// if (this.hashChange) this.consolidateState()
|
||||
|
||||
this.$ = {
|
||||
opened: new BehaviorSubject(this.opened),
|
||||
side: new BehaviorSubject(this.side),
|
||||
persistent: new BehaviorSubject(this.persistent),
|
||||
preventDefault: new BehaviorSubject(this.noScroll),
|
||||
mouseEvents: new BehaviorSubject(this.mouseEvents),
|
||||
// hashChange: new BehaviorSubject(this.hashChange),
|
||||
};
|
||||
|
||||
this.scrimClickable = this.opened;
|
||||
this.animateTo$ = new Subject<boolean>();
|
||||
this.updater = DOMUpdater.getUpdaterForPlatform(this);
|
||||
this.updateComplete.then(this.upgrade);
|
||||
}
|
||||
|
||||
#translateX$!: Observable<number>;
|
||||
#startTranslateX$!: Observable<number>;
|
||||
#tweenTranslateX$!: Observable<number>;
|
||||
|
||||
upgrade = () => {
|
||||
const drawerWidth$ = this.getDrawerWidth();
|
||||
const active$ = this.$.persistent.pipe(map((_) => !_));
|
||||
|
||||
const start$ = this.getStartObservable().pipe(
|
||||
// takeUntil(this.subjects.disconnect),
|
||||
filterWhen(active$),
|
||||
share(),
|
||||
);
|
||||
|
||||
const isScrimVisible$ = defer(() => {
|
||||
return this.#translateX$.pipe(map((translateX) => translateX !== 0));
|
||||
});
|
||||
|
||||
const isInRange$ = start$.pipe(
|
||||
withLatestFrom(isScrimVisible$),
|
||||
map((args) => this.calcIsInRange(...args)),
|
||||
tap((inRange) => {
|
||||
if (inRange) {
|
||||
this.willChange = true;
|
||||
this.fireEvent("prepare");
|
||||
}
|
||||
}),
|
||||
share(),
|
||||
);
|
||||
|
||||
const end$ = this.getEndObservable().pipe(
|
||||
// takeUntil(this.subjects.disconnect),
|
||||
filterWhen(active$, isInRange$),
|
||||
tap(() => {
|
||||
if (this.mouseEvents) this.grabbing = false;
|
||||
}),
|
||||
share(),
|
||||
);
|
||||
|
||||
const move$ = this.getMoveObservable(start$, end$).pipe(
|
||||
// takeUntil(this.subjects.disconnect),
|
||||
filterWhen(active$, isInRange$),
|
||||
share(),
|
||||
);
|
||||
|
||||
const isSliding$ = this.getIsSlidingObservable(move$, start$, end$).pipe(
|
||||
tap((isSliding) => {
|
||||
this.isSliding = isSliding;
|
||||
if (isSliding && this.mouseEvents) this.grabbing = true;
|
||||
// if (isSliding) this.fireEvent('slidestart', { detail: this.opened });
|
||||
}),
|
||||
);
|
||||
|
||||
const translateX$ = (this.#translateX$ = defer(() => {
|
||||
const jumpTranslateX$ = combineLatest([
|
||||
this.$.opened,
|
||||
this.$.side,
|
||||
drawerWidth$,
|
||||
]).pipe(
|
||||
map(([opened, side, drawerWidth]) => {
|
||||
return !opened ? 0 : drawerWidth * (side === "left" ? 1 : -1);
|
||||
}),
|
||||
);
|
||||
|
||||
const moveTranslateX$ = move$.pipe(
|
||||
filterWhen(isSliding$),
|
||||
tap(() => (this.scrimClickable = false)),
|
||||
tap(({ event }) => event && this.noScroll && event.preventDefault()),
|
||||
withLatestFrom(start$, this.#startTranslateX$, drawerWidth$),
|
||||
map((args) => this.calcTranslateX(...args)),
|
||||
);
|
||||
|
||||
return merge(this.#tweenTranslateX$, jumpTranslateX$, moveTranslateX$);
|
||||
}).pipe(share()));
|
||||
|
||||
this.#startTranslateX$ = translateX$.pipe(sample(start$));
|
||||
|
||||
const velocity$ = translateX$.pipe(
|
||||
timestamp(),
|
||||
pairwise(),
|
||||
filter(
|
||||
([{ timestamp: prevTime }, { timestamp: time }]) => time - prevTime > 0,
|
||||
),
|
||||
map(
|
||||
([
|
||||
{ value: prevX, timestamp: prevTime },
|
||||
{ value: x, timestamp: time },
|
||||
]) => (x - prevX) / (time - prevTime),
|
||||
),
|
||||
startWith(0),
|
||||
);
|
||||
|
||||
const willOpen$ = end$.pipe(
|
||||
withLatestFrom(start$, translateX$, drawerWidth$, velocity$),
|
||||
filter((args) => this.calcIsSwipe(...args)),
|
||||
map((args) => this.calcWillOpen(...args)),
|
||||
// TODO: only fire `slideend` event when slidestart fired as well?
|
||||
// tap(willOpen => this.fireEvent('slideend', { detail: willOpen })),
|
||||
);
|
||||
|
||||
const animateTo$ = this.animateTo$.pipe(
|
||||
tap(() => {
|
||||
this.willChange = true;
|
||||
this.fireEvent("prepare");
|
||||
}),
|
||||
);
|
||||
|
||||
this.#tweenTranslateX$ = merge(willOpen$, animateTo$).pipe(
|
||||
withLatestFrom(translateX$, drawerWidth$),
|
||||
switchMap(([willOpen, translateX, drawerWidth]) => {
|
||||
const inv = this.side === "left" ? 1 : -1;
|
||||
const endTranslateX = willOpen ? drawerWidth * inv : 0;
|
||||
const diffTranslateX = endTranslateX - translateX;
|
||||
const duration = Math.ceil(
|
||||
BASE_DURATION + drawerWidth * WIDTH_CONTRIBUTION,
|
||||
);
|
||||
|
||||
return tween(easeOutSine, translateX, diffTranslateX, duration).pipe(
|
||||
finalize(() => {
|
||||
this.transitioned(willOpen);
|
||||
}),
|
||||
takeUntil(start$),
|
||||
takeUntil(this.$.side.pipe(skip(1))),
|
||||
share(),
|
||||
);
|
||||
}),
|
||||
);
|
||||
|
||||
translateX$
|
||||
.pipe(
|
||||
withLatestFrom(drawerWidth$),
|
||||
tap((args) => {
|
||||
this.updateDOM(...args);
|
||||
const { translateX, opacity } = this;
|
||||
this.fireEvent("move", {
|
||||
detail: { translateX, opacity },
|
||||
bubbles: false,
|
||||
});
|
||||
}),
|
||||
)
|
||||
.subscribe();
|
||||
|
||||
fromEvent(this.scrimEl, "click")
|
||||
.pipe(
|
||||
// takeUntil(this.subjects.disconnect),
|
||||
tap(() => this.close()),
|
||||
)
|
||||
.subscribe();
|
||||
|
||||
active$
|
||||
.pipe(
|
||||
// takeUntil(this.subjects.disconnect),
|
||||
tap((active) => {
|
||||
this.scrimEl.style.display = active ? "block" : "none";
|
||||
}),
|
||||
)
|
||||
.subscribe();
|
||||
|
||||
this.$.mouseEvents
|
||||
.pipe(
|
||||
// takeUntil(this.subjects.disconnect),
|
||||
switchMap((mouseEvents) => {
|
||||
return mouseEvents ? start$.pipe(withLatestFrom(isInRange$)) : NEVER;
|
||||
}),
|
||||
filter(([coord, isInRange]) => isInRange && coord.event != null),
|
||||
tap(([{ event }]) => event && event.preventDefault()),
|
||||
)
|
||||
.subscribe();
|
||||
|
||||
// fromEvent(window, 'hashchange').pipe(
|
||||
// // takeUntil(this.subjects.disconnect),
|
||||
// subscribeWhen(this.$.hashChange),
|
||||
// tap(() => {
|
||||
// const opened = location.hash === this.hashId;
|
||||
// if (!history.state && opened) {
|
||||
// history.replaceState({ [this.histId]: { backable: true } }, document.title)
|
||||
// }
|
||||
|
||||
// // If the state doesn't match open/close the drawer
|
||||
// if (opened !== this.opened) this.animateTo$.next(opened);
|
||||
// }),
|
||||
// ).subscribe();
|
||||
|
||||
this.fireEvent("init", { detail: this.opened });
|
||||
this.#initialized.resolve(this);
|
||||
};
|
||||
|
||||
private transitioned = (hasOpened: boolean) => {
|
||||
this.opened = this.scrimClickable = hasOpened;
|
||||
this.willChange = false;
|
||||
|
||||
// if (this.hashChange) this.transitionedHash(hasOpened)
|
||||
|
||||
this.fireEvent("transitioned", { detail: hasOpened });
|
||||
};
|
||||
|
||||
// private transitionedHash(hasOpened: boolean) {
|
||||
// const hasClosed = !hasOpened;
|
||||
// const { backable } = history.state && history.state[this.histId] || { backable: false }
|
||||
// if (hasClosed && backable) {
|
||||
// history.back()
|
||||
// }
|
||||
// if (hasOpened && location.hash !== this.hashId) {
|
||||
// location.hash = this.hashId;
|
||||
// }
|
||||
// }
|
||||
|
||||
render() {
|
||||
return html`
|
||||
<div class="peek full-height"></div>
|
||||
<div
|
||||
class="scrim"
|
||||
style=${styleMap({
|
||||
willChange: this.willChange ? "opacity" : "",
|
||||
pointerEvents: this.scrimClickable ? "all" : "",
|
||||
})}
|
||||
></div>
|
||||
${
|
||||
this.mouseEvents && this.grabbing && !this.scrimClickable
|
||||
? html`<div class="grabbing-screen full-screen"></div>`
|
||||
: null
|
||||
}
|
||||
<div
|
||||
class=${classMap({
|
||||
wrapper: true,
|
||||
"full-height": true,
|
||||
[this.side]: true,
|
||||
grab: this.mouseEvents,
|
||||
grabbing: this.mouseEvents && this.grabbing,
|
||||
})}
|
||||
style=${styleMap({
|
||||
willChange: this.willChange ? "transform" : "",
|
||||
})}
|
||||
>
|
||||
<div class="overflow">
|
||||
<slot></slot>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
|
||||
open() {
|
||||
this.animateTo$.next(true);
|
||||
}
|
||||
|
||||
close() {
|
||||
this.animateTo$.next(false);
|
||||
}
|
||||
|
||||
toggle() {
|
||||
this.animateTo$.next(!this.opened);
|
||||
}
|
||||
}
|
||||
161
packages/hydecorp/drawer/src/observables.ts
Normal file
161
packages/hydecorp/drawer/src/observables.ts
Normal file
@@ -0,0 +1,161 @@
|
||||
import {
|
||||
Observable,
|
||||
combineLatest,
|
||||
fromEvent,
|
||||
merge,
|
||||
NEVER,
|
||||
ObservedValueOf,
|
||||
} from "rxjs";
|
||||
|
||||
import {
|
||||
// tap,
|
||||
filter,
|
||||
map,
|
||||
mapTo,
|
||||
repeatWhen,
|
||||
skipWhile,
|
||||
startWith,
|
||||
switchMap,
|
||||
take,
|
||||
withLatestFrom,
|
||||
} from "rxjs/operators";
|
||||
|
||||
import { subscribeWhen } from "./common";
|
||||
|
||||
const abs = Math.abs.bind(Math);
|
||||
|
||||
export type Coord = {
|
||||
readonly target: EventTarget;
|
||||
readonly clientX: number;
|
||||
readonly clientY: number;
|
||||
readonly pageX: number;
|
||||
readonly pageY: number;
|
||||
readonly screenX: number;
|
||||
readonly screenY: number;
|
||||
event?: Event;
|
||||
};
|
||||
|
||||
export class ObservablesMixin {
|
||||
$!: {
|
||||
mouseEvents: Observable<boolean>;
|
||||
preventDefault: Observable<boolean>;
|
||||
};
|
||||
|
||||
threshold!: number;
|
||||
noScroll!: boolean;
|
||||
|
||||
getStartObservable() {
|
||||
return combineLatest([this.$.mouseEvents]).pipe(
|
||||
switchMap(([mouseEvents]) => {
|
||||
const touchstart$ = (<Observable<TouchEvent>>(
|
||||
fromEvent(document, "touchstart", { passive: true })
|
||||
)).pipe(
|
||||
filter(({ touches }) => touches.length === 1),
|
||||
map(({ touches }) => touches[0] as Coord),
|
||||
);
|
||||
|
||||
const mousedown$ = !mouseEvents
|
||||
? NEVER
|
||||
: (<Observable<MouseEvent>>fromEvent(document, "mousedown")).pipe(
|
||||
map((e) => (((e as Coord).event = e), e as Coord)),
|
||||
);
|
||||
|
||||
return merge(touchstart$, mousedown$);
|
||||
}),
|
||||
);
|
||||
}
|
||||
|
||||
getMoveObservable(start$: Observable<Coord>, end$: Observable<Coord>) {
|
||||
return combineLatest([this.$.mouseEvents, this.$.preventDefault]).pipe(
|
||||
switchMap(([mouseEvents, preventDefault]) => {
|
||||
const touchmove$ = (<Observable<TouchEvent>>(
|
||||
fromEvent(document, "touchmove", { passive: !preventDefault })
|
||||
)).pipe(
|
||||
map(
|
||||
(e) => (((e.touches[0] as Coord).event = e), e.touches[0] as Coord),
|
||||
),
|
||||
);
|
||||
|
||||
const mousemove$ = !mouseEvents
|
||||
? NEVER
|
||||
: (<Observable<MouseEvent>>(
|
||||
fromEvent(document, "mousemove", { passive: !preventDefault })
|
||||
)).pipe(
|
||||
subscribeWhen(
|
||||
merge(start$.pipe(mapTo(true)), end$.pipe(mapTo(false))),
|
||||
),
|
||||
map((e) => (((e as Coord).event = e), e as Coord)),
|
||||
);
|
||||
|
||||
return merge(touchmove$, mousemove$);
|
||||
}),
|
||||
);
|
||||
}
|
||||
|
||||
getEndObservable() {
|
||||
return combineLatest([this.$.mouseEvents]).pipe(
|
||||
switchMap(([mouseEvents]) => {
|
||||
const touchend$ = (<Observable<TouchEvent>>(
|
||||
fromEvent(document, "touchend", { passive: true })
|
||||
)).pipe(
|
||||
filter(({ touches }) => touches.length === 0),
|
||||
map((event) => event.changedTouches[0] as Coord),
|
||||
);
|
||||
|
||||
const mouseup$ = !mouseEvents
|
||||
? NEVER
|
||||
: (<Observable<MouseEvent>>(
|
||||
fromEvent(document, "mouseup", { passive: true })
|
||||
)).pipe(map((e) => (((e as Coord).event = e), e as Coord)));
|
||||
|
||||
return merge(touchend$, mouseup$);
|
||||
}),
|
||||
);
|
||||
}
|
||||
|
||||
getIsSlidingObservable(
|
||||
move$: Observable<Coord>,
|
||||
start$: Observable<Coord>,
|
||||
end$: Observable<Coord>,
|
||||
) {
|
||||
return this.getIsSlidingObservableInner(move$, start$).pipe(
|
||||
take(1),
|
||||
startWith(undefined),
|
||||
repeatWhen(() => end$),
|
||||
);
|
||||
}
|
||||
|
||||
getIsSlidingObservableInner(
|
||||
move$: Observable<Coord>,
|
||||
start$: Observable<Coord>,
|
||||
) {
|
||||
if (this.threshold) {
|
||||
return move$.pipe(
|
||||
withLatestFrom(start$),
|
||||
skipWhile(
|
||||
([{ clientX, clientY }, { clientX: startX, clientY: startY }]) =>
|
||||
abs(startY - clientY) < this.threshold &&
|
||||
abs(startX - clientX) < this.threshold,
|
||||
),
|
||||
map(
|
||||
([{ clientX, clientY }, { clientX: startX, clientY: startY }]) =>
|
||||
abs(startX - clientX) >= abs(startY - clientY),
|
||||
),
|
||||
);
|
||||
} else {
|
||||
return move$.pipe(
|
||||
withLatestFrom(start$),
|
||||
map(
|
||||
([
|
||||
{ clientX, clientY, event },
|
||||
{ clientX: startX, clientY: startY },
|
||||
]) => {
|
||||
const isSliding = abs(startX - clientX) >= abs(startY - clientY);
|
||||
if (this.noScroll && isSliding && event) event.preventDefault();
|
||||
return isSliding;
|
||||
},
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
104
packages/hydecorp/drawer/src/styles.ts
Normal file
104
packages/hydecorp/drawer/src/styles.ts
Normal file
@@ -0,0 +1,104 @@
|
||||
import { css } from "lit";
|
||||
|
||||
export const styles = css`
|
||||
@media screen {
|
||||
:host {
|
||||
touch-action: pan-x;
|
||||
}
|
||||
|
||||
.full-screen {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
height: 100vh;
|
||||
width: 100vw;
|
||||
}
|
||||
|
||||
.full-height {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
.peek {
|
||||
left: 0;
|
||||
width: var(--hy-drawer-peek-width, 0px);
|
||||
visibility: hidden;
|
||||
z-index: calc(var(--hy-drawer-z-index, 100) - 1);
|
||||
}
|
||||
|
||||
.scrim {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
height: 10vh;
|
||||
width: 10vw;
|
||||
transform: scale(10);
|
||||
transform-origin: top left;
|
||||
opacity: 0;
|
||||
pointer-events: none;
|
||||
background: var(--hy-drawer-scrim-background, rgba(0, 0, 0, 0.5));
|
||||
z-index: var(--hy-drawer-z-index, 100);
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
}
|
||||
|
||||
.range {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
height: 100vh;
|
||||
z-index: calc(var(--hy-drawer-z-index, 100) + 1);
|
||||
}
|
||||
|
||||
.grabbing-screen {
|
||||
cursor: grabbing;
|
||||
z-index: calc(var(--hy-drawer-z-index, 100) + 2);
|
||||
}
|
||||
|
||||
.wrapper {
|
||||
width: var(--hy-drawer-width, 300px);
|
||||
background: var(--hy-drawer-background, inherit);
|
||||
box-shadow: var(--hy-drawer-box-shadow, 0 0 15px rgba(0, 0, 0, 0.25));
|
||||
z-index: calc(var(--hy-drawer-z-index, 100) + 3);
|
||||
contain: strict;
|
||||
}
|
||||
|
||||
.wrapper.left {
|
||||
left: calc(-1 * var(--hy-drawer-width, 300px) + var(--hy-drawer-peek-width, 0px));
|
||||
}
|
||||
|
||||
.wrapper.right {
|
||||
right: calc(-1 * var(--hy-drawer-width, 300px) + var(--hy-drawer-peek-width, 0px));
|
||||
}
|
||||
|
||||
.wrapper > .overflow {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
overscroll-behavior: contain;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
}
|
||||
|
||||
.grab {
|
||||
cursor: move;
|
||||
cursor: grab;
|
||||
}
|
||||
|
||||
.grabbing {
|
||||
cursor: grabbing;
|
||||
}
|
||||
}
|
||||
|
||||
@media print {
|
||||
.scrim {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.wrapper {
|
||||
transform: none !important;
|
||||
}
|
||||
}
|
||||
`;
|
||||
79
packages/hydecorp/drawer/src/update.ts
Normal file
79
packages/hydecorp/drawer/src/update.ts
Normal file
@@ -0,0 +1,79 @@
|
||||
export type CallbackValue = { translateX: number; opacity: number };
|
||||
|
||||
export class UpdateMixin {
|
||||
contentEl!: HTMLElement;
|
||||
scrimEl!: HTMLElement;
|
||||
|
||||
translateX!: number;
|
||||
side!: string;
|
||||
opacity!: number;
|
||||
|
||||
updater!: DOMUpdater;
|
||||
|
||||
updateDOM(translateX: number, drawerWidth: number) {
|
||||
const inv = this.side === "left" ? 1 : -1;
|
||||
const opacity = (translateX / drawerWidth) * inv || 0;
|
||||
|
||||
this.translateX = translateX;
|
||||
this.opacity = opacity;
|
||||
|
||||
this.updater.updateDOM(translateX, opacity);
|
||||
}
|
||||
}
|
||||
|
||||
export abstract class DOMUpdater {
|
||||
static getUpdaterForPlatform(parent: UpdateMixin) {
|
||||
const hasCSSOM =
|
||||
"attributeStyleMap" in Element.prototype &&
|
||||
"CSS" in window &&
|
||||
"number" in CSS;
|
||||
return hasCSSOM
|
||||
? new AttributeStyleMapUpdater(parent)
|
||||
: new StyleUpdater(parent);
|
||||
}
|
||||
|
||||
private parent: UpdateMixin;
|
||||
constructor(parent: UpdateMixin) {
|
||||
this.parent = parent;
|
||||
}
|
||||
get contentEl() {
|
||||
return this.parent.contentEl;
|
||||
}
|
||||
get scrimEl() {
|
||||
return this.parent.scrimEl;
|
||||
}
|
||||
|
||||
abstract updateDOM(translateX: number, opacity: number): void;
|
||||
}
|
||||
|
||||
export class StyleUpdater extends DOMUpdater {
|
||||
constructor(parent: UpdateMixin) {
|
||||
super(parent);
|
||||
}
|
||||
|
||||
updateDOM(translateX: number, opacity: number) {
|
||||
this.contentEl.style.transform = `translate(${translateX}px, 0px)`;
|
||||
this.scrimEl.style.opacity = `${opacity}`;
|
||||
}
|
||||
}
|
||||
|
||||
export class AttributeStyleMapUpdater extends DOMUpdater {
|
||||
private tvalue: CSSTransformValue;
|
||||
private ovalue: CSSUnitValue;
|
||||
|
||||
constructor(parent: UpdateMixin) {
|
||||
super(parent);
|
||||
this.tvalue = new CSSTransformValue([
|
||||
new CSSTranslate(CSS.px(0), CSS.px(0)),
|
||||
]);
|
||||
this.ovalue = CSS.number(1);
|
||||
}
|
||||
|
||||
updateDOM(translateX: number, opacity: number) {
|
||||
((this.tvalue[0] as CSSTranslate).x as CSSUnitValue).value = translateX;
|
||||
this.ovalue.value = opacity;
|
||||
|
||||
this.contentEl.attributeStyleMap.set("transform", this.tvalue);
|
||||
this.scrimEl.attributeStyleMap.set("opacity", this.ovalue);
|
||||
}
|
||||
}
|
||||
17
packages/hydecorp/drawer/tsconfig.json
Normal file
17
packages/hydecorp/drawer/tsconfig.json
Normal file
@@ -0,0 +1,17 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"experimentalDecorators": true,
|
||||
"lib": ["DOM", "DOM.Iterable", "ES2020"],
|
||||
"moduleResolution": "Node",
|
||||
"module": "ES2020",
|
||||
"target": "ES2018",
|
||||
"outDir": "lib",
|
||||
"declaration": true,
|
||||
"declarationMap": true,
|
||||
"sourceMap": true,
|
||||
"inlineSources": true,
|
||||
"strict": true,
|
||||
"importHelpers": true
|
||||
},
|
||||
"include": ["typings/**/*.ts", "src/**/*.ts"]
|
||||
}
|
||||
21
packages/hydecorp/drawer/typings/Decorators.d.ts
vendored
Normal file
21
packages/hydecorp/drawer/typings/Decorators.d.ts
vendored
Normal file
@@ -0,0 +1,21 @@
|
||||
type Constructor<T> = {
|
||||
new (...args: unknown[]): T;
|
||||
};
|
||||
|
||||
// From the TC39 Decorators proposal
|
||||
interface ClassDescriptor {
|
||||
kind: "class";
|
||||
elements: ClassElement[];
|
||||
finisher?: <T>(clazz: Constructor<T>) => undefined | Constructor<T>;
|
||||
}
|
||||
|
||||
// From the TC39 Decorators proposal
|
||||
interface ClassElement {
|
||||
kind: "field" | "method";
|
||||
key: PropertyKey;
|
||||
placement: "static" | "prototype" | "own";
|
||||
initializer?: Function;
|
||||
extras?: ClassElement[];
|
||||
finisher?: <T>(clazz: Constructor<T>) => undefined | Constructor<T>;
|
||||
descriptor?: PropertyDescriptor;
|
||||
}
|
||||
22
packages/hydecorp/push-state/.gitignore
vendored
Normal file
22
packages/hydecorp/push-state/.gitignore
vendored
Normal file
@@ -0,0 +1,22 @@
|
||||
# Logs
|
||||
logs
|
||||
*.log
|
||||
|
||||
# Dependency directory
|
||||
# https://www.npmjs.org/doc/misc/npm-faq.html#should-i-check-my-node_modules-folder-into-git
|
||||
node_modules
|
||||
|
||||
# Remove some common IDE working directories
|
||||
.idea
|
||||
.vscode
|
||||
|
||||
# macOS
|
||||
.DS_Store
|
||||
|
||||
# Packages
|
||||
*.tgz
|
||||
|
||||
# Build artifacts
|
||||
lib
|
||||
module
|
||||
docs/assets/hy-*
|
||||
674
packages/hydecorp/push-state/LICENSE
Normal file
674
packages/hydecorp/push-state/LICENSE
Normal file
@@ -0,0 +1,674 @@
|
||||
GNU GENERAL PUBLIC LICENSE
|
||||
Version 3, 29 June 2007
|
||||
|
||||
Copyright (C) 2007 Free Software Foundation, Inc. <https://fsf.org/>
|
||||
Everyone is permitted to copy and distribute verbatim copies
|
||||
of this license document, but changing it is not allowed.
|
||||
|
||||
Preamble
|
||||
|
||||
The GNU General Public License is a free, copyleft license for
|
||||
software and other kinds of works.
|
||||
|
||||
The licenses for most software and other practical works are designed
|
||||
to take away your freedom to share and change the works. By contrast,
|
||||
the GNU General Public License is intended to guarantee your freedom to
|
||||
share and change all versions of a program--to make sure it remains free
|
||||
software for all its users. We, the Free Software Foundation, use the
|
||||
GNU General Public License for most of our software; it applies also to
|
||||
any other work released this way by its authors. You can apply it to
|
||||
your programs, too.
|
||||
|
||||
When we speak of free software, we are referring to freedom, not
|
||||
price. Our General Public Licenses are designed to make sure that you
|
||||
have the freedom to distribute copies of free software (and charge for
|
||||
them if you wish), that you receive source code or can get it if you
|
||||
want it, that you can change the software or use pieces of it in new
|
||||
free programs, and that you know you can do these things.
|
||||
|
||||
To protect your rights, we need to prevent others from denying you
|
||||
these rights or asking you to surrender the rights. Therefore, you have
|
||||
certain responsibilities if you distribute copies of the software, or if
|
||||
you modify it: responsibilities to respect the freedom of others.
|
||||
|
||||
For example, if you distribute copies of such a program, whether
|
||||
gratis or for a fee, you must pass on to the recipients the same
|
||||
freedoms that you received. You must make sure that they, too, receive
|
||||
or can get the source code. And you must show them these terms so they
|
||||
know their rights.
|
||||
|
||||
Developers that use the GNU GPL protect your rights with two steps:
|
||||
(1) assert copyright on the software, and (2) offer you this License
|
||||
giving you legal permission to copy, distribute and/or modify it.
|
||||
|
||||
For the developers' and authors' protection, the GPL clearly explains
|
||||
that there is no warranty for this free software. For both users' and
|
||||
authors' sake, the GPL requires that modified versions be marked as
|
||||
changed, so that their problems will not be attributed erroneously to
|
||||
authors of previous versions.
|
||||
|
||||
Some devices are designed to deny users access to install or run
|
||||
modified versions of the software inside them, although the manufacturer
|
||||
can do so. This is fundamentally incompatible with the aim of
|
||||
protecting users' freedom to change the software. The systematic
|
||||
pattern of such abuse occurs in the area of products for individuals to
|
||||
use, which is precisely where it is most unacceptable. Therefore, we
|
||||
have designed this version of the GPL to prohibit the practice for those
|
||||
products. If such problems arise substantially in other domains, we
|
||||
stand ready to extend this provision to those domains in future versions
|
||||
of the GPL, as needed to protect the freedom of users.
|
||||
|
||||
Finally, every program is threatened constantly by software patents.
|
||||
States should not allow patents to restrict development and use of
|
||||
software on general-purpose computers, but in those that do, we wish to
|
||||
avoid the special danger that patents applied to a free program could
|
||||
make it effectively proprietary. To prevent this, the GPL assures that
|
||||
patents cannot be used to render the program non-free.
|
||||
|
||||
The precise terms and conditions for copying, distribution and
|
||||
modification follow.
|
||||
|
||||
TERMS AND CONDITIONS
|
||||
|
||||
0. Definitions.
|
||||
|
||||
"This License" refers to version 3 of the GNU General Public License.
|
||||
|
||||
"Copyright" also means copyright-like laws that apply to other kinds of
|
||||
works, such as semiconductor masks.
|
||||
|
||||
"The Program" refers to any copyrightable work licensed under this
|
||||
License. Each licensee is addressed as "you". "Licensees" and
|
||||
"recipients" may be individuals or organizations.
|
||||
|
||||
To "modify" a work means to copy from or adapt all or part of the work
|
||||
in a fashion requiring copyright permission, other than the making of an
|
||||
exact copy. The resulting work is called a "modified version" of the
|
||||
earlier work or a work "based on" the earlier work.
|
||||
|
||||
A "covered work" means either the unmodified Program or a work based
|
||||
on the Program.
|
||||
|
||||
To "propagate" a work means to do anything with it that, without
|
||||
permission, would make you directly or secondarily liable for
|
||||
infringement under applicable copyright law, except executing it on a
|
||||
computer or modifying a private copy. Propagation includes copying,
|
||||
distribution (with or without modification), making available to the
|
||||
public, and in some countries other activities as well.
|
||||
|
||||
To "convey" a work means any kind of propagation that enables other
|
||||
parties to make or receive copies. Mere interaction with a user through
|
||||
a computer network, with no transfer of a copy, is not conveying.
|
||||
|
||||
An interactive user interface displays "Appropriate Legal Notices"
|
||||
to the extent that it includes a convenient and prominently visible
|
||||
feature that (1) displays an appropriate copyright notice, and (2)
|
||||
tells the user that there is no warranty for the work (except to the
|
||||
extent that warranties are provided), that licensees may convey the
|
||||
work under this License, and how to view a copy of this License. If
|
||||
the interface presents a list of user commands or options, such as a
|
||||
menu, a prominent item in the list meets this criterion.
|
||||
|
||||
1. Source Code.
|
||||
|
||||
The "source code" for a work means the preferred form of the work
|
||||
for making modifications to it. "Object code" means any non-source
|
||||
form of a work.
|
||||
|
||||
A "Standard Interface" means an interface that either is an official
|
||||
standard defined by a recognized standards body, or, in the case of
|
||||
interfaces specified for a particular programming language, one that
|
||||
is widely used among developers working in that language.
|
||||
|
||||
The "System Libraries" of an executable work include anything, other
|
||||
than the work as a whole, that (a) is included in the normal form of
|
||||
packaging a Major Component, but which is not part of that Major
|
||||
Component, and (b) serves only to enable use of the work with that
|
||||
Major Component, or to implement a Standard Interface for which an
|
||||
implementation is available to the public in source code form. A
|
||||
"Major Component", in this context, means a major essential component
|
||||
(kernel, window system, and so on) of the specific operating system
|
||||
(if any) on which the executable work runs, or a compiler used to
|
||||
produce the work, or an object code interpreter used to run it.
|
||||
|
||||
The "Corresponding Source" for a work in object code form means all
|
||||
the source code needed to generate, install, and (for an executable
|
||||
work) run the object code and to modify the work, including scripts to
|
||||
control those activities. However, it does not include the work's
|
||||
System Libraries, or general-purpose tools or generally available free
|
||||
programs which are used unmodified in performing those activities but
|
||||
which are not part of the work. For example, Corresponding Source
|
||||
includes interface definition files associated with source files for
|
||||
the work, and the source code for shared libraries and dynamically
|
||||
linked subprograms that the work is specifically designed to require,
|
||||
such as by intimate data communication or control flow between those
|
||||
subprograms and other parts of the work.
|
||||
|
||||
The Corresponding Source need not include anything that users
|
||||
can regenerate automatically from other parts of the Corresponding
|
||||
Source.
|
||||
|
||||
The Corresponding Source for a work in source code form is that
|
||||
same work.
|
||||
|
||||
2. Basic Permissions.
|
||||
|
||||
All rights granted under this License are granted for the term of
|
||||
copyright on the Program, and are irrevocable provided the stated
|
||||
conditions are met. This License explicitly affirms your unlimited
|
||||
permission to run the unmodified Program. The output from running a
|
||||
covered work is covered by this License only if the output, given its
|
||||
content, constitutes a covered work. This License acknowledges your
|
||||
rights of fair use or other equivalent, as provided by copyright law.
|
||||
|
||||
You may make, run and propagate covered works that you do not
|
||||
convey, without conditions so long as your license otherwise remains
|
||||
in force. You may convey covered works to others for the sole purpose
|
||||
of having them make modifications exclusively for you, or provide you
|
||||
with facilities for running those works, provided that you comply with
|
||||
the terms of this License in conveying all material for which you do
|
||||
not control copyright. Those thus making or running the covered works
|
||||
for you must do so exclusively on your behalf, under your direction
|
||||
and control, on terms that prohibit them from making any copies of
|
||||
your copyrighted material outside their relationship with you.
|
||||
|
||||
Conveying under any other circumstances is permitted solely under
|
||||
the conditions stated below. Sublicensing is not allowed; section 10
|
||||
makes it unnecessary.
|
||||
|
||||
3. Protecting Users' Legal Rights From Anti-Circumvention Law.
|
||||
|
||||
No covered work shall be deemed part of an effective technological
|
||||
measure under any applicable law fulfilling obligations under article
|
||||
11 of the WIPO copyright treaty adopted on 20 December 1996, or
|
||||
similar laws prohibiting or restricting circumvention of such
|
||||
measures.
|
||||
|
||||
When you convey a covered work, you waive any legal power to forbid
|
||||
circumvention of technological measures to the extent such circumvention
|
||||
is effected by exercising rights under this License with respect to
|
||||
the covered work, and you disclaim any intention to limit operation or
|
||||
modification of the work as a means of enforcing, against the work's
|
||||
users, your or third parties' legal rights to forbid circumvention of
|
||||
technological measures.
|
||||
|
||||
4. Conveying Verbatim Copies.
|
||||
|
||||
You may convey verbatim copies of the Program's source code as you
|
||||
receive it, in any medium, provided that you conspicuously and
|
||||
appropriately publish on each copy an appropriate copyright notice;
|
||||
keep intact all notices stating that this License and any
|
||||
non-permissive terms added in accord with section 7 apply to the code;
|
||||
keep intact all notices of the absence of any warranty; and give all
|
||||
recipients a copy of this License along with the Program.
|
||||
|
||||
You may charge any price or no price for each copy that you convey,
|
||||
and you may offer support or warranty protection for a fee.
|
||||
|
||||
5. Conveying Modified Source Versions.
|
||||
|
||||
You may convey a work based on the Program, or the modifications to
|
||||
produce it from the Program, in the form of source code under the
|
||||
terms of section 4, provided that you also meet all of these conditions:
|
||||
|
||||
a) The work must carry prominent notices stating that you modified
|
||||
it, and giving a relevant date.
|
||||
|
||||
b) The work must carry prominent notices stating that it is
|
||||
released under this License and any conditions added under section
|
||||
7. This requirement modifies the requirement in section 4 to
|
||||
"keep intact all notices".
|
||||
|
||||
c) You must license the entire work, as a whole, under this
|
||||
License to anyone who comes into possession of a copy. This
|
||||
License will therefore apply, along with any applicable section 7
|
||||
additional terms, to the whole of the work, and all its parts,
|
||||
regardless of how they are packaged. This License gives no
|
||||
permission to license the work in any other way, but it does not
|
||||
invalidate such permission if you have separately received it.
|
||||
|
||||
d) If the work has interactive user interfaces, each must display
|
||||
Appropriate Legal Notices; however, if the Program has interactive
|
||||
interfaces that do not display Appropriate Legal Notices, your
|
||||
work need not make them do so.
|
||||
|
||||
A compilation of a covered work with other separate and independent
|
||||
works, which are not by their nature extensions of the covered work,
|
||||
and which are not combined with it such as to form a larger program,
|
||||
in or on a volume of a storage or distribution medium, is called an
|
||||
"aggregate" if the compilation and its resulting copyright are not
|
||||
used to limit the access or legal rights of the compilation's users
|
||||
beyond what the individual works permit. Inclusion of a covered work
|
||||
in an aggregate does not cause this License to apply to the other
|
||||
parts of the aggregate.
|
||||
|
||||
6. Conveying Non-Source Forms.
|
||||
|
||||
You may convey a covered work in object code form under the terms
|
||||
of sections 4 and 5, provided that you also convey the
|
||||
machine-readable Corresponding Source under the terms of this License,
|
||||
in one of these ways:
|
||||
|
||||
a) Convey the object code in, or embodied in, a physical product
|
||||
(including a physical distribution medium), accompanied by the
|
||||
Corresponding Source fixed on a durable physical medium
|
||||
customarily used for software interchange.
|
||||
|
||||
b) Convey the object code in, or embodied in, a physical product
|
||||
(including a physical distribution medium), accompanied by a
|
||||
written offer, valid for at least three years and valid for as
|
||||
long as you offer spare parts or customer support for that product
|
||||
model, to give anyone who possesses the object code either (1) a
|
||||
copy of the Corresponding Source for all the software in the
|
||||
product that is covered by this License, on a durable physical
|
||||
medium customarily used for software interchange, for a price no
|
||||
more than your reasonable cost of physically performing this
|
||||
conveying of source, or (2) access to copy the
|
||||
Corresponding Source from a network server at no charge.
|
||||
|
||||
c) Convey individual copies of the object code with a copy of the
|
||||
written offer to provide the Corresponding Source. This
|
||||
alternative is allowed only occasionally and noncommercially, and
|
||||
only if you received the object code with such an offer, in accord
|
||||
with subsection 6b.
|
||||
|
||||
d) Convey the object code by offering access from a designated
|
||||
place (gratis or for a charge), and offer equivalent access to the
|
||||
Corresponding Source in the same way through the same place at no
|
||||
further charge. You need not require recipients to copy the
|
||||
Corresponding Source along with the object code. If the place to
|
||||
copy the object code is a network server, the Corresponding Source
|
||||
may be on a different server (operated by you or a third party)
|
||||
that supports equivalent copying facilities, provided you maintain
|
||||
clear directions next to the object code saying where to find the
|
||||
Corresponding Source. Regardless of what server hosts the
|
||||
Corresponding Source, you remain obligated to ensure that it is
|
||||
available for as long as needed to satisfy these requirements.
|
||||
|
||||
e) Convey the object code using peer-to-peer transmission, provided
|
||||
you inform other peers where the object code and Corresponding
|
||||
Source of the work are being offered to the general public at no
|
||||
charge under subsection 6d.
|
||||
|
||||
A separable portion of the object code, whose source code is excluded
|
||||
from the Corresponding Source as a System Library, need not be
|
||||
included in conveying the object code work.
|
||||
|
||||
A "User Product" is either (1) a "consumer product", which means any
|
||||
tangible personal property which is normally used for personal, family,
|
||||
or household purposes, or (2) anything designed or sold for incorporation
|
||||
into a dwelling. In determining whether a product is a consumer product,
|
||||
doubtful cases shall be resolved in favor of coverage. For a particular
|
||||
product received by a particular user, "normally used" refers to a
|
||||
typical or common use of that class of product, regardless of the status
|
||||
of the particular user or of the way in which the particular user
|
||||
actually uses, or expects or is expected to use, the product. A product
|
||||
is a consumer product regardless of whether the product has substantial
|
||||
commercial, industrial or non-consumer uses, unless such uses represent
|
||||
the only significant mode of use of the product.
|
||||
|
||||
"Installation Information" for a User Product means any methods,
|
||||
procedures, authorization keys, or other information required to install
|
||||
and execute modified versions of a covered work in that User Product from
|
||||
a modified version of its Corresponding Source. The information must
|
||||
suffice to ensure that the continued functioning of the modified object
|
||||
code is in no case prevented or interfered with solely because
|
||||
modification has been made.
|
||||
|
||||
If you convey an object code work under this section in, or with, or
|
||||
specifically for use in, a User Product, and the conveying occurs as
|
||||
part of a transaction in which the right of possession and use of the
|
||||
User Product is transferred to the recipient in perpetuity or for a
|
||||
fixed term (regardless of how the transaction is characterized), the
|
||||
Corresponding Source conveyed under this section must be accompanied
|
||||
by the Installation Information. But this requirement does not apply
|
||||
if neither you nor any third party retains the ability to install
|
||||
modified object code on the User Product (for example, the work has
|
||||
been installed in ROM).
|
||||
|
||||
The requirement to provide Installation Information does not include a
|
||||
requirement to continue to provide support service, warranty, or updates
|
||||
for a work that has been modified or installed by the recipient, or for
|
||||
the User Product in which it has been modified or installed. Access to a
|
||||
network may be denied when the modification itself materially and
|
||||
adversely affects the operation of the network or violates the rules and
|
||||
protocols for communication across the network.
|
||||
|
||||
Corresponding Source conveyed, and Installation Information provided,
|
||||
in accord with this section must be in a format that is publicly
|
||||
documented (and with an implementation available to the public in
|
||||
source code form), and must require no special password or key for
|
||||
unpacking, reading or copying.
|
||||
|
||||
7. Additional Terms.
|
||||
|
||||
"Additional permissions" are terms that supplement the terms of this
|
||||
License by making exceptions from one or more of its conditions.
|
||||
Additional permissions that are applicable to the entire Program shall
|
||||
be treated as though they were included in this License, to the extent
|
||||
that they are valid under applicable law. If additional permissions
|
||||
apply only to part of the Program, that part may be used separately
|
||||
under those permissions, but the entire Program remains governed by
|
||||
this License without regard to the additional permissions.
|
||||
|
||||
When you convey a copy of a covered work, you may at your option
|
||||
remove any additional permissions from that copy, or from any part of
|
||||
it. (Additional permissions may be written to require their own
|
||||
removal in certain cases when you modify the work.) You may place
|
||||
additional permissions on material, added by you to a covered work,
|
||||
for which you have or can give appropriate copyright permission.
|
||||
|
||||
Notwithstanding any other provision of this License, for material you
|
||||
add to a covered work, you may (if authorized by the copyright holders of
|
||||
that material) supplement the terms of this License with terms:
|
||||
|
||||
a) Disclaiming warranty or limiting liability differently from the
|
||||
terms of sections 15 and 16 of this License; or
|
||||
|
||||
b) Requiring preservation of specified reasonable legal notices or
|
||||
author attributions in that material or in the Appropriate Legal
|
||||
Notices displayed by works containing it; or
|
||||
|
||||
c) Prohibiting misrepresentation of the origin of that material, or
|
||||
requiring that modified versions of such material be marked in
|
||||
reasonable ways as different from the original version; or
|
||||
|
||||
d) Limiting the use for publicity purposes of names of licensors or
|
||||
authors of the material; or
|
||||
|
||||
e) Declining to grant rights under trademark law for use of some
|
||||
trade names, trademarks, or service marks; or
|
||||
|
||||
f) Requiring indemnification of licensors and authors of that
|
||||
material by anyone who conveys the material (or modified versions of
|
||||
it) with contractual assumptions of liability to the recipient, for
|
||||
any liability that these contractual assumptions directly impose on
|
||||
those licensors and authors.
|
||||
|
||||
All other non-permissive additional terms are considered "further
|
||||
restrictions" within the meaning of section 10. If the Program as you
|
||||
received it, or any part of it, contains a notice stating that it is
|
||||
governed by this License along with a term that is a further
|
||||
restriction, you may remove that term. If a license document contains
|
||||
a further restriction but permits relicensing or conveying under this
|
||||
License, you may add to a covered work material governed by the terms
|
||||
of that license document, provided that the further restriction does
|
||||
not survive such relicensing or conveying.
|
||||
|
||||
If you add terms to a covered work in accord with this section, you
|
||||
must place, in the relevant source files, a statement of the
|
||||
additional terms that apply to those files, or a notice indicating
|
||||
where to find the applicable terms.
|
||||
|
||||
Additional terms, permissive or non-permissive, may be stated in the
|
||||
form of a separately written license, or stated as exceptions;
|
||||
the above requirements apply either way.
|
||||
|
||||
8. Termination.
|
||||
|
||||
You may not propagate or modify a covered work except as expressly
|
||||
provided under this License. Any attempt otherwise to propagate or
|
||||
modify it is void, and will automatically terminate your rights under
|
||||
this License (including any patent licenses granted under the third
|
||||
paragraph of section 11).
|
||||
|
||||
However, if you cease all violation of this License, then your
|
||||
license from a particular copyright holder is reinstated (a)
|
||||
provisionally, unless and until the copyright holder explicitly and
|
||||
finally terminates your license, and (b) permanently, if the copyright
|
||||
holder fails to notify you of the violation by some reasonable means
|
||||
prior to 60 days after the cessation.
|
||||
|
||||
Moreover, your license from a particular copyright holder is
|
||||
reinstated permanently if the copyright holder notifies you of the
|
||||
violation by some reasonable means, this is the first time you have
|
||||
received notice of violation of this License (for any work) from that
|
||||
copyright holder, and you cure the violation prior to 30 days after
|
||||
your receipt of the notice.
|
||||
|
||||
Termination of your rights under this section does not terminate the
|
||||
licenses of parties who have received copies or rights from you under
|
||||
this License. If your rights have been terminated and not permanently
|
||||
reinstated, you do not qualify to receive new licenses for the same
|
||||
material under section 10.
|
||||
|
||||
9. Acceptance Not Required for Having Copies.
|
||||
|
||||
You are not required to accept this License in order to receive or
|
||||
run a copy of the Program. Ancillary propagation of a covered work
|
||||
occurring solely as a consequence of using peer-to-peer transmission
|
||||
to receive a copy likewise does not require acceptance. However,
|
||||
nothing other than this License grants you permission to propagate or
|
||||
modify any covered work. These actions infringe copyright if you do
|
||||
not accept this License. Therefore, by modifying or propagating a
|
||||
covered work, you indicate your acceptance of this License to do so.
|
||||
|
||||
10. Automatic Licensing of Downstream Recipients.
|
||||
|
||||
Each time you convey a covered work, the recipient automatically
|
||||
receives a license from the original licensors, to run, modify and
|
||||
propagate that work, subject to this License. You are not responsible
|
||||
for enforcing compliance by third parties with this License.
|
||||
|
||||
An "entity transaction" is a transaction transferring control of an
|
||||
organization, or substantially all assets of one, or subdividing an
|
||||
organization, or merging organizations. If propagation of a covered
|
||||
work results from an entity transaction, each party to that
|
||||
transaction who receives a copy of the work also receives whatever
|
||||
licenses to the work the party's predecessor in interest had or could
|
||||
give under the previous paragraph, plus a right to possession of the
|
||||
Corresponding Source of the work from the predecessor in interest, if
|
||||
the predecessor has it or can get it with reasonable efforts.
|
||||
|
||||
You may not impose any further restrictions on the exercise of the
|
||||
rights granted or affirmed under this License. For example, you may
|
||||
not impose a license fee, royalty, or other charge for exercise of
|
||||
rights granted under this License, and you may not initiate litigation
|
||||
(including a cross-claim or counterclaim in a lawsuit) alleging that
|
||||
any patent claim is infringed by making, using, selling, offering for
|
||||
sale, or importing the Program or any portion of it.
|
||||
|
||||
11. Patents.
|
||||
|
||||
A "contributor" is a copyright holder who authorizes use under this
|
||||
License of the Program or a work on which the Program is based. The
|
||||
work thus licensed is called the contributor's "contributor version".
|
||||
|
||||
A contributor's "essential patent claims" are all patent claims
|
||||
owned or controlled by the contributor, whether already acquired or
|
||||
hereafter acquired, that would be infringed by some manner, permitted
|
||||
by this License, of making, using, or selling its contributor version,
|
||||
but do not include claims that would be infringed only as a
|
||||
consequence of further modification of the contributor version. For
|
||||
purposes of this definition, "control" includes the right to grant
|
||||
patent sublicenses in a manner consistent with the requirements of
|
||||
this License.
|
||||
|
||||
Each contributor grants you a non-exclusive, worldwide, royalty-free
|
||||
patent license under the contributor's essential patent claims, to
|
||||
make, use, sell, offer for sale, import and otherwise run, modify and
|
||||
propagate the contents of its contributor version.
|
||||
|
||||
In the following three paragraphs, a "patent license" is any express
|
||||
agreement or commitment, however denominated, not to enforce a patent
|
||||
(such as an express permission to practice a patent or covenant not to
|
||||
sue for patent infringement). To "grant" such a patent license to a
|
||||
party means to make such an agreement or commitment not to enforce a
|
||||
patent against the party.
|
||||
|
||||
If you convey a covered work, knowingly relying on a patent license,
|
||||
and the Corresponding Source of the work is not available for anyone
|
||||
to copy, free of charge and under the terms of this License, through a
|
||||
publicly available network server or other readily accessible means,
|
||||
then you must either (1) cause the Corresponding Source to be so
|
||||
available, or (2) arrange to deprive yourself of the benefit of the
|
||||
patent license for this particular work, or (3) arrange, in a manner
|
||||
consistent with the requirements of this License, to extend the patent
|
||||
license to downstream recipients. "Knowingly relying" means you have
|
||||
actual knowledge that, but for the patent license, your conveying the
|
||||
covered work in a country, or your recipient's use of the covered work
|
||||
in a country, would infringe one or more identifiable patents in that
|
||||
country that you have reason to believe are valid.
|
||||
|
||||
If, pursuant to or in connection with a single transaction or
|
||||
arrangement, you convey, or propagate by procuring conveyance of, a
|
||||
covered work, and grant a patent license to some of the parties
|
||||
receiving the covered work authorizing them to use, propagate, modify
|
||||
or convey a specific copy of the covered work, then the patent license
|
||||
you grant is automatically extended to all recipients of the covered
|
||||
work and works based on it.
|
||||
|
||||
A patent license is "discriminatory" if it does not include within
|
||||
the scope of its coverage, prohibits the exercise of, or is
|
||||
conditioned on the non-exercise of one or more of the rights that are
|
||||
specifically granted under this License. You may not convey a covered
|
||||
work if you are a party to an arrangement with a third party that is
|
||||
in the business of distributing software, under which you make payment
|
||||
to the third party based on the extent of your activity of conveying
|
||||
the work, and under which the third party grants, to any of the
|
||||
parties who would receive the covered work from you, a discriminatory
|
||||
patent license (a) in connection with copies of the covered work
|
||||
conveyed by you (or copies made from those copies), or (b) primarily
|
||||
for and in connection with specific products or compilations that
|
||||
contain the covered work, unless you entered into that arrangement,
|
||||
or that patent license was granted, prior to 28 March 2007.
|
||||
|
||||
Nothing in this License shall be construed as excluding or limiting
|
||||
any implied license or other defenses to infringement that may
|
||||
otherwise be available to you under applicable patent law.
|
||||
|
||||
12. No Surrender of Others' Freedom.
|
||||
|
||||
If conditions are imposed on you (whether by court order, agreement or
|
||||
otherwise) that contradict the conditions of this License, they do not
|
||||
excuse you from the conditions of this License. If you cannot convey a
|
||||
covered work so as to satisfy simultaneously your obligations under this
|
||||
License and any other pertinent obligations, then as a consequence you may
|
||||
not convey it at all. For example, if you agree to terms that obligate you
|
||||
to collect a royalty for further conveying from those to whom you convey
|
||||
the Program, the only way you could satisfy both those terms and this
|
||||
License would be to refrain entirely from conveying the Program.
|
||||
|
||||
13. Use with the GNU Affero General Public License.
|
||||
|
||||
Notwithstanding any other provision of this License, you have
|
||||
permission to link or combine any covered work with a work licensed
|
||||
under version 3 of the GNU Affero General Public License into a single
|
||||
combined work, and to convey the resulting work. The terms of this
|
||||
License will continue to apply to the part which is the covered work,
|
||||
but the special requirements of the GNU Affero General Public License,
|
||||
section 13, concerning interaction through a network will apply to the
|
||||
combination as such.
|
||||
|
||||
14. Revised Versions of this License.
|
||||
|
||||
The Free Software Foundation may publish revised and/or new versions of
|
||||
the GNU General Public License from time to time. Such new versions will
|
||||
be similar in spirit to the present version, but may differ in detail to
|
||||
address new problems or concerns.
|
||||
|
||||
Each version is given a distinguishing version number. If the
|
||||
Program specifies that a certain numbered version of the GNU General
|
||||
Public License "or any later version" applies to it, you have the
|
||||
option of following the terms and conditions either of that numbered
|
||||
version or of any later version published by the Free Software
|
||||
Foundation. If the Program does not specify a version number of the
|
||||
GNU General Public License, you may choose any version ever published
|
||||
by the Free Software Foundation.
|
||||
|
||||
If the Program specifies that a proxy can decide which future
|
||||
versions of the GNU General Public License can be used, that proxy's
|
||||
public statement of acceptance of a version permanently authorizes you
|
||||
to choose that version for the Program.
|
||||
|
||||
Later license versions may give you additional or different
|
||||
permissions. However, no additional obligations are imposed on any
|
||||
author or copyright holder as a result of your choosing to follow a
|
||||
later version.
|
||||
|
||||
15. Disclaimer of Warranty.
|
||||
|
||||
THERE IS NO WARRANTY FOR THE PROGRAM, TO THE EXTENT PERMITTED BY
|
||||
APPLICABLE LAW. EXCEPT WHEN OTHERWISE STATED IN WRITING THE COPYRIGHT
|
||||
HOLDERS AND/OR OTHER PARTIES PROVIDE THE PROGRAM "AS IS" WITHOUT WARRANTY
|
||||
OF ANY KIND, EITHER EXPRESSED OR IMPLIED, INCLUDING, BUT NOT LIMITED TO,
|
||||
THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
|
||||
PURPOSE. THE ENTIRE RISK AS TO THE QUALITY AND PERFORMANCE OF THE PROGRAM
|
||||
IS WITH YOU. SHOULD THE PROGRAM PROVE DEFECTIVE, YOU ASSUME THE COST OF
|
||||
ALL NECESSARY SERVICING, REPAIR OR CORRECTION.
|
||||
|
||||
16. Limitation of Liability.
|
||||
|
||||
IN NO EVENT UNLESS REQUIRED BY APPLICABLE LAW OR AGREED TO IN WRITING
|
||||
WILL ANY COPYRIGHT HOLDER, OR ANY OTHER PARTY WHO MODIFIES AND/OR CONVEYS
|
||||
THE PROGRAM AS PERMITTED ABOVE, BE LIABLE TO YOU FOR DAMAGES, INCLUDING ANY
|
||||
GENERAL, SPECIAL, INCIDENTAL OR CONSEQUENTIAL DAMAGES ARISING OUT OF THE
|
||||
USE OR INABILITY TO USE THE PROGRAM (INCLUDING BUT NOT LIMITED TO LOSS OF
|
||||
DATA OR DATA BEING RENDERED INACCURATE OR LOSSES SUSTAINED BY YOU OR THIRD
|
||||
PARTIES OR A FAILURE OF THE PROGRAM TO OPERATE WITH ANY OTHER PROGRAMS),
|
||||
EVEN IF SUCH HOLDER OR OTHER PARTY HAS BEEN ADVISED OF THE POSSIBILITY OF
|
||||
SUCH DAMAGES.
|
||||
|
||||
17. Interpretation of Sections 15 and 16.
|
||||
|
||||
If the disclaimer of warranty and limitation of liability provided
|
||||
above cannot be given local legal effect according to their terms,
|
||||
reviewing courts shall apply local law that most closely approximates
|
||||
an absolute waiver of all civil liability in connection with the
|
||||
Program, unless a warranty or assumption of liability accompanies a
|
||||
copy of the Program in return for a fee.
|
||||
|
||||
END OF TERMS AND CONDITIONS
|
||||
|
||||
How to Apply These Terms to Your New Programs
|
||||
|
||||
If you develop a new program, and you want it to be of the greatest
|
||||
possible use to the public, the best way to achieve this is to make it
|
||||
free software which everyone can redistribute and change under these terms.
|
||||
|
||||
To do so, attach the following notices to the program. It is safest
|
||||
to attach them to the start of each source file to most effectively
|
||||
state the exclusion of warranty; and each file should have at least
|
||||
the "copyright" line and a pointer to where the full notice is found.
|
||||
|
||||
<one line to give the program's name and a brief idea of what it does.>
|
||||
Copyright (C) <year> <name of author>
|
||||
|
||||
This program is free software: you can redistribute it and/or modify
|
||||
it under the terms of the GNU General Public License as published by
|
||||
the Free Software Foundation, either version 3 of the License, or
|
||||
(at your option) any later version.
|
||||
|
||||
This program is distributed in the hope that it will be useful,
|
||||
but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
GNU General Public License for more details.
|
||||
|
||||
You should have received a copy of the GNU General Public License
|
||||
along with this program. If not, see <https://www.gnu.org/licenses/>.
|
||||
|
||||
Also add information on how to contact you by electronic and paper mail.
|
||||
|
||||
If the program does terminal interaction, make it output a short
|
||||
notice like this when it starts in an interactive mode:
|
||||
|
||||
<program> Copyright (C) <year> <name of author>
|
||||
This program comes with ABSOLUTELY NO WARRANTY; for details type `show w'.
|
||||
This is free software, and you are welcome to redistribute it
|
||||
under certain conditions; type `show c' for details.
|
||||
|
||||
The hypothetical commands `show w' and `show c' should show the appropriate
|
||||
parts of the General Public License. Of course, your program's commands
|
||||
might be different; for a GUI interface, you would use an "about box".
|
||||
|
||||
You should also get your employer (if you work as a programmer) or school,
|
||||
if any, to sign a "copyright disclaimer" for the program, if necessary.
|
||||
For more information on this, and how to apply and follow the GNU GPL, see
|
||||
<https://www.gnu.org/licenses/>.
|
||||
|
||||
The GNU General Public License does not permit incorporating your program
|
||||
into proprietary programs. If your program is a subroutine library, you
|
||||
may consider it more useful to permit linking proprietary applications with
|
||||
the library. If this is what you want to do, use the GNU Lesser General
|
||||
Public License instead of this License. But first, please read
|
||||
<https://www.gnu.org/licenses/why-not-lgpl.html>.
|
||||
69
packages/hydecorp/push-state/package.json
Normal file
69
packages/hydecorp/push-state/package.json
Normal file
@@ -0,0 +1,69 @@
|
||||
{
|
||||
"name": "@hydecorp/push-state",
|
||||
"version": "1.0.0",
|
||||
"description": "Turn static web sites into dynamic web apps",
|
||||
"type": "module",
|
||||
"main": "lib/index.js",
|
||||
"module": "lib/index.js",
|
||||
"files": [
|
||||
"src",
|
||||
"lib",
|
||||
"module",
|
||||
"tsconfig.json"
|
||||
],
|
||||
"publishConfig": {
|
||||
"access": "public"
|
||||
},
|
||||
"scripts": {
|
||||
"clean": "rm -rf lib module",
|
||||
"test": "exit 0",
|
||||
"build:tsc": "tsc -d",
|
||||
"watch:tsc": "tsc -d -w",
|
||||
"build:rollup": "rollup -c",
|
||||
"watch:rollup": "rollup -c -w",
|
||||
"build": "pnpm run build:tsc & pnpm run build:rollup & wait",
|
||||
"watch": "pnpm run watch:tsc & pnpm run watch:rollup",
|
||||
"serve": "serve -l 3337",
|
||||
"dev": "pnpm run watch & pnpm run serve",
|
||||
"preversion": "sed -i '' -E 's:^(lib|docs/assets/hy-\\*)$:#<removed temporarily>\\1:' .gitignore",
|
||||
"version": "pnpm run build && git add .",
|
||||
"postversion": "sed -i '' -E 's:^#<removed temporarily>(lib|docs/assets/hy-\\*)$:\\1:' .gitignore && git rm --cached -r lib docs/assets/hy-* && git add . && git commit -m 'Restore preversion .gitignore'",
|
||||
"prepack": "pnpm run clean && pnpm run build"
|
||||
},
|
||||
"author": "Florian Klampfer <mail@qwtel.com> (https://qwtel.com/)",
|
||||
"license": "GPL-3.0",
|
||||
"dependencies": {
|
||||
"@hydecorp/component": "^1.0.0",
|
||||
"@types/resize-observer-browser": "^0.1.7"
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git+https://github.com/hydecorp/push-state.git"
|
||||
},
|
||||
"bugs": {
|
||||
"url": "https://github.com/hydecorp/push-state/issues"
|
||||
},
|
||||
"homepage": "https://hydecorp.github.io/push-state/",
|
||||
"keywords": [
|
||||
"page-transitions",
|
||||
"ajax",
|
||||
"pjax",
|
||||
"smoothstate",
|
||||
"pivoine",
|
||||
"vanilla",
|
||||
"jquery",
|
||||
"animations",
|
||||
"rxjs",
|
||||
"vanilla-js",
|
||||
"custom-element",
|
||||
"jquery-plugin",
|
||||
"history-api",
|
||||
"web-components",
|
||||
"webcomponent",
|
||||
"history-management",
|
||||
"prefetch",
|
||||
"page-loader",
|
||||
"prefetcher",
|
||||
"reactive"
|
||||
]
|
||||
}
|
||||
23
packages/hydecorp/push-state/rollup.config.js
Normal file
23
packages/hydecorp/push-state/rollup.config.js
Normal file
@@ -0,0 +1,23 @@
|
||||
import resolve from "@rollup/plugin-node-resolve";
|
||||
import commonjs from "@rollup/plugin-commonjs";
|
||||
import typescript from "@rollup/plugin-typescript";
|
||||
import terser from "@rollup/plugin-terser";
|
||||
|
||||
export default [
|
||||
{
|
||||
input: "src/index.ts",
|
||||
output: [
|
||||
{
|
||||
file: `docs/assets/hy-push-state.js`,
|
||||
format: "es",
|
||||
sourcemap: true,
|
||||
},
|
||||
{
|
||||
file: `module/index.js`,
|
||||
format: "es",
|
||||
sourcemap: true,
|
||||
},
|
||||
],
|
||||
plugins: [typescript(), resolve(), commonjs(), terser()],
|
||||
},
|
||||
];
|
||||
98
packages/hydecorp/push-state/src/common.ts
Normal file
98
packages/hydecorp/push-state/src/common.ts
Normal file
@@ -0,0 +1,98 @@
|
||||
export {
|
||||
applyMixins,
|
||||
subscribeWhen,
|
||||
unsubscribeWhen,
|
||||
filterWhen,
|
||||
bufferDebounceTime,
|
||||
fetchRx,
|
||||
fragmentFromString,
|
||||
createMutationObservable,
|
||||
getScrollHeight,
|
||||
getScrollLeft,
|
||||
getScrollTop,
|
||||
matches,
|
||||
matchesAncestors,
|
||||
} from "@hydecorp/component";
|
||||
|
||||
export enum Cause {
|
||||
Init = "init",
|
||||
Hint = "hint",
|
||||
Push = "push",
|
||||
Pop = "pop",
|
||||
}
|
||||
|
||||
export interface Context {
|
||||
cause: Cause;
|
||||
url: URL;
|
||||
oldURL?: URL;
|
||||
cacheNr?: number;
|
||||
replace?: boolean;
|
||||
error?: any;
|
||||
anchor?: HTMLAnchorElement;
|
||||
}
|
||||
|
||||
export interface ClickContext extends Context {
|
||||
event: MouseEvent;
|
||||
}
|
||||
|
||||
export function isExternal(
|
||||
url?: { protocol: string; host: string } | null,
|
||||
location: { protocol: string; host: string } = window.location,
|
||||
) {
|
||||
return (
|
||||
url != null &&
|
||||
(url.protocol !== location.protocol || url.host !== location.host)
|
||||
);
|
||||
}
|
||||
|
||||
export function isHash(
|
||||
{
|
||||
hash,
|
||||
origin,
|
||||
pathname,
|
||||
}: { hash: string; origin: string; pathname: string },
|
||||
location: {
|
||||
hash: string;
|
||||
origin: string;
|
||||
pathname: string;
|
||||
} = window.location,
|
||||
) {
|
||||
return (
|
||||
hash !== "" && origin === location.origin && pathname === location.pathname
|
||||
);
|
||||
}
|
||||
|
||||
export function shouldLoadAnchor(anchor?: HTMLAnchorElement | null) {
|
||||
return anchor && anchor.target === "";
|
||||
}
|
||||
|
||||
export function isPushEvent(
|
||||
{ url, anchor, event: { metaKey, ctrlKey } }: ClickContext,
|
||||
location: Location,
|
||||
) {
|
||||
return !!(
|
||||
!metaKey &&
|
||||
!ctrlKey &&
|
||||
shouldLoadAnchor(anchor) &&
|
||||
!isExternal(url, location)
|
||||
);
|
||||
}
|
||||
|
||||
export function isHintEvent({ url, anchor }: Context, location: Location) {
|
||||
return !!(
|
||||
shouldLoadAnchor(anchor) &&
|
||||
!isExternal(url, location) &&
|
||||
!isHash(url, location)
|
||||
);
|
||||
}
|
||||
|
||||
export function isHashChange({
|
||||
cause,
|
||||
url: { pathname, hash },
|
||||
oldURL,
|
||||
}: Context) {
|
||||
return (
|
||||
pathname === oldURL?.pathname &&
|
||||
(cause === Cause.Pop || (cause === Cause.Push && hash !== ""))
|
||||
);
|
||||
}
|
||||
126
packages/hydecorp/push-state/src/event-listeners.ts
Normal file
126
packages/hydecorp/push-state/src/event-listeners.ts
Normal file
@@ -0,0 +1,126 @@
|
||||
import { Subject, Observable, from, fromEvent, of, merge, NEVER } from "rxjs";
|
||||
|
||||
import {
|
||||
matchesAncestors,
|
||||
createMutationObservable,
|
||||
subscribeWhen,
|
||||
bufferDebounceTime,
|
||||
} from "./common";
|
||||
import {
|
||||
map,
|
||||
filter,
|
||||
startWith,
|
||||
tap,
|
||||
mergeMap,
|
||||
mergeAll,
|
||||
switchMap,
|
||||
} from "rxjs/operators";
|
||||
|
||||
const flat = <T>(x: Array<Array<T>>): Array<T> =>
|
||||
Array.prototype.concat.apply([], x);
|
||||
|
||||
type MiniRecord = { addedNodes: Iterable<Node>; removedNodes: Iterable<Node> };
|
||||
|
||||
const combineRecords = (records: MiniRecord[]) => ({
|
||||
addedNodes: new Set(flat(records.map((r) => Array.from(r.addedNodes)))),
|
||||
removedNodes: new Set(flat(records.map((r) => Array.from(r.removedNodes)))),
|
||||
});
|
||||
|
||||
export class EventListenersMixin {
|
||||
el!: HTMLElement;
|
||||
|
||||
linkSelector!: string;
|
||||
|
||||
$!: {
|
||||
linkSelector: Subject<string>;
|
||||
prefetch: Subject<boolean>;
|
||||
};
|
||||
|
||||
// LINKS 2
|
||||
setupEventListeners() {
|
||||
const pushEvent$ = fromEvent(this.el, "click").pipe(
|
||||
map((event) => {
|
||||
const anchor = matchesAncestors(
|
||||
<Element>event.target,
|
||||
this.linkSelector,
|
||||
);
|
||||
if (anchor instanceof HTMLAnchorElement) {
|
||||
return [event, anchor] as [MouseEvent, HTMLAnchorElement];
|
||||
}
|
||||
}),
|
||||
filter((x) => !!x),
|
||||
);
|
||||
|
||||
const matchOrQuery = (
|
||||
el: Element,
|
||||
selector: string,
|
||||
): Observable<HTMLAnchorElement> => {
|
||||
if (el.matches(selector) && el instanceof HTMLAnchorElement) {
|
||||
return of(el);
|
||||
} else {
|
||||
return from(el.querySelectorAll(selector)).pipe(
|
||||
filter(
|
||||
(el): el is HTMLAnchorElement => el instanceof HTMLAnchorElement,
|
||||
),
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
const addEventListeners = (link: HTMLAnchorElement) => {
|
||||
return merge(
|
||||
fromEvent(link, "mouseenter", { passive: true }),
|
||||
fromEvent(link, "touchstart", { passive: true }),
|
||||
fromEvent(link, "focus", { passive: true }),
|
||||
).pipe(map((event) => [event, link] as [Event, HTMLAnchorElement]));
|
||||
};
|
||||
|
||||
const hintEvent$ = this.$.linkSelector.pipe(
|
||||
switchMap((linkSelector) => {
|
||||
const links = new Map<
|
||||
HTMLAnchorElement,
|
||||
Observable<[Event, HTMLAnchorElement]>
|
||||
>();
|
||||
|
||||
const addLink = (link: HTMLAnchorElement) => {
|
||||
if (!links.has(link)) {
|
||||
links.set(link, addEventListeners(link));
|
||||
}
|
||||
};
|
||||
const removeLink = (link: HTMLAnchorElement) => {
|
||||
links.delete(link);
|
||||
};
|
||||
|
||||
return createMutationObservable(this.el, {
|
||||
childList: true,
|
||||
subtree: true,
|
||||
}).pipe(
|
||||
startWith({ addedNodes: [this.el], removedNodes: [] }),
|
||||
bufferDebounceTime(500),
|
||||
map(combineRecords),
|
||||
switchMap(({ addedNodes, removedNodes }) => {
|
||||
from(removedNodes)
|
||||
.pipe(
|
||||
filter((el): el is Element => el instanceof Element),
|
||||
mergeMap((el) => matchOrQuery(el, linkSelector)),
|
||||
tap(removeLink),
|
||||
)
|
||||
.subscribe();
|
||||
|
||||
from(addedNodes)
|
||||
.pipe(
|
||||
filter((el): el is Element => el instanceof Element),
|
||||
mergeMap((el) => matchOrQuery(el, linkSelector)),
|
||||
tap(addLink),
|
||||
)
|
||||
.subscribe();
|
||||
|
||||
return from(links.values()).pipe(mergeAll());
|
||||
}),
|
||||
subscribeWhen(this.$.prefetch),
|
||||
);
|
||||
}),
|
||||
);
|
||||
|
||||
return { hintEvent$, pushEvent$ };
|
||||
}
|
||||
}
|
||||
68
packages/hydecorp/push-state/src/event.ts
Normal file
68
packages/hydecorp/push-state/src/event.ts
Normal file
@@ -0,0 +1,68 @@
|
||||
import { Context } from "./common";
|
||||
import { ResponseContextErr } from "./fetch";
|
||||
import { HyPushState } from "./index";
|
||||
|
||||
const timeout = (t: number) => new Promise((r) => setTimeout(r, t));
|
||||
|
||||
export class EventManager {
|
||||
private parent: HyPushState;
|
||||
|
||||
constructor(parent: HyPushState) {
|
||||
this.parent = parent;
|
||||
}
|
||||
|
||||
onStart(context: Context) {
|
||||
this.parent.animPromise = timeout(this.parent.duration);
|
||||
|
||||
const transitionUntil = (promise: Promise<{}>) => {
|
||||
this.parent.animPromise = Promise.all([this.parent.animPromise, promise]);
|
||||
};
|
||||
|
||||
this.parent.fireEvent("start", { detail: { ...context, transitionUntil } });
|
||||
}
|
||||
|
||||
emitDOMError(error: any) {
|
||||
if (process.env.DEBUG) console.error(error);
|
||||
|
||||
// To open the link directly, we first pop one entry off the browser history.
|
||||
// We have to do this because some browsers (Safari) won't handle the back button correctly otherwise.
|
||||
// We then wait for a short time and change the document's location.
|
||||
// TODO: If we didn't call `pushState` optimistically we wouldn't have to do this.
|
||||
// TODO: Use browser sniffing instead?
|
||||
const url = location.href;
|
||||
window.history.back();
|
||||
setTimeout(() => document.location.assign(url), 100);
|
||||
}
|
||||
|
||||
emitNetworkError(context: ResponseContextErr) {
|
||||
if (process.env.DEBUG) console.error(context);
|
||||
this.parent.fireEvent("networkerror", { detail: context });
|
||||
}
|
||||
|
||||
emitError(context: Context) {
|
||||
if (process.env.DEBUG) console.error(context);
|
||||
this.parent.fireEvent("error", { detail: context });
|
||||
}
|
||||
|
||||
emitReady(context: Context) {
|
||||
this.parent.fireEvent("ready", { detail: context });
|
||||
}
|
||||
|
||||
emitAfter(context: Context) {
|
||||
this.parent.fadePromise = timeout(this.parent.duration);
|
||||
|
||||
const transitionUntil = (promise: Promise<{}>) => {
|
||||
this.parent.fadePromise = Promise.all([this.parent.fadePromise, promise]);
|
||||
};
|
||||
|
||||
this.parent.fireEvent("after", { detail: { ...context, transitionUntil } });
|
||||
}
|
||||
|
||||
emitProgress(context: Context) {
|
||||
this.parent.fireEvent("progress", { detail: context });
|
||||
}
|
||||
|
||||
emitLoad(context: Context) {
|
||||
this.parent.fireEvent("load", { detail: context });
|
||||
}
|
||||
}
|
||||
64
packages/hydecorp/push-state/src/fetch.ts
Normal file
64
packages/hydecorp/push-state/src/fetch.ts
Normal file
@@ -0,0 +1,64 @@
|
||||
import { of, zip, Observable } from "rxjs";
|
||||
import { catchError, map, take, switchMap } from "rxjs/operators";
|
||||
|
||||
import { fetchRx, Context } from "./common";
|
||||
import { HyPushState } from "./index";
|
||||
|
||||
export interface ResponseContext extends Context {
|
||||
responseText: string | null;
|
||||
error?: any;
|
||||
}
|
||||
|
||||
export interface ResponseContextOk extends ResponseContext {
|
||||
responseText: string;
|
||||
}
|
||||
|
||||
export interface ResponseContextErr extends ResponseContext {
|
||||
responseText: null;
|
||||
error: any;
|
||||
}
|
||||
|
||||
export class FetchManager {
|
||||
private parent: HyPushState;
|
||||
|
||||
constructor(parent: HyPushState) {
|
||||
this.parent = parent;
|
||||
}
|
||||
|
||||
fetchPage(context: Context): Observable<ResponseContext> {
|
||||
return fetchRx(context.url.href, {
|
||||
method: "GET",
|
||||
mode: "cors", ///isExternal(this.parent) ? 'cors' : undefined,
|
||||
headers: { Accept: "text/html" },
|
||||
}).pipe(
|
||||
switchMap((response) => response.text()),
|
||||
map((responseText) => ({ ...context, responseText })),
|
||||
catchError((error) => of({ ...context, error, responseText: null })),
|
||||
);
|
||||
}
|
||||
|
||||
private selectPrefetch(
|
||||
{ href }: URL,
|
||||
latestPrefetch: ResponseContext,
|
||||
prefetch$: Observable<ResponseContext>,
|
||||
) {
|
||||
return href === latestPrefetch.url.href // && latestPrefetch.error == null
|
||||
? of(latestPrefetch)
|
||||
: prefetch$.pipe(take(1));
|
||||
}
|
||||
|
||||
// Returns an observable that emits exactly one notice, which contains the response.
|
||||
// It will not emit until an (optional) page transition animation completes.
|
||||
getResponse(
|
||||
prefetch$: Observable<ResponseContext>,
|
||||
context: Context,
|
||||
latestPrefetch: ResponseContext,
|
||||
) {
|
||||
return zip(
|
||||
this.selectPrefetch(context.url, latestPrefetch, prefetch$),
|
||||
this.parent.animPromise,
|
||||
).pipe(
|
||||
map(([prefetch]) => ({ ...prefetch, ...context }) as ResponseContext),
|
||||
);
|
||||
}
|
||||
}
|
||||
96
packages/hydecorp/push-state/src/history.ts
Normal file
96
packages/hydecorp/push-state/src/history.ts
Normal file
@@ -0,0 +1,96 @@
|
||||
import {
|
||||
isExternal,
|
||||
getScrollTop,
|
||||
getScrollHeight,
|
||||
Cause,
|
||||
Context,
|
||||
} from "./common";
|
||||
|
||||
import { ReplaceContext } from "./update";
|
||||
|
||||
// @ts-ignore
|
||||
window.HashChangeEvent =
|
||||
window.HashChangeEvent ||
|
||||
function HashChangeEvent(type, { oldURL = "", newURL = "" } = {}) {
|
||||
const e = new CustomEvent(type);
|
||||
// @ts-ignore
|
||||
e.oldURL = oldURL;
|
||||
// @ts-ignore
|
||||
e.newURL = newURL;
|
||||
return e;
|
||||
};
|
||||
|
||||
function simHashChange(newURL: URL, oldURL: URL) {
|
||||
if (newURL.hash !== oldURL.hash) {
|
||||
window.dispatchEvent(
|
||||
new HashChangeEvent("hashchange", {
|
||||
newURL: newURL.href,
|
||||
oldURL: oldURL.href,
|
||||
}),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export class HistoryManager {
|
||||
private parent: Location & { histId: string; simulateHashChange: boolean };
|
||||
|
||||
constructor(
|
||||
parent: Location & { histId: string; simulateHashChange: boolean },
|
||||
) {
|
||||
this.parent = parent;
|
||||
}
|
||||
|
||||
updateHistoryState({ cause, replace, url, oldURL }: Context) {
|
||||
if (isExternal(this.parent)) return;
|
||||
|
||||
switch (cause) {
|
||||
case Cause.Init:
|
||||
case Cause.Push: {
|
||||
const { histId } = this.parent;
|
||||
|
||||
if (replace || url.href === location.href) {
|
||||
const state = { ...history.state, [histId]: {} };
|
||||
history.replaceState(state, document.title, url.href);
|
||||
} else {
|
||||
history.pushState({ [histId]: {} }, document.title, url.href);
|
||||
}
|
||||
// no break
|
||||
}
|
||||
case Cause.Pop: {
|
||||
if (this.parent.simulateHashChange && oldURL)
|
||||
simHashChange(url, oldURL);
|
||||
break;
|
||||
}
|
||||
default: {
|
||||
// if (process.env.DEBUG) console.warn(`Type '${cause}' not reconginzed`);
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
updateTitle({ cause, title }: ReplaceContext) {
|
||||
document.title = title;
|
||||
if (!isExternal(this.parent) && cause === Cause.Push) {
|
||||
history.replaceState(history.state, title);
|
||||
}
|
||||
}
|
||||
|
||||
updateHistoryScrollPosition = () => {
|
||||
if (isExternal(this.parent)) return;
|
||||
|
||||
const state = this.assignScrollPosition(history.state || {});
|
||||
history.replaceState(state, document.title);
|
||||
};
|
||||
|
||||
private assignScrollPosition(state: any) {
|
||||
const { histId } = this.parent;
|
||||
return {
|
||||
...state,
|
||||
[histId]: {
|
||||
...state[histId],
|
||||
scrollTop: getScrollTop(),
|
||||
scrollHeight: getScrollHeight(),
|
||||
},
|
||||
};
|
||||
}
|
||||
}
|
||||
440
packages/hydecorp/push-state/src/index.ts
Normal file
440
packages/hydecorp/push-state/src/index.ts
Normal file
@@ -0,0 +1,440 @@
|
||||
/**
|
||||
* Copyright (c) 2020 Florian Klampfer <https://qwtel.com/>
|
||||
*
|
||||
* This program is free software: you can redistribute it and/or modify
|
||||
* it under the terms of the GNU General Public License as published by
|
||||
* the Free Software Foundation, either version 3 of the License, or
|
||||
* (at your option) any later version.
|
||||
*
|
||||
* This program is distributed in the hope that it will be useful,
|
||||
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
* GNU General Public License for more details.
|
||||
*
|
||||
* You should have received a copy of the GNU General Public License
|
||||
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||
*
|
||||
* @license
|
||||
* @nocompile
|
||||
*/
|
||||
import { property, customElement } from "lit/decorators.js";
|
||||
|
||||
import {
|
||||
Observable,
|
||||
Subject,
|
||||
BehaviorSubject,
|
||||
merge,
|
||||
defer,
|
||||
fromEvent,
|
||||
animationFrameScheduler,
|
||||
} from "rxjs";
|
||||
import {
|
||||
map,
|
||||
filter,
|
||||
tap,
|
||||
takeUntil,
|
||||
startWith,
|
||||
pairwise,
|
||||
share,
|
||||
mapTo,
|
||||
switchMap,
|
||||
distinctUntilChanged,
|
||||
withLatestFrom,
|
||||
catchError,
|
||||
observeOn,
|
||||
} from "rxjs/operators";
|
||||
|
||||
import {
|
||||
RxLitElement,
|
||||
createResolvablePromise,
|
||||
matchesAncestors,
|
||||
} from "@hydecorp/component";
|
||||
|
||||
import {
|
||||
applyMixins,
|
||||
Context,
|
||||
Cause,
|
||||
ClickContext,
|
||||
isPushEvent,
|
||||
isHashChange,
|
||||
isHintEvent,
|
||||
filterWhen,
|
||||
isExternal,
|
||||
} from "./common";
|
||||
|
||||
import {
|
||||
FetchManager,
|
||||
ResponseContext,
|
||||
ResponseContextErr,
|
||||
ResponseContextOk,
|
||||
} from "./fetch";
|
||||
import { UpdateManager } from "./update";
|
||||
import { EventListenersMixin } from "./event-listeners";
|
||||
import { EventManager } from "./event";
|
||||
import { HistoryManager } from "./history";
|
||||
import { ScrollManager } from "./scroll";
|
||||
|
||||
function compareContext(p: Context, q: Context) {
|
||||
return (
|
||||
p.url.href === q.url.href && p.error === q.error && p.cacheNr === q.cacheNr
|
||||
);
|
||||
}
|
||||
|
||||
@customElement("hy-push-state")
|
||||
export class HyPushState
|
||||
extends applyMixins(RxLitElement, [EventListenersMixin])
|
||||
implements Location, EventListenersMixin
|
||||
{
|
||||
el: HTMLElement = this;
|
||||
|
||||
createRenderRoot() {
|
||||
return this;
|
||||
}
|
||||
|
||||
@property({ type: String, reflect: true, attribute: "replace-selector" })
|
||||
replaceSelector?: string;
|
||||
@property({ type: String, reflect: true, attribute: "link-selector" })
|
||||
linkSelector: string = "a[href]:not([data-no-push])";
|
||||
@property({ type: String, reflect: true, attribute: "script-selector" })
|
||||
scriptSelector?: string;
|
||||
@property({ type: Boolean, reflect: true }) prefetch: boolean = false;
|
||||
@property({ type: Number, reflect: true }) duration: number = 0;
|
||||
// @property({ type: Boolean, reflect: true, attribute: 'simulate-load' }) simulateLoad: boolean = false;
|
||||
@property({ type: Boolean, reflect: true, attribute: "hashchange" })
|
||||
simulateHashChange: boolean = false;
|
||||
|
||||
@property({ type: String }) baseURL: string = window.location.href;
|
||||
|
||||
#initialized = createResolvablePromise();
|
||||
get initialized() {
|
||||
return this.#initialized;
|
||||
}
|
||||
|
||||
$!: {
|
||||
linkSelector: Subject<string>;
|
||||
prefetch: Subject<boolean>;
|
||||
};
|
||||
|
||||
animPromise: Promise<any> = Promise.resolve(null);
|
||||
fadePromise: Promise<any> = Promise.resolve(null);
|
||||
|
||||
#scrollManager = new ScrollManager(this);
|
||||
#historyManager = new HistoryManager(this);
|
||||
#fetchManager = new FetchManager(this);
|
||||
#updateManager = new UpdateManager(this);
|
||||
#eventManager = new EventManager(this);
|
||||
|
||||
#url = new URL(this.baseURL);
|
||||
|
||||
#setLocation = (
|
||||
key:
|
||||
| "hash"
|
||||
| "host"
|
||||
| "hostname"
|
||||
| "href"
|
||||
| "pathname"
|
||||
| "port"
|
||||
| "protocol"
|
||||
| "search",
|
||||
value: string,
|
||||
) => {
|
||||
const u = new URL(this.#url.href);
|
||||
u[key] = value;
|
||||
this.assign(u.href);
|
||||
};
|
||||
|
||||
// Implement Location
|
||||
get hash() {
|
||||
return this.#url.hash;
|
||||
}
|
||||
get host() {
|
||||
return this.#url.host;
|
||||
}
|
||||
get hostname() {
|
||||
return this.#url.hostname;
|
||||
}
|
||||
get href() {
|
||||
return this.#url.href;
|
||||
}
|
||||
get pathname() {
|
||||
return this.#url.pathname;
|
||||
}
|
||||
get port() {
|
||||
return this.#url.port;
|
||||
}
|
||||
get protocol() {
|
||||
return this.#url.protocol;
|
||||
}
|
||||
get search() {
|
||||
return this.#url.search;
|
||||
}
|
||||
get origin() {
|
||||
return this.#url.origin;
|
||||
}
|
||||
get ancestorOrigins() {
|
||||
return window.location.ancestorOrigins;
|
||||
}
|
||||
|
||||
set hash(value) {
|
||||
this.#setLocation("hash", value);
|
||||
}
|
||||
set host(value) {
|
||||
this.#setLocation("host", value);
|
||||
}
|
||||
set hostname(value) {
|
||||
this.#setLocation("hostname", value);
|
||||
}
|
||||
set href(value) {
|
||||
this.#setLocation("href", value);
|
||||
}
|
||||
set pathname(value) {
|
||||
this.#setLocation("pathname", value);
|
||||
}
|
||||
set port(value) {
|
||||
this.#setLocation("port", value);
|
||||
}
|
||||
set protocol(value) {
|
||||
this.#setLocation("protocol", value);
|
||||
}
|
||||
set search(value) {
|
||||
this.#setLocation("search", value);
|
||||
}
|
||||
|
||||
// EventListenersMixin
|
||||
setupEventListeners!: () => {
|
||||
pushEvent$: Observable<[MouseEvent, HTMLAnchorElement]>;
|
||||
hintEvent$: Observable<[Event, HTMLAnchorElement]>;
|
||||
};
|
||||
|
||||
#cacheNr = 0;
|
||||
|
||||
get histId() {
|
||||
return this.id || this.tagName;
|
||||
}
|
||||
|
||||
#reload$ = new Subject<Context>();
|
||||
|
||||
@property()
|
||||
assign(url: string) {
|
||||
this.#reload$.next({
|
||||
cause: Cause.Push,
|
||||
url: new URL(url, this.href),
|
||||
cacheNr: ++this.#cacheNr,
|
||||
});
|
||||
}
|
||||
|
||||
@property()
|
||||
reload() {
|
||||
this.#reload$.next({
|
||||
cause: Cause.Push,
|
||||
url: new URL(this.href),
|
||||
cacheNr: ++this.#cacheNr,
|
||||
replace: true,
|
||||
});
|
||||
}
|
||||
|
||||
@property()
|
||||
replace(url: string) {
|
||||
this.#reload$.next({
|
||||
cause: Cause.Push,
|
||||
url: new URL(url, this.href),
|
||||
cacheNr: ++this.#cacheNr,
|
||||
replace: true,
|
||||
});
|
||||
}
|
||||
|
||||
connectedCallback() {
|
||||
super.connectedCallback();
|
||||
|
||||
this.$ = {
|
||||
linkSelector: new BehaviorSubject(this.linkSelector),
|
||||
prefetch: new BehaviorSubject(this.prefetch),
|
||||
};
|
||||
|
||||
// Remember the current scroll position (for F5/reloads).
|
||||
window.addEventListener(
|
||||
"beforeunload",
|
||||
this.#historyManager.updateHistoryScrollPosition,
|
||||
);
|
||||
|
||||
// Remember scroll position for backward/forward navigation cache.
|
||||
// Technically, this is only necessary for Safari, because other browsers will not use the BFN cache
|
||||
// when a beforeunload event is registered...
|
||||
document.documentElement.addEventListener(
|
||||
"click",
|
||||
this.#updateHistoryScrollPosition,
|
||||
);
|
||||
|
||||
this.updateComplete.then(this.#upgrade);
|
||||
}
|
||||
|
||||
#updateHistoryScrollPosition = (event: MouseEvent) => {
|
||||
const anchor = matchesAncestors(
|
||||
event.target as Element,
|
||||
"a[href]",
|
||||
) as HTMLAnchorElement | null;
|
||||
if (isExternal(anchor)) {
|
||||
this.#historyManager.updateHistoryScrollPosition();
|
||||
}
|
||||
};
|
||||
|
||||
#response$!: Observable<ResponseContext>;
|
||||
|
||||
#upgrade = () => {
|
||||
const { pushEvent$, hintEvent$ } = this.setupEventListeners();
|
||||
|
||||
const push$: Observable<ClickContext> = pushEvent$.pipe(
|
||||
// takeUntil(this.subjects.disconnect),
|
||||
map(([event, anchor]) => ({
|
||||
cause: Cause.Push,
|
||||
url: new URL(anchor.href, this.href),
|
||||
anchor,
|
||||
event,
|
||||
cacheNr: this.#cacheNr,
|
||||
})),
|
||||
filter((x) => isPushEvent(x, this)),
|
||||
tap(({ event }) => {
|
||||
event.preventDefault();
|
||||
this.#historyManager.updateHistoryScrollPosition();
|
||||
}),
|
||||
);
|
||||
|
||||
const pop$: Observable<Context> = fromEvent(window, "popstate").pipe(
|
||||
// takeUntil(this.subjects.disconnect),
|
||||
filter(() => window.history.state && window.history.state[this.histId]),
|
||||
map((event) => ({
|
||||
cause: Cause.Pop,
|
||||
url: new URL(window.location.href),
|
||||
cacheNr: this.#cacheNr,
|
||||
event,
|
||||
})),
|
||||
);
|
||||
|
||||
const reload$ = this.#reload$; // .pipe(takeUntil(this.subjects.disconnect));
|
||||
|
||||
const merged$: Observable<Context> = merge(push$, pop$, reload$).pipe(
|
||||
startWith({ url: new URL(window.location.href) } as Context),
|
||||
pairwise(),
|
||||
map(([old, current]) => Object.assign(current, { oldURL: old.url })),
|
||||
share(),
|
||||
);
|
||||
|
||||
const page$ = merged$.pipe(
|
||||
filter((p) => !isHashChange(p)),
|
||||
share(),
|
||||
);
|
||||
|
||||
const hash$ = merged$.pipe(
|
||||
filter((p) => isHashChange(p)),
|
||||
filter(() => history.state && history.state[this.histId]),
|
||||
observeOn<Context>(animationFrameScheduler),
|
||||
tap((context) => {
|
||||
this.#historyManager.updateHistoryState(context);
|
||||
this.#scrollManager.manageScrollPosition(context);
|
||||
}),
|
||||
);
|
||||
|
||||
const pauser$ = defer(() =>
|
||||
merge(page$.pipe(mapTo(true)), this.#response$.pipe(mapTo(false))),
|
||||
).pipe(startWith(false));
|
||||
|
||||
const hint$: Observable<Context> = hintEvent$.pipe(
|
||||
// takeUntil(this.subjects.disconnect),
|
||||
filterWhen(pauser$.pipe(map((x) => !x))),
|
||||
map(([event, anchor]) => ({
|
||||
cause: Cause.Hint,
|
||||
url: new URL(anchor.href, this.href),
|
||||
anchor,
|
||||
event,
|
||||
cacheNr: this.#cacheNr,
|
||||
})),
|
||||
filter((x) => isHintEvent(x, this)),
|
||||
);
|
||||
|
||||
const prefetchResponse$ = merge(hint$, page$).pipe(
|
||||
distinctUntilChanged((x, y) => compareContext(x, y)),
|
||||
switchMap((x) => this.#fetchManager.fetchPage(x)),
|
||||
startWith({ url: {} } as ResponseContext),
|
||||
share(),
|
||||
);
|
||||
|
||||
const response$ = (this.#response$ = page$.pipe(
|
||||
tap((context) => {
|
||||
this.#eventManager.onStart(context);
|
||||
this.#historyManager.updateHistoryState(context);
|
||||
this.#url = context.url;
|
||||
}),
|
||||
withLatestFrom(prefetchResponse$),
|
||||
switchMap((args) =>
|
||||
this.#fetchManager.getResponse(prefetchResponse$, ...args),
|
||||
),
|
||||
share(),
|
||||
));
|
||||
|
||||
const responseOk$ = response$.pipe(
|
||||
filter((ctx): ctx is ResponseContextOk => !ctx.error),
|
||||
);
|
||||
const responseErr$ = response$.pipe(
|
||||
filter((ctx): ctx is ResponseContextErr => !!ctx.error),
|
||||
);
|
||||
|
||||
const main$ = responseOk$.pipe(
|
||||
map((context) => this.#updateManager.responseToContent(context)),
|
||||
tap((context) => this.#eventManager.emitReady(context)),
|
||||
observeOn(animationFrameScheduler),
|
||||
tap((context) => {
|
||||
this.#updateManager.updateDOM(context);
|
||||
this.#historyManager.updateTitle(context);
|
||||
this.#eventManager.emitAfter(context);
|
||||
}),
|
||||
startWith({
|
||||
cause: Cause.Init,
|
||||
url: this.#url,
|
||||
scripts: [],
|
||||
}),
|
||||
observeOn(animationFrameScheduler),
|
||||
tap((context) => this.#scrollManager.manageScrollPosition(context)),
|
||||
tap({ error: (e) => this.#eventManager.emitDOMError(e) }),
|
||||
catchError((_, c) => c),
|
||||
switchMap((x) => this.fadePromise.then(() => x)),
|
||||
switchMap((x) => this.#updateManager.reinsertScriptTags(x)),
|
||||
tap({ error: (e) => this.#eventManager.emitError(e) }),
|
||||
catchError((_, c) => c),
|
||||
tap((context) => this.#eventManager.emitLoad(context)),
|
||||
);
|
||||
|
||||
const error$ = responseErr$.pipe(
|
||||
tap((e) => this.#eventManager.emitNetworkError(e)),
|
||||
);
|
||||
|
||||
const progress$ = page$.pipe(
|
||||
switchMap((context) =>
|
||||
defer(() => this.animPromise).pipe(
|
||||
takeUntil(response$),
|
||||
mapTo(context),
|
||||
),
|
||||
),
|
||||
tap((context) => this.#eventManager.emitProgress(context)),
|
||||
);
|
||||
|
||||
// Subscriptions
|
||||
main$.subscribe();
|
||||
hash$.subscribe();
|
||||
error$.subscribe();
|
||||
progress$.subscribe();
|
||||
|
||||
this.#initialized.resolve(this);
|
||||
this.fireEvent("init");
|
||||
};
|
||||
|
||||
disconnectedCallback() {
|
||||
window.removeEventListener(
|
||||
"beforeunload",
|
||||
this.#historyManager.updateHistoryScrollPosition,
|
||||
);
|
||||
document.documentElement.removeEventListener(
|
||||
"click",
|
||||
this.#updateHistoryScrollPosition,
|
||||
);
|
||||
}
|
||||
}
|
||||
95
packages/hydecorp/push-state/src/rewrite-urls.ts
Normal file
95
packages/hydecorp/push-state/src/rewrite-urls.ts
Normal file
@@ -0,0 +1,95 @@
|
||||
// When fetching documents from an external source,
|
||||
// relative URLs will be resolved relative to the current `window.location`.
|
||||
// We can rewrite URL to absolute urls
|
||||
export function rewriteURLs(replaceEls: (Element | null)[], base: string) {
|
||||
replaceEls.forEach((el) => {
|
||||
if (!el) return;
|
||||
el.querySelectorAll("[href]").forEach(rewriteURL("href", base));
|
||||
el.querySelectorAll("[src]").forEach(rewriteURL("src", base));
|
||||
el.querySelectorAll("img[srcset]").forEach(
|
||||
rewriteURLSrcSet("srcset", base),
|
||||
);
|
||||
el.querySelectorAll("blockquote[cite]").forEach(rewriteURL("cite", base));
|
||||
el.querySelectorAll("del[cite]").forEach(rewriteURL("cite", base));
|
||||
el.querySelectorAll("ins[cite]").forEach(rewriteURL("cite", base));
|
||||
el.querySelectorAll("q[cite]").forEach(rewriteURL("cite", base));
|
||||
el.querySelectorAll("img[longdesc]").forEach(rewriteURL("longdesc", base));
|
||||
el.querySelectorAll("frame[longdesc]").forEach(
|
||||
rewriteURL("longdesc", base),
|
||||
);
|
||||
el.querySelectorAll("iframe[longdesc]").forEach(
|
||||
rewriteURL("longdesc", base),
|
||||
);
|
||||
el.querySelectorAll("img[usemap]").forEach(rewriteURL("usemap", base));
|
||||
el.querySelectorAll("input[usemap]").forEach(rewriteURL("usemap", base));
|
||||
el.querySelectorAll("object[usemap]").forEach(rewriteURL("usemap", base));
|
||||
el.querySelectorAll("form[action]").forEach(rewriteURL("action", base));
|
||||
el.querySelectorAll("button[formaction]").forEach(
|
||||
rewriteURL("formaction", base),
|
||||
);
|
||||
el.querySelectorAll("input[formaction]").forEach(
|
||||
rewriteURL("formaction", base),
|
||||
);
|
||||
el.querySelectorAll("video[poster]").forEach(rewriteURL("poster", base));
|
||||
el.querySelectorAll("object[data]").forEach(rewriteURL("data", base));
|
||||
el.querySelectorAll("object[codebase]").forEach(
|
||||
rewriteURL("codebase", base),
|
||||
);
|
||||
el.querySelectorAll("object[archive]").forEach(
|
||||
rewriteURLList("archive", base),
|
||||
);
|
||||
/* el.querySelectorAll("command[icon]").forEach(this.rewriteURL("icon")); */ // obsolte
|
||||
});
|
||||
}
|
||||
|
||||
function rewriteURL(attr: string, base: string) {
|
||||
return (el: Element) => {
|
||||
try {
|
||||
const attrVal = el.getAttribute(attr);
|
||||
if (attrVal == null) return;
|
||||
el.setAttribute(attr, new URL(attrVal, base).href);
|
||||
} catch (e) {
|
||||
// if (process.env.DEBUG) console.warn(`Couldn't rewrite URL in attribute ${attr} on element`, el);
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
function rewriteURLSrcSet(attr: string, base: string) {
|
||||
return (el: Element) => {
|
||||
try {
|
||||
const attrVal = el.getAttribute(attr);
|
||||
if (attrVal == null) return;
|
||||
el.setAttribute(
|
||||
attr,
|
||||
attrVal
|
||||
.split(/\s*,\s*/)
|
||||
.map((str) => {
|
||||
const pair = str.split(/\s+/);
|
||||
pair[0] = new URL(pair[0], base).href;
|
||||
return pair.join(" ");
|
||||
})
|
||||
.join(", "),
|
||||
);
|
||||
} catch (e) {
|
||||
// if (process.env.DEBUG) console.warn(`Couldn't rewrite URLs in attribute ${attr} on element`, el);
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
function rewriteURLList(attr: string, base: string) {
|
||||
return (el: Element) => {
|
||||
try {
|
||||
const attrVal = el.getAttribute(attr);
|
||||
if (attrVal == null) return;
|
||||
el.setAttribute(
|
||||
attr,
|
||||
attrVal
|
||||
.split(/[\s,]+/)
|
||||
.map((str) => new URL(str, base).href)
|
||||
.join(", "),
|
||||
);
|
||||
} catch (e) {
|
||||
// if (process.env.DEBUG) console.warn(`Couldn't rewrite URLs in attribute ${attr} on element`, el);
|
||||
}
|
||||
};
|
||||
}
|
||||
89
packages/hydecorp/push-state/src/script.ts
Normal file
89
packages/hydecorp/push-state/src/script.ts
Normal file
@@ -0,0 +1,89 @@
|
||||
import { of, from } from "rxjs";
|
||||
import { concatMap, catchError, finalize, mapTo } from "rxjs/operators";
|
||||
|
||||
import { HyPushState } from ".";
|
||||
|
||||
function cloneScript(script: HTMLScriptElement) {
|
||||
const newScript = document.createElement("script");
|
||||
Array.from(script.attributes).forEach((attr) =>
|
||||
newScript.setAttributeNode(attr.cloneNode() as Attr),
|
||||
);
|
||||
newScript.innerHTML = script.innerHTML;
|
||||
return newScript;
|
||||
}
|
||||
|
||||
export class ScriptManager {
|
||||
private parent: HyPushState;
|
||||
|
||||
constructor(parent: HyPushState) {
|
||||
this.parent = parent;
|
||||
}
|
||||
|
||||
get scriptSelector() {
|
||||
return this.parent.scriptSelector;
|
||||
}
|
||||
|
||||
removeScriptTags(replaceEls: (Element | null)[]) {
|
||||
const scripts: Array<[HTMLScriptElement, HTMLScriptElement]> = [];
|
||||
|
||||
replaceEls.forEach((el) => {
|
||||
if (el && this.scriptSelector) {
|
||||
el.querySelectorAll(this.scriptSelector).forEach((script) => {
|
||||
if (script instanceof HTMLScriptElement) {
|
||||
const newScript = cloneScript(script);
|
||||
const pair: [HTMLScriptElement, HTMLScriptElement] = [
|
||||
newScript,
|
||||
script,
|
||||
];
|
||||
scripts.push(pair);
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
return scripts;
|
||||
}
|
||||
|
||||
reinsertScriptTags(context: {
|
||||
scripts: Array<[HTMLScriptElement, HTMLScriptElement]>;
|
||||
}) {
|
||||
if (!this.scriptSelector) return Promise.resolve(context);
|
||||
|
||||
const { scripts } = context;
|
||||
|
||||
const originalWrite = document.write;
|
||||
|
||||
return from(scripts)
|
||||
.pipe(
|
||||
concatMap((script) => this.insertScript(script)),
|
||||
catchError((error) => of({ ...context, error })),
|
||||
finalize(() => (document.write = originalWrite)),
|
||||
mapTo(context),
|
||||
)
|
||||
.toPromise();
|
||||
}
|
||||
|
||||
private insertScript([script, ref]: [
|
||||
HTMLScriptElement,
|
||||
HTMLScriptElement,
|
||||
]): Promise<{}> {
|
||||
document.write = (...args) => {
|
||||
const temp = document.createElement("div");
|
||||
temp.innerHTML = args.join();
|
||||
Array.from(temp.childNodes).forEach((node) =>
|
||||
ref.parentNode?.insertBefore(node, ref),
|
||||
);
|
||||
};
|
||||
|
||||
return new Promise((resolve, reject) => {
|
||||
if (script.src !== "") {
|
||||
script.addEventListener("load", resolve);
|
||||
script.addEventListener("error", reject);
|
||||
ref.parentNode?.replaceChild(script, ref);
|
||||
} else {
|
||||
ref.parentNode?.replaceChild(script, ref);
|
||||
resolve({});
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
78
packages/hydecorp/push-state/src/scroll.ts
Normal file
78
packages/hydecorp/push-state/src/scroll.ts
Normal file
@@ -0,0 +1,78 @@
|
||||
import { getScrollTop, Cause } from "./common";
|
||||
|
||||
interface ScrollState {
|
||||
[k: string]: any;
|
||||
scrollTop?: number;
|
||||
scrollHeight?: number;
|
||||
}
|
||||
|
||||
export class ScrollManager {
|
||||
private parent: { histId: string } & HTMLElement;
|
||||
|
||||
constructor(parent: { histId: string } & HTMLElement) {
|
||||
this.parent = parent;
|
||||
if ("scrollRestoration" in history) {
|
||||
history.scrollRestoration = "manual";
|
||||
}
|
||||
}
|
||||
|
||||
manageScrollPosition({ cause, url: { hash } }: { cause: Cause; url: URL }) {
|
||||
switch (cause) {
|
||||
case Cause.Push: {
|
||||
// FIXME: make configurable
|
||||
this.scrollHashIntoView(hash, {
|
||||
behavior: "smooth",
|
||||
block: "start",
|
||||
inline: "nearest",
|
||||
});
|
||||
break;
|
||||
}
|
||||
case Cause.Pop: {
|
||||
this.restoreScrollPosition();
|
||||
break;
|
||||
}
|
||||
case Cause.Init: {
|
||||
this.restoreScrollPositionOnReload();
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
private elementFromHash(hash: string) {
|
||||
return document.getElementById(decodeURIComponent(hash.substr(1)));
|
||||
}
|
||||
|
||||
private scrollHashIntoView(
|
||||
hash: string,
|
||||
options: boolean | ScrollIntoViewOptions,
|
||||
) {
|
||||
if (hash) {
|
||||
const el = this.elementFromHash(hash);
|
||||
if (el) el.scrollIntoView(options);
|
||||
} else {
|
||||
window.scroll(window.pageXOffset, 0);
|
||||
}
|
||||
}
|
||||
|
||||
private restoreScrollPosition() {
|
||||
const { histId } = this.parent;
|
||||
const { scrollTop } =
|
||||
(history.state && history.state[histId]) || ({} as ScrollState);
|
||||
|
||||
if (scrollTop != null) {
|
||||
window.scroll(window.pageXOffset, scrollTop);
|
||||
}
|
||||
}
|
||||
|
||||
private restoreScrollPositionOnReload() {
|
||||
const { histId } = this.parent;
|
||||
const scrollState = history.state && history.state[histId];
|
||||
// FIXME: As far as I can tell there is no better way of figuring out if the user has scrolled
|
||||
// and it doesn't work on hash links b/c the scroll position is going to be non-null by definition
|
||||
if (scrollState && getScrollTop() === 0) {
|
||||
this.restoreScrollPosition();
|
||||
} else if (location.hash) {
|
||||
requestAnimationFrame(() => this.scrollHashIntoView(location.hash, true));
|
||||
}
|
||||
}
|
||||
}
|
||||
135
packages/hydecorp/push-state/src/update.ts
Normal file
135
packages/hydecorp/push-state/src/update.ts
Normal file
@@ -0,0 +1,135 @@
|
||||
import { isExternal, fragmentFromString } from "./common";
|
||||
|
||||
import { ScriptManager } from "./script";
|
||||
import { rewriteURLs } from "./rewrite-urls";
|
||||
|
||||
import { ResponseContext, ResponseContextOk } from "./fetch";
|
||||
import { HyPushState } from ".";
|
||||
|
||||
const CANONICAL_SEL = "link[rel=canonical]";
|
||||
const META_DESC_SEL = "meta[name=description]";
|
||||
|
||||
export interface ReplaceContext extends ResponseContext {
|
||||
title: string;
|
||||
document: Document;
|
||||
replaceEls: (Element | null)[];
|
||||
scripts: Array<[HTMLScriptElement, HTMLScriptElement]>;
|
||||
}
|
||||
|
||||
export class UpdateManager {
|
||||
private parent!: HyPushState;
|
||||
private scriptManager!: ScriptManager;
|
||||
|
||||
constructor(parent: HyPushState) {
|
||||
this.parent = parent;
|
||||
this.scriptManager = new ScriptManager(parent);
|
||||
}
|
||||
|
||||
get el() {
|
||||
return this.parent;
|
||||
}
|
||||
get replaceSelector() {
|
||||
return this.parent.replaceSelector;
|
||||
}
|
||||
get scriptSelector() {
|
||||
return this.parent.scriptSelector;
|
||||
}
|
||||
|
||||
// Extracts the elements to be replaced
|
||||
private getReplaceElements(doc: Document): (Element | null)[] {
|
||||
if (this.replaceSelector) {
|
||||
return this.replaceSelector
|
||||
.split(",")
|
||||
.map((sel) => doc.querySelector(sel));
|
||||
} else if (this.el.id) {
|
||||
return [doc.getElementById(this.el.id)];
|
||||
} else {
|
||||
const index = Array.from(
|
||||
document.getElementsByTagName(this.el.tagName),
|
||||
).indexOf(this.el);
|
||||
return [doc.getElementsByTagName(this.el.tagName)[index]];
|
||||
}
|
||||
}
|
||||
|
||||
// Takes the response string and turns it into document fragments
|
||||
// that can be inserted into the DOM.
|
||||
responseToContent(context: ResponseContextOk): ReplaceContext {
|
||||
const { responseText } = context;
|
||||
|
||||
const doc = new DOMParser().parseFromString(responseText, "text/html");
|
||||
const { title = "" } = doc;
|
||||
const replaceEls = this.getReplaceElements(doc);
|
||||
|
||||
if (replaceEls.every((el) => el == null)) {
|
||||
throw new Error(
|
||||
`Couldn't find any element in the document at '${location}'.`,
|
||||
);
|
||||
}
|
||||
|
||||
const scripts = this.scriptSelector
|
||||
? this.scriptManager.removeScriptTags(replaceEls)
|
||||
: [];
|
||||
|
||||
return { ...context, document: doc, title, replaceEls, scripts };
|
||||
}
|
||||
|
||||
// Replaces the old elements with the new one, one-by-one.
|
||||
private replaceContentWithSelector(
|
||||
replaceSelector: string,
|
||||
elements: (Element | null)[],
|
||||
) {
|
||||
replaceSelector
|
||||
.split(",")
|
||||
.map((sel) => document.querySelector(sel))
|
||||
.forEach((oldElement, i) => {
|
||||
const el = elements[i];
|
||||
if (el) oldElement?.parentNode?.replaceChild(el, oldElement);
|
||||
});
|
||||
}
|
||||
|
||||
// When no `replaceIds` are set, replace the entire content of the component (slow).
|
||||
private replaceContentWholesale([el]: (Element | null)[]) {
|
||||
if (el) this.el.innerHTML = el.innerHTML;
|
||||
}
|
||||
|
||||
private replaceContent(replaceEls: (Element | null)[]) {
|
||||
if (this.replaceSelector) {
|
||||
this.replaceContentWithSelector(this.replaceSelector, replaceEls);
|
||||
} else {
|
||||
this.replaceContentWholesale(replaceEls);
|
||||
}
|
||||
}
|
||||
|
||||
private replaceHead(doc: Document) {
|
||||
const { head } = this.el.ownerDocument;
|
||||
|
||||
const canonicalEl = head.querySelector(
|
||||
CANONICAL_SEL,
|
||||
) as HTMLLinkElement | null;
|
||||
const cEl = doc.head.querySelector(CANONICAL_SEL) as HTMLLinkElement | null;
|
||||
if (canonicalEl && cEl) canonicalEl.href = cEl.href;
|
||||
|
||||
const metaDescEl = head.querySelector(
|
||||
META_DESC_SEL,
|
||||
) as HTMLMetaElement | null;
|
||||
const mEl = doc.head.querySelector(META_DESC_SEL) as HTMLMetaElement | null;
|
||||
if (metaDescEl && mEl) metaDescEl.content = mEl.content;
|
||||
}
|
||||
|
||||
updateDOM(context: ReplaceContext) {
|
||||
try {
|
||||
const { replaceEls, document } = context;
|
||||
if (isExternal(this.parent)) rewriteURLs(replaceEls, this.parent.href);
|
||||
this.replaceHead(document);
|
||||
this.replaceContent(replaceEls);
|
||||
} catch (error) {
|
||||
throw { ...context, error };
|
||||
}
|
||||
}
|
||||
|
||||
reinsertScriptTags(context: {
|
||||
scripts: Array<[HTMLScriptElement, HTMLScriptElement]>;
|
||||
}) {
|
||||
return this.scriptManager.reinsertScriptTags(context);
|
||||
}
|
||||
}
|
||||
17
packages/hydecorp/push-state/tsconfig.json
Normal file
17
packages/hydecorp/push-state/tsconfig.json
Normal file
@@ -0,0 +1,17 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"experimentalDecorators": true,
|
||||
"lib": ["DOM", "DOM.Iterable", "ES2020"],
|
||||
"moduleResolution": "Node",
|
||||
"module": "ES2020",
|
||||
"target": "ES2018",
|
||||
"outDir": "lib",
|
||||
"declaration": true,
|
||||
"declarationMap": true,
|
||||
"sourceMap": true,
|
||||
"inlineSources": true,
|
||||
"strict": true,
|
||||
"importHelpers": true
|
||||
},
|
||||
"include": ["typings/**/*.ts", "src/**/*.ts"]
|
||||
}
|
||||
21
packages/hydecorp/push-state/typings/Decorators.d.ts
vendored
Normal file
21
packages/hydecorp/push-state/typings/Decorators.d.ts
vendored
Normal file
@@ -0,0 +1,21 @@
|
||||
type Constructor<T> = {
|
||||
new (...args: unknown[]): T;
|
||||
};
|
||||
|
||||
// From the TC39 Decorators proposal
|
||||
interface ClassDescriptor {
|
||||
kind: "class";
|
||||
elements: ClassElement[];
|
||||
finisher?: <T>(clazz: Constructor<T>) => undefined | Constructor<T>;
|
||||
}
|
||||
|
||||
// From the TC39 Decorators proposal
|
||||
interface ClassElement {
|
||||
kind: "field" | "method";
|
||||
key: PropertyKey;
|
||||
placement: "static" | "prototype" | "own";
|
||||
initializer?: Function;
|
||||
extras?: ClassElement[];
|
||||
finisher?: <T>(clazz: Constructor<T>) => undefined | Constructor<T>;
|
||||
descriptor?: PropertyDescriptor;
|
||||
}
|
||||
Reference in New Issue
Block a user