mascot-vis 3.0.0 → 3.0.1

package/src-new-ts/depgraph/DepGraph.js

@@ -1,178 +0,0 @@
-import Dataflow, { OpType } from "./operator/Dataflow.js";
-import BoundsVar from "./variable/BoundsVar.js";
-import DataScopeVar from "./variable/DataScopeVar.js";
-import Variable, { VarType } from "../depgraph/variable/Variable.js";
-import Edge from "./Edge.js";
-import ChannelVar from "./variable/ChannelVar.js";
-import FieldVar from "./variable/FieldVar.js";
-import DomainVar from "./variable/DomainVar.js";
-import DomainBuilder from "./operator/DomainBuilder.js";
-import BoundsEvaluator from "./operator/BoundsEvaluator.js";
-
-export default class DependencyGraph {
-
-    constructor() {
-        this._variables = {};
-        this._operators = {};
-        this._edges = [];
-    }
-
-    getVariable(type, ...params) {
-        if (Object.values(VarType).indexOf(type) < 0)
-            throw new Error('Variable Type Not Known');
-        let v = this.findVariable(type, params);
-        if (v) return v;
-        switch (type) {
-            case VarType.CHANNEL:
-                v = new ChannelVar(type, params[0], params[1]);
-                break;
-            case VarType.FIELD:
-                v = new FieldVar(type, params[0], params[1]);
-                break;
-            case VarType.DOMAIN:
-                v = new DomainVar(type, params[0]);
-                break;
-            case VarType.DATASCOPE:
-                v = new DataScopeVar(type, params[0]);
-                break;
-            case VarType.BOUNDS:
-                v = new BoundsVar(type, params[0]);
-                break;
-            default:
-                break;
-        }
-        if (!(type in this._variables))
-            this._variables[type] = {}
-        this._variables[type][v.id] = v;
-        return v;
-    }
-
-    // createDataflowOperator(type, input, output) {
-    //     if (Object.values(OpType).indexOf(type) < 0)
-    //         throw new Error('Operator Type Not Known');
-    //     let op = new Dataflow(type, input, output);
-    //     if (!(type in this._operators))
-    //         this._operators[type] = {}
-    //     this._operators[type][op.id] = op;
-    //     return op;
-    // }
-
-    createDataflowOperator(type, ...params) {
-        if (Object.values(OpType).indexOf(type) < 0)
-            throw new Error('Operator Type Not Known');
-        let op;
-        switch (type) {
-            case OpType.EVAL_BBOX:
-                op = new BoundsEvaluator(type);
-                break;
-            case OpType.BUILD_DOMAIN:
-                op = new DomainBuilder(type, params[0]);
-                break;
-        }
-        if (!(type in this._operators))
-            this._operators[type] = {}
-        this._operators[type][op.id] = op;
-        return op;
-    }
-
-    connect(fromNode, toNode, isDirected = true){
-        if (fromNode instanceof Variable && toNode instanceof Dataflow) {
-            const edge = new Edge(fromNode, toNode, isDirected);
-            this._edges.push(edge);
-            fromNode.outgoingEdges.push(edge);
-            toNode.inputVars.push(fromNode);
-        } else if (fromNode instanceof Dataflow && toNode instanceof Variable) {
-            const edge = new Edge(fromNode, toNode, isDirected);
-            this._edges.push(edge);
-            fromNode.outputVar = toNode;
-            toNode.incomingEdges.push(edge);
-        } else {
-            throw new Error("An edge must connect a variable and an operator.");
-        }
-    }
-
-    // createOperator(type, ...params) {
-    //     if (Object.values(OpType).indexOf(type) < 0)
-    //         throw new Error('Operator Type Not Known');
-    //     let op;
-    //     switch(type) {
-    //         case OpType.ENCODER:
-    //             if ((params[0] == "x" || params[0] == "y") && isMark(params[1]))
-    //                 op = new MarkPosEncoder(params[0], params[1]);
-    //             break;
-    //         case OpType.LAYOUT:
-    //             break;
-    //         case OpType.CONSTRAINT:
-    //             break;
-    //         default:
-    //             break;
-    //     }
-    //     if (!(type in this._operators))
-    //         this._operators[type] = {}
-    //     this._operators[type][op.id] = op;
-    //     return op;
-    // }
-
-    /**
-     * 
-     * @param {object} def: 
-     */
-    addInteraction(def) {
-
-    }
-
-    processChange(varType, ...params) {
-        // if (Object.values(VarType).indexOf(varType) < 0)
-        //     throw new Error('Unknown Variable Type: ' + varType);
-        let v = this.findVariable(varType, params);
-        if (!v)
-            throw new Error('Unable to find variables matching the described change');
-        for (let e of v.outgoingEdges) {
-            if (e.isDirected) {
-                let dfOp = e.toNode;
-                dfOp.run();
-            }
-        }
-    }
-
-
-    findVariable(varType, params) {
-        if (!(varType in this._variables))
-            return null;
-        let vars = Object.values(this._variables[varType]);
-        switch (varType) {
-            case VarType.CHANNEL:
-                return vars.find(d => d.channel == params[0] && d.element.classId == params[1].classId);
-            case VarType.FIELD:
-                return vars.find(d => d.field == params[0] && d.dataset == params[1]);
-            case VarType.SCALE:
-                return vars.find(d => d.scale == params[0]);
-            case VarType.DATASCOPE:
-            default:
-                return vars.find(d => d.element.classId == params[0].classId);
-        }
-    }
-
-    // addEdges(...stp) {
-    //     for (let p of stp) {
-    //         this.addEdge(p[0], p[1]);
-    //     }
-    // }
-
-    // addEdge(source, target) {
-    //     // let e = new Edge(source, target);
-    //     // this._edges.push(e);
-    //     // if (!(source.id in this._outgoing))
-    //     //     this._outgoing[source.id] = [];
-    //     // this._outgoing[source.id].push(target.id);
-
-    //     // if (!(target.id in this._incoming))
-    //     //     this._incoming[target.id] = [];
-    //     // this._incoming[target.id].push(source.id);
-    //     if (source instanceof Variable && target instanceof Dataflow) {
-    //         source.targetDf = target;
-    //     } else if (source instanceof Dataflow && target instanceof Variable) {
-
-    //     }
-    // }
-}

