31:T10f5,chart = { /** * Code taken from: https://observablehq.com/@d3/collapsible-tree?collection=@d3/d3-hierarchy */ const dx = 20; const dy = 50; const margin = ({top: 10, right: 120, bottom: 10, left: 40}); const root = d3.hierarchy(trie, d => { return d.children ? Array.from(d.children.values()) : null; }); const diagonal = d3.linkHorizontal().x(d => d.y).y(d => d.x); const tree = d3.tree().nodeSize([dx, dy]); root.x0 = dy / 2; root.y0 = 0; root.descendants().forEach((d, i) => { d.id = i; d.found = d.data.found; //d.children = d.data.children ? Array.from(d.data.children.values()) : null; d._children = d.children; //if (d.depth && d.data.value.length !== 7) d.children = null; }); //console.log(root) const svg = d3.create("svg") .attr("viewBox", [-margin.left, -margin.top, width, dx]) .style("font", "10px sans-serif") .style("user-select", "none"); const gLink = svg.append("g") .attr("fill", "none") .attr("stroke", "#555") .attr("stroke-opacity", 0.4) .attr("stroke-width", 1.5); const gNode = svg.append("g") .attr("cursor", "pointer") .attr("pointer-events", "all"); function update(source) { const duration = d3.event && d3.event.altKey ? 2500 : 250; const nodes = root.descendants().reverse(); const links = root.links(); // Compute the new tree layout. tree(root); let left = root; let right = root; root.eachBefore(node => { if (node.x < left.x) left = node; if (node.x > right.x) right = node; }); const height = right.x - left.x + margin.top + margin.bottom; const transition = svg.transition() .duration(duration) .attr("viewBox", [-margin.left, left.x - margin.top, width, height]) .tween("resize", window.ResizeObserver ? null : () => () => svg.dispatch("toggle")); // Update the nodes… const node = gNode.selectAll("g") .data(nodes, d => d.id); // Enter any new nodes at the parent's previous position. const nodeEnter = node.enter().append("g") .attr("transform", d => `translate(${source.y0},${source.x0})`) .attr("fill-opacity", 0) .attr("stroke-opacity", 0) .on("click", d => { d.children = d.children ? null : d._children; update(d); }); nodeEnter.append("circle") .attr("r", 2.5) .attr("fill", d => d.found ? "#f00" : "#555") .attr("stroke-width", 10); nodeEnter.append("text") .attr("dy", "0.15em") .attr("x", d => d._children ? -6 : 6) .attr("text-anchor", d => d._children ? "end" : "start") .attr("font-size", "2em") .attr("fill", d => d.found ? "#f00" : "#555") .text(d => d.data.key) .clone(true).lower() .attr("stroke-linejoin", "round") .attr("stroke-width", 3) .attr("stroke", "white"); // Transition nodes to their new position. const nodeUpdate = node.merge(nodeEnter).transition(transition) .attr("transform", d => `translate(${d.y},${d.x})`) .attr("fill-opacity", 1) .attr("stroke-opacity", 1); // Transition exiting nodes to the parent's new position. const nodeExit = node.exit().transition(transition).remove() .attr("transform", d => `translate(${source.y},${source.x})`) .attr("fill-opacity", 0) .attr("stroke-opacity", 0); // Update the links… const link = gLink.selectAll("path") .data(links, d => d.target.id); // Enter any new links at the parent's previous position. const linkEnter = link.enter().append("path") .attr("d", d => { const o = {x: source.x0, y: source.y0}; return diagonal({source: o, target: o}); }); // Transition links to their new position. link.merge(linkEnter).transition(transition) .attr("d", diagonal); // Transition exiting nodes to the parent's new position. link.exit().transition(transition).remove() .attr("d", d => { const o = {x: source.x, y: source.y}; return diagonal({source: o, target: o}); }); // Stash the old positions for transition. root.eachBefore(d => { d.x0 = d.x; d.y0 = d.y; }); } update(root); return svg.node(); }32:T749,class Trie{ constructor(key=null){ this.key = key; this.value = null; this.children = null; this.found = false; } find_prefix_node(chars){ if(chars.length==0){ return [this, chars]; } if(this.children === null){ return [this, chars]; } const key = chars[0]; if(this.children.has(key)){ return this.children.get(key).find_prefix_node(chars.slice(1)); } return [this, chars]; } set(chars, value=null){ const [prefix_node, suffix] = this.find_prefix_node(chars); if(suffix.length==0){ prefix_node.found = true; prefix_node.value = value; return; } if(prefix_node.children === null){ prefix_node.children = new Map(); } const key = suffix[0]; if(!prefix_node.children.has(key)){ prefix_node.children.set(key, new Trie(key)); } prefix_node.children.get(key).set(suffix.slice(1), value); } has(chars){ const [prefix_node, suffix] = this.find_prefix_node(chars); return (suffix.length == 0 && prefix_node.found); } // set(chars, value){ // if(chars.length==0){ // this.found = true; // this.value = value; // return; // } // if(!this.children){ // this.children = new Map(); // } // const key = chars[0]; // if(!this.children.has(key)){ // this.children.set(key, new Trie(key, value)); // } // this.children.get(key).set(chars.slice(1)); // } // has(chars){ // if(chars.length==0){ // return false; // } // if(this.children === null){ // return false; // } // const key = chars[0]; // if(this.children.has(key)){ // return this.children.get(key).has(chars.slice(1)); // } // return false; // } toString(){ return `$Node({this.found}, {this.value}, {this.children})`; } }33:T65e,function aho_corasick(input_text, word_boundary=false, case_sensitive=false){ const text = case_sensitive ? input_text : input_text.toLowerCase(); let node = trie; let prev_index = 0; let best_match = -1; let best_match_value = null; let matches = new Array(); function add_match(best_match, prev_index, best_match_value){ if(best_match > -1){ console.log([text.slice(prev_index, best_match+1), prev_index, best_match+1, best_match_value]); console.log( word_boundary, prev_index, text[prev_index-1], best_match, text[best_match+1], (prev_index > 0 && !alphanumeric.test(text[prev_index-1])), (best_match < text.length-1 && !alphanumeric.test(text[best_match+1])) ) if(word_boundary){ if((prev_index > 0 && !alphanumeric.test(text[prev_index-1]))){ return; } else if((best_match < text.length-1 && !alphanumeric.test(text[best_match+1]))){ return; } } matches.push([text.slice(prev_index, best_match+1), prev_index, best_match+1, best_match_value]); } } for(let i=0; i\n

\n \n Keywords\n \n

\n \n Word Boundary\n \n \n \n Case sensitive\n \n

\n \n Split String\n \n \n \n Word boundary regex\n <\\\\[\\\\]\\+ \\\\n]\">\n \n

\n \n

\n`)","pinned":false,"hidden":false,"mode":"ojs"},{"id":154,"value":"show_matches(data.text, matches);","pinned":false,"hidden":false,"mode":"ojs"},{"id":69,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":132,"value":"matches = aho_corasick(data.text, data.word_boundary, data.case_sensitive)","pinned":false,"hidden":false,"mode":"ojs"},{"id":135,"value":"function show_matches(text, matches){\n const div = d3.create(\"div\").classed(\"text-matches\", true);\n let p = div.append(\"p\");\n let prev_i = 0;\n let parts = new Array();\n for(let i=0; i d[0].replace(\"\\n\", \"
\"))\n .attr(\"data-descr\", d => d[2])\n .classed(\"matched\", d => d[1])\n //.style(\"background-color\", d => d[1] ? \"#0f0\" : \"#fff\")\n \n //p.text(text);\n \n return div.node();\n \n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":247,"value":"html`\n\n\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":10,"value":"data = {\n const split = form_input.split;\n const data = {...form_input}\n data.keywords = data.keywords.split(split);\n data.text = data.text;\n return data;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":176,"value":"trie.find_prefix_node(\"shubh\")","pinned":true,"hidden":false,"mode":"ojs"},{"id":23,"value":"$32","pinned":false,"hidden":false,"mode":"ojs"},{"id":45,"value":"trie = {\n const root = new Trie();\n data.keywords.forEach(w => root.set(w, w));\n return root;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":213,"value":"alphanumeric = {\n //const alphanumeric = new RegExp('[\\\\.,-\\\\/#!$%\\\\^&\\\\*;:{}=\\\\-_`~()@\\\\+\\\\?><\\\\[\\\\]\\+ \\n]'); \n const alphanumeric = new RegExp(data.word_boundary_regex); \n //regexObj.compile('new foo', 'g');\n return alphanumeric;\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":205,"value":"alphanumeric.test(\",\")","pinned":true,"hidden":false,"mode":"ojs"},{"id":343,"value":"$33","pinned":true,"hidden":false,"mode":"ojs"},{"id":5,"value":"import {form} from \"@mbostock/form-input\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":8,"value":"d3 = require(\"d3@v5\")","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W34","stdlib":"1","titling":"auto"}