KAZOO-2444: Simplify the creation of SIP devices

submodules/devices/devices.css

@@ -305,106 +305,3 @@
 	line-height: 30px;
 	margin: 0 10px;
 }
-
-/* Provisioner Popup */
-.device-popup {
-	width: 700px;
-}
-
-.device-popup .text-right {
-	padding: 10px;
-	text-align: right;
-}
-
-.device-popup .block-brand {
-	background: #eee;
-	border: 1px solid #ddd;
-}
-
-.device-popup .title-bar {
-	padding: 20px 10px;
-}
-
-.device-popup .block-brand .brand-selection {
-	background: #ccc;
-	border-top: 2px solid #22CCFF;
-	overflow-x: auto;
-	padding: 10px 0 5px;
-	white-space: nowrap;
-	width: auto;
-}
-
-.device-popup .block-brand .brand-selection .brand-box {
-	border: 2px solid #666666;
-    border-radius: 5px 5px 5px 5px;
-    color: #666666;
-    display: inline-block;
-    font-weight: bold;
-    height: 67px;
-    line-height: 69px;
-    margin: auto 10px;
-    text-align: center;
-    width: 95px;
-}
-
-.device-popup .block-brand .brand-selection .brand-box.unselected {
-	opacity: 0.5;
-}
-
-.device-popup .block-brand .brand-selection .brand-box.selected,
-.device-popup .block-brand .brand-selection .brand-box:hover {
-	border: 2px solid #22CCFF;
-	cursor: pointer;
-}
-
-/* Default state */
-.device-popup .block-device,
-.device-popup .actions{
-	display: none;
-}
-
-.device-popup .block-device .device-selection {
-	background: #FFF;
-	border: 1px solid #CCC;
-	padding: 10px;
-}
-
-.device-popup .block-device .device-selection .device-box {
-	border-radius: 4px;
-	border: 2px solid #FFF;
-	display: inline-block;
-	margin: 0 0px 10px;
-	padding: 3px;
-}
-
-.device-popup .block-device .device-selection .device-box.selected {
-	border: 2px solid #22CCFF !important;
-}
-.device-popup .block-device .device-selection .device-box:hover {
-	border: 2px solid #ddd;
-	cursor: pointer;
-}
-
-.device-popup .block-device .device-selection .device-box .device-image {
-	height: 80px;
-	width: 100px;
-}
-
-.device-popup .block-device .device-selection .device-box .device-name {
-	text-align: center;
-}
-
-.device-popup .block-device .device-selection .devices-brand {
-	display: none;
-}
-
-.device-popup .block-device .device-selection .devices-brand.active {
-	display: block;
-}
-
-.device-popup .actions .selection {
-	display: inline-block;
-	margin-right: 20px;
-	font-size: 16px;
-	font-weight: 500;
-}

submodules/devices/devices.js

