on master help sign in
Fix behavior of customButton to avoid flicker.
545be51evancz
libraries/Native/Graphics/Input.js+19−7
@@ -58,15 +58,27 @@ Elm.Native.Graphics.Input = function(elm) {
58 btn.elmHover = Render.render(model.hover);
58 btn.elmHover = Render.render(model.hover);
59 btn.elmDown = Render.render(model.down);
59 btn.elmDown = Render.render(model.down);
60
60
61− function replace(node) { return function() {
61+ function replace(node) {
62 if (node !== btn.firstChild) btn.replaceChild(node, btn.firstChild);
62 if (node !== btn.firstChild) btn.replaceChild(node, btn.firstChild);
63− };
64 }
63 }
64+ var overCount = 0;
65+ function over(e) {
66+ if (overCount++ > 0) return;
65− var hover = replace(btn.elmHover);
67+ replace(btn.elmHover);
68+ }
69+ function out(e) {
70+ if (btn.contains(e.toElement || e.relatedTarget)) return;
71+ overCount = 0;
72+ replace(btn.elmUp);
73+ }
74+ function up() {
75+ replace(btn.elmHover);
66− function up() { hover(); elm.notify(events.id, btn.elmEvent); }
76+ elm.notify(events.id, btn.elmEvent);
77+ }
78+ function down() { replace(btn.elmDown); }
67− btn.addEventListener('mouseover', hover);
79+ btn.addEventListener('mouseover', over);
68− btn.addEventListener('mouseout' , replace(btn.elmUp));
80+ btn.addEventListener('mouseout' , out);
69− btn.addEventListener('mousedown', replace(btn.elmDown));
81+ btn.addEventListener('mousedown', down);
70 btn.addEventListener('mouseup' , up);
82 btn.addEventListener('mouseup' , up);
71
83
72 btn.appendChild(btn.elmUp);
84 btn.appendChild(btn.elmUp);
runtime/Render/Element.js+1−1
@@ -5,7 +5,7 @@ ElmRuntime.Render.Element = function() {
5var Utils = ElmRuntime.use(ElmRuntime.Render.Utils);
5var Utils = ElmRuntime.use(ElmRuntime.Render.Utils);
6var newElement = Utils.newElement, addTo = Utils.addTo, extract = Utils.extract,
6var newElement = Utils.newElement, addTo = Utils.addTo, extract = Utils.extract,
7 addTransform = Utils.addTransform, removeTransform = Utils.removeTransform,
7 addTransform = Utils.addTransform, removeTransform = Utils.removeTransform,
8− fromList = Utils.fromList;
8+ fromList = Utils.fromList, eq = Utils.eq;
9
9
10function setProps(props, e) {
10function setProps(props, e) {
11 e.style.width = (props.width |0) + 'px';
11 e.style.width = (props.width |0) + 'px';