package/src-new-ts/depgraph/Edge.js

@@ -1,9 +0,0 @@
-export default class Edge {
-
-    constructor(fromNode, toNode, isDirected = true) {
-        this.fromNode = fromNode;
-        this.toNode = toNode;
-        this.isDirected = isDirected;
-    }
-
-}

package/src-new-ts/depgraph/SceneGraph2DepGraph.js

@@ -1,110 +0,0 @@
-import { OpType } from "./operator/Dataflow.js";
-import { VarType } from "./variable/Variable.js";
-import DependencyGraph from "./DepGraph.js";
-
-export default function constructDepGraph(scn) {
-    
-    let g = new DependencyGraph();
-    
-    for (let enc of scn.encodings) {
-        parseEncoding(enc, g);
-    }
-
-    //more to handle later: layouts and constraints
-
-    console.log("variables", g._variables);
-    console.log("operators", g._operators);
-
-    return g;
-}
-
-/**
-     * this method takes an encoding definition enc as input (take a look at src/core/Encoding.js), 
-     * and adds the necessary nodes and edges to the graph. 
-     */
-function parseEncoding(enc, g) {
-
-    switch (enc.channel) {
-        case "width":
-        case "height":
-        case "radius":
-        case "outerRadius":
-        case "innerRadius":
-        case "area":
-        case "fontSize":
-        case "strokeWidth":
-        case "x": {
-            const item = enc.anyItem;
-            const datascope = g._createVariable(VarType.DATASCOPE, item);
-            //new Variable(VarType.DATASCOPE, this, item.type === ItemType.Vertex && !item.dataScope? item.parent.dataScope : item.dataScope);
-
-            const scale = g._createVariable(VarType.SCALE, enc.scale);
-            const channel = g._createVariable(VarType.CHANNEL, enc.channel, item);
-            const op = g._createOperator(OpType.ENCODER, enc.channel, item);
-
-            //TODO: depending the item type, create channel node that will be used as input to the operator
-            //e.g., if the item is a mark and its parent is a collection whose position is not bound to data, 
-            //then the collection's left coordinate should be the input
-            g.addEdge(datascope, op);
-            g.addEdge(scale, op);
-            g.addEdge(op, channel);
-
-            let axes = enc.axes;
-            for (let axis of axes) {
-                const axisX = g._createVariable(VarType.CHANNEL, 'x', axis);
-                g.addEdge(op, axisX);
-                const axisY = g._createVariable(VarType.CHANNEL, 'y', axis);
-            }
-            break;
-        }
-        default:
-            break;
-        // case "y": {
-        //     const scale = new ScaleNode(NodeType.VARIABLE, "n"+generateUniqueID(), enc.scale);
-        //     const collectionTop = new ChannelNode(NodeType.VARIABLE, "n"+generateUniqueID(), 'collections.top', enc.scene._bounds.top);
-        //     const op = new Operator('y-encoder', "n"+generateUniqueID(),);
-        //     const out1 = new ChannelNode(NodeType.VARIABLE, "n"+generateUniqueID(), 'y-axis.y', null);
-        //     const out2 = new ChannelNode(NodeType.VARIABLE, "n"+generateUniqueID(), 'mark.y', null);
-        //     // confused for slope graph - how to determine? Hardcode?
-        //     const out3 = new ChannelNode(NodeType.VARIABLE, "n"+generateUniqueID(), 'y-axis.x', null);
-        //     const _datascope = new DataScopeNode(NodeType.VARIABLE, "n"+generateUniqueID(), 'collections.datascope', null);
-        // }
-        // case "fillColor": {
-        //     const op = new Operator('fill-encoder', "n"+generateUniqueID(),);
-        //     const scale = new ScaleNode(NodeType.VARIABLE, "n"+generateUniqueID(), enc.scale);
-        //     const out1 = new ChannelNode(NodeType.VARIABLE, "n"+generateUniqueID(), 'mark.fill', null);
-        //     const _datascope = new DataScopeNode(NodeType.VARIABLE, "n"+generateUniqueID(), 'collections.datascope', null);
-
-        //     this._variables[_datascope.id] = _datascope;
-        //     this._variables[scale.id] = scale;
-        //     this._variables[out1.id] = out1;
-        //     this._operators[op.id] = op;
-
-        //     this._edges.push(...[new Edge(scale.id, op.id),
-        //     new Edge(_datascope.id, op.id),
-        //     new Edge(op.id, out1.id)]);
-        //     break;
-        // }
-        // case "strokeColor": {
-        //     const op = new Operator('stroke-encoder', "n"+generateUniqueID(),);
-        //     const scale = new ScaleNode(NodeType.VARIABLE, "n"+generateUniqueID(), enc.scale);
-        //     const out1 = new ChannelNode(NodeType.VARIABLE, "n"+generateUniqueID(), 'path.stroke', null);
-        //     const _datascope = new DataScopeNode(NodeType.VARIABLE, "n"+generateUniqueID(), 'collections.datascope', null);
-
-        //     this._variables[_datascope.id] = _datascope;
-        //     this._variables[scale.id] = scale;
-        //     this._variables[out1.id] = out1;
-        //     this._operators[op.id] = op;
-
-        //     this._edges.push(...[new Edge(scale.id, op.id),
-        //     new Edge(_datascope.id, op.id),
-        //     new Edge(op.id, out1.id)]);
-        //     break;
-        // }
-        // case "fillGradient":
-        // case "angle":
-        // case "text":
-        // case "radialDistance":
-        // case "thickness":
-    }
-}

