h5:add popover implementation

This commit is contained in:
pengfei.zhou 2019-12-26 19:01:28 +08:00 committed by osborn
parent b9a3d94cb5
commit 9101c8cd88
8 changed files with 177 additions and 14 deletions

View File

@ -3664,14 +3664,30 @@ return __module.exports;
constructor(context) {
this.context = context;
}
onTearDown() {
}
}
class ShaderPlugin extends DoricPlugin {
render(ret) {
var _a;
if (((_a = this.context.rootNode.viewId) === null || _a === void 0 ? void 0 : _a.length) > 0) {
if (this.context.rootNode.viewId === ret.id) {
this.context.rootNode.blend(ret.props);
}
else {
const viewNode = this.context.headNodes.get(ret.id);
if (viewNode) {
viewNode.blend(ret.props);
}
}
}
else {
this.context.rootNode.viewId = ret.id;
this.context.rootNode.blend(ret.props);
}
}
}
var LayoutSpec;
(function (LayoutSpec) {
@ -3736,10 +3752,12 @@ return __module.exports;
this.context = context;
}
init(superNode) {
if (superNode) {
this.superNode = superNode;
if (this instanceof DoricSuperViewNode) {
this.reusable = superNode.reusable;
}
}
this.view = this.build();
this.view.style.overflow = "hidden";
}
@ -3861,8 +3879,9 @@ return __module.exports;
this.offsetY = prop;
break;
case 'onClick':
this.view.onclick = () => {
this.view.onclick = (event) => {
this.callJSResponse(prop);
event.stopPropagation();
};
break;
case 'corners':
@ -4566,6 +4585,61 @@ return __module.exports;
}
}
class PopoverPlugin extends DoricPlugin {
constructor(context) {
super(context);
this.fullScreen = document.createElement('div');
this.fullScreen.id = `PopOver__${context.contextId}`;
this.fullScreen.style.position = 'fixed';
this.fullScreen.style.top = '0px';
this.fullScreen.style.width = "100%";
this.fullScreen.style.height = "100%";
}
show(model) {
const viewNode = DoricViewNode.create(this.context, model.type);
if (viewNode === undefined) {
return Promise.reject(`Cannot create ViewNode for ${model.type}`);
}
viewNode.viewId = model.id;
viewNode.init();
viewNode.blend(model.props);
this.fullScreen.appendChild(viewNode.view);
this.context.headNodes.set(model.id, viewNode);
if (!document.body.contains(this.fullScreen)) {
document.body.appendChild(this.fullScreen);
}
return Promise.resolve();
}
dismiss(args) {
if (args) {
const viewNode = this.context.headNodes.get(args.id);
if (viewNode) {
this.fullScreen.removeChild(viewNode.view);
}
if (this.context.headNodes.size === 0) {
document.body.removeChild(this.fullScreen);
}
}
else {
this.dismissAll();
}
return Promise.resolve();
}
dismissAll() {
for (let node of this.context.headNodes.values()) {
this.context.headNodes.delete(node.viewId);
this.fullScreen.removeChild(node.view);
}
if (document.body.contains(this.fullScreen)) {
document.body.removeChild(this.fullScreen);
}
}
onTearDown() {
super.onTearDown();
this.dismissAll();
}
}
const bundles = new Map;
const plugins = new Map;
const nodes = new Map;
@ -4588,6 +4662,7 @@ return __module.exports;
registerPlugin('modal', ModalPlugin);
registerPlugin('storage', StoragePlugin);
registerPlugin('navigator', NavigatorPlugin);
registerPlugin('popover', PopoverPlugin);
registerViewNode('Stack', DoricStackNode);
registerViewNode('VLayout', DoricVLayoutNode);
registerViewNode('HLayout', DoricHLayoutNode);
@ -4740,6 +4815,7 @@ ${content}
constructor(content) {
this.contextId = getContextId();
this.pluginInstances = new Map;
this.headNodes = new Map;
createContext(this.contextId, content);
doricContexts.set(this.contextId, this);
this.rootNode = new DoricStackNode(this);
@ -4759,6 +4835,9 @@ ${content}
this.invokeEntityMethod("__init__", frame, extra ? JSON.stringify(extra) : undefined);
}
teardown() {
for (let plugin of this.pluginInstances.values()) {
plugin.onTearDown();
}
destroyContext(this.contextId);
}
}

File diff suppressed because one or more lines are too long

View File

