Location hierarchy

Service Portal Widgets/Location hierarchy/README.md

@@ -0,0 +1,3 @@
+This widget allows you to hierarchically choose a location for the catalog item variable. 
+
+With small additional setup you can adjust it to your own structure. You also need a variable (preferably multi line text) to save the output of this widget.

Service Portal Widgets/Location hierarchy/client controller.js

@@ -0,0 +1,79 @@
+api.controller=function($scope, spModal) {
+  	var c = this;
+	c.newLocations = [];
+
+	c.server.get({
+		action: 'getChildren',
+		type: 'city',
+		parent: null
+	}).then((res) => {
+		c.locations = res.data.locations;
+		$scope.locations = res.data.locations.selected;
+		$scope.locations.room = '';
+	});
+
+	c.changeCity = (newSysId) => {
+		$scope.locations.city = c.locations.available.city.filter((city) => city.sys_id === newSysId)[0];
+		$scope.locations['building/structure'] = c.locations.default['building/structure'];
+		$scope.locations.floor = c.locations.default.floor;
+		$scope.locations.zone = c.locations.default.zone;
+
+		c.getChildren('building/structure', newSysId);
+	}
+
+	c.changeBuilding = (newSysId) => {
+		$scope.locations['building/structure'] = c.locations.available['building/structure'].filter((building) => building.sys_id === newSysId)[0];
+		$scope.locations.floor = c.locations.default.floor;
+		$scope.locations.zone = c.locations.default.zone;
+
+		c.getChildren('floor', newSysId);
+	}
+
+	c.changeFloor = (newSysId) => {
+		$scope.locations.floor = c.locations.available.floor.filter((floor) => floor.sys_id === newSysId)[0];
+		$scope.locations.zone = c.locations.default.zone;
+
+		c.getChildren('zone', newSysId);
+	}
+
+	c.changeZone = (newSysId) => {
+		$scope.locations.zone = c.locations.available.zone.filter((zone) => zone.sys_id === newSysId)[0];
+	}
+
+	c.changeRoom = () => {
+		//c.newLocations.push($scope.locations.zone.name + $scope.locations.room);
+	}
+
+	c.addNewLocation = () => {
+		c.newLocations.push('City: ' + $scope.locations.city.name + ', building: ' + $scope.locations['building/structure'].name + ', floor: ' + $scope.locations.floor.name + ', corridor: ' + $scope.locations.zone.name + ', room: * ' + $scope.locations.room);
+		if ($scope.page.g_form) {
+			$scope.page.g_form.setValue('locks_locations_new_locations_added', c.newLocations.join('\n'));
+		}
+		$scope.locations.room = '';
+	}
+
+	c.notListedModal = (type) => {
+		spModal.prompt('Please enter missing value for the ' + type)
+			.then(value => {
+				$scope.locations[type] = {name: '* ' + value, sys_id: '-2'};
+			});
+	}
+
+	c.getChildren = (type, parent) => {
+		c.server.get({
+			action: 'getChildren',
+			type: type,
+			parent: parent
+		}).then((res) => {
+			c.locations.available[type] = res.data.locations.available[type];
+		});
+	}
+
+	c.allSelected = () => {
+		return $scope.locations && 
+						$scope.locations.city.sys_id !== '-1' && 
+						$scope.locations['building/structure'].sys_id !== '-1' &&
+						$scope.locations.floor.sys_id !== '-1' && 
+						$scope.locations.zone.sys_id !== '-1'
+	}
+};

Service Portal Widgets/Location hierarchy/css.css

@@ -0,0 +1,11 @@
+.location-picker-input {
+  padding: 6px 12px;
+  color: #555555;
+  border: 1px solid #939393;
+  border-radius: 4px;
+  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
+  box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
+  -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
+  -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
+  transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
+}

Service Portal Widgets/Location hierarchy/html.html

