[4.3] MSPB-101: Add save and apply button in edit device form (#204)

* Add save and apply button in edit device form

* Use single button with dropup in edit device actions

* Do not show dropup when the device edited is not privisionable

* Show droup button just if the edited device is register

i18n/en-US.json

@@ -169,6 +169,7 @@
 			"basicSectionTitle": "Basic Settings",
 			"dragAndDrop": "To select a codec, drag and drop from the available codecs box to selected codecs box",
 			"noOwner": "- No Owner -",
+			"saveAndApply": "Save and Apply",
 			"options": {
 				"menuTitle": "Options"
 			},

submodules/devices/devices.js

@@ -581,13 +581,26 @@ define(function(require) {
 					templateDevice.find('.feature-key-value:not(.active)').remove();
 
 					var $this = $(this),
+						hasToRestart = !!$this.data('extra'),
 						dataToSave = self.devicesMergeData(data, templateDevice, audioCodecs, videoCodecs);
 
+					if ($this.hasClass('disabled')) {
+						return;
+					}
+
 					$this.prop('disabled', 'disabled');
 
 					self.devicesSaveDevice(dataToSave, function(data) {
-						popup.dialog('close').remove();
+						if (hasToRestart) {
+							self.devicesRestart(data.id, function() {
+								monster.ui.toast({
+									type: 'success',
+									message: self.i18n.active().devices.popupSettings.miscellaneous.restart.success
+								});
+							});
+						}
 
+						popup.dialog('close').remove();
 						callbackSave && callbackSave(data);
 					}, function() {
 						$this.prop('disabled', false);

submodules/devices/devices.scss

@@ -234,8 +234,19 @@
 	padding: 15px;
 }
 
-.voip-edit-device-popup .edit-device .actions button {
-	margin-left: 10px;
+.voip-edit-device-popup .edit-device .actions{
+	button {
+		&.save {
+			font-size: 15px;
+			margin-left: 10px;
+		}
+	}
+
+	a {
+		&.save.disabled {
+			color: $french-gray;
+		}
+	}
 }
 
 .voip-edit-device-popup .edit-device .title-bar {

submodules/devices/views/devices-sip_device.html

@@ -436,13 +436,26 @@
 
 		<div class="pull-right">
 			<a class="cancel-link monster-link blue" href="javascript:void(0);">{{ i18n.cancel }}</a>
-			<button type="button" class="monster-button monster-button-success save">
-			{{#if id}}
-				{{ i18n.saveChanges }}
-			{{else}}
-				{{ i18n.devices.createDevice }}
-			{{/if}}
-			</button>
+
+			<div class="btn-group dropup">
+				<button type="button" class="monster-button-success save">
+					{{#if id}}
+						{{i18n.saveChanges}}
+					{{else}}
+						{{ i18n.devices.createDevice }}
+					{{/if}}
+				</button>
+				{{#if extra.isRegistered}}
+					<button class="monster-button-success dropdown-toggle" data-toggle="dropdown">
+						<span class="caret"></span>
+					</button>
+					<ul class="dropdown-menu pull-right">
+						<li>
+							<a class="save" data-extra="restart">{{i18n.devices.popupSettings.saveAndApply}}</a>
+						</li>
+					</ul>
+				{{/if}}
+			</div>
 		</div>
 	</div>
 </div>