package/src-new-ts/depgraph/Signal.js

@@ -1,12 +0,0 @@
-/**
- * Signal should capture the following info:
- * variable type
- * value
- */
-export default class Signal {
-
-    constructor(varType, val, object) {
-        
-    }
-
-}

package/src-new-ts/depgraph/operator/BoundsEvaluator.js

@@ -1,30 +0,0 @@
-import { ElementType } from "../../action/createElement";
-import { getPeers } from "../../action/traverseScene";
-import { Rectangle } from "../variable/BoundsVar";
-import Dataflow from "./Dataflow";
-
-export default class BoundsEvaluator extends Dataflow {
-
-    constructor(opType) {
-        super(opType);
-    }
-
-    run() {
-        let elem = this._outputVar.element,
-            peers = getPeers(elem);
-        //elem._bounds = computeBounds(elem);
-        for (let p of peers)
-            p._bounds = this.computeBounds(p);
-    }
-
-    computeBounds(elem) {
-        switch (elem.type) {
-            case ElementType.Circle:
-                return this.computeCircleBounds(elem);
-        }
-    }
-
-    computeCircleBounds(elem) {
-        return new Rectangle(elem.x - elem.radius, elem.y - elem.radius, elem.radius * 2, elem.radius * 2);
-    }
-}

package/src-new-ts/depgraph/operator/Dataflow.js

