start adding QMLTextEdit to qt.js

add TextEdit to tests
modified ColumnRow and Widgets in tests

lib/qt.js

@@ -7131,7 +7131,7 @@ global.Easing = {
 var GETTER = "__defineGetter__",
     SETTER = "__defineSetter__",
     Undefined = undefined,
-    // Property that is currently beeing evaluated. Used to get the information
+    // Property that is currently being evaluated. Used to get the information
     // which property called the getter of a certain other property for
     // evaluation and is thus dependant on it.
     evaluatingProperty = undefined,
@@ -9647,7 +9647,6 @@ function QMLFlow(meta) {
         LeftToRight: 0,
         TopToBottom: 1
     }
-
     createSimpleProperty("enum", this, "flow");
     createSimpleProperty("enum", this, "layoutDirection");
     this.flowChanged.connect(this, this.layoutChildren);
@@ -11946,15 +11945,227 @@ registerQmlType({
     }
 });
 
-//And here's how you would use that component in a regular QML file:
-//
-//import MyModule 1.3
-//
-//MyTypeName {
-//  name: 'el nombre'
-//  data: [ 1, 2, 3 ]
-//
-//  onSomethingHappened: console.log(data)
-//}
+registerQmlType({
+    module: 'QtQuick',
+    name:   'TextEdit',
+    versions: /.*/,
+    constructor: function(meta) {
+        QMLItem.call(this, meta);
+
+        var self = this;
+
+        var QMLFont = new getConstructor('QtQuick', '2.0', 'Font');
+        this.font = new getConstructor('QtQuick', '2.0', 'Font')(this);
+
+        this.dom.innerHTML = '<textarea></textarea>'
+        this.dom.firstChild.style.pointerEvents = 'auto';
+        this.dom.firstChild.style.width = '100%';
+        this.dom.firstChild.style.height = '100%';
+        this.dom.firstChild.style.margin = '0';
+
+        // Properties
+        createSimpleProperty('bool', this, 'activeFocusOnPress');
+        createSimpleProperty('url', this, 'baseUrl');
+        createSimpleProperty('bool', this, 'canPaste');
+        createSimpleProperty('bool', this, 'canRedo');
+        createSimpleProperty('bool', this, 'canUndo');
+        createSimpleProperty('color', this, 'color');
+        createSimpleProperty('real', this, 'contentHeight');
+        createSimpleProperty('real', this, 'contentWidth');
+        createSimpleProperty('Component', this, 'cursorDelegate');
+        createSimpleProperty('int', this, 'cursorPosition');
+        createSimpleProperty('rectangle', this, 'cursorRectangle');
+        createSimpleProperty('bool', this, 'cursorVisible');
+        createSimpleProperty('enum', this, 'effectiveHorizontalAlignment');
+        createSimpleProperty('enum', this, 'horizontalAlignment');
+        createSimpleProperty('string', this, 'hoveredLink');
+        createSimpleProperty('bool', this, 'inputMethodComposing');
+        createSimpleProperty('enum', this, 'inputMethodHints');
+        createSimpleProperty('int', this, 'length');
+        createSimpleProperty('int', this, 'lineCount');
+        createSimpleProperty('enum', this, 'mouseSelectionMode');
+        createSimpleProperty('bool', this, 'persistentSelection');
+        createSimpleProperty('bool', this, 'readOnly');
+        createSimpleProperty('enum', this, 'renderType');
+        createSimpleProperty('bool', this, 'selectByKeyboard');
+        createSimpleProperty('bool', this, 'selectByMouse');
+        createSimpleProperty('string', this, 'selectedText');
+        createSimpleProperty('color', this, 'selectedTextColor');
+        createSimpleProperty('color', this, 'selectionColor');
+        createSimpleProperty('int', this, 'selectionEnd');
+        createSimpleProperty('int', this, 'selectionStart');
+        createSimpleProperty('string', this, 'text');
+        createSimpleProperty('TextDocument', this, 'textDocument');
+        createSimpleProperty('enum', this, 'textFormat');
+        createSimpleProperty('real', this, 'textMargin');
+        createSimpleProperty('enum', this, 'verticalAlignment');
+        createSimpleProperty('enum', this, 'wrapMode');
+
+        this.activeFocusOnPress = true;
+        this.baseUrl = undefined;
+        this.canPaste = false;
+        this.canRedo = false;
+        this.canUndo = false;
+        this.color = 'white';
+        this.contentHeight = 0;
+        this.contentWidth = 0;
+        this.cursorDelegate = undefined;
+        this.cursorPosition = 0;
+        this.cursorRectangle = undefined;
+        this.cursorVisible = true;
+        this.effectiveHorizontalAlignment = undefined;
+        this.horizontalAlignment = undefined;
+        this.hoveredLink = undefined;
+        this.inputMethodComposing = undefined;
+        this.inputMethodHints = undefined;
+        this.length = 0;
+        this.lineCount = 0;
+        this.mouseSelectionMode = undefined;
+        this.persistentSelection = false;
+        this.readOnly = false;
+        this.renderType = undefined;
+        this.selectByKeyboard = true;
+        this.selectByMouse = false;
+        this.selectedText = undefined;
+        this.selectedTextColor = 'yellow';
+        this.selectionColor = 'pink';
+        this.selectionEnd = 0;
+        this.selectionStart = 0;
+        this.text = '';
+        this.textDocument = undefined;
+        this.textFormat = undefined;
+        this.textMargin = 0;
+        this.verticalAlignment = undefined;
+        this.wrapMode = undefined;
+
+        // Undo / Redo stacks;
+        this.undoStack = [];
+        this.undoStackPosition = -1;
+        this.redoStack = [];
+        this.redoStackPosition = -1;
+
+        this.dom.firstChild.disabled = false;
+
+        this.Component.completed.connect(this, function() {
+            this.implicitWidth = this.dom.firstChild.offsetWidth;
+            this.implicitHeight = this.dom.firstChild.offsetHeight;
+            this.selectByKeyboard = this.readOnly ? false : true;
+            this.length = this.text.length;
+            this.lineCount = this.text.split(/\n/).length;
+        });
+
+        this.textChanged.connect(this, function(newVal) {
+            this.dom.firstChild.value = newVal;
+        });
+
+        function updateValue(e) {
+            if (self.text != self.dom.firstChild.value) {
+                self.text = self.dom.firstChild.value;
+            }
+        }
+
+        // Signals
+        this.linkActivated = Signal([
+            {type: 'string', name: 'link'}]);
+        this.linkHovered = Signal([
+            {type: 'string', name: 'link'}]);
+
+        // Methods
+        var append = (function append(text) {
+            this.text += text;
+        }).bind(this);
+
+        var copy = (function copy() {
+            // TODO
+            // copyToClipboard(this.selectedText);
+        }).bind(this);
+
+        var cut = (function cut() {
+            this.text =
+                this.text(0, this.selectionStart)
+                + this.text(this.selectionEnd, this.text.length);
+            // TODO
+            // moveToClipboard(this.selectedTex);
+        }).bind(this);
+
+        var deselect = (function deselect() {
+            //this.selectionStart = -1;
+            //this.selectionEnd = -1;
+            //this.selectedText = null;
+        }).bind(this);
+
+        var getFormattedText = (function getFormattedText(start, end) {
+            var text = this.text.slice(start, end);
+            // TODO
+            // process text
+            return text;
+        }).bind(this);
+
+        var getText = (function getText(start, end) {
+            return this.text.slice(start, end);
+        }).bind(this);
+
+        var insert = (function getText(position, text) {
+            // TODO
+        }).bind(this);
+
+        var isRightToLeft = (function isRightToLeft(start, end) {
+            // TODO
+        }).bind(this);
+
+        var linkAt = (function linkAt(x, y) {
+            // TODO
+        }).bind(this);
+
+        var moveCursorSelection = (function moveCursorSelection(x, y) {
+            // TODO
+        }).bind(this);
+
+        var paste = (function paste() {
+            // TODO
+        }).bind(this);
+
+        var positionAt = (function positionAt(x, y) {
+            // TODO
+            // return cursor value
+        }).bind(this);
+
+        var positionToRectangle = (function positionToRectangle(position) {
+            // TODO
+            // return rectangle
+        }).bind(this);
+
+        var redo = (function redo() {
+            // TODO
+        }).bind(this);
+
+        var remove = (function remove(start, end) {
+            // TODO
+            // return text from start to end
+        }).bind(this);
+
+        var select = (function select(start, end) {
+            // TODO
+        }).bind(this);
+
+        var selectAll = (function selectAll() {
+            //this.selectionStart = 0;
+            //this.selectionEnd = this.text.length;
+            //this.selectedText = this.text;
+        }).bind(this);
+
+        var selectWord = (function selectWord() {
+            // TODO
+            // return text from start to end
+        }).bind(this);
+
+        var undo = (function undo() {
+            // TODO
+        }).bind(this);
+
+        this.dom.firstChild.oninput = updateValue;
+        this.dom.firstChild.onpropertychanged = updateValue;
+    }
+});
 
 })(typeof global != 'undefined' ? global : window);

