diff --git a/cellindex.js b/cellindex.js index 520118f..48838bb 100644 --- a/cellindex.js +++ b/cellindex.js @@ -104,16 +104,12 @@ export const LAYERS120 = { 163,219,271,223,167] }; -// just one for now - export const CELL120_CELL5 = { - "1": [ 1, 258, 304, 431, 510 ], - "2": [ 1, 260, 302, 427, 506 ], - "3": [1, 264, 298, 435, 514], - "4": [1, 330, 334, 387, 391], - "5": [1, 491, 503, 574, 578], - "6": [1, 495, 499, 570, 582 ], -}; + "1": [ 258, 1, 510, 304, 431 ], + "2": [ 185, 93, 222, 295, 372 ], +} + + // Schoute's partition via https://arxiv.org/abs/1010.4353 diff --git a/gui.js b/gui.js index 5a747ee..646dd5a 100644 --- a/gui.js +++ b/gui.js @@ -28,9 +28,10 @@ const DEFAULTS = { class FourDGUI { - constructor(shapes, changeShape, setColor, setBackground, setNodeOpacity,setLinkOpacity, setVisibility, showDocs) { + constructor(funcs) { + this.shapes = funcs.shapes; this.gui = new GUI(); - const SHAPE_NAMES = shapes.map((s) => s.name); + const SHAPE_NAMES = this.shapes.map((s) => s.name); this.parseLinkParams(); const guiObj = this; @@ -55,41 +56,52 @@ class FourDGUI { captions: true, dtheta: this.link['dtheta'], dpsi: this.link['dpsi'], - "copy link": function () { guiObj.copyUrl() } + "copy link": function () { guiObj.copyUrl() }, }; + if( funcs.extras ) { + for( const label in funcs.extras ) { + console.log(label); + console.log(funcs.extras[label]); + this.params[label] = funcs.extras[label]; + } + } let options_ctrl; this.gui.add(this.params, 'shape', SHAPE_NAMES).onChange((shape) => { - const options = this.getShapeOptions(shapes, shape); + const options = this.getShapeOptions(shape); options_ctrl = options_ctrl.options(options).onChange((option) => { - setVisibility(option) + funcs.setVisibility(option) }); options_ctrl.setValue(options[0]) - changeShape(shape) + funcs.changeShape(shape) }); - const options = this.getShapeOptions(shapes, this.params['shape']); + const options = this.getShapeOptions(this.params['shape']); options_ctrl = this.gui.add(this.params, 'option').options(options).onChange((option) => { - setVisibility(option) + funcs.setVisibility(option) }); this.gui.add(this.params, 'hyperplane', 0.5, 1 / 0.8); this.gui.add(this.params, 'zoom', 0.1, 2.0); this.gui.add(this.params, 'nodesize', 0, 1.5); - this.gui.add(this.params, 'nodeopacity', 0, 1).onChange(setNodeOpacity); + this.gui.add(this.params, 'nodeopacity', 0, 1).onChange(funcs.setNodeOpacity); this.gui.add(this.params, 'linksize', 0, 2); - console.log(setLinkOpacity); - this.gui.add(this.params, 'linkopacity', 0, 1).onChange((v) => setLinkOpacity(v, true)); - this.gui.add(this.params, 'link2opacity', 0, 1).onChange((v) => setLinkOpacity(v, false)); - this.gui.addColor(this.params, 'color').onChange(setColor); - this.gui.addColor(this.params, 'background').onChange(setBackground); + console.log(funcs.setLinkOpacity); + this.gui.add(this.params, 'linkopacity', 0, 1).onChange((v) => funcs.setLinkOpacity(v, true)); + this.gui.add(this.params, 'link2opacity', 0, 1).onChange((v) => funcs.setLinkOpacity(v, false)); + this.gui.addColor(this.params, 'color').onChange(funcs.setColor); + this.gui.addColor(this.params, 'background').onChange(funcs.setBackground); this.gui.add(this.params, 'xRotate', [ 'YW', 'YZ', 'ZW' ]); this.gui.add(this.params, 'yRotate', [ 'XZ', 'XY', 'XW' ]); - this.gui.add(this.params, 'captions').onChange(showDocs); + this.gui.add(this.params, 'captions').onChange(this.showDocs); this.gui.add(this.params, 'damping'); this.gui.add(this.params, 'copy link'); - + if( funcs.extras ) { + for( const label in funcs.extras ) { + this.gui.add(this.params, label); + } + } } - getShapeOptions(shapes, shape) { - const spec = shapes.filter((s) => s.name === shape); + getShapeOptions(shape) { + const spec = this.shapes.filter((s) => s.name === shape); if( spec && spec[0].options ) { return spec[0].options.map((o) => o.name); } else { diff --git a/main.js b/main.js index aa8cab4..40eff35 100644 --- a/main.js +++ b/main.js @@ -200,14 +200,20 @@ function setVisibility(option_name) { gui = new FourDGUI( - STRUCTURES, - changeShape, - setColors, - setBackground, - setNodeOpacity, - setLinkOpacity, - setVisibility, - showDocs + { + shapes: STRUCTURES, + changeShape: changeShape, + setColors: setColors, + setBackground: setBackground, + setNodeOpacity: setNodeOpacity, + setLinkOpacity: setLinkOpacity, + setVisibility: setVisibility, + showDocs: showDocs, + extras: { + "Show an alert": function() { alert("hi there") }, + "Show a different one": function() { alert('yowza')}, + }, + } ); // these are here to pick up colour settings from the URL params diff --git a/polytopes.js b/polytopes.js index 89d7e2f..dd1f328 100644 --- a/polytopes.js +++ b/polytopes.js @@ -463,19 +463,27 @@ export const cell120_inscribed = () => { export const cell120_inscribed_cell5 = () => { const nodes = make_120cell_vertices(); - const links = auto_detect_edges(nodes, 4); + //const links = auto_detect_edges(nodes, 4); for( const cstr in CELLINDEX.INDEX120 ) { label_nodes(nodes, CELLINDEX.INDEX120[cstr], Number(cstr)); } - links.map((l) => l.label = 0); + //links.map((l) => l.label = 0); + + const links = []; + + for( const p of [ 1, 2 ]) { + const nodes600 = nodes.filter((n) => n.label === p); + const links600 = auto_detect_edges(nodes600, 12); + links600.map((l) => l.label = p); + links.push(...links600); + } for( const c5 in CELLINDEX.CELL120_CELL5 ) { const nodes5 = nodes.filter((n) => CELLINDEX.CELL120_CELL5[c5].includes(n.id)); - console.log(`node5 = ${nodes5}`); const links5 = auto_detect_edges(nodes5, 4); - links5.map((l) => l.label = c5); + links5.map((l) => l.label = 0); links.push(...links5); } @@ -484,8 +492,7 @@ export const cell120_inscribed_cell5 = () => { nodes: nodes, links: links, options: [ - { name: "none", links: [ 0 ]}, - { name: "one inscribed 5-cell", links: [ 0, 1 ] }, + { name: "5-cells", links: [ 0, 1, 2, 3, 4, 5, 6 ] }, ], description: `The 120-cell with one of its 5-cells.`, }