mirror of
https://github.com/smallmain/cocos-enhance-kit.git
synced 2024-12-26 11:48:29 +00:00
275 lines
9.3 KiB
JavaScript
275 lines
9.3 KiB
JavaScript
/****************************************************************************
|
||
Copyright (c) 2013-2016 Chukong Technologies Inc.
|
||
Copyright (c) 2017-2018 Xiamen Yaji Software Co., Ltd.
|
||
|
||
https://www.cocos.com/
|
||
|
||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||
of this software and associated engine source code (the "Software"), a limited,
|
||
worldwide, royalty-free, non-assignable, revocable and non-exclusive license
|
||
to use Cocos Creator solely to develop games on your target platforms. You shall
|
||
not use Cocos Creator software for developing other software or tools that's
|
||
used for developing games. You are not granted to publish, distribute,
|
||
sublicense, and/or sell copies of Cocos Creator.
|
||
|
||
The software or tools in this License Agreement are licensed, not sold.
|
||
Xiamen Yaji Software Co., Ltd. reserves all rights not expressly granted to you.
|
||
|
||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
||
THE SOFTWARE.
|
||
****************************************************************************/
|
||
|
||
const WebViewImpl = require('./webview-impl');
|
||
|
||
/**
|
||
* !#en WebView event type
|
||
* !#zh 网页视图事件类型
|
||
* @enum WebView.EventType
|
||
*/
|
||
const EventType = WebViewImpl.EventType;
|
||
|
||
|
||
/**
|
||
* !#en Web page Load completed.
|
||
* !#zh 网页加载完成
|
||
* @property {String} LOADED
|
||
*/
|
||
|
||
/**
|
||
* !#en Web page is loading.
|
||
* !#zh 网页加载中
|
||
* @property {String} LOADING
|
||
*/
|
||
|
||
/**
|
||
* !#en Web page error occurs when loading.
|
||
* !#zh 网页加载出错
|
||
* @property {String} ERROR
|
||
*/
|
||
|
||
//
|
||
function emptyCallback () { }
|
||
|
||
/**
|
||
* !#en cc.WebView is a component for display web pages in the game. Because different platforms have different authorization, API and control methods for WebView component. And have not yet formed a unified standard, only Web, iOS, and Android platforms are currently supported.
|
||
* !#zh WebView 组件,用于在游戏中显示网页。由于不同平台对于 WebView 组件的授权、API、控制方式都不同,还没有形成统一的标准,所以目前只支持 Web、iOS 和 Android 平台。
|
||
* @class WebView
|
||
* @extends Component
|
||
*/
|
||
let WebView = cc.Class({
|
||
name: 'cc.WebView',
|
||
extends: cc.Component,
|
||
|
||
editor: CC_EDITOR && {
|
||
menu: 'i18n:MAIN_MENU.component.ui/WebView',
|
||
help: 'i18n:COMPONENT.help_url.webview',
|
||
executeInEditMode: true
|
||
},
|
||
|
||
properties: {
|
||
_url: '',
|
||
/**
|
||
* !#en A given URL to be loaded by the WebView, it should have a http or https prefix.
|
||
* !#zh 指定 WebView 加载的网址,它应该是一个 http 或者 https 开头的字符串
|
||
* @property {String} url
|
||
*/
|
||
url: {
|
||
type: cc.String,
|
||
tooltip: CC_DEV && 'i18n:COMPONENT.webview.url',
|
||
get: function () {
|
||
return this._url;
|
||
},
|
||
set: function (url) {
|
||
this._url = url;
|
||
let impl = this._impl;
|
||
if (impl) {
|
||
impl.loadURL(url);
|
||
}
|
||
}
|
||
},
|
||
|
||
/**
|
||
* !#en The webview's event callback , it will be triggered when certain webview event occurs.
|
||
* !#zh WebView 的回调事件,当网页加载过程中,加载完成后或者加载出错时都会回调此函数
|
||
* @property {Component.EventHandler[]} webviewLoadedEvents
|
||
*/
|
||
webviewEvents: {
|
||
default: [],
|
||
type: cc.Component.EventHandler,
|
||
},
|
||
},
|
||
|
||
statics: {
|
||
EventType: EventType,
|
||
// Impl will be overrided in the different platform.
|
||
Impl: WebViewImpl
|
||
},
|
||
|
||
ctor () {
|
||
this._impl = new WebView.Impl();
|
||
},
|
||
|
||
onRestore () {
|
||
if (!this._impl) {
|
||
this._impl = new WebView.Impl();
|
||
}
|
||
},
|
||
|
||
onEnable () {
|
||
let impl = this._impl;
|
||
impl.createDomElementIfNeeded(this.node.width, this.node.height);
|
||
if (!CC_EDITOR) {
|
||
impl.setEventListener(EventType.LOADED, this._onWebViewLoaded.bind(this));
|
||
impl.setEventListener(EventType.LOADING, this._onWebViewLoading.bind(this));
|
||
impl.setEventListener(EventType.ERROR, this._onWebViewLoadError.bind(this));
|
||
}
|
||
impl.loadURL(this._url);
|
||
impl.setVisible(true);
|
||
},
|
||
|
||
onDisable () {
|
||
let impl = this._impl;
|
||
impl.setVisible(false);
|
||
if (!CC_EDITOR) {
|
||
impl.setEventListener(EventType.LOADED, emptyCallback);
|
||
impl.setEventListener(EventType.LOADING, emptyCallback);
|
||
impl.setEventListener(EventType.ERROR, emptyCallback);
|
||
}
|
||
},
|
||
|
||
onDestroy () {
|
||
if (this._impl) {
|
||
this._impl.destroy();
|
||
this._impl = null;
|
||
}
|
||
},
|
||
|
||
update (dt) {
|
||
if (this._impl) {
|
||
this._impl.updateMatrix(this.node);
|
||
}
|
||
},
|
||
|
||
_onWebViewLoaded () {
|
||
cc.Component.EventHandler.emitEvents(this.webviewEvents, this, EventType.LOADED);
|
||
this.node.emit('loaded', this);
|
||
},
|
||
|
||
_onWebViewLoading () {
|
||
cc.Component.EventHandler.emitEvents(this.webviewEvents, this, EventType.LOADING);
|
||
this.node.emit('loading', this);
|
||
return true;
|
||
},
|
||
|
||
_onWebViewLoadError () {
|
||
cc.Component.EventHandler.emitEvents(this.webviewEvents, this, EventType.ERROR);
|
||
this.node.emit('error', this);
|
||
},
|
||
|
||
/**
|
||
* !#en
|
||
* Set javascript interface scheme (see also setOnJSCallback). <br/>
|
||
* Note: Supports only on the Android and iOS. For HTML5, please refer to the official documentation.<br/>
|
||
* Please refer to the official documentation for more details.
|
||
* !#zh
|
||
* 设置 JavaScript 接口方案(与 'setOnJSCallback' 配套使用)。<br/>
|
||
* 注意:只支持 Android 和 iOS ,Web 端用法请前往官方文档查看。<br/>
|
||
* 详情请参阅官方文档
|
||
* @method setJavascriptInterfaceScheme
|
||
* @param {String} scheme
|
||
*/
|
||
setJavascriptInterfaceScheme (scheme) {
|
||
if (this._impl) {
|
||
this._impl.setJavascriptInterfaceScheme(scheme);
|
||
}
|
||
},
|
||
|
||
/**
|
||
* !#en
|
||
* This callback called when load URL that start with javascript
|
||
* interface scheme (see also setJavascriptInterfaceScheme). <br/>
|
||
* Note: Supports only on the Android and iOS. For HTML5, please refer to the official documentation.<br/>
|
||
* Please refer to the official documentation for more details.
|
||
* !#zh
|
||
* 当加载 URL 以 JavaScript 接口方案开始时调用这个回调函数。<br/>
|
||
* 注意:只支持 Android 和 iOS,Web 端用法请前往官方文档查看。
|
||
* 详情请参阅官方文档
|
||
* @method setOnJSCallback
|
||
* @param {Function} callback
|
||
*/
|
||
setOnJSCallback (callback) {
|
||
if (this._impl) {
|
||
this._impl.setOnJSCallback(callback);
|
||
}
|
||
},
|
||
|
||
/**
|
||
* !#en
|
||
* Evaluates JavaScript in the context of the currently displayed page. <br/>
|
||
* Please refer to the official document for more details <br/>
|
||
* Note: Cross domain issues need to be resolved by yourself <br/>
|
||
* !#zh
|
||
* 执行 WebView 内部页面脚本(详情请参阅官方文档) <br/>
|
||
* 注意:需要自行解决跨域问题
|
||
* @method evaluateJS
|
||
* @param {String} str
|
||
*/
|
||
evaluateJS (str) {
|
||
if (this._impl) {
|
||
this._impl.evaluateJS(str);
|
||
}
|
||
},
|
||
|
||
});
|
||
|
||
cc.WebView = module.exports = WebView;
|
||
/**
|
||
* !#en
|
||
* Note: This event is emitted from the node to which the component belongs.
|
||
* !#zh
|
||
* 注意:此事件是从该组件所属的 Node 上面派发出来的,需要用 node.on 来监听。
|
||
* @event loaded
|
||
* @param {Event.EventCustom} event
|
||
* @param {WebView} webView - The WebView component.
|
||
*/
|
||
|
||
/**
|
||
* !#en
|
||
* Note: This event is emitted from the node to which the component belongs.
|
||
* !#zh
|
||
* 注意:此事件是从该组件所属的 Node 上面派发出来的,需要用 node.on 来监听。
|
||
* @event loading
|
||
* @param {Event.EventCustom} event
|
||
* @param {WebView} webView - The WebView component.
|
||
*/
|
||
|
||
/**
|
||
* !#en
|
||
* Note: This event is emitted from the node to which the component belongs.
|
||
* !#zh
|
||
* 注意:此事件是从该组件所属的 Node 上面派发出来的,需要用 node.on 来监听。
|
||
* @event error
|
||
* @param {Event.EventCustom} event
|
||
* @param {WebView} webView - The WebView component.
|
||
*/
|
||
|
||
/**
|
||
* !#en if you don't need the WebView and it isn't in any running Scene, you should
|
||
* call the destroy method on this component or the associated node explicitly.
|
||
* Otherwise, the created DOM element won't be removed from web page.
|
||
* !#zh
|
||
* 如果你不再使用 WebView,并且组件未添加到场景中,那么你必须手动对组件或所在节点调用 destroy。
|
||
* 这样才能移除网页上的 DOM 节点,避免 Web 平台内存泄露。
|
||
* @example
|
||
* webview.node.parent = null; // or webview.node.removeFromParent(false);
|
||
* // when you don't need webview anymore
|
||
* webview.node.destroy();
|
||
* @method destroy
|
||
* @return {Boolean} whether it is the first time the destroy being called
|
||
*/
|