@dynamix-layout/core 0.0.2-beta.0 → 0.0.5

package/src/app/index.ts

@@ -1,291 +0,0 @@
-import { ILayout, Type, LayoutTree, AreaValue } from "../types";
-import { Node, Bond, Helper } from "../lib";
-
-
-export type LayoutOptions = {
-	layout?: LayoutTree,
-	range?: number,
-	dimension?: [number, number],
-	tabs?: string[],
-}
-
-export type Settings = {
-	layout: LayoutTree,
-	range: number,
-	dimension: [number, number],
-	coordinate: [number, number],
-	tabs: string[],
-}
-
-export default class Layout implements ILayout<Node, Bond> {
-	_root: Node;
-	_tabs: Node[];
-	_bond: Bond[];
-	_settings: Settings;
-	constructor(
-		options: LayoutOptions = {}
-	) {
-
-		let setting = Object.assign({
-			layout: null,
-			range: 1,
-			dimension: [0, 0],
-			coordinate: [0, 0],
-			tabs: Array.from({ length: options.range ?? 1 }, (_, i) => `tab-${i + 1}`),
-		}, options);
-
-		this._tabs = [];
-		this._bond = [];
-		this._settings = setting;
-		this._root = new Node(Type.Row, 100, null);
-
-		this._root.coordinate = this._settings.coordinate;
-		this._root.dimension = this._settings.dimension;
-		this.createTree();
-	}
-
-	public shiftTree = (srcId: string, desId: string, area: AreaValue) => {
-
-		let des: any;
-		let src: any;
-
-		this._tabs.forEach((tab: Node) => {
-			if (tab.name == desId) des = tab;
-			if (tab.name == srcId) src = tab;
-			tab.children.forEach((child: Node) => {
-				if (child.name == desId) des = child;
-				if (child.name == srcId) src = child;
-			});
-		});
-
-		if (src === undefined || src === null) return;
-		if (des === undefined || des === null) return;
-
-		if (src.parent === null) return;
-
-		const length = src.parent.children.length;
-
-		if (des.type == Type.Tabset && src.type == Type.Tab) {
-			Helper.detach(src, length > 1);
-			Helper.attach(des, src, area);
-
-		} else if (des.type == Type.Tabset && src.type == Type.Tabset) {
-			Helper.detach(src, length > 2);
-			Helper.attach(des, src, area);
-		}
-
-		return this.calculate(this._root, 0);
-	}
-
-	private createTree = () => {
-		const { layout } = this._settings;
-
-		if (!layout) {
-			Helper.createBinaryTree(this._root, this._settings);
-			console.log("create tree",JSON.stringify(this.jsonify()));
-			
-			return this.updateTree();
-		}
-
-		const queue: LayoutTree[] = [layout];
-		const _queue: Node[] = [this._root];
-
-		const levels: LayoutTree[][] = [];
-		let toggle = 1;
-
-		while (queue.length) {
-			const level: LayoutTree[] = [];
-			const range = queue.length;
-
-			for (let i = 0; i < range; i++) {
-
-				const parent = queue.shift();
-				const _parent = _queue.shift();
-
-				if (parent) {
-					level.push(parent);
-					parent.children.forEach((child: LayoutTree, index: number) => {
-						queue.push(child);
-						_queue.push(
-							new Node(child.type, child.weight, _parent ?? null)
-						);
-
-						_parent?.children.push(_queue[_queue.length - 1]);
-
-						if (index == 0) return;
-
-						new Bond(
-							child.type,
-							_queue[_queue.length - 2],
-							_queue[_queue.length - 1],
-						);
-					});
-				}
-			}
-
-			levels.push(level);
-			toggle = 1 - toggle;
-		}
-
-		this.updateTree();
-		return this;
-	}
-
-	public updateTree = (width?: number, height?: number, hook?: Function) => {
-
-		if (width && height) {
-			this._root.dimension = [width, height];
-		}
-
-		const queue: Node[] = [this._root];
-
-		const levels: any[][] = [];
-		let toggle = 1;
-
-		this._bond = [];
-		this._tabs = [];
-
-		while (queue.length) {
-			const level: any[] = [];
-			const range = queue.length;
-
-			for (let i = 0; i < range; i++) {
-
-				const parent = queue.shift() as Node;
-
-				const size = Helper.getSize(parent);
-				const weight = Helper.getTotalWeight(parent);
-
-				let percent = 0;
-				let sum = 0;
-				let prev = parent.children[0];
-				const dimension = parent.dimension
-				const coordinate = parent.coordinate
-
-				if (parent) {
-					level.push(parent.coordinate);
-					if (parent.type == Type.Tabset) {
-						this._tabs.push(parent);
-					}
-
-					parent.children.forEach((child: Node, index: number) => {
-						queue.push(child);
-						child.dimension = [...dimension];
-						child.coordinate = [...coordinate];
-
-						child.weight = (child.weight / weight) * 100;
-						if (index === parent.children.length - 1) {
-							child.dimension[parent.type] = size - sum;
-							child.weight = 100 - percent;
-						} else {
-							child.weight = (child.weight / weight) * 100;
-							const dmn = size * (child.weight / 100);
-							child.dimension[parent.type] = dmn;
-							percent += child.weight;
-							sum += child.dimension[parent.type];
-						}
-
-						child.dimension[parent.type] = child.dimension[parent.type];
-
-						if (!child.prev) return;
-						child.coordinate[parent.type] =
-							prev.coordinate[parent.type] +
-							prev.dimension[parent.type] + 8;
-
-						child.prev.dimension = [...dimension];
-						child.prev.coordinate = [...coordinate];
-						child.prev.dimension[parent.type] = 8;
-
-						child.prev.coordinate[parent.type] =
-							prev.coordinate[parent.type] +
-							prev.dimension[parent.type];
-
-						child.prev.type = 1 - parent.type;
-						prev = child;
-						this._bond.push(child.prev);
-					});
-				}
-			}
-
-			levels.push(level);
-			toggle = 1 - toggle;
-		}
-
-		if (hook) hook();
-
-		return this.getElements();
-
-	}
-
-	calculate(node: Node, level = 0) {
-
-		if (level == 0) {
-			this._bond = [];
-			this._tabs = [];
-		}
-
-		const reducedSize = Helper.getSize(node);
-		const totalWeight = Helper.getTotalWeight(node);
-
-		let prev = node.children[0];
-		let sum = 0;
-		let prcnt = 0;
-
-		if (node.type == Type.Tabset) {
-			this._tabs.push(node);
-		}
-
-		node.children.forEach((child, index) => {
-
-			child.dimension = [...node.dimension];
-			child.coordinate = [...node.coordinate];
-
-			if (index === node.children.length - 1) {
-				child.dimension[node.type] = reducedSize - sum;
-				child.weight = 100 - prcnt;
-			} else {
-				child.weight = (child.weight / totalWeight) * 100;
-				child.dimension[node.type] = reducedSize * (child.weight / 100);
-				prcnt += child.weight;
-				sum += child.dimension[node.type];
-			}
-
-			if (index === 0) return;
-
-			child.coordinate[node.type] = prev.coordinate[node.type] + prev.dimension[node.type] + 8;
-
-			if (child.prev) {
-
-				child.prev.dimension = [...node.dimension];
-				child.prev.coordinate = [...node.coordinate];
-				child.prev.dimension[node.type] = 8;
-				child.prev.coordinate[node.type] = prev.coordinate[node.type] + prev.dimension[node.type];
-
-				this._bond.push(child.prev);
-			}
-
-			prev = child;
-		});
-
-		if (node.type == Type.Tabset) {
-			this._tabs.push(node);
-		}
-		node.children.forEach((child) => {
-			if (child.children.length) {
-				this.calculate(child, level + 1);
-			}
-		});
-
-	}
-
-	public getElements = () => {
-		return {
-			tabs: this._tabs.map((tab: Node) => Helper.json(tab)),
-			bonds: this._bond.map((bond: Bond) => Helper.json(bond))
-		};
-	}
-
-	public jsonify = () => {
-		return Helper.json(this._root)
-	}
-}

