Checkpoint having a selection dropdown for kind of visuals.
Chris Pressey
6 years ago
| 32 | 32 | }); |
| 33 | 33 | } |
| 34 | 34 | |
| 35 | function setVisuals(c) { | |
| 35 | function setClassicVisuals(c) { | |
| 36 | 36 | c.forEachBot(function(bot) { |
| 37 | 37 | if (bot.graphics) return; |
| 38 | 38 | var graphics = new PIXI.Graphics(); |
| 40 | 40 | graphics.beginFill(0xff0000); |
| 41 | 41 | graphics.drawCircle(0, 0, 10); |
| 42 | 42 | graphics.endFill(); |
| 43 | //graphics.filters = [new PIXI.filters.BlurFilter()]; | |
| 44 | 43 | app.stage.addChild(graphics); |
| 45 | 44 | bot.graphics = graphics; |
| 46 | 45 | }); |
| 47 | 46 | } |
| 48 | 47 | |
| 49 | setVisuals(c); | |
| 48 | function setBlurredVisuals(c) { | |
| 49 | c.forEachBot(function(bot) { | |
| 50 | if (bot.graphics) return; | |
| 51 | var graphics = new PIXI.Graphics(); | |
| 52 | graphics.lineStyle(0); | |
| 53 | graphics.beginFill(0xff0000); | |
| 54 | graphics.drawCircle(0, 0, 10); | |
| 55 | graphics.endFill(); | |
| 56 | graphics.filters = [new PIXI.filters.BlurFilter()]; | |
| 57 | app.stage.addChild(graphics); | |
| 58 | bot.graphics = graphics; | |
| 59 | }); | |
| 60 | } | |
| 61 | ||
| 62 | setClassicVisuals(c); | |
| 50 | 63 | |
| 51 | 64 | app.ticker.add(function(delta) { |
| 52 | 65 | c.update(); |
| 66 | 79 | button.onclick = fun; |
| 67 | 80 | return button; |
| 68 | 81 | } |
| 69 | function makeSelect(container, labelText, optionsArray, fun, def) { | |
| 82 | function makeSelect(container, labelText, optionsArray, fun) { | |
| 70 | 83 | var label = document.createElement('label'); |
| 71 | 84 | label.innerHTML = labelText; |
| 72 | 85 | container.appendChild(label); |
| 73 | 86 | var select = document.createElement("select"); |
| 74 | 87 | for (var i = 0; i < optionsArray.length; i++) { |
| 75 | 88 | var op = document.createElement("option"); |
| 76 | op.value = optionsArray[i][0]; | |
| 77 | op.text = optionsArray[i][1]; | |
| 89 | op.value = optionsArray[i].value; | |
| 90 | op.text = optionsArray[i].text; | |
| 78 | 91 | select.options.add(op); |
| 79 | 92 | } |
| 80 | 93 | select.onchange = function(e) { |
| 81 | fun(optionsArray[select.selectedIndex][0]); | |
| 94 | fun(optionsArray[select.selectedIndex]); | |
| 82 | 95 | }; |
| 83 | 96 | select.selectedIndex = 0; |
| 84 | 97 | label.appendChild(select); |
| 99 | 112 | } |
| 100 | 113 | function makeVisualsPanel(container) { |
| 101 | 114 | var panel = makeDiv(container); |
| 115 | makeSelect(panel, "Visuals:", [ | |
| 116 | { | |
| 117 | text: "Classic", | |
| 118 | value: function() { | |
| 119 | removeVisuals(c); | |
| 120 | setClassicVisuals(c); | |
| 121 | } | |
| 122 | }, | |
| 123 | { | |
| 124 | text: "Blurred", | |
| 125 | value: function() { | |
| 126 | removeVisuals(c); | |
| 127 | setBlurredVisuals(c); | |
| 128 | } | |
| 129 | }, | |
| 130 | ], function(selection) { | |
| 131 | selection.value(); | |
| 132 | }); | |
| 102 | 133 | makeButton(panel, "Classic", function(e) { setVisuals(c); }); |
| 103 | makeButton(panel, "Remove", function(e) { removeVisuals(c); }); | |
| 134 | makeButton(panel, "Remove", function(e) { }); | |
| 104 | 135 | } |
| 105 | 136 | |
| 106 | 137 | var controlPanel = makeDiv(config.container); |