Implemented basic command mode

Exposes access to the application via JavaScript to the user.
This will enable easy configuration changes as well as make more complex commands possible.

All JavaScript entered in command mode is evaluated at the application root.

5 files changed, 192 insertions, 85 deletions

diff --git a/qml/CommandInput.qml b/qml/CommandInput.qml
new file mode 100644
index 0000000..835ccae
--- /dev/null
+++ b/qml/CommandInput.qml
@@ -0,0 +1,63 @@
+import QtQuick 2.0
+import QtQuick.Layouts 1.1
+import Qt.labs.settings 1.0
+
+Item {
+	id: item
+
+	visible: false
+
+	Settings {
+		id: settings
+		category: "command"
+
+		property color  background : "black"
+		property int    fontSize   : 12
+		property string fontFamily : "Monospace"
+		property color  fontColor  : "white"
+	}
+
+	function focus() {
+		visible = true;
+		command.forceActiveFocus();
+	}
+
+	function unfocus() {
+		visible = false;
+	}
+
+	Rectangle {
+		anchors.fill: parent
+		color: settings.background
+
+		TextInput {
+			id: command
+
+			font {
+				family:    settings.fontFamily
+				pointSize: settings.fontSize
+			}
+
+			color:             settings.fontColor
+			selectionColor:    settings.fontColor
+			selectedTextColor: settings.background
+			text: ":"
+
+			selectByMouse:    true
+
+			onAccepted: {
+				const prefix = String(text).charAt(0);
+				const cmd    = String(text).substring(1, String(text).length);
+
+				switch ( prefix ) {
+					case ':': {
+						eval(cmd);
+						text = ':';
+						break;
+					}
+					default: { }
+				}
+			}
+		}
+	}
+}
diff --git a/qml/EmbeddedTerminal.qml b/qml/EmbeddedTerminal.qml
index 4e13131..d2cab9e 100644
--- a/qml/EmbeddedTerminal.qml
+++ b/qml/EmbeddedTerminal.qml
@@ -69,7 +69,7 @@ Item {
 				}
 
 				shellProgramArgs: {
-					var elements = (item.program).split(" ");
+					const elements = (item.program).split(" ");
 					elements.shift();
 
 					return elements;
diff --git a/qml/StateHandler.qml b/qml/StateHandler.qml
index 4d226c9..8c78e2f 100644
--- a/qml/StateHandler.qml
+++ b/qml/StateHandler.qml
@@ -5,7 +5,8 @@ import Qt.labs.settings 1.0
 Item {
 	id: item
 
-	property Item terminalList : null
+	property Item         terminalList : null
+	property CommandInput commandInput : null
 
 	Settings {
 		id: settings
@@ -13,6 +14,7 @@ Item {
 
 		property string insertMode   : "i"
 		property string normalMode   : "Shift+ESC"
+		property string commandMode  : ":"
 		property string nextItem     : "j"
 		property string prevItem     : "k"
 		property string firstItem    : "g"
@@ -32,8 +34,9 @@ Item {
 		State {
 			name: "NORMAL"
 
-			PropertyChanges { target: escapeInsertAction;     enabled: false }
+			PropertyChanges { target: enterNormalAction;      enabled: false }
 			PropertyChanges { target: enterInsertAction;      enabled: true  }
+			PropertyChanges { target: enterCommandAction;     enabled: true  }
 			PropertyChanges { target: nextTerminalAction;     enabled: true  }
 			PropertyChanges { target: heightenTerminalAction; enabled: true  }
 			PropertyChanges { target: shortenTerminalAction;  enabled: true  }
@@ -45,8 +48,23 @@ Item {
 		State {
 			name: "INSERT"
 
-			PropertyChanges { target: escapeInsertAction;     enabled: true  }
+			PropertyChanges { target: enterNormalAction;      enabled: true  }
 			PropertyChanges { target: enterInsertAction;      enabled: false }
+			PropertyChanges { target: enterCommandAction;     enabled: false }
+			PropertyChanges { target: nextTerminalAction;     enabled: false }
+			PropertyChanges { target: heightenTerminalAction; enabled: false }
+			PropertyChanges { target: shortenTerminalAction;  enabled: false }
+			PropertyChanges { target: prevTerminalAction;     enabled: false }
+			PropertyChanges { target: lastTerminalAction;     enabled: false }
+			PropertyChanges { target: firstTerminalAction;    enabled: false }
+			PropertyChanges { target: resetTerminalAction;    enabled: false }
+		},
+		State {
+			name: "COMMAND"
+
+			PropertyChanges { target: enterNormalAction;      enabled: true  }
+			PropertyChanges { target: enterInsertAction;      enabled: false }
+			PropertyChanges { target: enterCommandAction;     enabled: false }
 			PropertyChanges { target: nextTerminalAction;     enabled: false }
 			PropertyChanges { target: heightenTerminalAction; enabled: false }
 			PropertyChanges { target: shortenTerminalAction;  enabled: false }
@@ -58,6 +76,18 @@ Item {
 	]
 
 	Action {
+		id: enterNormalAction
+		shortcut: settings.normalMode
+		onTriggered: {
+			item.state = "NORMAL";
+
+            terminalList.forceActiveFocus();
+			terminalList.unfocusCurrent();
+			commandInput.unfocus();
+		}
+	}
+
+	Action {
 		id: enterInsertAction
 		shortcut: settings.insertMode
 		onTriggered: {
@@ -68,13 +98,12 @@ Item {
 	}
 
 	Action {
-		id: escapeInsertAction
-		shortcut: settings.normalMode
+		id: enterCommandAction
+		shortcut: settings.commandMode
 		onTriggered: {
-			item.state = "NORMAL";
+			item.state = "COMMAND";
 
-            terminalList.forceActiveFocus();
-			terminalList.unfocusCurrent();
+			commandInput.focus();
 		}
 	}
 
diff --git a/qml/main.qml b/qml/main.qml
index 19d19fc..2b81fe2 100644
--- a/qml/main.qml
+++ b/qml/main.qml
@@ -1,6 +1,7 @@
 import QtQuick 2.0
 import QtQuick.Window 2.0
 import QtQuick.Controls 1.2
+import QtQuick.Layouts 1.1
 import Qt.labs.settings 1.0
 
 ApplicationWindow {
@@ -12,7 +13,7 @@ ApplicationWindow {
 		id: settings
 		category: "window"
 
-		property color background : "#161616"
+		property color background  : "#161616"
 	}
 
 	color: settings.background
@@ -22,115 +23,128 @@ ApplicationWindow {
 		terminalList.focusCurrent();
 	}
 
-	Flickable {
-		id: terminalListFlickable
-
+	ColumnLayout {
 		anchors.fill: parent
 
-		boundsBehavior: Flickable.StopAtBounds
-		contentHeight:  terminalList.height
-		contentWidth:   parent.width
-		pixelAligned:   true
-
-		Column {
-			id: terminalList
+		Flickable {
+			id: terminalListFlickable
 
-			property int activeItem : 0
-			property int itemIndex  : 0
+			Layout.fillHeight: true
+			Layout.fillWidth:  true
 
-			anchors {
-				left:  parent.left
-				right: parent.right
-			}
+			boundsBehavior: Flickable.StopAtBounds
+			contentHeight:  terminalList.height
+			contentWidth:   parent.width
+			pixelAligned:   true
 
-			spacing: 10
+			Column {
+				id: terminalList
 
-			onHeightChanged: scrollTo(activeItem)
+				property int activeItem : 0
+				property int itemIndex  : 0
 
-			function onItemExecuted(index) {
-				if ( index === (children.length - 1) ) {
-					createItem();
+				anchors {
+					left:  parent.left
+					right: parent.right
 				}
-			}
 
-			function createItem() {
-				var terminalItem = Qt.createComponent("qrc:/TerminalItem.qml");
-				var instantiateTerminal = function() {
-					var instance = terminalItem.createObject(terminalList, {
-						"index": itemIndex,
-						"width": terminalListFlickable.width
-					});
-					instance.onExecuted.connect(onItemExecuted);
+				spacing: 10
 
-					++itemIndex;
-				}
+				onHeightChanged: scrollTo(activeItem)
 
-				if ( terminalItem.status === Component.Ready ) {
-					instantiateTerminal();
-				} else {
-					terminalItem.statusChanged.connect(instantiateTerminal);
+				function onItemExecuted(index) {
+					if ( index === (children.length - 1) ) {
+						createItem();
+					}
 				}
-			}
 
-			function scrollTo(index) {
-				if ( terminalList.height >= terminalListFlickable.height ) {
-					var offset = children[index].y
-					           + (children[index].height       / 2)
-					           - (terminalListFlickable.height / 2);
+				function createItem() {
+					var terminalItem = Qt.createComponent("qrc:/TerminalItem.qml");
+					var instantiateTerminal = function() {
+						var instance = terminalItem.createObject(terminalList, {
+							"index": itemIndex,
+							"width": terminalListFlickable.width
+						});
+						instance.onExecuted.connect(onItemExecuted);
 
-					var bound  = terminalList.height
-					           - terminalListFlickable.height;
+						++itemIndex;
+					}
 
-					if ( offset < 0 ) {
-						terminalListFlickable.contentY = 0;
-					} else if ( offset >= bound ) {
-						terminalListFlickable.contentY = bound;
+					if ( terminalItem.status === Component.Ready ) {
+						instantiateTerminal();
 					} else {
-						terminalListFlickable.contentY = offset;
+						terminalItem.statusChanged.connect(instantiateTerminal);
 					}
 				}
-			}
 
-			function selectItem(index) {
-				children[activeItem].deselect();
-				children[index     ].select();
+				function scrollTo(index) {
+					if ( terminalList.height >= terminalListFlickable.height ) {
+						var offset = children[index].y
+								   + (children[index].height       / 2)
+								   - (terminalListFlickable.height / 2);
+
+						var bound  = terminalList.height
+								   - terminalListFlickable.height;
+
+						if ( offset < 0 ) {
+							terminalListFlickable.contentY = 0;
+						} else if ( offset >= bound ) {
+							terminalListFlickable.contentY = bound;
+						} else {
+							terminalListFlickable.contentY = offset;
+						}
+					}
+				}
 
-				activeItem = index;
+				function selectItem(index) {
+					children[activeItem].deselect();
+					children[index     ].select();
 
-				scrollTo(index);
-			}
+					activeItem = index;
 
-			function selectNext() {
-				if ( activeItem < (children.length - 1) ) {
-					selectItem(activeItem + 1);
-				} else {
-					state.enterInsertMode();
+					scrollTo(index);
 				}
-			}
 
-			function selectPrev() {
-				if ( activeItem > 0 ) {
-					selectItem(activeItem - 1);
+				function selectNext() {
+					if ( activeItem < (children.length - 1) ) {
+						selectItem(activeItem + 1);
+					} else {
+						state.enterInsertMode();
+					}
 				}
-			}
 
-			function focusCurrent() {
-				children[activeItem].forceActiveFocus();
-			}
+				function selectPrev() {
+					if ( activeItem > 0 ) {
+						selectItem(activeItem - 1);
+					}
+				}
 
-			function unfocusCurrent() {
-				children[activeItem].unfocus();
-			}
+				function focusCurrent() {
+					children[activeItem].forceActiveFocus();
+				}
+
+				function unfocusCurrent() {
+					children[activeItem].unfocus();
+				}
 
-			function getCurrent() {
-				return children[activeItem];
+				function getCurrent() {
+					return children[activeItem];
+				}
 			}
-        }
+		}
+
+		CommandInput {
+			id: command
+
+			Layout.fillWidth: true
+			height: 20
+		}
 	}
 
 	StateHandler {
 		id: state
 
 		terminalList: terminalList
+		commandInput: command
 	}
 }
diff --git a/qml/ui.qrc b/qml/ui.qrc
index 1bc4c62..ae9e8e7 100644
--- a/qml/ui.qrc
+++ b/qml/ui.qrc
@@ -5,5 +5,6 @@
 		<file>TerminalItem.qml</file>
 		<file>EmbeddedTerminal.qml</file>
 		<file>Highlighter.qml</file>
+		<file>CommandInput.qml</file>
 	</qresource>
 </RCC>