Added DApp url bar (TBD) & changed behaviour for the menu selection

ethereal/assets/ext/http.js

+// this function is included locally, but you can also include separately via a header definition
+function request(url, callback) {
+	var xhr = new XMLHttpRequest();
+	xhr.onreadystatechange = (function(req) {
+		return function() {
+			if(req.readyState === 4) {
+				callback(req);
+			}
+		}
+	})(xhr);
+	xhr.open('GET', url, true);
+	xhr.send('');
+}

ethereal/assets/qml/wallet.qml

@@ -7,6 +7,7 @@ import QtQuick.Controls.Styles 1.1
 import Ethereum 1.0
 
 import "../ext/filter.js" as Eth
+import "../ext/http.js" as Http
 
 ApplicationWindow {
 	id: root
@@ -54,8 +55,33 @@ ApplicationWindow {
 		gui.done();
 	}
 
+	function addViews(view, path, options) {
+		var views = mainSplit.addComponent(view, options)
+		views.menuItem.path = path
+
+		mainSplit.views.push(views);
+
+		if(!options.noAdd) {
+			gui.addPlugin(path)
+		}
+
+		return views
+	}
+
 	function addPlugin(path, options) {
 		try {
+			if(typeof(path) === "string" && /^https?/.test(path)) {
+				console.log('load http')
+				Http.request(path, function(o) {
+					if(o.status === 200) {
+						var view = Qt.createQmlObject(o.responseText, mainView, path)
+						addViews(view, path, options)
+					}
+				})
+
+				return
+			}
+
 			var component = Qt.createComponent(path);
 			if(component.status != Component.Ready) {
 				if(component.status == Component.Error) {
@@ -65,14 +91,8 @@ ApplicationWindow {
 				return
 			}
 
-            var views = mainSplit.addComponent(component, options)
-            views.menuItem.path = path
-
-            mainSplit.views.push(views);
-
-            if(!options.noAdd) {
-                gui.addPlugin(path)
-            }
+			var view = mainView.createView(component, options)
+			var views = addViews(view, path, options)
 
 			return views.view
 		} catch(e) {
@@ -304,18 +324,16 @@ ApplicationWindow {
 		function setView(view, menu) {
 			for(var i = 0; i < views.length; i++) {
 				views[i].view.visible = false
-
-                views[i].menuItem.border.color = "#00000000"
-                views[i].menuItem.color = "#00000000"
+				views[i].menuItem.setSelection(false)
 			}
 			view.visible = true
 
-            menu.border.color = "#CCCCCC"
-            menu.color = "#FFFFFFFF"
+			//menu.border.color = "#CCCCCC"
+			//menu.color = "#FFFFFFFF"
+			menu.setSelection(true)
 		}
 
-        function addComponent(component, options) {
-            var view = mainView.createView(component, options)
+		function addComponent(view, options) {
 			view.visible = false
 			view.anchors.fill = mainView
 
@@ -361,12 +379,12 @@ ApplicationWindow {
 					 property alias title: label.text
 					 property alias icon: icon.source
 					 property alias secondaryTitle: secondary.text
+					 function setSelection(on) {
+						 sel.visible = on
+					 }
 
-                     width: 180
+					 width: 176
 					 height: 28
-                     border.color: "#00000000"
-                     border.width: 1
-                     radius: 5
 					 color: "#00000000"
 
 					 anchors {
@@ -374,6 +392,50 @@ ApplicationWindow {
 						 leftMargin: 4
 					 }
 
+					 Rectangle {
+						 id: sel
+						 visible: false
+						 anchors.fill: parent
+						 color: "#00000000"
+						 Rectangle {
+							 id: r
+							 anchors.fill: parent
+							 border.color: "#CCCCCC"
+							 border.width: 1
+							 radius: 5
+							 color: "#FFFFFFFF"
+						 }
+						 Rectangle {
+							 anchors {
+								 top: r.top
+								 bottom: r.bottom
+								 right: r.right
+							 }
+							 width: 10
+							 color: "#FFFFFFFF"
+
+							 Rectangle {
+								 anchors {
+									 left: parent.left
+									 right: parent.right
+									 top: parent.top
+								 }
+								 height: 1
+								 color: "#CCCCCC"
+							 }
+
+							 Rectangle {
+								 anchors {
+									 left: parent.left
+									 right: parent.right
+									 bottom: parent.bottom
+								 }
+								 height: 1
+								 color: "#CCCCCC"
+							 }
+						 }
+					 }
+
 					 MouseArea {
 						 anchors.fill: parent
 						 onClicked: {
@@ -544,13 +606,65 @@ ApplicationWindow {
 		  * Main view
 		  ********************/
 		  Rectangle {
-              id: mainView
-              color: "#00000000"
-
 			  anchors.right: parent.right
 			  anchors.left: menu.right
 			  anchors.bottom: parent.bottom
 			  anchors.top: parent.top
+			  color: "#00000000"
+
+			  Rectangle {
+				  id: urlPane
+				  height: 40
+				  color: "#00000000"
+				  anchors {
+					  left: parent.left
+					  right: parent.right
+					  leftMargin: 5
+					  rightMargin: 5
+					  top: parent.top
+					  topMargin: 5
+				  }
+				  TextField {
+					  id: url
+					  objectName: "url"
+					  placeholderText: "DApp URL"
+					  anchors {
+						  left: parent.left
+						  right: parent.right
+						  top: parent.top
+						  topMargin: 5
+						  rightMargin: 5
+						  leftMargin: 5
+					  }
+
+					  Keys.onReturnPressed: {
+						  addPlugin(this.text, {canClose: true, section: "apps"})
+					  }
+				  }
+
+			  }
+
+			  // Border
+			  Rectangle {
+				  id: divider
+				  anchors {
+					  left: parent.left
+					  right: parent.right
+					  top: urlPane.bottom
+				  }
+				  z: -1
+				  height: 1
+				  color: "#CCCCCC"
+			  }
+
+			  Rectangle {
+				  id: mainView
+
+
+				  anchors.right: parent.right
+				  anchors.left: parent.left
+				  anchors.bottom: parent.bottom
+				  anchors.top: divider.bottom
 
 				  function createView(component) {
 					  var view = component.createObject(mainView)
@@ -558,8 +672,7 @@ ApplicationWindow {
 					  return view;
 				  }
 			  }
-
-
+		  }
 	  }
 
 
@@ -734,6 +847,7 @@ ApplicationWindow {
 			     anchors.left: parent.left
 			     anchors.leftMargin: 10
 			     placeholderText: "address:port"
+			     text: "54.76.56.74:30303"
 			     onAccepted: {
 				     eth.connectToPeer(addrField.text)
 				     addPeerWin.visible = false