@@ -1,41 +0,0 @@
-import { generateUniqueID } from "../../util.js";
-
-export default class Dataflow {
-    //constructor(opType, input, output) {
-    constructor(opType) {
-        this._id = opType + "_" + generateUniqueID();
-        this._type = opType;
-        this._inputVars = [];
-        this._outputVar = undefined;
-    }
-
-    run() {}
-
-    get id() {
-        return this._id;
-    }
-
-    get type() {
-        return this._type;
-    }
-
-    get inputVars() {
-        return this._inputVars;
-    }
-
-    get outputVar() {
-        return this._outputVar;
-    }
-
-    set outputVar(v) {
-        this._outputVar = v;
-    }
-}
-
-export const OpType = Object.freeze({
-    ENCODE: 'encoder',
-    LAYOUT: 'layout',
-    CONSTRAIN: 'constraint',
-    EVAL_BBOX: 'evalBBox',
-    BUILD_DOMAIN: 'buildDomain'
-});

package/src-new-ts/depgraph/operator/DomainBuilder.js

@@ -1,50 +0,0 @@
-import { getPeers } from "../../action/traverseScene";
-import { FieldType } from "../../data/field";
-import DataScopeVar from "../variable/DataScopeVar";
-import FieldVar from "../variable/FieldVar";
-import Dataflow from "./Dataflow";
-
-export default class DomainBuilder extends Dataflow {
-
-    constructor(opType, aggregator) {
-        super(opType);
-        this._aggregator = aggregator;
-    }
-
-    run() {
-        let scale = this._outputVar.scale,
-            inputFieldVar = this.inputVars.find(d => d instanceof FieldVar),
-            inputDSVar = this.inputVars.find(d => d instanceof DataScopeVar);
-
-        let field = inputFieldVar.field,
-            table = inputFieldVar.dataset,
-            elem = inputDSVar.element;
-        // console.log(field, table, elem);
-        //scale.domain = computeDomain(field, tbl, getPeers(elem));
-        let dataScopes = getPeers(elem).map(d => d.dataScope),
-            domain;
-        switch (table.getFieldType(field)) {
-            case FieldType.Boolean:
-                break;
-
-            case FieldType.Date:
-                domain = dataScopes.map(d => d.getFieldValue(field));
-                break;
-
-            case FieldType.String:
-                try {
-                    domain = dataScopes.map(d => d.getFieldValue(field));
-                } catch (error) {
-                    throw new Error("Cannot bind " + this.channel + " to " + field + " : " + error);
-                }
-                break;
-
-            default: //integer or number
-                domain = dataScopes.map(d => d.aggregateNumericalField(field, this._aggregator));
-                break;
-        }
-        scale.domain = domain;
-        console.log(scale.domain);
-    }
-
-}

package/src-new-ts/depgraph/updateDepGraph.js

@@ -1,45 +0,0 @@
-import { ElementType } from "../action/createElement.js";
-import { OpType } from "./operator/Dataflow.js";
-import { VarType } from "./variable/Variable.js";
-
-//to move to createElement.js
-export function newMarkCreated(m, rt) {
-    switch (m.type) {
-        case ElementType.Circle: {
-            let b = rt.getVariable(VarType.BOUNDS, m),
-                x = rt.getVariable(VarType.CHANNEL, "x", m),
-                y = rt.getVariable(VarType.CHANNEL, "y", m),
-                r = rt.getVariable(VarType.CHANNEL, "radius", m),
-                bbox = rt.createDataflowOperator(OpType.EVAL_BBOX);
-                // bbox = rt.createDataflowOperator(OpType.EVALBBOX, [x, y, r], b);
-            rt.connect(x, bbox);
-            rt.connect(y, bbox);
-            rt.connect(r, bbox);
-            rt.connect(bbox, b);
-            bbox.run();
-        }
-        break;
-    }
-
-    // console.log("variables", rt._variables);
-    // console.log("operators", rt._operators);
-}
-
-
-export function encodingSpecified(field, channel, elem, scale, aggregator, rt) {
-    //first find/create all the variables in the dep graph (rt)
-    let fv = rt.getVariable(VarType.FIELD, field, elem.dataScope.dataTable),
-        cv = rt.getVariable(VarType.CHANNEL, channel, elem),
-        dv = rt.getVariable(VarType.DOMAIN, scale),
-        dsv = rt.getVariable(VarType.DATASCOPE, elem),
-        db = rt.createDataflowOperator(OpType.BUILD_DOMAIN, aggregator);
-    rt.connect(fv, db);
-    rt.connect(dsv, db);
-    rt.connect(db, dv);
-    db.run();
-    //console.log(fv, cv, dv);
-    //then create a new dataflow operator that takes the field and elem data scope as input 
-    //and outputs a scale
-    //then create a new dataflow operator that takes the scale and elem collection bounds as input
-    //and channel variables as output
-}

