git.iko.soy/elk
on da4d613 help sign in
elk/runtime/core.js
387 lines 12 kB history raw
2(function() {
3'use strict';
5var Display = { FULLSCREEN: 0, COMPONENT: 1, NONE: 2 };
8Elm.fullscreen = function(module, ports) {
9 var style = document.createElement('style');
10 style.type = 'text/css';
11 style.innerHTML = "html,head,body { padding:0; margin:0; }" +
12 "body { font-family: calibri, helvetica, arial, sans-serif; }";
13 document.head.appendChild(style);
14 var container = document.createElement('div');
15 document.body.appendChild(container);
16 return init(Display.FULLSCREEN, container, module, ports || {});
17};
19Elm.embed = function(module, container, ports) {
20 var tag = container.tagName;
21 if (tag !== 'DIV') {
22 throw new Error('Elm.node must be given a DIV, not a ' + tag + '.');
23 } else if (container.hasChildNodes()) {
24 throw new Error('Elm.node must be given an empty DIV. No children allowed!');
25 }
26 return init(Display.COMPONENT, container, module, ports || {});
27};
29Elm.worker = function(module, ports) {
30 return init(Display.NONE, {}, module, ports || {});
31};
33function init(display, container, module, ports, moduleToReplace) {
34 // defining state needed for an instance of the Elm RTS
35 var inputs = [];
37 /* OFFSET
38 * Elm's time traveling debugger lets you interrupt the smooth flow of time
39 * by pausing and continuing program execution. To ensure the user sees a
40 * program that moves smoothly through the pause/continue time gap,
41 * we need to adjsut the value of Date.now().
42 */
43 var timer = function() {
44 var inducedDelay = 0;
46 var now = function() {
47 return Date.now() - inducedDelay;
48 };
50 var addDelay = function(d) {
51 inducedDelay += d;
52 return inducedDelay;
53 };
55 return { now : now
56 , addDelay : addDelay
57 }
58 }();
60 var updateInProgress = false;
61 function notify(id, v) {
62 if (updateInProgress) {
63 throw new Error(
64 'The notify function has been called synchronously!\n' +
65 'This can lead to frames being dropped.\n' +
66 'Definitely report this to <https://github.com/elm-lang/Elm/issues>\n');
67 }
68 updateInProgress = true;
69 var timestep = timer.now();
70 for (var i = inputs.length; i--; ) {
71 inputs[i].recv(timestep, id, v);
72 }
73 updateInProgress = false;
74 }
75 function setTimeout(func, delay) {
76 window.setTimeout(func, delay);
77 }
79 var listeners = [];
80 function addListener(relevantInputs, domNode, eventName, func) {
81 domNode.addEventListener(eventName, func);
82 var listener = {
83 relevantInputs: relevantInputs,
84 domNode: domNode,
85 eventName: eventName,
86 func: func
87 };
88 listeners.push(listener);
89 }
91 var portUses = {}
92 for (var key in ports) {
93 portUses[key] = 0;
94 }
95 // create the actual RTS. Any impure modules will attach themselves to this
96 // object. This permits many Elm programs to be embedded per document.
97 var elm = {
98 notify: notify,
99 setTimeout: setTimeout,
100 node: container,
101 addListener: addListener,
102 inputs: inputs,
103 timer: timer,
104 ports: { incoming:ports, outgoing:{}, uses:portUses },
106 isFullscreen: function() { return display === Display.FULLSCREEN; },
107 isEmbed: function() { return display === Display.COMPONENT; },
108 isWorker: function() { return display === Display.NONE; }
109 };
111 function swap(newModule) {
112 removeListeners(listeners);
113 var div = document.createElement('div');
114 var newElm = init(display, div, newModule, ports, elm);
115 inputs = [];
116 // elm.swap = newElm.swap;
117 return newElm;
118 }
120 function dispose() {
121 removeListeners(listeners);
122 inputs = [];
123 }
125 var Module = {};
126 var reportAnyErrors = function() {};
127 try {
128 Module = module.make(elm);
129 checkPorts(elm);
130 } catch(e) {
131 var directions = "<br/>&nbsp; &nbsp; Open the developer console for more details."
132 Module.main = Elm.Text.make(elm).leftAligned('<code>' + e.message + directions + '</code>');
133 reportAnyErrors = function() { throw e; }
134 }
135 inputs = filterDeadInputs(inputs);
136 filterListeners(inputs, listeners);
137 addReceivers(elm.ports.outgoing);
138 if (display !== Display.NONE) {
139 var graphicsNode = initGraphics(elm, Module);
140 }
141 if (typeof moduleToReplace !== 'undefined') {
142 hotSwap(moduleToReplace, elm);
144 // rerender scene if graphics are enabled.
145 if (typeof graphicsNode !== 'undefined') {
146 graphicsNode.recv(0, true, 0);
147 }
148 }
150 reportAnyErrors();
151 return {
152 swap:swap,
153 ports:elm.ports.outgoing,
154 dispose:dispose
155 };
156};
158function checkPorts(elm) {
159 var portUses = elm.ports.uses;
160 for (var key in portUses) {
161 var uses = portUses[key]
162 if (uses === 0) {
163 throw new Error(
164 "Initialization Error: provided port '" + key +
165 "' to a module that does not take it as in input.\n" +
166 "Remove '" + key + "' from the module initialization code.");
167 } else if (uses > 1) {
168 throw new Error(
169 "Initialization Error: port '" + key +
170 "' has been declared multiple times in the Elm code.\n" +
171 "Remove declarations until there is exactly one.");
172 }
173 }
177//// FILTER SIGNALS ////
179// TODO: move this code into the signal module and create a function
180// Signal.initializeGraph that actually instantiates everything.
182function filterListeners(inputs, listeners) {
183 loop:
184 for (var i = listeners.length; i--; ) {
185 var listener = listeners[i];
186 for (var j = inputs.length; j--; ) {
187 if (listener.relevantInputs.indexOf(inputs[j].id) >= 0) {
188 continue loop;
189 }
190 }
191 listener.domNode.removeEventListener(listener.eventName, listener.func);
192 }
195function removeListeners(listeners) {
196 for (var i = listeners.length; i--; ) {
197 var listener = listeners[i];
198 listener.domNode.removeEventListener(listener.eventName, listener.func);
199 }
202// add receivers for built-in ports if they are defined
203function addReceivers(ports) {
204 if ('log' in ports) {
205 ports.log.subscribe(function(v) { console.log(v) });
206 }
207 if ('stdout' in ports) {
208 var process = process || {};
209 var handler = process.stdout
210 ? function(v) { process.stdout.write(v); }
211 : function(v) { console.log(v); };
212 ports.stdout.subscribe(handler);
213 }
214 if ('stderr' in ports) {
215 var process = process || {};
216 var handler = process.stderr
217 ? function(v) { process.stderr.write(v); }
218 : function(v) { console.log('Error:' + v); };
219 ports.stderr.subscribe(handler);
220 }
221 if ('title' in ports) {
222 if (typeof ports.title === 'string') {
223 document.title = ports.title;
224 } else {
225 ports.title.subscribe(function(v) { document.title = v; });
226 }
227 }
228 if ('redirect' in ports) {
229 ports.redirect.subscribe(function(v) {
230 if (v.length > 0) window.location = v;
231 });
232 }
233 if ('favicon' in ports) {
234 if (typeof ports.favicon === 'string') {
235 changeFavicon(ports.favicon);
236 } else {
237 ports.favicon.subscribe(changeFavicon);
238 }
239 }
240 function changeFavicon(src) {
241 var link = document.createElement('link');
242 var oldLink = document.getElementById('elm-favicon');
243 link.id = 'elm-favicon';
244 link.rel = 'shortcut icon';
245 link.href = src;
246 if (oldLink) {
247 document.head.removeChild(oldLink);
248 }
249 document.head.appendChild(link);
250 }
254function filterDeadInputs(inputs) {
255 var temp = [];
256 for (var i = inputs.length; i--; ) {
257 if (isAlive(inputs[i])) temp.push(inputs[i]);
258 }
259 return temp;
263function isAlive(input) {
264 if (!('defaultNumberOfKids' in input)) return true;
265 var len = input.kids.length;
266 if (len === 0) return false;
267 if (len > input.defaultNumberOfKids) return true;
268 var alive = false;
269 for (var i = len; i--; ) {
270 alive = alive || isAlive(input.kids[i]);
271 }
272 return alive;
276//// RENDERING ////
278function initGraphics(elm, Module) {
279 if (!('main' in Module)) {
280 throw new Error("'main' is missing! What do I display?!");
281 }
283 var signalGraph = Module.main;
285 // make sure the signal graph is actually a signal & extract the visual model
286 var Signal = Elm.Signal.make(elm);
287 if (!('recv' in signalGraph)) {
288 signalGraph = Signal.constant(signalGraph);
289 }
290 var currentScene = signalGraph.value;
292 // Add the currentScene to the DOM
293 var Element = Elm.Native.Graphics.Element.make(elm);
294 elm.node.appendChild(Element.render(currentScene));
296 // set up updates so that the DOM is adjusted as necessary.
297 var savedScene = currentScene;
298 var previousDrawId = 0;
299 function domUpdate(newScene) {
300 previousDrawId = draw(previousDrawId, function(_) {
301 Element.update(elm.node.firstChild, savedScene, newScene);
302 if (elm.Native.Window) elm.Native.Window.values.resizeIfNeeded();
303 savedScene = newScene;
304 });
305 }
306 var renderer = A2(Signal.lift, domUpdate, signalGraph);
308 // must check for resize after 'renderer' is created so
309 // that changes show up.
310 if (elm.Native.Window) elm.Native.Window.values.resizeIfNeeded();
312 return renderer;
316// define function for drawing efficiently
317//
318// draw : RequestID -> (() -> ()) -> RequestID
319//
320// Takes a "RequestID" allowing you to cancel old requests if possible.
321// Returns a "RequestID" so you can refer to past requests.
322//
323function draw(previousRequestID, callback) {
324 callback();
325 return previousRequestID;
328var vendors = ['ms', 'moz', 'webkit', 'o'];
329var win = typeof window !== 'undefined' ? window : {};
330for (var i = 0; i < vendors.length && !win.requestAnimationFrame; ++i) {
331 win.requestAnimationFrame = win[vendors[i]+'RequestAnimationFrame'];
332 win.cancelAnimationFrame = win[vendors[i]+'CancelAnimationFrame'] ||
333 win[vendors[i]+'CancelRequestAnimationFrame'];
335if (win.requestAnimationFrame && win.cancelAnimationFrame) {
336 draw = function(previousRequestID, callback) {
337 win.cancelAnimationFrame(previousRequestID);
338 return win.requestAnimationFrame(callback);
339 };
343//// HOT SWAPPING ////
345// Returns boolean indicating if the swap was successful.
346// Requires that the two signal graphs have exactly the same
347// structure.
348function hotSwap(from, to) {
349 function similar(nodeOld,nodeNew) {
350 var idOkay = nodeOld.id === nodeNew.id;
351 var lengthOkay = nodeOld.kids.length === nodeNew.kids.length;
352 return idOkay && lengthOkay;
353 }
354 function swap(nodeOld,nodeNew) {
355 nodeNew.value = nodeOld.value;
356 return true;
357 }
358 var canSwap = depthFirstTraversals(similar, from.inputs, to.inputs);
359 if (canSwap) {
360 depthFirstTraversals(swap, from.inputs, to.inputs);
361 }
362 from.node.parentNode.replaceChild(to.node, from.node);
364 return canSwap;
367// Returns false if the node operation f ever fails.
368function depthFirstTraversals(f, queueOld, queueNew) {
369 if (queueOld.length !== queueNew.length) return false;
370 queueOld = queueOld.slice(0);
371 queueNew = queueNew.slice(0);
373 var seen = [];
374 while (queueOld.length > 0 && queueNew.length > 0) {
375 var nodeOld = queueOld.pop();
376 var nodeNew = queueNew.pop();
377 if (seen.indexOf(nodeOld.id) < 0) {
378 if (!f(nodeOld, nodeNew)) return false;
379 queueOld = queueOld.concat(nodeOld.kids);
380 queueNew = queueNew.concat(nodeNew.kids);
381 seen.push(nodeOld.id);
382 }
383 }
384 return true;
387}());