@@ -0,0 +1,47 @@
+<h3>
+  Describe the new location
+</h3>
+<div class="form-group">
+	<div class="btn-group" uib-dropdown>
+		<button id="cityRef" type="button" class="btn btn-info" uib-dropdown-toggle>
+			{{locations.city.name}}&nbsp;<span class="caret"></span>
+		</button>
+		<ul class="dropdown-menu" uib-dropdown-menu role="menu" aria-labelledby="cityRef">
+			<li ng-repeat="city in c.locations.available.city" role="menuitem" ng-click="c.changeCity(city.sys_id)"><a href="#">{{city.name}}</a></li>
+			<li class="divider"></li>
+			<li role="menuitem" ng-click="c.notListedModal('city')"><a href="#">City not listed</a></li>
+		</ul>
+  </div>
+	<div class="btn-group" uib-dropdown>
+		<button id="buildingRef" type="button" class="btn btn-info" uib-dropdown-toggle ng-disabled="locations.city.sys_id === '-1'">
+			{{locations['building/structure'].name}}&nbsp;<span class="caret"></span>
+		</button>
+		<ul class="dropdown-menu" uib-dropdown-menu role="menu" aria-labelledby="buildingRef">
+      <li ng-repeat="building in c.locations.available['building/structure']" role="menuitem" ng-click="c.changeBuilding(building.sys_id)"><a href="#">{{building.name}}</a></li>
+			<li class="divider"></li>
+			<li role="menuitem" ng-click="c.notListedModal('building/structure')"><a href="#">Building not listed</a></li>
+		</ul>
+  </div>
+ 	<div class="btn-group" uib-dropdown>
+		<button id="floorRef" type="button" class="btn btn-info" uib-dropdown-toggle ng-disabled="locations['building/structure'].sys_id === '-1'">
+			{{locations.floor.name}}&nbsp;<span class="caret"></span>
+		</button>
+		<ul class="dropdown-menu" uib-dropdown-menu role="menu" aria-labelledby="floorRef">
+      <li ng-repeat="floor in c.locations.available.floor" role="menuitem" ng-click="c.changeFloor(floor.sys_id)"><a href="#">{{floor.name}}</a></li>
+			<li class="divider"></li>
+			<li role="menuitem" ng-click="c.notListedModal('floor')"><a href="#">Floor not listed</a></li>
+		</ul>
+  </div>
+	<div class="btn-group" uib-dropdown>
+		<button id="zoneRef" type="button" class="btn btn-info" uib-dropdown-toggle ng-disabled="locations.floor.sys_id === '-1'">
+			{{locations.zone.name}}&nbsp;<span class="caret"></span>
+		</button>
+		<ul class="dropdown-menu" uib-dropdown-menu role="menu" aria-labelledby="zoneRef">
+      <li ng-repeat="zone in c.locations.available.zone" role="menuitem" ng-click="c.changeZone(zone.sys_id)"><a href="#">{{zone.name}}</a></li>
+			<li class="divider"></li>
+			<li role="menuitem" ng-click="c.notListedModal('zone')"><a href="#">Corridor not listed</a></li>
+		</ul>
+  </div>
+  <input id="roomRef" class="location-picker-input" type="text" placeholder="Room name" ng-disabled="!c.allSelected()" ng-model="locations.room" ng-blur="c.changeRoom()"/>
+  <button type="button" class="btn btn-success" ng-click="c.addNewLocation()" ng-disabled="locations.room === ''">Add to the list</button>
+</div>

Service Portal Widgets/Location hierarchy/server script.js

@@ -0,0 +1,41 @@
+(function() {
+	data.locations = {
+		available: {
+			city: [],
+			'building/structure': [],
+			floor: [],
+			zone: []
+		},
+		default: {
+			city: {name: 'Pick a city', sys_id: '-1'},
+			'building/structure': {name: 'Pick a building', sys_id: '-1'},
+			floor: {name: 'Pick a floor', sys_id: '-1'},
+			zone: {name: 'Pick a corridor', sys_id: '-1'}
+		}
+	};
+
+	data.locations.selected = data.locations.default;
+
+	if (input && input.action === 'getChildren' && input.type) {
+		data.locations.available[input.type] = getData(input.type, input.parent);
+	}
+
+	function getData(locationType, parent) {
+		let ret = [];
+		let gq = new global.GlideQuery('cmn_location').where('cmn_location_type', locationType);
+
+		if (!gs.nil(parent))
+			gq = gq.where('parent', parent);
+
+		gq
+			.orderBy('name')
+			.select('name')
+			.forEach(function(childLocation){
+				ret.push({
+					sys_id: childLocation.sys_id,
+					name: childLocation.name
+				});
+			});
+		return ret;
+	}
+})();