| 73 | }) |
| 74 | |
| 75 | function addBug(d, prev){ |
| 76 | if (!d || d.visable) return |
| 77 | |
| 78 | d.visable = true |
| 79 | |
| 80 | d.div = buggContainer.append('div.bugg') |
| 81 | |
| 82 | d.imgEl = d.div.append('img.bug-img').attr('src', d.img) |
| 83 | |
| 84 | d.qcontainer = d.div.append('div.q-container') |
| 85 | d.qcontainer |
| 86 | .dataAppend(_.shuffle([d.right, d.wrong]), 'div.awnser') |
| 87 | .text(ƒ()) |
| 88 | .on('click', function(e){ |
| 89 | if (d.correct) return |
| 90 | |
| 91 | if (d.right == e){ |
| 92 | d.correct = true |
| 93 | d.imgEl.transition().delay(300).style('opacity', 0) |
| 94 | d3.select(this).style('color', green) |
| 95 | d.div.classed('correct', true) |
| 96 | |
| 97 | svg.append('g').dataAppend([[Math.random()*width, 0], [0, Math.random()*height]], 'path.lazer') |
| 98 | .attr('d', function(e){ return ['M', e, 'L', e].join('') }) |
| 99 | .style({'stroke-width': 1, stroke: 'yellow'}) |
| 100 | .transition().duration(400) |
| 101 | .attr('d', function(e){ return ['M', e, 'L', [d.pos[0] + 150, d.pos[1] + 50]].join('') }) |
| 102 | .style({'stroke-width': 8, stroke: green}) |
| 103 | .transition() |
| 104 | .style('opacity', 0) |
| 105 | .style('stroke-width', 50) |
| 106 | |
| 107 | } else{ |
| 108 | addBug(bugs.filter(_.negate(ƒ('visable')))[0], d) |
| 109 | d3.select(this).style('color', red) |
| 110 | } |
| 111 | }) |
| 112 | |
| 113 | |
| 114 | if (prev && prev.pos){ |
| 115 | d.qcontainer.style('opacity', 0).style('pointer-events', 'none') |
| 116 | d.imgEl.style('width', '0px') |
| 117 | .transition().duration(800) |
| 118 | .style('width', '100px') |
| 119 | d.div.call(posAt, prev.pos) |
| 120 | .transition().duration(1000).ease('cubic') |
| 121 | .call(posAt, d.pos) |
| 122 | .each('end', function(){ |
| 123 | d.qcontainer |
| 124 | .style('pointer-events', 'all') |
| 125 | .transition() |
| 126 | .style('opacity', 1) |
| 127 | }) |
| 128 | //todo - hide questions, till pos is done, scale bug size |
| 129 | } else{ |
| 130 | d.div.call(posAt, d.pos) |
| 131 | } |
| 132 | |