package/src/index.ts

@@ -1,3 +0,0 @@
-import Layout from './app'
-
-export default Layout

package/src/lib/Constant.ts

@@ -1,17 +0,0 @@
-import { Type } from '../types';
-
-export const AreaType = {
-	top: Type.Row,
-	left: Type.Column,
-	right: Type.Column,
-	bottom: Type.Row,
-	cover: Type.Tab
-}
-
-export const AreaIndex = {
-	top: 0,
-	left: 0,
-	right: 1,
-	bottom: 1,
-	cover : 0
-}

package/src/lib/Element.ts

@@ -1,66 +0,0 @@
-import {
-	INode,
-	IBond,
-	TypeValue,
-} from '../types';
-
-export class Node implements INode<Node,Bond> {
-	type: TypeValue;
-	name: string | null;
-	weight: number;
-
-	parent: Node | null;
-	children: Node[];
-	
-	dimension: [number,number];
-	coordinate: [number,number];
-
-	prev: Bond | null;
-	next: Bond | null;
-	constructor(
-		type: TypeValue,
-
-		weight: number,
-		parent: Node | null
-	) {
-		this.type = type;
-		this.name = null;
-		this.parent = parent;
-		this.weight = weight;
-		
-		this.children = [];
-		this.dimension = [0,0];
-		this.coordinate = [0,0];
-		this.prev = null;
-		this.next = null;
-	}
-}
-
-export class Bond implements IBond<Node> {
-	type: TypeValue;
-	name: string | null;
-
-	prev: Node;
-	next: Node;
-
-	dimension: [number,number];
-	coordinate: [number,number];
-
-	constructor(
-		type: TypeValue,
-
-		prev: Node,
-		next: Node,
-	) {
-		this.type = type;
-		this.prev = prev;
-		this.next = next;
-		this.name = `${prev.name}-${next.name}`;
-		this.dimension = [0,0];
-		this.coordinate = [0,0];
-
-		prev.next = this;
-		next.prev = this;
-	}
-}
-

