diff --git a/webgui/lib/props2.js b/webgui/lib/props2.js new file mode 100644 index 000000000..04cf80092 --- /dev/null +++ b/webgui/lib/props2.js @@ -0,0 +1,51 @@ +/** + * Wraps json properties into something like SGPropertyNodes + */ +(function(factory) { + if (typeof define === "function" && define.amd)// AMD. Register as an anonymous module. + define([ + ], factory); else // Browser globals + factory(); +}(function() { + + var SGPropertyNode = function(json) { + this.json = json; + }; + + SGPropertyNode.prototype.getValue = function() { + return this.json.value; + } + + SGPropertyNode.prototype.getName = function() { + return this.json.name; + } + + SGPropertyNode.prototype.getPath = function() { + return this.json.path; + } + + SGPropertyNode.prototype.getIndex = function() { + return this.json.index; + } + + SGPropertyNode.prototype.getChildren = function(name) { + var reply = []; + this.json.children.forEach(function(child) { + if (name && child.name == name) + reply.push(new SGPropertyNode(child)); + }); + return reply; + } + + SGPropertyNode.prototype.getNode = function(name, index) { + if (!index) + index = 0; + for (var i = 0; i < this.json.children.length; i++) { + var child = this.json.children[i]; + if (child.name == name && child.index == index) + return new SGPropertyNode(child); + } + } + + return SGPropertyNode; +})); diff --git a/webgui/main.js b/webgui/main.js index 8f0675b8d..7d9c006cf 100644 --- a/webgui/main.js +++ b/webgui/main.js @@ -12,6 +12,7 @@ require.config({ flotresize : '3rdparty/flot/jquery.flot.resize', flottime : '3rdparty/flot/jquery.flot.time', fgcommand : 'lib/fgcommand', + props : 'lib/props2', sammy: '3rdparty/sammy-latest.min' } }); diff --git a/webgui/topics/Map.js b/webgui/topics/Map.js index 9d7f580b1..17a10a8b0 100644 --- a/webgui/topics/Map.js +++ b/webgui/topics/Map.js @@ -127,10 +127,10 @@ define([ } self.overlays = { - "Track" : trackLayer, + "Flight History" : trackLayer, - "NavDB": L.navdbLayer(), - "AI": L.aiLayer(), + "Navigation Data": L.navdbLayer(), + "Other Traffic": L.aiLayer(), "VFRMap.com Sectionals (US)" : new L.TileLayer('http://vfrmap.com/20140918/tiles/vfrc/{z}/{y}/{x}.jpg', { maxZoom : 12, @@ -229,15 +229,15 @@ define([ } self.mapResize = function(a,b) { - self.overlays.NavDB.invalidate(); + self.overlays["Navigation Data"].invalidate(); } self.mapZoomend = function() { - self.overlays.NavDB.invalidate(); + self.overlays["Navigation Data"].invalidate(); } self.mapMoveend = function() { - self.overlays.NavDB.invalidate(); + self.overlays["Navigation Data"].invalidate(); } self.mapLoad = function(a,b) { diff --git a/webgui/topics/Map/AILayer.js b/webgui/topics/Map/AILayer.js index 96c009110..297e7afc3 100644 --- a/webgui/topics/Map/AILayer.js +++ b/webgui/topics/Map/AILayer.js @@ -2,52 +2,13 @@ if (typeof define === "function" && define.amd) { // AMD. Register as an anonymous module. define([ - 'leaflet', './MapIcons' + 'leaflet', 'props', './MapIcons' ], factory); } else { // Browser globals factory(); } -}(function(leaflet, MAP_ICON) { - - var SGPropertyNode = function(json) { - this.json = json; - }; - - SGPropertyNode.prototype.getValue = function() { - return this.json.value; - } - - SGPropertyNode.prototype.getName = function() { - return this.json.name; - } - - SGPropertyNode.prototype.getPath = function() { - return this.json.path; - } - - SGPropertyNode.prototype.getIndex = function() { - return this.json.index; - } - - SGPropertyNode.prototype.getChildren = function(name) { - var reply = []; - this.json.children.forEach(function(child) { - if (name && child.name == name) - reply.push(new SGPropertyNode(child)); - }); - return reply; - } - - SGPropertyNode.prototype.getNode = function(name, index) { - if (!index) - index = 0; - for (var i = 0; i < this.json.children.length; i++) { - var child = this.json.children[i]; - if (child.name == name && child.index == index) - return new SGPropertyNode(child); - } - } +}(function(leaflet, SGPropertyNode, MAP_ICON) { leaflet.AILayer = leaflet.GeoJSON.extend({ options : { diff --git a/webgui/topics/Simulator/Config.html b/webgui/topics/Simulator/Config.html index 5fd2af241..778300781 100644 --- a/webgui/topics/Simulator/Config.html +++ b/webgui/topics/Simulator/Config.html @@ -1,10 +1,38 @@
-
- AI -
- - -
-
+
+ AI +
+ + +
+
+
+ Multiplayer + +
+ + + +
+
+ +
+
+ + + +
+ +
+
diff --git a/webgui/topics/Simulator/Config.js b/webgui/topics/Simulator/Config.js index c3df2de68..73a750671 100644 --- a/webgui/topics/Simulator/Config.js +++ b/webgui/topics/Simulator/Config.js @@ -1,10 +1,73 @@ define([ - 'jquery', 'knockout', 'text!./Config.html', 'fgcommand', 'kojqui/button', 'kojqui/buttonset' -], function(jquery, ko, htmlString,fgCommand ) { + 'jquery', 'knockout', 'text!./Config.html', 'fgcommand', 'props', 'kojqui/button', 'kojqui/buttonset', 'kojqui/selectmenu', +], function(jquery, ko, htmlString, fgCommand, SGPropertyNode) { function ViewModel(params) { var self = this; + + self.asa = ko.observable(''); - self.aiEnabled = ko.observable().extend({ fgPropertyGetSet: "/sim/traffic-manager/enabled" }); + self.aiEnabled = ko.observable().extend({ + fgPropertyGetSet : "/sim/traffic-manager/enabled" + }); + self.multiplayerHideReplay = ko.observable().extend({ + fgPropertyGetSet : "/sim/traffic-manager/enabled" + }); + + self.callsign = ko.observable().extend({ + fgPropertyGetSet : "/sim/multiplay/callsign" + }); + + self.online = ko.observable().extend({ + fgprop : "/sim/multiplay/online" + }); + + self.offline = ko.pureComputed(function() { + return !self.online(); + }); + + self.selectedServer = ko.observable().extend({ + fgPropertyGetSet : "/sim/multiplay/selected-server" + }); + + self.gotServers = ko.observable().extend({ + fgprop: "/sim/multiplay/got-servers" + }).subscribe(function(newValue) { + if( newValue ) { + self.serverList.removeAll(); + jquery.get('/json/sim/multiplay/server-list?d=3', null, function(data) { + var root = new SGPropertyNode(data); + root.getChildren('server').forEach(function(server){ + if( !server.getNode('online').getValue() ) + return; + self.serverList.push( { + name: server.getNode('name').getValue(), + host: server.getNode('hostname').getValue(), + location: server.getNode('location').getValue(), + port: server.getNode('port').getValue(), + longname: server.getNode('hostname').getValue() + ' - ' + server.getNode('location').getValue(), + }) + }); + + }); + } + }); + + + self.serverList = ko.observableArray([]); + + self.toggleConnect = function() { + if( self.online() ) { + fgCommand.multiplayer({ disconnect: {} }); + } else { + fgCommand.multiplayer({ connect: { + 'servername': self.selectedServer(), + } }); + } + } + + self.serverListVisible = ko.observable(true); + + fgCommand.multiplayer({ refreshserverlist: {} }); } // Return component definition