Removed dialog logic from the Topo2Map Class
Change-Id: I2e89c911d904feb7226160ee368459d04a3ddc32
diff --git a/web/gui/src/main/webapp/app/view/topo2/topo2Map.js b/web/gui/src/main/webapp/app/view/topo2/topo2Map.js
index 4576528..7176a76 100644
--- a/web/gui/src/main/webapp/app/view/topo2/topo2Map.js
+++ b/web/gui/src/main/webapp/app/view/topo2/topo2Map.js
@@ -22,56 +22,16 @@
(function () {
'use strict';
- var $log, $loc, wss, ps, ms, t2ds, sus;
+ // Injected Services
+ var $loc, ps, ms, sus, countryFilters;
+
+ // Injected Classes
+ var MapSelectionDialog;
// internal state
- var mapG, order, maps, map, mapItems, tintCheck, messageHandlers;
-
- // constants
- var mapRequest = 'mapSelectorRequest';
-
- var countryFilters = {
- s_america: function (c) {
- return c.properties.continent === 'South America';
- },
-
- ns_america: function (c) {
- return c.properties.custom === 'US-cont' ||
- c.properties.subregion === 'Central America' ||
- c.properties.continent === 'South America';
- },
-
- japan: function (c) {
- return c.properties.geounit === 'Japan';
- },
-
- europe: function (c) {
- return c.properties.continent === 'Europe';
- },
-
- italy: function (c) {
- return c.properties.geounit === 'Italy';
- },
-
- uk: function (c) {
- // technically, Ireland is not part of the United Kingdom,
- // but the map looks weird without it showing.
- return c.properties.adm0_a3 === 'GBR' ||
- c.properties.adm0_a3 === 'IRL';
- },
-
- s_korea: function (c) {
- return c.properties.adm0_a3 === 'KOR';
- },
-
- australia: function (c) {
- return c.properties.adm0_a3 === 'AUS';
- }
- };
+ var mapG;
function init(zoomLayer) {
-
- start();
return setUpMap(zoomLayer);
}
@@ -80,7 +40,7 @@
mapId = prefs.mapid,
mapFilePath = prefs.mapfilepath,
mapScale = prefs.mapscale,
- tint = prefs.tint,
+ loadMap = ms.loadMapInto,
promise, cfilter;
mapG = d3.select('#topo-map');
@@ -93,36 +53,20 @@
});
}
- cfilter = countryFilters[mapId] || countryFilters.uk;
-
if (mapFilePath === '*countries') {
-
cfilter = countryFilters[mapId] || countryFilters.uk;
-
- promise = ms.loadMapRegionInto(mapG, {
- countryFilter: cfilter,
- adjustScale: mapScale,
- shading: ''
- });
- } else {
-
- promise = ms.loadMapInto(mapG, mapFilePath, mapId, {
- adjustScale: mapScale,
- shading: ''
- });
+ loadMap = ms.loadMapRegionInto
}
+ promise = loadMap(mapG, mapFilePath, mapId, {
+ countryFilters: cfilter,
+ adjustScale: mapScale,
+ shading: ''
+ });
+
return promise;
}
- function start() {
- wss.bindHandlers(messageHandlers);
- }
-
- function stop() {
- wss.unbindHandlers(messageHandlers);
- }
-
function currentMap() {
return ps.getPrefs(
'topo_mapid',
@@ -136,10 +80,6 @@
);
}
- function openMapSelection() {
- wss.sendEvent(mapRequest);
- }
-
function opacifyMap(b) {
mapG.transition()
.duration(1000)
@@ -152,56 +92,6 @@
opacifyMap(true);
}
- function dOk() {
- var p = {
- mapid: map.id,
- mapscale: map.scale,
- mapfilepath: map.filePath,
- tint: 'off'
- // tint: tintCheck.property('checked') ? 'on' : 'off'
- };
- setMap(p);
- $log.debug('Dialog OK button clicked');
- }
-
- function dClose() {
- $log.debug('Dialog Close button clicked (or Esc pressed)');
- }
-
- function selectMap() {
- map = maps[this.options[this.selectedIndex].value];
- $log.info('Selected map', map);
- }
-
- function createListContent() {
- var content = t2ds.createDiv('map-list'),
- form = content.append('form'),
- current = currentMap();
- map = maps[current.mapid];
- mapItems = form.append('select').on('change', selectMap);
- order.forEach(function (id) {
- var m = maps[id];
- mapItems.append('option')
- .attr('value', m.id)
- .attr('selected', m.id === current.mapid ? true : null)
- .text(m.description);
- });
-
- return content;
- }
-
- function handleMapResponse(data) {
- $log.info('Got response', data);
- order = data.order;
- maps = data.maps;
- t2ds.openDialog()
- .setTitle('Select Map')
- .addContent(createListContent())
- .addOk(dOk, 'OK')
- .addCancel(dClose, 'Close')
- .bindKeys();
- }
-
// TODO: -- START -- Move to dedicated module
var prefsState = {};
@@ -211,8 +101,7 @@
}
function _togSvgLayer(x, G, tag, what) {
- var on = (x === 'keyev') ? !sus.visible(G) : !!x,
- verb = on ? 'Show' : 'Hide';
+ var on = (x === 'keyev') ? !sus.visible(G) : Boolean(x);
sus.visible(G, on);
updatePrefsState(tag, on);
// flash.flash(verb + ' ' + what);
@@ -223,29 +112,35 @@
_togSvgLayer(x, mapG, 'bg', 'background map');
}
+ function openMapSelection() {
+
+ // TODO: Create a view class with extend method
+ MapSelectionDialog.prototype.currentMap = currentMap;
+
+ new MapSelectionDialog({
+ okHandler: function (preferences) {
+ setMap(preferences);
+ }
+ }).open();
+ }
+
angular.module('ovTopo2')
.factory('Topo2MapService',
- ['$log', '$location', 'WebSocketService', 'PrefsService', 'MapService',
- 'SvgUtilService', 'Topo2DialogService',
- function (_$log_, _$loc_, _wss_, _ps_, _ms_, _sus_, _t2ds_) {
+ ['$location', 'PrefsService', 'MapService',
+ 'SvgUtilService', 'Topo2CountryFilters', 'Topo2MapDialog',
+ function (_$loc_, _ps_, _ms_, _sus_, _t2cf_, _t2md_) {
- $log = _$log_;
$loc = _$loc_;
- wss = _wss_;
ps = _ps_;
ms = _ms_;
sus = _sus_;
- t2ds = _t2ds_;
-
- messageHandlers = {
- mapSelectorResponse: handleMapResponse
- };
+ countryFilters = _t2cf_;
+ MapSelectionDialog = _t2md_;
return {
init: init,
openMapSelection: openMapSelection,
- toggle: toggle,
- stop: stop
+ toggle: toggle
};
}
]);
diff --git a/web/gui/src/main/webapp/app/view/topo2/topo2MapCountryFilters.js b/web/gui/src/main/webapp/app/view/topo2/topo2MapCountryFilters.js
new file mode 100644
index 0000000..a3c10e4
--- /dev/null
+++ b/web/gui/src/main/webapp/app/view/topo2/topo2MapCountryFilters.js
@@ -0,0 +1,61 @@
+/*
+ * Copyright 2016-present Open Networking Laboratory
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/*
+ ONOS GUI -- Topology Force Module.
+ Visualization of the topology in an SVG layer, using a D3 Force Layout.
+ */
+
+(function () {
+ 'use strict';
+
+ angular.module('ovTopo2')
+ .factory('Topo2CountryFilters', [
+ function (_$log_, _wss_, _t2ds_) {
+ return {
+ s_america: function (c) {
+ return c.properties.continent === 'South America';
+ },
+ ns_america: function (c) {
+ return c.properties.custom === 'US-cont' ||
+ c.properties.subregion === 'Central America' ||
+ c.properties.continent === 'South America';
+ },
+ japan: function (c) {
+ return c.properties.geounit === 'Japan';
+ },
+ europe: function (c) {
+ return c.properties.continent === 'Europe';
+ },
+ italy: function (c) {
+ return c.properties.geounit === 'Italy';
+ },
+ uk: function (c) {
+ // technically, Ireland is not part of the United Kingdom,
+ // but the map looks weird without it showing.
+ return c.properties.adm0_a3 === 'GBR' ||
+ c.properties.adm0_a3 === 'IRL';
+ },
+ s_korea: function (c) {
+ return c.properties.adm0_a3 === 'KOR';
+ },
+ australia: function (c) {
+ return c.properties.adm0_a3 === 'AUS';
+ }
+ };
+ }
+ ]);
+})();
diff --git a/web/gui/src/main/webapp/app/view/topo2/topo2MapDialog.js b/web/gui/src/main/webapp/app/view/topo2/topo2MapDialog.js
new file mode 100644
index 0000000..85b67b6
--- /dev/null
+++ b/web/gui/src/main/webapp/app/view/topo2/topo2MapDialog.js
@@ -0,0 +1,130 @@
+/*
+ * Copyright 2016-present Open Networking Laboratory
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/*
+ ONOS GUI -- Topology Force Module.
+ Visualization of the topology in an SVG layer, using a D3 Force Layout.
+ */
+
+(function () {
+ 'use strict';
+
+ // Injected
+ var $log, wss, t2ds;
+
+ // Constants
+ var mapRequest = 'mapSelectorRequest';
+
+ // State
+ var order, maps, map, mapItems;
+
+ var Dialog = function (options) {
+
+ this.okHandlerCallback = options.okHandler;
+ this.closeHandlerCallback = options.closeHandler;
+
+ wss.bindHandlers({
+ mapSelectorResponse: this.handleMapResponse.bind(this)
+ });
+ };
+
+ Dialog.prototype = {
+ handleMapResponse: function (data) {
+ $log.info('Got response', data);
+ order = data.order;
+ maps = data.maps;
+
+ t2ds.openDialog()
+ .setTitle('Select Map')
+ .addContent(this.render.bind(this)())
+ .addOk(this.okHandler.bind(this), 'OK')
+ .addCancel(this.closeHandler.bind(this), 'Close')
+ .bindKeys();
+ },
+
+ open: function () {
+ wss.sendEvent(mapRequest);
+ },
+ close: function () {
+ wss.unbindHandlers({
+ mapSelectorResponse: this.handleMapResponse.bind(this)
+ });
+ },
+
+ selectedMap: function () {
+ map = maps[this.options[this.selectedIndex].value];
+ $log.info('Selected map', map);
+ },
+
+ okHandler: function () {
+
+ var p = {
+ mapid: map.id,
+ mapscale: map.scale,
+ mapfilepath: map.filePath,
+ tint: 'off'
+ // tint: tintCheck.property('checked') ? 'on' : 'off'
+ };
+
+ if (this.okHandlerCallback) {
+ this.okHandlerCallback(p);
+ }
+
+ this.close();
+ },
+ closeHandler: function () {
+
+ if (this.closeHandlerCallback) {
+ this.closeHandlerCallback();
+ }
+
+ this.close();
+ },
+
+ render: function () {
+
+ var content = t2ds.createDiv('map-list'),
+ form = content.append('form'),
+ current = this.currentMap();
+
+ map = maps[current.mapid];
+ mapItems = form.append('select').on('change', this.selectedMap);
+
+ order.forEach(function (id) {
+ var m = maps[id];
+ mapItems.append('option')
+ .attr('value', m.id)
+ .attr('selected', m.id === current.mapid ? true : null)
+ .text(m.description);
+ });
+
+ return content;
+ }
+ };
+
+ angular.module('ovTopo2')
+ .factory('Topo2MapDialog', [
+ '$log', 'WebSocketService', 'Topo2DialogService',
+ function (_$log_, _wss_, _t2ds_) {
+
+ $log = _$log_;
+ wss = _wss_;
+ t2ds = _t2ds_;
+
+ return Dialog;
+ }
+ ]);
+})();
diff --git a/web/gui/src/main/webapp/index.html b/web/gui/src/main/webapp/index.html
index beef418..7caeb04 100644
--- a/web/gui/src/main/webapp/index.html
+++ b/web/gui/src/main/webapp/index.html
@@ -140,6 +140,8 @@
<script src="app/view/topo2/topo2Layout.js"></script>
<script src="app/view/topo2/topo2Link.js"></script>
<script src="app/view/topo2/topo2Map.js"></script>
+ <script src="app/view/topo2/topo2MapCountryFilters.js"></script>
+ <script src="app/view/topo2/topo2MapDialog.js"></script>
<script src="app/view/topo2/topo2Model.js"></script>
<script src="app/view/topo2/topo2NodeModel.js"></script>
<script src="app/view/topo2/topo2Prefs.js"></script>