package/src-new-ts/depgraph/variable/BoundsVar.js

@@ -1,81 +0,0 @@
-import { ElementType } from "../../action/createElement.js";
-import Variable from "./Variable.js";
-
-export default class BoundsVar extends Variable {
-
-    constructor(type, elem) {
-        super(type);
-        this._elem = elem;
-    }
-
-    get element() {
-        return this._elem;
-    }
-
-}
-
-export class Rectangle {
-
-	constructor(x, y, width, height) {
-		this._x = x;
-		this._y = y;
-		this._width = width;
-		this._height = height;
-	}
-
-	toJSON() {
-		let json = {};
-		json.x = this._x;
-		json.y = this._y;
-		json.width = this._width;
-		json.height = this._height;
-		return json;
-	}
-
-	union(rect) {
-		let left = Math.min(this.left, rect.left),
-			top = Math.min(this.top, rect.top),
-			right = Math.max(this.right, rect.right),
-			btm = Math.max(this.bottom, rect.bottom),
-			wd = right - left,
-			ht = btm - top;
-		return new Rectangle(left + wd/2, top + ht/2, wd, ht);
-	}
-
-	clone() {
-		return new Rectangle(this.x, this.y, this.width, this.height);
-	}
-
-	get left() {
-		return this._x - this._width/2;
-	}
-
-	get right() {
-		return this._x + this._width/2;
-	}
-
-	get top() {
-		return this._y - this._height/2;
-	}
-
-	get bottom() {
-		return this._y + this._height/2;
-	}
-
-	get x() {
-		return this._x;
-	}
-
-	get y() {
-		return this._y;
-	}
-
-	contains(x, y) {
-		return this.left <= x && this.right >= x && this.top <= y && this.bottom >= y;
-	}
-
-	overlap(r) {
-		return !(this.right < r.left || this.bottom < r.top || this.left > r.right || this.top > r.bottom);
-	}
-
-}

package/src-new-ts/depgraph/variable/ChannelVar.js

@@ -1,17 +0,0 @@
-import Variable from "./Variable.js";
-
-export default class ChannelVar extends Variable {
-    constructor(type, channel, elem) {
-        super(type);
-        this._channel = channel;
-        this._elem = elem;
-    }
-
-    get channel() {
-        return this._channel;
-    }
-
-    get element() {
-        return this._elem;
-    }
-}

package/src-new-ts/depgraph/variable/DataScopeVar.js

@@ -1,12 +0,0 @@
-import Variable from "./Variable.js";
-
-export default class DataScopeVar extends Variable {
-    constructor(type, item) {
-        super(type);
-        this._item = item;
-    }
-
-    get element() {
-        return this._item;
-    }
-}

package/src-new-ts/depgraph/variable/DomainVar.js

@@ -1,15 +0,0 @@
-import Variable from "./Variable.js";
-
-/**
- * domain of a scale
- */
-export default class DomainVar extends Variable {
-    constructor(type, scale) {
-        super(type);
-        this._scale = scale;
-    }
-
-    get scale() {
-        return this._scale;
-    }
-}

package/src-new-ts/depgraph/variable/FieldVar.js

@@ -1,17 +0,0 @@
-import Variable from "./Variable.js";
-
-export default class FieldVar extends Variable {
-    constructor(type, field, dataset) {
-        super(type);
-        this._field = field;
-        this._dataset = dataset;
-    }
-
-    get field() {
-        return this._field;
-    }
-
-    get dataset() {
-        return this._dataset;
-    }
-}

package/src-new-ts/depgraph/variable/LayoutParameter.js

@@ -1,8 +0,0 @@
-import Variable from "./Variable.js";
-
-export default class LayoutParameter extends Variable {
-
-    constructor(type) {
-        super(type);
-    }
-}

package/src-new-ts/depgraph/variable/ScaleVar.js

@@ -1,13 +0,0 @@
-import Variable from "./Variable.js";
-// ToDo:: To be deleted
-export default class ScaleVar extends Variable {
-
-    constructor(type,scale) {
-        super(type);
-        this._scale = scale;
-    }
-
-    get scale() {
-        return this._scale;
-    }
-}