yogsototh/elm
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Improve behavior of text field updates, but not entirely

Browse source 
Still need to fix behavior of copy/paste and undo.
This commit is contained in:
Evan Czaplicki 2014-02-22 15:55:27 -05:00
parent 9113907bcd
commit 162141b5bd
1 changed files with 40 additions and 28 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

68
libraries/Native/Graphics/Input.js
View file

@ -217,7 +217,11 @@ Elm.Native.Graphics.Input.make = function(elm) {
function renderField(model) {
var field = newNode('input');
field.style.border = 'none';
field.style.outline = 'none';
field.style.backgroundColor = 'transparent';
field.style.pointerEvents = 'auto';
field.elm_signal = model.signal;
field.elm_handler = model.handler;
@ -227,53 +231,61 @@ Elm.Native.Graphics.Input.make = function(elm) {
var selection = model.content.selection;
var direction = selection.direction.ctor === 'Forward' ? 'forward' : 'backward';
setRange(field, selection.start, selection.end, direction);
field.style.border = 'none';
function update() {
var direction = field.selectionDirection === 'backward' ? 'Backward' : 'Forward';
function keyUpdate(event) {
var curr = field.value;
var next = (curr.slice(0, field.selectionStart) +
String.fromCharCode(event.keyCode) +
curr.slice(field.selectionEnd));
var pos = field.selectionEnd + 1;
elm.notify(field.elm_signal.id, field.elm_handler({
_:{},
string:JS.toString(field.value),
string: JS.toString(next),
selection: {
start:field.selectionStart,
end:field.selectionEnd,
direction: { ctor:direction }
start: pos,
end: pos,
direction: { ctor:'Forward' }
},
}));
event.preventDefault();
}
function mouseUpdate(event) {
var direction = field.selectionDirection === 'forward' ? 'Forward' : 'Backward';
elm.notify(field.elm_signal.id, field.elm_handler({
_:{},
string: field.value,
selection: {
start: field.selectionStart,
end: field.selectionEnd,
direction: { ctor: direction }
},
}));
}
function mousedown() {
update();
function mousedown(event) {
mouseUpdate(event);
elm.node.addEventListener('mouseup', mouseup);
}
function mouseup() {
update();
function mouseup(event) {
mouseUpdate(event);
elm.node.removeEventListener('mouseup', mouseup)
}
field.addEventListener('keyup', update);
field.addEventListener('keypress', keyUpdate);
field.addEventListener('mousedown', mousedown);
return field;
}
function updateField(node, oldModel, newModel) {
node.elmHandler = newModel.handler;
var newStr = JS.fromString(newModel.content.string);
if (node.value !== newStr) node.value = newStr;
function updateField(field, oldModel, newModel) {
field.elm_signal = newModel.signal;
field.elm_handler = newModel.handler;
field.type = newModel.type;
field.placeholder = JS.fromString(newModel.placeHolder);
field.value = JS.fromString(newModel.content.string);
var selection = newModel.content.selection;
var start = selection.start;
var end = selection.end;
var direction = selection.direction.ctor === 'Forward' ? 'forward' : 'backward';
if (end < start) {
start = end;
end = selection.start;
}
if (node.selectionStart !== start
|| node.selectionEnd !== end
|| node.selectionDirection !== direction) {
setRange(node, start, end, direction);
}
setRange(field, selection.start, selection.end, direction);
}
function mkField(type) {