@ -3,6 +3,7 @@ import { Panel } from 'doric'
import { DoricPlugin } from "./DoricPlugin"
import { createContext, destroyContext } from "./DoricDriver"
import { DoricStackNode } from './shader/DoricStackNode'
import { DoricViewNode } from './shader/DoricViewNode'
const doricContexts: Map<string, DoricContext> = new Map
let __contextId__ = 0
@ -18,6 +19,8 @@ export class DoricContext {
contextId = getContextId()
pluginInstances: Map<string, DoricPlugin> = new Map
rootNode: DoricStackNode
headNodes: Map<string, DoricViewNode> = new Map
constructor(content: string) {
createContext(this.contextId, content)
doricContexts.set(this.contextId, this)
@ -44,6 +47,9 @@ export class DoricContext {
}
teardown() {
for (let plugin of this.pluginInstances.values()) {
plugin.onTearDown()
}
destroyContext(this.contextId)
}
}

View File

@ -6,4 +6,7 @@ export class DoricPlugin {
constructor(context: DoricContext) {
this.context = context
}
onTearDown() {
}
}

View File

@ -10,6 +10,7 @@ import { DoricScrollerNode } from "./shader/DoricScrollerNode"
import { ModalPlugin } from './plugins/ModalPlugin'
import { StoragePlugin } from "./plugins/StoragePlugin"
import { NavigatorPlugin } from "./navigate/NavigatorPlugin"
import { PopoverPlugin } from './plugins/PopoverPlugin'
const bundles: Map<string, string> = new Map
@ -48,6 +49,7 @@ registerPlugin('shader', ShaderPlugin)
registerPlugin('modal', ModalPlugin)
registerPlugin('storage', StoragePlugin)
registerPlugin('navigator', NavigatorPlugin)
registerPlugin('popover', PopoverPlugin)
registerViewNode('Stack', DoricStackNode)
registerViewNode('VLayout', DoricVLayoutNode)

View File

@ -0,0 +1,59 @@
import { DoricPlugin } from '../DoricPlugin'
import { DVModel, DoricViewNode } from '../shader/DoricViewNode';
import { DoricContext } from '../DoricContext';
export class PopoverPlugin extends DoricPlugin {
fullScreen = document.createElement('div')
constructor(context: DoricContext) {
super(context)
this.fullScreen.id = `PopOver__${context.contextId}`
this.fullScreen.style.position = 'fixed'
this.fullScreen.style.top = '0px'
this.fullScreen.style.width = "100%"
this.fullScreen.style.height = "100%"
}
show(model: DVModel) {
const viewNode = DoricViewNode.create(this.context, model.type)
if (viewNode === undefined) {
return Promise.reject(`Cannot create ViewNode for ${model.type}`)
}
viewNode.viewId = model.id
viewNode.init()
viewNode.blend(model.props)
this.fullScreen.appendChild(viewNode.view)
this.context.headNodes.set(model.id, viewNode)
if (!document.body.contains(this.fullScreen)) {
document.body.appendChild(this.fullScreen)
}
return Promise.resolve()
}
dismiss(args?: { id: string }) {
if (args) {
const viewNode = this.context.headNodes.get(args.id)
if (viewNode) {
this.fullScreen.removeChild(viewNode.view)
}
if (this.context.headNodes.size === 0) {
document.body.removeChild(this.fullScreen)
}
} else {
this.dismissAll()
}
return Promise.resolve()
}
dismissAll() {
for (let node of this.context.headNodes.values()) {
this.context.headNodes.delete(node.viewId)
this.fullScreen.removeChild(node.view)
}
if (document.body.contains(this.fullScreen)) {
document.body.removeChild(this.fullScreen)
}
}
onTearDown() {
super.onTearDown()
this.dismissAll()
}
}

View File

@ -3,7 +3,18 @@ import { DVModel } from "../shader/DoricViewNode";
export class ShaderPlugin extends DoricPlugin {
render(ret: DVModel) {
if (this.context.rootNode.viewId?.length > 0) {
if (this.context.rootNode.viewId === ret.id) {
this.context.rootNode.blend(ret.props)
} else {
const viewNode = this.context.headNodes.get(ret.id)
if (viewNode) {
viewNode.blend(ret.props)
}
}
} else {
this.context.rootNode.viewId = ret.id
this.context.rootNode.blend(ret.props)
}
}
}

View File

@ -104,11 +104,13 @@ export abstract class DoricViewNode {
this.context = context
}
init(superNode: DoricSuperViewNode) {
init(superNode?: DoricSuperViewNode) {
if (superNode) {
this.superNode = superNode
if (this instanceof DoricSuperViewNode) {
this.reusable = superNode.reusable
}
}
this.view = this.build()
this.view.style.overflow = "hidden"
}
@ -247,8 +249,9 @@ export abstract class DoricViewNode {
this.offsetY = prop as number
break
case 'onClick':
this.view.onclick = () => {
this.view.onclick = (event: Event) => {
this.callJSResponse(prop as string)
event.stopPropagation()
}
break
case 'corners':