@@ -22,13 +22,6 @@ define(function(require){
 				url: 'accounts/{accountId}/phone_numbers/{phoneNumber}',
 				verb: 'GET'
 			},
-			/* Provisioner */
-			'voip.devices.getProvisionerData': {
-				apiRoot: monster.config.api.provisioner || 'http://p.2600hz.com/',
-				dataType: '*/*',
-				url: 'api/phones/',
-				verb: 'GET'
-			},
 			/* Users */
 			'voip.devices.listUsers': {
 				url: 'accounts/{accountId}/users',
@@ -185,7 +178,7 @@ define(function(require){
 			template.find('.create-device').on('click', function() {
 				var type = $(this).data('type');
 
-				monster.pub('voip.devices.renderAdd', {
+				self.devicesRenderAdd({
 					type: type,
 					callback: function(device) {
 						self.devicesRender({ deviceId: device.id });
@@ -203,16 +196,24 @@ define(function(require){
 				};
 
 			if(type === 'sip_device') {
-				self.devicesGetProvisionerData(function(dataProvisioner) {
-					var listModels = self.devicesFormatProvisionerData(dataProvisioner);
-
-					self.devicesRenderProvisioner(listModels, function(dataProvisioner) {
-						data.provision = dataProvisioner;
-
+				monster.pub('common.chooseModel.render', {
+					callback: function(dataModel) {
+						monster.request({
+							resource: 'voip.devices.createDevice',
+							data: {
+								accountId: self.accountId,
+								data: dataModel
+							},
+							success: function(data, status) {
+								self.devicesRender({ deviceId: data.data.id});
+							}
+						});
+					},
+					callbackMissingBrand: function() {
 						self.devicesGetEditData(data, function(dataDevice) {
 							self.devicesRenderDevice(dataDevice, callback);
 						});
-					});
+					}
 				});
 			}
 			else {
@@ -373,78 +374,6 @@ define(function(require){
 			});
 		},
 
-		/* Args inclunding: data:list of supported devices from provisioner api */
-		devicesRenderProvisioner: function(listModels, callback) {
-			var self = this,
-				selectedBrand,
-				selectedFamily,
-				selectedModel,
-				templateDevice = $(monster.template(self, 'devices-provisioner', listModels));
-
-			templateDevice.find('.brand-box').on('click', function() {
-				var $this = $(this),
-					brand = $this.data('brand');
-
-				selectedBrand = brand;
-
-				$this.removeClass('unselected').addClass('selected');
-				templateDevice.find('.brand-box:not([data-brand="'+brand+'"])').removeClass('selected').addClass('unselected');
-				templateDevice.find('.devices-brand').hide();
-				templateDevice.find('.devices-brand[data-brand="'+ brand + '"]').show();
-
-				templateDevice.find('.block-device').show();
-			});
-
-			templateDevice.find('.device-box').on('click', function() {
-				var $this = $(this);
-				selectedModel = $this.data('model'),
-				selectedFamily = $this.data('family');
-
-				templateDevice.find('.device-box').removeClass('selected');
-
-				$this.addClass('selected');
-
-				templateDevice.find('.actions .selection').text(monster.template(self, '!' + self.i18n.active().devices.provisionerPopup.deviceSelected, { brand: selectedBrand, model: selectedModel }));
-				templateDevice.find('.actions').show();
-			});
-
-			templateDevice.find('.device-box').dblclick(function() {
-				var $this = $(this),
-					dataProvisioner = {
-					endpoint_brand: selectedBrand,
-					endpoint_family: $this.data('family'),
-					endpoint_model: $this.data('model')
-				};
-
-				popup.dialog('close').remove();
-
-				callback && callback(dataProvisioner);
-			});
-
-			templateDevice.find('.missing-brand').on('click', function() {
-				popup.dialog('close').remove();
-
-				callback && callback();
-			});
-
-			templateDevice.find('.next-step').on('click', function() {
-				var dataProvisioner = {
-					endpoint_brand: selectedBrand,
-					endpoint_family: selectedFamily,
-					endpoint_model: selectedModel
-				};
-
-				popup.dialog('close').remove();
-
-				callback && callback(dataProvisioner);
-			});
-
-			var popup = monster.ui.dialog(templateDevice, {
-				position: ['center', 20],
-				title: self.i18n.active().devices.provisionerPopup.title
-			});
-		},
-
 		devicesMergeData: function(originalData, template) {
 			var self = this,
 				hasCodecs = $.inArray(originalData.device_type, ['sip_device', 'landline', 'fax', 'ata', 'softphone', 'smartphone', 'mobile']) > -1,
@@ -795,50 +724,7 @@ define(function(require){
 			return formattedData;
 		},
 
-
-		devicesFormatProvisionerData: function(data) {
-			var formattedData = {
-				brands: []
-			};
-
-			_.each(data, function(brand) {
-				var families = [];
-
-				_.each(brand.families, function(family) {
-					var models = [];
-
-					_.each(family.models, function(model) {
-						models.push(model.name);
-					});
-
-					families.push({ name: family.name, models: models });
-				});
-
-				formattedData.brands.push({
-					name: brand.name,
-					families: families
-				});
-			});
-
-			return formattedData;
-		},
-
 		/* Utils */
-		devicesGetProvisionerData: function(callback) {
-			var self = this;
-
-			monster.request({
-				resource: 'voip.devices.getProvisionerData',
-				data: {},
-				success: function(data) {
-					// we had to set the type to */* to get a response from the API. So we have to manually parse the JSON response
-					var jsonResponse = JSON.parse(data.response || {});
-
-					callback(jsonResponse.data);
-				}
-			});
-		},
-
 		devicesDeleteDevice: function(deviceId, callback) {
 			var self = this;
 

views/devices-provisioner.html

@@ -1,41 +0,0 @@
-<div class="device-popup" type="provisioner">
-	<div class="block-brand">
-		<div class="title-bar clearfix">
-			<div class="title pull-left">{{i18n.devices.provisionerPopup.brandHeadline}}</div>
-			<a class="monster-link pull-right missing-brand" href="javascript:void(0)">{{i18n.devices.provisionerPopup.missingBrand}}</a>
-		</div>
-
-		<div class="brand-selection">
-			{{#each brands}}
-			<div class="brand-box {{this.name}}" data-brand="{{this.name}}"/>
-			{{/each}}
-		</div>
-	</div>
-
-	<div class="block-device">
-		<div class="title-bar clearfix">
-			<div class="title pull-left">{{i18n.devices.provisionerPopup.deviceHeadline}}</div>
-			<a class="monster-link pull-right missing-brand" href="javascript:void(0)">{{i18n.devices.provisionerPopup.missingDevice}}</a>
-		</div>
-
-		<div class="device-selection">
-			{{#each brands}}
-				<div class="devices-brand" data-brand="{{this.name}}">
-					{{#each this.families}}
-						{{#each this.models}}
-							<div class="device-box" data-family="{{../name}}" data-model="{{this}}">
-								<div class="device-image {{../../name}}-{{this}}"/>
-								<div class="device-name">{{this}}</div>
-							</div>
-						{{/each}}
-					{{/each}}
-				</div>
-			{{/each}}
-		</div>
-	</div>
-
-	<div class="actions text-right">
-		<div class="selection"></div>
-		<button class="btn btn-primary next-step">{{i18n.next}}</button>
-	</div>
-</div>