152ef51 · elk · git.iko.soy

git.iko.soy/elk

on master help sign in

Fix `croppedImage`, `show` for tuples, and init for resizing initial dom node.

152ef51evancz14 years ago

libraries/Native/Show.js+2−2

compare with master

unifiedsplit

@@ -55,8 +55,8 @@ Elm.Native.Show = function(elm) {

55 return "{ " + output.join(", ") + " }";

56 } else if ('ctor' in v) {

57 if (v.ctor.substring(0,5) === "Tuple") {

58− var output = new Array(v.length-1);

58+ var output = [];

59− for (var i = v.length; --i; ) { output[i-1] = toString(v[i]); }

59+ for (var k in v) { if (k === 'ctor') continue; output.push(toString(v[k])); }

60 return "(" + output.join(",") + ")";

61 } else if (v.ctor === "Cons") {

62 var isStr = typeof v._0 === "string";

runtime/Init.js+4−2

@@ -23,10 +23,12 @@ Elm.init = function(module, baseNode) {

23 if (typeof baseNode === 'undefined') {

24 baseNode = Render.newElement('div');

25 document.body.appendChild(baseNode);

26+ baseNode.style.width = window.innerWidth + 'px';

27+ baseNode.style.height = window.innerHeight + 'px';

26 window.addEventListener('resize', function() {

28 window.addEventListener('resize', function() {

27 console.log('resize the base node');

29 console.log('resize the base node');

28− baseNode.style.width = document.documentElement.clientWidth + 'px';

30+ baseNode.style.width = window.innerWidth + 'px';

29− baseNode.style.height = document.documentElement.clientHeight + 'px';

31+ baseNode.style.height = window.innerHeight + 'px';

30 }, true);

32 }, true);

32 var style = Render.newElement('style');

34 var style = Render.newElement('style');

runtime/Render/Element.js+12−10

@@ -2,7 +2,8 @@

2ElmRuntime.Render.Element = function() {

3'use strict';

5−var fromList = Elm.JavaScript({}).fromList

5+var fromList = Elm.JavaScript({}).fromList;

6+var eq = Elm.Native.Utils({}).eq;

7function newElement(elementType) {

8function newElement(elementType) {

8 var e = document.createElement(elementType);

9 var e = document.createElement(elementType);

@@ -41,7 +42,7 @@ function image(props, img) {

41 switch (img._0.ctor) {

42 switch (img._0.ctor) {

42 case 'Plain': return plainImage(img._3);

43 case 'Plain': return plainImage(img._3);

43 case 'Fitted': return fittedImage(props.width, props.height, img._3);

44 case 'Fitted': return fittedImage(props.width, props.height, img._3);

44− case 'Cropped': return croppedImage(img._0._0,props.width,props.height,img._3);

45+ case 'Cropped': return croppedImage(img,props.width,props.height,img._3);

45 }

46 }

46}

47}

@@ -80,7 +81,8 @@ function fittedImage(w, h, src) {

80 return e;

81 return e;

81}

82}

83−function croppedImage(pos, w, h, src) {

84+function croppedImage(elem, w, h, src) {

85+ var pos = elem._0._0;

84 var e = newElement('div');

86 var e = newElement('div');

85 e.style.position = "relative";

87 e.style.position = "relative";

86 e.style.overflow = "hidden";

88 e.style.overflow = "hidden";

@@ -89,11 +91,11 @@ function croppedImage(pos, w, h, src) {

89 img.onload = function() {

91 img.onload = function() {

90 img.style.position = 'absolute';

92 img.style.position = 'absolute';

91 img.style.margin = 'auto';

93 img.style.margin = 'auto';

92− var sw = dimensions.width / w, sh = dimensions.height / h;

94+ var sw = w / elem._1, sh = h / elem._2;

93− img.style.width = (this.width * sw) + 'px';

95+ img.style.width = ((this.width * sw)|0) + 'px';

94− img.style.height = (this.height * sh) + 'px';

96+ img.style.height = ((this.height * sh)|0) + 'px';

95− img.style.left = (- pos._0 * sw) + 'px';

97+ img.style.left = ((- pos._0 * sw)|0) + 'px';

96− img.style.top = (- pos._1 * sh) + 'px';

98+ img.style.top = ((- pos._1 * sh)|0) + 'px';

97 };

99 };

98 img.src = src;

100 img.src = src;

99 img.name = src;

101 img.name = src;

@@ -207,7 +209,7 @@ function update(node, curr, next) {

207 case "Image":

209 case "Image":

208 if (nextE._0.ctor === 'Plain') {

210 if (nextE._0.ctor === 'Plain') {

209 if (nextE._3 !== currE._3) node.src = nextE._3;

211 if (nextE._3 !== currE._3) node.src = nextE._3;

210− } else if (!Value.eq(nextE,currE) ||

212+ } else if (!eq(nextE,currE) ||

211 next.props.width !== curr.props.width ||

213 next.props.width !== curr.props.width ||

212 next.props.height !== curr.props.height) {

214 next.props.height !== curr.props.height) {

213 node.parentNode.replaceChild(render(next),node);

215 node.parentNode.replaceChild(render(next),node);

@@ -255,7 +257,7 @@ function update(node, curr, next) {

255 if (next._0 !== curr._0) node.parentNode.replaceChild(render(next),node);

257 if (next._0 !== curr._0) node.parentNode.replaceChild(render(next),node);

256 break;

258 break;

257 }

259 }

258− var props = next.props, currP = curr.props;

260+ var props = next.props, currP = curr.props, e = node;

259 if (props.width !== currP.width) e.style.width = (props.width |0) + 'px';

261 if (props.width !== currP.width) e.style.width = (props.width |0) + 'px';

260 if (props.height !== currP.height) e.style.height = (props.height|0) + 'px';

262 if (props.height !== currP.height) e.style.height = (props.height|0) + 'px';

261 if (props.opacity !== 1 && props.opacity !== currP.opacity) {

263 if (props.opacity !== 1 && props.opacity !== currP.opacity) {