mirror of
https://github.com/NativeScript/NativeScript.git
synced 2025-08-16 11:42:04 +08:00
1cbb1e8d0d
We want webpack's uglification to mangle function and class names
but that's what the current implementation of the CSS in {N} relys on
to get the CSS type for each view when targeted by CSS type selectors.
The implementation is changed a little so now the CSS type can be set
directly on the prototype of each View class or for TS, through decorator.
BREAKING CHANGES:
Extending classes requires marking the derived class with @CSSType
The root classes are not marked with CSSType and classes derived from ViewBase and View
will continue to work as expected. More concrete view classes (Button, Label, etc.) are
marked with @CSSType now and store their cssType on the prototype suppressing the previous
implementation that looked up the class function name. So clien classes that derive from one of
our @CSSType decorated classes will now have to be marked with @CSSType.
103 lines
3.0 KiB
TypeScript
103 lines
3.0 KiB
TypeScript
import { WebView as WebViewDefinition, LoadEventData, NavigationType } from ".";
|
|
import { View, Property, EventData, CSSType } from "../core/view";
|
|
import { File, knownFolders, path } from "../../file-system";
|
|
|
|
export { File, knownFolders, path, NavigationType };
|
|
export * from "../core/view";
|
|
|
|
export const srcProperty = new Property<WebViewBase, string>({ name: "src" });
|
|
|
|
@CSSType("WebView")
|
|
export abstract class WebViewBase extends View implements WebViewDefinition {
|
|
public static loadStartedEvent = "loadStarted";
|
|
public static loadFinishedEvent = "loadFinished";
|
|
|
|
public src: string;
|
|
|
|
public _onLoadFinished(url: string, error?: string) {
|
|
let args = <LoadEventData>{
|
|
eventName: WebViewBase.loadFinishedEvent,
|
|
object: this,
|
|
url: url,
|
|
navigationType: undefined,
|
|
error: error
|
|
};
|
|
|
|
this.notify(args);
|
|
}
|
|
|
|
public _onLoadStarted(url: string, navigationType: NavigationType) {
|
|
let args = <LoadEventData>{
|
|
eventName: WebViewBase.loadStartedEvent,
|
|
object: this,
|
|
url: url,
|
|
navigationType: navigationType,
|
|
error: undefined
|
|
};
|
|
|
|
this.notify(args);
|
|
}
|
|
|
|
abstract _loadUrl(src: string): void;
|
|
|
|
abstract _loadData(src: string): void;
|
|
|
|
abstract stopLoading(): void;
|
|
|
|
get canGoBack(): boolean {
|
|
throw new Error("This member is abstract.");
|
|
}
|
|
|
|
get canGoForward(): boolean {
|
|
throw new Error("This member is abstract.");
|
|
}
|
|
|
|
abstract goBack(): void;
|
|
|
|
abstract goForward(): void;
|
|
|
|
abstract reload(): void;
|
|
|
|
[srcProperty.getDefault](): string {
|
|
return "";
|
|
}
|
|
[srcProperty.setNative](src: string) {
|
|
this.stopLoading();
|
|
|
|
// Add file:/// prefix for local files.
|
|
// They should be loaded with _loadUrl() method as it handles query params.
|
|
if (src.indexOf("~/") === 0) {
|
|
src = `file:///${knownFolders.currentApp().path}/` + src.substr(2);
|
|
} else if (src.indexOf("/") === 0) {
|
|
src = "file://" + src;
|
|
}
|
|
|
|
// loading local files from paths with spaces may fail
|
|
if (src.toLowerCase().indexOf("file:///") === 0) {
|
|
src = encodeURI(src);
|
|
}
|
|
|
|
if (src.toLowerCase().indexOf("http://") === 0 ||
|
|
src.toLowerCase().indexOf("https://") === 0 ||
|
|
src.toLowerCase().indexOf("file:///") === 0) {
|
|
this._loadUrl(src);
|
|
} else {
|
|
this._loadData(src);
|
|
}
|
|
}
|
|
|
|
get url(): string {
|
|
throw new Error("Property url of WebView is deprecated. Use src instead");
|
|
}
|
|
set url(value: string) {
|
|
throw new Error("Property url of WebView is deprecated. Use src instead")
|
|
}
|
|
}
|
|
export interface WebViewBase {
|
|
on(eventNames: string, callback: (data: EventData) => void, thisArg?: any);
|
|
on(event: "loadFinished", callback: (args: LoadEventData) => void, thisArg?: any);
|
|
on(event: "loadStarted", callback: (args: LoadEventData) => void, thisArg?: any);
|
|
}
|
|
|
|
srcProperty.register(WebViewBase);
|