D3
OG
Old school D3 from simpler times
All examples
By author
By category
About
okiloco
Full window
Github gist
SandBox
Built with
blockbuilder.org
<!DOCTYPE html> <head> <meta charset="utf-8"> <script src="https://d3js.org/d3.v4.min.js"></script> <style> body { margin:0;position:fixed;top:0;right:0;bottom:0;left:0; } </style> </head> <body> <script> // Feel free to change or delete any of the code you see in this editor! var svg = d3.select("body").append("svg") .attr("width", 960) .attr("height", 500) svg.append("text") .text("Edit the code below to change me!") .attr("y", 200) .attr("x", 120) .attr("font-size", 36) .attr("font-family", "monospace"); class SandBox{ log = console.log } class Donec{ constructor(){ this.modules = {}; } static create = (moduleId,creator) => { var sandbox = new SandBox(); var module = this.modules[moduleId]; let instance = {}; try{ if(typeof module === 'undefined') throw new Error(`The module: ${moduleId} is not defined.`); let original_instance; if(typeof module.creator === "function"){ original_instance = module.creator(sandbox); }else{ original_instance = createInstance(module.creator); } if(typeof creator !== "undefined"){ if(typeof creator === "function"){ //module["creator"] = creator; instance = creator(sandbox); }else if(typeof creator === 'object' && !Array.isArray(creator)){ instance = createInstance(creator); } }else{ if(typeof module.creator === "function"){ instance = module.creator(sandbox); }else{ instance = createInstance(module.creator); } } original_instance["sandbox"] = sandbox; original_instance["parent"] = original_instance; original_instance["class"] = moduleId; instance = {...original_instance,...instance}; var funapply; function createInstance(instance){ for(var key in instance){ let method = instance[key]; if(typeof method === 'function'){ instance[key] = (function(name,method){ return function(){ funapply = method.apply(this,arguments); return funapply; } })(key,method) } } return instance; } this.modules = this.modules || {}; instance = createInstance(instance); //module["instance"] = instance; if(typeof instance["init"] !== "undefined"){ this.modules[moduleId]["instances"] = this.modules[moduleId]["instances"] || []; //instance.init(); let id = instance.id || `${moduleId}_${this.modules[moduleId]["instances"].length}`; //verify if is already exists if(typeof this.getInstance(moduleId,id) !== "undefined") this.modules[moduleId]["instances"] = this.modules[moduleId]["instances"].filter(item => item.id !== id); if(typeof instance["remove"] === "undefined") instance["remove"] = function(){ console.log("Remove Object!",id); }; if(typeof instance["stop"] === "undefined") instance["stop"] = function(){ console.log("Stop Object!",id); }; this.modules[moduleId]["instances"].push({ id, parent:moduleId, instance }); } //this.modules[moduleId] = obj; return instance; }catch(err){ console.error("[Code: 101]",err); return null; } } static getModules = () => this.modules; static getInstancesOf = (moduleId) => { if(typeof this.modules[moduleId] === "undefined") return []; return this.modules[moduleId]["instances"]; }; static define = (moduleId,creator) => { this.modules = this.modules || {}; let module = { creator, instance:null } this.modules[moduleId] = module; } static getInstance = (moduleId,_id) => { let instance; let modules = this.modules; if(typeof _id === "undefined"){ Object.keys(modules).forEach(key => { let module = modules[key]; let instances = module["instances"] || []; instances = instances.filter(item => item.id === moduleId) .map(item => item.instance) if(instances.length > 0) return instance = instances[instances.length - 1];//return last instace for replace first instance }); return instance; } var instances = this.modules[moduleId]["instances"] || []; instances = instances.filter(item => item.id === _id) .map(item => item.instance); if(instances.length > 0) instance = instances[instances.length - 1];//return last instace for replace first instance return instance; } static start = (moduleId,_id) => { try{ let instance = this.getInstance(moduleId,_id); if(!instance) throw new Error(`[Code 102 Start:] Instance ${_id || moduleId} is not found.`); if(instance.init && !instance.initialized){//call init function instance["initialized"] = true; instance["stoped"] = false; return instance.init(); } }catch(err){ console.error(err); } } static stop = (moduleId,_id) => { try{ let instance = this.getInstance(moduleId,_id); if(!instance) throw new Error(`[Code 102 Stop:] Instance ${_id || moduleId} is not found.`); if(instance.stop && !instance.stoped){//call stop function instance["initialized"] = false; instance["stoped"] = true; instance.stop(); } }catch(err){ console.error(err); } } static remove = (moduleId,_id) => { try{ let instance = this.getInstance(moduleId,_id); if(!instance) throw new Error(`[Code 102 Remove:] Instance ${_id || moduleId} is not found.`); if(typeof instance.remove !== "undefined") instance.remove(); let module = this.modules[instance.class]; let id = _id || moduleId; module.instances = module.instances.filter(item => item.id !== id); }catch(err){ console.error(err); } } static removeAll = () => { let modules = this.modules; Object.keys(modules).forEach(key => { let module = modules[key]; let instances = module.instances || []; for(var i = 0; i < instances.length;++i){ let id = instances[i].id; this.remove(key,id); } delete this.modules[key]; }); } static startAll = () => { let modules = this.modules; Object.keys(modules).forEach(key => { let module = modules[key]; let instances = module.instances || []; for(var i = 0; i < instances.length;++i){ let id = instances[i].id; let instance = instances[i].instance; let parent = instance.parent; instance["autoLoad"] = instance.autoLoad || parent.autoLoad || true; if(instance.autoLoad) this.start(key,id); } }); } static stopAll = () => { let modules = this.modules; Object.keys(modules).forEach(key => { let module = modules[key]; let instances = module.instances || []; for(var i = 0; i < instances.length;++i){ let id = instances[i].id; let instance = instances[i].instance; this.stop(key,id); } }); } } Donec.define("obj",function(sandbox){ //sandbox.log("Hola instance!"); return{ "name":"Whoiam", autoLoad:false, init:function(){ sandbox.log(">>>Origin: ",this.name); }, stop:function(){ console.log("Stop!",this.name); } } }); Donec.define("modelo",{ extends:"modelo", "name":"Whoiam", autoLoad:false, init:function(){ this.sandbox.log(">>>INSTANCE OF Obj2: ",this.name); }, remove:function(){ return this.sandbox.remove(this.id); }, save:function(payloads){ return this.sandbox.save(payloads); } }); Donec.define("usuario",{ "id":"xzxzxz", extends:"modelo", "name":"Whoiam", autoLoad:false, init:function(){ this.sandbox.log(">>>INSTANCE OF Obj2: ",this.name); }, remove:function(){ return this.sandbox.remove(this.id); }, save:function(payloads){} return this.sandbox.save(payloads); } }); var obj1 = Donec.create("obj",$ => { return { init:function(){ $.log("->Obj1!!",this.name); }, name:"Jose" } }); var obj2 = Donec.create("obj",{ init:function(){ this.sandbox.log(">>SANBOX:: ->Obj2: Hola!!",this.name); }, name:"Fabian" }); var obj3 = Donec.create("obj",{ id:"pancho", name:"Pancho" }); var obj31 = Donec.create("obj",{ id:"pancho", name:"Juancho" }); var obj4 = Donec.create("obj2"); //var obj5 = Donec.create("obj2"); console.log("Modules: ",Donec.getModules(),Donec.getInstancesOf("obj"),Donec.getInstance("pancho")); Donec.start("pancho"); Donec.startAll(); Donec.stop("pancho"); Donec.stopAll(); Donec.startAll(); Donec.remove("pancho"); Donec.removeAll(); console.log(Donec.getInstancesOf("obj"),Donec.getModules()); console.log(obj4); var obj32 = Donec.create("obj",{ id:"pancho", name:"Juancho" }); /*var usuario = Donec.create("usuario",{ id:"xdadasdasdasdsa", name:"Elkin", lastname:"Chaverra" }); usuario.remove();*/ </script> </body>
https://d3js.org/d3.v4.min.js