| 156 | |
| 157 | //update logic |
| 158 | function update(i){ |
| 159 | gatesByCol.forEach(function(gateCol){ |
| 160 | gateCol.values.forEach(function(gate){ |
| 161 | gate.lastOn = gate.on |
| 162 | gate.on = gate.type.fn.apply(null, gate.inputs.map(ƒ('on'))) |
| 163 | gate.changedOn = gate.lastOn != gate.on |
| 164 | |
| 165 | gate.outputs.forEach(function(d){ |
| 166 | d.on = gate.on |
| 167 | d.changedOn = gate.changedOn |
| 168 | }) |
| 169 | }) |
| 170 | }) |
| 171 | |
| 172 | var uuid = Math.random() |
| 173 | |
| 174 | gateGs.selectAll('g.gate-icon').filter(ƒ('changedOn')) |
| 175 | .transition(uuid).delay(function(d){ return (d.i - i)*300+ 200}) |
| 176 | .style('fill', color) |
| 177 | .style('fill-opacity', .5) |
| 178 | .transition(uuid).duration(300) |
| 179 | .style('fill-opacity', 1) |
| 180 | |
| 181 | wireBotEls |
| 182 | .transition(uuid).delay(function(d){ return (d.from.i - i)*300 + 600 }) |
| 183 | .style('stroke', color) |
| 184 | |
| 185 | wireTopEls.filter(ƒ('changedOn')) |
| 186 | .attr({stroke: color, 'stroke-width': 3, 'stroke-dashoffset': '100%'}) |
| 187 | .transition(uuid).delay(function(d){ return (d.from.i - i)*300 + 100 }).duration(1000) |
| 188 | .each('start', function(){ d3.select(this).style('stroke-width', 3) }) |
| 189 | .attr('stroke-dashoffset', '0%') |
| 190 | .transition(uuid) |
| 191 | .style('stroke-width', 0) |
| 192 | |
| 193 | |
| 194 | function color(d){ return d.on ? '#00c770' : '#f94600' } |
| 195 | } |
| 196 | |
| 197 | update(0) |
| 198 | |