b96b240 · elk · git.iko.soy

git.iko.soy/elk

Make rotations counter-clockwise, just like the unit circle. Now trig functions and rendering functions match each other.

b96b240evancz13 years ago

runtime/Init.js+2−2

compare with master

unifiedsplit

@@ -89,7 +89,7 @@ function init(display, container, module) {

89 // Add the visualModel to the DOM

90 var renderNode = Render.render(visualModel)

91 container.appendChild(renderNode);

92− elm.Native.Window.resizeIfNeeded();

92+ if (elm.Native.Window) elm.Native.Window.resizeIfNeeded();

94 // set up updates so that the DOM is adjusted as necessary.

95 var update = Render.update;

@@ -97,7 +97,7 @@ function init(display, container, module) {

97 ElmRuntime.draw(function(_) {

98 update(renderNode, visualModel, value);

99 visualModel = value;

100− elm.Native.Window.resizeIfNeeded();

100+ if (elm.Native.Window) elm.Native.Window.resizeIfNeeded();

101 });

102 return value;

103 }

runtime/Render/Collage.js+18−16

@@ -84,11 +84,11 @@ function gradient(ctx, grad) {

84 var stops = [];

85 if (grad.ctor === 'Linear') {

86 var p0 = grad._0, p1 = grad._1;

87− g = ctx.createLinearGradient(p0._0, -p0._1, p1._0, -p1._1);

87+ g = ctx.createLinearGradient(p0._0, p0._1, p1._0, p1._1);

88 stops = fromList(grad._2);

89 } else {

90 var p0 = grad._0, p2 = grad._2;

91− g = ctx.createRadialGradient(p0._0, -p0._1, grad._1, p2._0, -p2._1, grad._3);

91+ g = ctx.createRadialGradient(p0._0, p0._1, grad._1, p2._0, p2._1, grad._3);

92 stops = fromList(grad._4);

93 }

94 var len = stops.length;

@@ -119,9 +119,9 @@ function drawImage(redo, ctx, form) {

119function renderForm(redo, ctx, form) {

120 ctx.save();

121 var x = form.x, y = form.y, theta = form.theta, scale = form.scale;

122− if (x !== 0 || y !== 0) ctx.translate(x, -y);

122+ if (x !== 0 || y !== 0) ctx.translate(x, y);

123 if (theta !== 0) ctx.rotate(theta);

124− if (scale !== 1) ctx.scale(scale, scale);

124+ ctx.scale(scale,-scale);

125 ctx.beginPath();

126 var f = form.form;

127 switch(f.ctor) {

@@ -143,16 +143,17 @@ function makeTransform(w, h, form, matrices) {

143 var props = form.form._0.props;

144 var m = A6( Matrix.matrix, 1, 0, 0, 1,

145 (w - props.width)/2,

146− (props.height - h)/2 );

146+ (h - props.height)/2 );

147 var len = matrices.length;

148 for (var i = 0; i < len; ++i) { m = A2( Matrix.multiply, m, matrices[i] ); }

149

150 var x = form.x, y = form.y, theta = form.theta, scale = form.scale;

151 if (x !== 0 || y !== 0) m = A3( Matrix.move, x, y, m );

152 if (theta !== 0) m = A2( Matrix.rotate, theta, m );

153+ m = A2( Matrix.scaleY, -scale, m );

153− if (scale !== 1) m = Matrix.scale( scale );

154+ if (scale !== 1) m = A2( Matrix.scale, scale, m);

154 return 'matrix(' + m[0] + ',' + m[3] + ',' + m[1] + ',' +

155 return 'matrix(' + m[0] + ',' + m[3] + ',' + m[1] + ',' +

155− m[4] + ',' + m[2] + ',' + (-m[5]) + ')';

156+ m[4] + ',' + m[2] + ',' + m[5] + ')';

156}

157}

157

158

158function stepperHelp(list) {

159function stepperHelp(list) {

@@ -191,11 +192,11 @@ function stepper(forms) {

191 var m = f._0;

192 var m = f._0;

192 matrices.push(m);

193 matrices.push(m);

193 var x = out.x, y = out.y, theta = out.theta, scale = out.scale;

194 var x = out.x, y = out.y, theta = out.theta, scale = out.scale;

194− if (x !== 0 || y !== 0) ctx.translate(x, -y);

195+ if (x !== 0 || y !== 0) ctx.translate(x, y);

195 if (theta !== 0) ctx.rotate(theta);

196 if (theta !== 0) ctx.rotate(theta);

196 if (scale !== 1) ctx.scale(scale, scale);

197 if (scale !== 1) ctx.scale(scale, scale);

197 ctx.save();

198 ctx.save();

198− ctx.transform(m[0], m[3], m[1], m[4], m[2], -m[5]);

199+ ctx.transform(m[0], m[3], m[1], m[4], m[2], m[5]);

199 }

200 }

200 return out;

201 return out;

201 }

202 }

@@ -253,16 +254,16 @@ function updateTracker(w,h,div) {

253 }

254 }

254 function element(matrices, form) {

255 function element(matrices, form) {

255 var container = kids[i];

256 var container = kids[i];

256− if (!container) {

257+ if (!container || container.getContext) {

257 container = newElement('div');

258 container = newElement('div');

258 container.style.overflow = 'hidden';

259 container.style.overflow = 'hidden';

259 container.style.position = 'absolute';

260 container.style.position = 'absolute';

261+ addTransform(container.style, 'scaleY(-1)');

262+ if (!container) {

260− div.appendChild(container);

263+ div.appendChild(container);

261− } else if (container.getContext) {

264+ } else {

262− container = newElement('div');

263− container.style.overflow = 'hidden';

264− container.style.position = 'absolute';

265− div.insertBefore(container, kids[i]);

265+ div.insertBefore(container, kids[i]);

266+ }

266 }

267 }

267 // we have added a new node, so we must step our position

268 // we have added a new node, so we must step our position

268 ++i;

269 ++i;

@@ -303,6 +304,7 @@ function update(div, _, model) {

303 while (formType = stpr.peekNext()) {

304 while (formType = stpr.peekNext()) {

304 if (ctx === null && formType !== 'FElement') {

305 if (ctx === null && formType !== 'FElement') {

305 ctx = tracker.getContext(stpr.transforms());

306 ctx = tracker.getContext(stpr.transforms());

307+ ctx.scale(1,-1);

306 }

308 }

307 var form = stpr.next(ctx);

309 var form = stpr.next(ctx);

308 if (formType === 'FElement') {

310 if (formType === 'FElement') {