package/src/lib/Helper.ts

@@ -1,259 +0,0 @@
-import { IMethods, Type, AreaValue, TypeValue } from "../types"
-import { Node, Bond } from "./Element";
-import { AreaIndex, AreaType } from "./Constant";
-import { Settings } from "../app";
-export class Helper implements IMethods {
-
-	static createBinaryTree = (root: Node, settings: Settings) => {
-		const { range } = settings;
-		const tabs = [...settings.tabs]
-		if (range == 1) {
-
-			const col = new Node(Type.Column, 100, root)
-			root.children = [col];
-			Helper.addTab(col, tabs);
-			return;
-		};
-
-		const queue: Node[] = [root];
-
-		const levels: Node[][] = [];
-
-		let toggle = 1;
-		let count = 1;
-
-		while (count < (range as number) || queue.length) {
-			const level: Node[] = [];
-			const length = queue.length;
-
-			for (let i = 0; i < length; i++) {
-
-				const parent = queue.shift() as Node;
-				const pIndex = parent.parent?.children.indexOf(parent) ?? 0;
-				parent.name = `r${levels.length}/c${i}/tb${pIndex}`;
-
-				if (parent) {
-					level.push(parent);
-
-					if (count < (range as number)) {
-						parent.children[0] = new Node(toggle, 50, parent);
-						queue.push(parent.children[0]);
-					}
-
-					if (count < (range as number)) {
-						parent.children[1] = new Node(toggle, 50, parent);
-						queue.push(parent.children[1]);
-
-						count++;
-
-						const bond = new Bond(
-							toggle,
-							parent.children[0],
-							parent.children[1]
-						);
-
-						bond.name = `r${levels.length}/c${i}/b${pIndex}-${pIndex + 1}`;
-					}
-				}
-			}
-
-			levels.push(level);
-			toggle = 1 - toggle;
-		}
-
-		const last = [
-			...levels[levels.length - 1],
-			...levels[levels.length - 2]
-		]
-
-		last.forEach((child: Node) => {
-			Helper.addTab(child, tabs)
-		})
-
-		return;
-	}
-
-	static fixSrc = (src: Node) => {
-		const parent = src.parent;
-		if (!parent) return;
-		const index = parent.children.indexOf(src);
-		const peer = parent.children[1 - index];
-		const grand = parent.parent;
-		const pIndex = grand?.children.indexOf(parent) as number;
-
-		switch (peer.type) {
-			case Type.Tabset:
-				const weight = parent.weight;
-				grand?.children.splice(pIndex, 1);
-				grand?.children.splice(pIndex, 0, peer);
-				peer.weight = weight;
-				peer.parent = grand;
-				Helper.fixBond(peer, peer.type);
-
-				break;
-			default:
-
-				if (!grand) {
-					parent.children.splice(index, 1);
-					break;
-				}
-				const count = peer.children.length;
-				const affacted = (8 * (count - 1)) * 100 / grand.dimension[peer.type];
-
-				peer.children.forEach((child: Node) => {
-					child.weight = ((parent.weight - affacted) * child.weight) / 100;
-				});
-
-				const first = peer.children[0];
-				const last = peer.children[count - 1];
-
-				grand.children = [
-					...grand.children.slice(0, pIndex),
-					...peer.children,
-					...grand.children.slice(pIndex + 1)
-				]
-
-				peer.children.forEach((child: Node) => {
-					child.parent = grand;
-				})
-
-				Helper.fixBond(first, peer.type);
-				Helper.fixBond(last, peer.type);
-				break;
-		}
-	}
-
-	static detach(src: Node, flag: Boolean) {
-		const parent = src.parent;
-		if (!parent) return;
-
-		const index = src.parent?.children.indexOf(src) as number;
-		const range = parent?.children.length as number;
-		const affacted = 8 * 100 / parent.dimension[parent.type];
-		if (!flag) return Helper.fixSrc(src);
-
-
-
-		if (index > 0 && index < range - 1) {
-			const weight = (src.weight + affacted) / 2;
-			const next = parent.children[index + 1];
-			const prev = parent.children[index - 1];
-			next.weight += weight;
-			prev.weight += weight;
-			new Bond(src.type, prev, next);
-		}
-
-		if (index === range - 1) {
-			const prev = parent.children[index - 1];
-			prev.weight += src.weight + affacted;
-			prev.next = null;
-		}
-
-		if (index === 0) {
-			const next = parent.children[index + 1];
-			next.weight += src.weight + affacted;
-			next.prev = null;
-		}
-
-		parent.children.splice(index, 1);
-	}
-
-	static attach(des: Node, src: Node, area: AreaValue) {
-		const parent = des.parent;
-		if (!parent) return;
-		const index = parent.children.indexOf(des) as number;
-
-		switch (AreaType[area]) {
-			case 1 - parent.type:
-				const insert = index + AreaIndex[area];
-				const affacted = 8 * 100 / parent.dimension[parent.type];
-				src.weight = des.weight = (des.weight - affacted) / 2;
-				src.parent = parent;
-				parent.children.splice(insert, 0, src);
-				Helper.fixBond(src, parent.type);
-				break;
-
-			case parent.type:
-
-				const weight = des.weight / 2;
-				const children = AreaIndex[area] == 0 ? [src, des] : [des, src];
-				const rowcol = new Node(1 - parent.type, des.weight, parent);
-				rowcol.children = children;
-				parent.children[index] = rowcol;
-
-				children.forEach((child: Node) => {
-					child.weight = weight;
-					child.parent = rowcol;
-				})
-
-				this.fixBond(rowcol, parent.type);
-				this.fixBond(src, parent.type);
-				this.fixBond(des, parent.type);
-				break;
-
-			case Type.Tab:
-				des.children.push(...src.children);
-				src.children.forEach((child: Node) => {
-					child.parent = des;
-				})
-				break;
-
-		}
-	}
-
-	static fixBond = (node: Node, type: TypeValue) => {
-		const parent = node.parent;
-		if (!parent) return;
-		const index = parent.children.indexOf(node) as number;
-		const range = parent.children.length;
-
-		if (index > 0 && index < range - 1) {
-			new Bond(type, parent.children[index - 1], parent.children[index]);
-			new Bond(type, parent.children[index], parent.children[index + 1]);
-		}
-
-		if (index === range - 1) {
-			new Bond(type, parent.children[index - 1], parent.children[index]);
-			parent.children[index].next = null;
-		}
-
-		if (index === 0) {
-			new Bond(type, parent.children[index], parent.children[index + 1]);
-			parent.children[index].prev = null;
-		}
-	}
-
-	static getTotalWeight(node: Node): number {
-		return node.children.reduce((acc, cur) => acc + (cur.weight), 0) ?? 100;
-	}
-
-	static getTotalNodes(node: Node): number {
-
-		return node.children.length;
-	}
-
-	static getSize(node: Node): number {
-		return node.dimension[node.type] - ((this.getTotalNodes(node) - 1) * 8);
-	}
-
-	static addTab = (child: Node, names: string[]) => {
-		if (child.children.length !== 0) return;
-		child.type = Type.Tabset;
-		const tab = new Node(Type.Tab, 100, child);
-		const name = names.shift() as string;
-		tab.name = name;
-		child.children = [tab];
-		return;
-	}
-
-	static json = (node: any) => {
-		return {
-			type: node.type,
-			dimension: node.dimension,
-			coordinate: node.coordinate,
-			name: node.name,
-			children: node.children?.map((child: any) => Helper.json(child))
-		}
-	}
-}
-

package/src/lib/Method.ts

@@ -1,12 +0,0 @@
-export function emitEvent (type:string, detail = {}, elem = document as Document) {
-
-	if (!type) return;
-
-	let event = new CustomEvent(type, {
-		bubbles: true,
-		cancelable: true,
-		detail: detail
-	});
-
-	return elem.dispatchEvent(event);
-}

package/src/lib/index.ts

@@ -1,4 +0,0 @@
-export * from './Element';
-export * from './Helper';
-export * from './Constant';
-export * from './Method';