tests/ColumnRow.qml

@@ -33,7 +33,7 @@ Rectangle {
     }
 
     Row {
-        x: col.right - 80
+        x: col.right - 30
         y: 120
         spacing: 20
 
@@ -52,9 +52,10 @@ Rectangle {
                 width: 120
                 height: 32
                 x: 10
-                border.width: 1
-                border.color: 'gray'
-                radius: 3
+                border.width: 2
+                border.color: 'black'
+                radius: 8
+                color: '#111'
                 Rectangle {
                     id: planet_color
                     x: 5
@@ -69,6 +70,7 @@ Rectangle {
                     anchors.left: planet_color.right + 8
                     anchors.verticalCenter: parent.verticalCenter
                     font.pointSize: 16
+                    color: 'white'
                     text: name
                 }
             }

tests/TextEdit.qml

@@ -0,0 +1,47 @@
+import QtQuick 2.0
+import QtQuick.Controls 1.0
+
+Rectangle {
+    id: page
+    color: 'white'
+    width: 500
+
+    Text {
+        id: title
+        anchors.horizontalCenter: text_edit.horizontalCenter
+        font.pointSize: 28
+        font.bold: true
+        color: '#00a'
+        text: '<b><u>TextEdit</u></b>'
+    }
+    TextEdit {
+        id: text_edit
+        width: 500
+        height: 400
+        anchors.top: title.bottom + 30
+        anchors.left: 100
+        font.bold: true
+
+        text:
+'Habe nun, ach! Philosophie,
+Juristerei und Medizin,
+Und leider auch Theologie
+Durchaus studiert, mit heißem Bemühn.
+Da steh ich nun, ich armer Tor!
+Und bin so klug als wie zuvor;
+Heiße Magister, heiße Doktor gar
+Und ziehe schon an die zehen Jahr
+Herauf, herab und quer und krumm
+Meine Schüler an der Nase herum'
+    }
+
+    Text {
+        id: info
+        anchors.left: text_edit.left
+        anchors.top: text_edit.bottom + 20
+        color: 'red'
+        font.pointSize: 16
+        text: 'Lines = ' + text_edit.lineCount + '  '
+            + 'Chars = ' + text_edit.length
+    }
+}

tests/Widgets.qml

@@ -4,7 +4,8 @@ import QtQuick.Controls 1.0
 Rectangle {
     id: page
     color: 'white'
-    width: 500; height: 500
+    width: 500
+    //height: 500
 
     Text {
         id: title
@@ -57,6 +58,7 @@ Rectangle {
 
         onAccepted: {
             info.text = text;
+            text_edit.text = text;
         }
     }
 
@@ -95,6 +97,7 @@ Rectangle {
     }
 
     TextArea {
+        id: text_area
         x: 280
         y: 280
         width: 200
@@ -103,14 +106,32 @@ Rectangle {
         anchors.left: grid.left
         font.bold: true
 
-        text: 'Hi,\nI am a TextArea!\n\n' + 'The checkbox is ' + (checkbox.checked ? '' : 'not ') + 'checked.'
+        text: 'Hi,\nI am a TextArea!\n\n' + 'The checkbox is '
+            + (checkbox.checked ? '' : 'not ') + 'checked.'
     }
 
     Text {
+        id: final
         anchors.horizontalCenter: page.horizontalCenter
-        anchors.bottom: page.bottom
+        anchors.bottom: page.bottom - 20
         color: 'red'
         font.pointSize: 20
         text: '<u>More Widgets to follow ...</u>'
     }
+
+    TextEdit {
+        id: text_edit
+        x: 280
+        y: 280
+        width: 200
+        height: 100
+        anchors.top: text_area.bottom + 10
+        anchors.left: grid.left
+        font.bold: true
+
+        text: 'Hi,\nI am a TextEdit in making!\n\nMy char count is '
+            + length + '\nI have '
+            + lineCount + ' lines \nselectByKeyboard ' + selectByKeyboard
+            + '\nselectByMouse ' + selectByMouse
+    }
 }