d4ba806 · elk · git.iko.soy

git.iko.soy/elk

Ensure that gifs work in collages in all browsers.

Add the `arrows` and `wasd` values to the Keyboard library. Makes it way way easier to deal with directional input.

commitd4ba8068d528371b16b024a1ffcd775147cd6bba authorevancz <info@elm-lang.org> dateSun 6 Jan 2013, 04:21 (14 years ago) parent5bf237d

2 files changed+61−26

compare with master

unifiedsplit

core-js/Graphics/Collage.js+31−25 core-js/Signal/Keyboard.js+30−1

core-js/Graphics/Collage.js+31−25

@@ -139,17 +139,21 @@ function collageForms(w,h,forms) {

139139 return canvas;

140140};

141141

142+function applyTransforms(theta,scale,x,y,w,h,e) {

143+ var t = "translate(" + (x - w / 2) + "px,"+ (y - h / 2) + "px)";

144+ var r = theta === (~~theta) ? "" : "rotate(" + theta*360 + "deg)";

145+ var s = scale === 1 ? "" : "scale(" + scale + "," + scale + ")";

146+ var transforms = t + " " + s + " " + r;

147+ e.style.transform = transforms;

148+ e.style.msTransform = transforms;

149+ e.style.MozTransform = transforms;

150+ e.style.webkitTransform = transforms;

151+ e.style.OTransform = transforms;

152+}

153+

142154function collageElement(w,h,theta,scale,x,y,elem) {

143155 var e = Render.render(elem);

144− var t = "translate(" + (x - elem[3] / 2) + "px,"+ (y - elem[4] / 2) + "px)";

145− var r = theta === (~~theta) ? "" : "rotate(" + theta*360 + "deg)";

146− var s = scale === 1 ? "" : "scale(" + scale + "," + scale + ")";

147− var transforms = t + " " + s + " " + r;

148− e.style.transform = transforms;

149− e.style.msTransform = transforms;

150− e.style.MozTransform = transforms;

151− e.style.webkitTransform = transforms;

152− e.style.OTransform = transforms;

156+ applyTransforms(theta,scale,x,y,elem[3],elem[4],e);

153157 var div = Render.newElement('div');

154158 Render.addTo(div,e);

155159 div.style.width = (~~w) + "px";

@@ -174,25 +178,27 @@ function collage(w,h,formss) {

174178}

175179

176180function updateFormSet(node,currSet,nextSet) {

177− if (Value.eq(nextSet,currSet)) return;

178− var w = node.style.width.slice(0,-2) - 0;

179− var h = node.style.height.slice(0,-2) - 0;

180− if (typeof nextSet[0] === "object") {

181− if (typeof currSet[0] === "object") {

182− if (node.getContext) {

183− var ctx = node.getContext('2d');

184− function redo() { renderForms(this,ctx,w,h,nextSet); }

185− return renderForms(redo,ctx,w,h,nextSet);

186− }

187− }

188− var newNode = collageForms(w,h,nextSet);

189− newNode.style.position = 'absolute';

190− return node.parentNode.replaceChild(newNode,node);

181+ if (Value.eq(nextSet,currSet)) return;

182+ var w = node.style.width.slice(0,-2) - 0;

183+ var h = node.style.height.slice(0,-2) - 0;

184+ if (typeof nextSet[0] === "object") {

185+ if (typeof currSet[0] === "object") {

186+ if (node.getContext) {

187+ var ctx = node.getContext('2d');

188+ function redo() { renderForms(this,ctx,w,h,nextSet); }

189+ return renderForms(redo,ctx,w,h,nextSet);

190+ }

191191 }

192− var f = nextSet;

193− var newNode = collageElement(w,h,f[1],f[2],f[3][1],f[3][2],f[4][1]);

192+ var newNode = collageForms(w,h,nextSet);

194193 newNode.style.position = 'absolute';

195194 return node.parentNode.replaceChild(newNode,node);

195+ }

196+ node.style.width = (~~w) + "px";

197+ node.style.height = (~~h) + "px";

198+ var f = nextSet;

199+ var next = nextSet[4][1];

200+ Render.update(node.firstChild, currSet[4][1], next);

201+ applyTransforms(f[1],f[2],f[3][1],f[3][2],next[3],next[4],node.firstChild);

196202}

197203

198204// assumes that the form sets are the same length.

core-js/Signal/Keyboard.js+30−1

@@ -1,7 +1,10 @@

22Elm.Keyboard = { Raw : function() {

33 var keysDown = Elm.Signal.constant(["Nil"]);

4+ keysDown.defaultNumberOfKids = 2;

46 var charPressed = Elm.Signal.constant(["Nothing"]);

58 function remove(x,xs) {

69 if (xs[0] === "Nil") return xs;

710 if (xs[1] === x) return xs[2];

@@ -40,4 +43,30 @@ Elm.Keyboard = { Raw : function() {

4043 return {keysDown:keysDown,

4144 charPressed:charPressed};

4245 }()

43−};

46+};

47+

48+(function() {

49+ function dir(left,right,up,down) {

50+ function f(ks) {

51+ var x = 0, y = 0;

52+ while (ks[0] == "Cons") {

53+ switch (ks[1]) {

54+ case left : --x; break;

55+ case right: ++x; break;

56+ case up : ++y; break;

57+ case down : --y; break;

58+ }

59+ ks = ks[2];

60+ }

61+ return { _:[true], x:[x], y:[y] };

62+ }

63+ return Elm.Signal.lift(f)(Elm.Keyboard.Raw.keysDown);

64+ }

65+ var arrows = dir(37,39,38,40);

66+ arrows.defaultNumberOfKids = 0;

67+ var wasd = dir(65,68,87,83);

68+ wasd.defaultNumberOfKids = 0;

69+

70+ Elm.Keyboard.arrows = arrows;

71+ Elm.Keyboard.wasd = wasd;

72+}());