Merge branch 'UI-1342'

submodules/devices/devices.js

@@ -34,8 +34,6 @@ define(function(require){
 					template.find('.devices-rows').append(templateDevice);
 				});
 
-				template.find('.switch').bootstrapSwitch();
-
 				self.devicesBindEvents(template, parent, dataTemplate);
 
 				parent
@@ -77,11 +75,11 @@ define(function(require){
 				}
 			});
 
-			template.find('.switch').on('change', function() {
+			template.find('.switch-state').on('change', function() {
 				var toggle = $(this),
 					row = toggle.parents('.grid-row'),
 					deviceId = row.data('id'),
-					enable = toggle.bootstrapSwitch('status');
+					enable = toggle.prop('checked');
 
 				self.devicesGetDevice(deviceId, function(dataDevice) {
 					dataDevice.enabled = enable;
@@ -109,11 +107,11 @@ define(function(require){
 						//We could display a success message but that could spam the user so for now we don't display anything
 					},
 					function() {
-						toggle.bootstrapSwitch('toggleState');
+						toggle.prop('checked', !enable);
 					});
 				},
 				function() {
-					toggle.bootstrapSwitch('toggleState');
+					toggle.prop('checked', !enable);
 				});
 			});
 
@@ -249,7 +247,6 @@ define(function(require){
 			monster.ui.protectField(templateDevice.find('#sip_password'), templateDevice);
 
 			templateDevice.find('[data-toggle="tooltip"]').tooltip();
-			templateDevice.find('.switch').bootstrapSwitch();
 			templateDevice.find('#mac_address').mask("hh:hh:hh:hh:hh:hh", {placeholder:" "});
 
 			if(!(data.media.encryption.enforce_security)) {
@@ -311,7 +308,7 @@ define(function(require){
 				}
 			});
 
-			templateDevice.find('.restriction-list .switch').on('switch-change', function() {
+			templateDevice.find('.restrictions-switch').on('change', function() {
 				templateDevice.find('.restriction-matcher-sign').hide();
 				templateDevice.find('.restriction-message').hide();
 			});
@@ -334,7 +331,7 @@ define(function(require){
 								matchedMsg = templateDevice.find('.restriction-message');
 
 							templateDevice.find('.restriction-matcher-sign').hide();
-							if(matchedLine.find('.switch').bootstrapSwitch('status')) {
+							if(matchedLine.find('.restrictions-switch').prop('checked')) {
 								matchedSign.removeClass('icon-red icon-remove')
 										   .addClass('icon-green icon-ok')
 										   .css('display', 'inline-block');

submodules/groups/groups.js

@@ -472,7 +472,7 @@ define(function(require){
 											} : {})
 										),
 				featureTemplate = $(monster.template(self, 'groups-feature-call_recording', templateData)),
-				switchFeature = featureTemplate.find('.switch').bootstrapSwitch(),
+				switchFeature = featureTemplate.find('.switch-state'),
 				featureForm = featureTemplate.find('#call_recording_form'),
 				popup;
 
@@ -488,14 +488,14 @@ define(function(require){
 				popup.dialog('close').remove();
 			});
 
-			switchFeature.on('switch-change', function(e, data) {
-				data.value ? featureTemplate.find('.content').slideDown() : featureTemplate.find('.content').slideUp();
+			switchFeature.on('change', function() {
+				$(this).prop('checked') ? featureTemplate.find('.content').slideDown() : featureTemplate.find('.content').slideUp();
 			});
 
 			featureTemplate.find('.save').on('click', function() {
 				if(monster.ui.valid(featureForm)) {
 					var formData = monster.ui.getFormData('call_recording_form'),
-						enabled = switchFeature.bootstrapSwitch('status');
+						enabled = switchFeature.prop('checked');
 
 					if(!('smartpbx' in data.group)) { data.group.smartpbx = {}; }
 					if(!('call_recording' in data.group.smartpbx)) {
@@ -559,7 +559,7 @@ define(function(require){
 						media: ringGroupNode.data.ringback || ''
 					},
 					featureTemplate = $(monster.template(self, 'groups-feature-ringback', templateData)),
-					switchFeature = featureTemplate.find('.switch').bootstrapSwitch(),
+					switchFeature = featureTemplate.find('.switch-state'),
 					popup,
 					closeUploadDiv = function(newMedia) {
 						mediaToUpload = undefined;
@@ -596,8 +596,8 @@ define(function(require){
 					popup.dialog('close').remove();
 				});
 
-				switchFeature.on('switch-change', function(e, data) {
-					data.value ? featureTemplate.find('.content').slideDown() : featureTemplate.find('.content').slideUp();
+				switchFeature.on('change', function() {
+					$(this).prop('checked') ? featureTemplate.find('.content').slideDown() : featureTemplate.find('.content').slideUp();
 				});
 
 				featureTemplate.find('.upload-toggle').on('click', function() {
@@ -658,7 +658,7 @@ define(function(require){
 
 				featureTemplate.find('.save').on('click', function() {
 					var selectedMedia = featureTemplate.find('.media-dropdown option:selected').val(),
-						enabled = switchFeature.bootstrapSwitch('status');
+						enabled = switchFeature.prop('checked');
 
 					if(!('smartpbx' in data.group)) {
 						data.group.smartpbx = {};
@@ -717,20 +717,20 @@ define(function(require){
 
 			var templateData = $.extend(true, {selectedEntity: selectedEntity}, data),
 				featureTemplate = $(monster.template(self, 'groups-feature-next_action', templateData)),
-				switchFeature = featureTemplate.find('.switch').bootstrapSwitch(),
+				switchFeature = featureTemplate.find('.switch-state'),
 				popup;
 
 			featureTemplate.find('.cancel-link').on('click', function() {
 				popup.dialog('close').remove();
 			});
 
-			switchFeature.on('switch-change', function(e, data) {
-				data.value ? featureTemplate.find('.content').slideDown() : featureTemplate.find('.content').slideUp();
+			switchFeature.on('change', function() {
+				$(this).prop('checked') ? featureTemplate.find('.content').slideDown() : featureTemplate.find('.content').slideUp();
 			});
 
 			featureTemplate.find('.save').on('click', function() {
 				var selectedOption = featureTemplate.find('.next-action-select option:selected'),
-					enabled = switchFeature.bootstrapSwitch('status');
+					enabled = switchFeature.prop('checked');
 
 				if(!('smartpbx' in data.group)) { data.group.smartpbx = {}; }
 				if(!('next_action' in data.group.smartpbx)) {

submodules/users/users.css

@@ -640,6 +640,7 @@
 }
 
 .feature-popup-container .switch {
+	display: inline-block;
 	margin-left: 15px;
 }
 

submodules/users/users.js

@@ -1514,7 +1514,7 @@ define(function(require){
 			var self = this,
 				data = self.usersFormatConferencingData(data),
 				featureTemplate = $(monster.template(self, 'users-feature-conferencing', data)),
-				switchFeature = featureTemplate.find('.switch').bootstrapSwitch(),
+				switchFeature = featureTemplate.find('.switch-state'),
 				featureForm = featureTemplate.find('#conferencing_form');
 
 			monster.ui.validate(featureForm);
@@ -1523,8 +1523,8 @@ define(function(require){
 				popup.dialog('close').remove();
 			});
 
-			switchFeature.on('switch-change', function(e, data) {
-				data.value ? featureTemplate.find('.content').slideDown() : featureTemplate.find('.content').slideUp();
+			switchFeature.on('change', function() {
+				$(this).prop('checked') ? featureTemplate.find('.content').slideDown() : featureTemplate.find('.content').slideUp();
 			});
 
 			featureTemplate.find('.save').on('click', function() {
@@ -1538,7 +1538,7 @@ define(function(require){
 				if(monster.ui.valid(featureForm)) {
 					data.conference = monster.ui.getFormData('conferencing_form');
 
-					if(switchFeature.bootstrapSwitch('status')) {
+					if(switchFeature.prop('checked')) {
 						self.usersUpdateConferencing(data, function(data) {
 							args.userId = data.user.id;
 
@@ -1569,7 +1569,7 @@ define(function(require){
 			var self = this,
 				data = self.usersFormatFaxingData(data),
 				featureTemplate = $(monster.template(self, 'users-feature-faxing', data)),
-				switchFeature = featureTemplate.find('.switch').bootstrapSwitch();
+				switchFeature = featureTemplate.find('.switch-state');
 
 			if ( !_.isEmpty(data.extra.listNumbers) ) {
 				var popup = monster.ui.dialog(featureTemplate, {
@@ -1584,8 +1584,8 @@ define(function(require){
 				popup.dialog('close').remove();
 			});
 
-			switchFeature.on('switch-change', function(e, data) {
-				data.value ? featureTemplate.find('.content').slideDown() : featureTemplate.find('.content').slideUp();
+			switchFeature.on('change', function() {
+				$(this).prop('checked') ? featureTemplate.find('.content').slideDown() : featureTemplate.find('.content').slideUp();
 			});
 
 			featureTemplate.find('.save').on('click', function() {
@@ -1597,7 +1597,7 @@ define(function(require){
 						}
 					};
 
-				if ( switchFeature.bootstrapSwitch('status') ) {
+				if ( switchFeature.prop('checked') ) {
 					self.usersUpdateFaxing(data, newNumber, function(results) {
 						args.userId = results.callflow.owner_id;
 
@@ -1616,7 +1616,7 @@ define(function(require){
 		usersRenderHotdesk: function(currentUser) {
 			var self = this,
 				featureTemplate = $(monster.template(self, 'users-feature-hotdesk', currentUser)),
-				switchFeature = featureTemplate.find('.switch').bootstrapSwitch(),
+				switchFeature = featureTemplate.find('.switch-state'),
 				requirePin = featureTemplate.find('[name="require_pin"]'),
 				featureForm = featureTemplate.find('#hotdesk_form');
 
@@ -1626,8 +1626,8 @@ define(function(require){
 				popup.dialog('close').remove();
 			});
 
-			switchFeature.on('switch-change', function(e, data) {
-				data.value ? featureTemplate.find('.content').slideDown() : featureTemplate.find('.content').slideUp();
+			switchFeature.on('change', function() {
+				$(this).prop('checked') ? featureTemplate.find('.content').slideDown() : featureTemplate.find('.content').slideUp();
 			});
 
 			requirePin.on('change', function() {
@@ -1653,7 +1653,7 @@ define(function(require){
 						}
 					};
 
-					formData.enabled = switchFeature.bootstrapSwitch('status');
+					formData.enabled = switchFeature.prop('checked');
 					
 					if(formData.require_pin === false) { delete formData.pin; }
 					delete currentUser.hotdesk;
@@ -1677,7 +1677,7 @@ define(function(require){
 		usersRenderVMToEmail: function(currentUser) {
 			var self = this,
 				featureTemplate = $(monster.template(self, 'users-feature-vm_to_email', currentUser)),
-				switchFeature = featureTemplate.find('.switch').bootstrapSwitch(),
+				switchFeature = featureTemplate.find('.switch-state'),
 				featureForm = featureTemplate.find('#vm_to_email_form');
 
 			monster.ui.validate(featureForm);
@@ -1686,14 +1686,14 @@ define(function(require){
 				popup.dialog('close').remove();
 			});
 
-			switchFeature.on('switch-change', function(e, data) {
-				data.value ? featureTemplate.find('.content').slideDown() : featureTemplate.find('.content').slideUp();
+			switchFeature.on('change', function() {
+				$(this).prop('checked') ? featureTemplate.find('.content').slideDown() : featureTemplate.find('.content').slideUp();
 			});
 
 			featureTemplate.find('.save').on('click', function() {
 				var formData = monster.ui.getFormData('vm_to_email_form'),
 					userToSave = $.extend(true, {}, currentUser),
-					enabled = switchFeature.bootstrapSwitch('status'),
+					enabled = switchFeature.prop('checked'),
 					args = {
 						callback: function() {
 							popup.dialog('close').remove();
@@ -1763,18 +1763,18 @@ define(function(require){
 		usersRenderCallerId: function(currentUser) {
 			var self = this,
 				featureTemplate = $(monster.template(self, 'users-feature-caller_id', currentUser)),
-				switchFeature = featureTemplate.find('.switch').bootstrapSwitch();
+				switchFeature = featureTemplate.find('.switch-state');
 
 			featureTemplate.find('.cancel-link').on('click', function() {
 				popup.dialog('close').remove();
 			});
 
-			switchFeature.on('switch-change', function(e, data) {
-				data.value ? featureTemplate.find('.content').slideDown() : featureTemplate.find('.content').slideUp();
+			switchFeature.on('change', function() {
+				$(this).prop('checked') ? featureTemplate.find('.content').slideDown() : featureTemplate.find('.content').slideUp();
 			});
 
 			featureTemplate.find('.save').on('click', function() {
-				var switchCallerId = featureTemplate.find('.switch'),
+				var switchCallerId = featureTemplate.find('.switch-state'),
 					userData = currentUser,
 					userToSave = $.extend(true, {}, {
 						caller_id: {
@@ -1788,16 +1788,16 @@ define(function(require){
 						}
 					};
 
-				if(switchCallerId.bootstrapSwitch('status') === false) {
-					if(userToSave.caller_id.hasOwnProperty('external')) {
-						delete userToSave.caller_id.external.number;
-					}
-				}
-				else {
+				if (switchCallerId.prop('checked')) {
 					var callerIdValue = featureTemplate.find('.caller-id-select').val();
 
 					userToSave.caller_id.external.number = callerIdValue;
 				}
+				else {
+					if(userToSave.caller_id.hasOwnProperty('external')) {
+						delete userToSave.caller_id.external.number;
+					}
+				}
 
 				self.usersUpdateUser(userToSave, function(data) {
 					args.userId = data.data.id;
@@ -1820,7 +1820,7 @@ define(function(require){
 		usersRenderCallForward: function(currentUser) {
 			var self = this,
 				featureTemplate = $(monster.template(self, 'users-feature-call_forward', currentUser)),
-				switchFeature = featureTemplate.find('.switch').bootstrapSwitch(),
+				switchFeature = featureTemplate.find('.switch-state'),
 				featureForm = featureTemplate.find('#call_forward_form'),
 				args = {
 					callback: function() {
@@ -1844,8 +1844,8 @@ define(function(require){
 				popup.dialog('close').remove();
 			});
 
-			switchFeature.on('switch-change', function(e, data) {
-				data.value ? featureTemplate.find('.content').slideDown() : featureTemplate.find('.content').slideUp();
+			switchFeature.on('change', function() {
+				$(this).prop('checked') ? featureTemplate.find('.content').slideDown() : featureTemplate.find('.content').slideUp();
 			});
 
 			featureTemplate.find('.save').on('click', function() {
@@ -1853,7 +1853,7 @@ define(function(require){
 					var formData = monster.ui.getFormData('call_forward_form');
 					formData.require_keypress = !formData.require_keypress;
 
-					formData.enabled = switchFeature.bootstrapSwitch('status');
+					formData.enabled = switchFeature.prop('checked');
 					formData.number = monster.util.unformatPhoneNumber(formData.number, 'keepPlus');
 					delete formData.phoneType;
 
@@ -1896,7 +1896,7 @@ define(function(require){
 				var currentUser = params.currentUser,
 					userCallflow = params.userCallflow,
 					featureTemplate = $(monster.template(self, 'users-feature-find_me_follow_me', { currentUser: currentUser })),
-					switchFeature = featureTemplate.find('.switch').bootstrapSwitch(),
+					switchFeature = featureTemplate.find('.switch-state'),
 					featureForm = featureTemplate.find('#find_me_follow_me_form'),
 					args = {
 						callback: function() {
@@ -1947,12 +1947,12 @@ define(function(require){
 					popup.dialog('close').remove();
 				});
 
-				switchFeature.on('switch-change', function(e, data) {
-					data.value ? featureTemplate.find('.content').slideDown() : featureTemplate.find('.content').slideUp();
+				switchFeature.on('change', function() {
+					$(this).prop('checked') ? featureTemplate.find('.content').slideDown() : featureTemplate.find('.content').slideUp();
 				});
 
 				featureTemplate.find('.save').on('click', function() {
-					var enabled = switchFeature.bootstrapSwitch('status');
+					var enabled = switchFeature.prop('checked');
 
 					monster.pub('common.ringingDurationControl.getEndpoints', { 
 						container: featureForm,
@@ -2106,7 +2106,7 @@ define(function(require){
 											} : {})
 										),
 				featureTemplate = $(monster.template(self, 'users-feature-call_recording', templateData)),
-				switchFeature = featureTemplate.find('.switch').bootstrapSwitch(),
+				switchFeature = featureTemplate.find('.switch-state'),
 				featureForm = featureTemplate.find('#call_recording_form'),
 				popup;
 
@@ -2122,14 +2122,14 @@ define(function(require){
 				popup.dialog('close').remove();
 			});
 
-			switchFeature.on('switch-change', function(e, data) {
-				data.value ? featureTemplate.find('.content').slideDown() : featureTemplate.find('.content').slideUp();
+			switchFeature.on('change', function() {
+				$(this).prop('checked') ? featureTemplate.find('.content').slideDown() : featureTemplate.find('.content').slideUp();
 			});
 
 			featureTemplate.find('.save').on('click', function() {
 				if(monster.ui.valid(featureForm)) {
 					var formData = monster.ui.getFormData('call_recording_form'),
-						enabled = switchFeature.bootstrapSwitch('status');
+						enabled = switchFeature.prop('checked');
 
 					if(!('smartpbx' in params.currentUser)) { params.currentUser.smartpbx = {}; }
 					if(!('call_recording' in params.currentUser.smartpbx)) {
@@ -2213,7 +2213,7 @@ define(function(require){
 						media: 'music_on_hold' in currentUser && 'media_id' in currentUser.music_on_hold ? currentUser.music_on_hold.media_id : silenceMediaId
 					},
 					featureTemplate = $(monster.template(self, 'users-feature-music_on_hold', templateData)),
-					switchFeature = featureTemplate.find('.switch').bootstrapSwitch(),
+					switchFeature = featureTemplate.find('.switch-state'),
 					popup,
 					closeUploadDiv = function(newMedia) {
 						mediaToUpload = undefined;
@@ -2250,8 +2250,8 @@ define(function(require){
 					popup.dialog('close').remove();
 				});
 
-				switchFeature.on('switch-change', function(e, data) {
-					data.value ? featureTemplate.find('.content').slideDown() : featureTemplate.find('.content').slideUp();
+				switchFeature.on('change', function() {
+					$(this).prop('checked') ? featureTemplate.find('.content').slideDown() : featureTemplate.find('.content').slideUp();
 				});
 
 				featureTemplate.find('.upload-toggle').on('click', function() {
@@ -2312,7 +2312,7 @@ define(function(require){
 
 				featureTemplate.find('.save').on('click', function() {
 					var selectedMedia = featureTemplate.find('.media-dropdown option:selected').val(),
-						enabled = switchFeature.bootstrapSwitch('status');
+						enabled = switchFeature.prop('checked');
 
 					if(!('music_on_hold' in currentUser)) {
 						currentUser.music_on_hold = {};

submodules/vmboxes/vmboxes.js

@@ -127,7 +127,7 @@ define(function(require){
 			});
 		},
 
-		vmboxesEditBindEvents: function(templatVMBox, data, callbacks) {
+		vmboxesEditBindEvents: function(templateVMBox, data, callbacks) {
 			var self = this,
 				vmboxForm = templateVMBox.find('#form_vmbox');
 
@@ -145,7 +145,6 @@ define(function(require){
 			templateVMBox.find('#timezone').chosen({search_contains: true, width: "40%"});
 
 			templateVMBox.find('[data-toggle="tooltip"]').tooltip();
-			templateVMBox.find('.switch').bootstrapSwitch();
 
 			templateVMBox.find('.actions .save').on('click', function() {
 				if(monster.ui.valid(vmboxForm)) {

views/devices-ata.html

@@ -93,8 +93,10 @@
 								{{/if}}
 							</label>
 							<div class="controls">
-								<div class="switch" data-on="success" data-off="danger" data-on-label="{{../i18n.devices.popupSettings.restrictions.allow}}" data-off-label="{{../i18n.devices.popupSettings.restrictions.deny}}">
-									<input class="not-pretty" type="checkbox" name="call_restriction.{{@key}}.action" {{#compare this.action '===' 'inherit'}}{{#unless this.disabled}} checked{{/unless}}{{/compare}}{{#if this.disabled}} disabled{{/if}}></input>
+								<div class="switch">
+								{{#monsterSwitch}}
+									<input class="restrictions-switch" type="checkbox" name="call_restriction.{{@key}}.action" data-on="{{../i18n.devices.popupSettings.restrictions.allow}}" data-off="{{../i18n.devices.popupSettings.restrictions.deny}}" {{#compare this.action '===' 'inherit'}}{{#unless this.disabled}} checked{{/unless}}{{/compare}}{{#if this.disabled}} disabled{{/if}}></input>
+								{{/monsterSwitch}}
 								</div>
 								<i class="restriction-matcher-sign icon-large icon-ok icon-green"></i>
 							</div>

views/devices-fax.html

@@ -104,8 +104,10 @@
 								{{/if}}
 							</label>
 							<div class="controls">
-								<div class="switch" data-on="success" data-off="danger" data-on-label="{{../i18n.devices.popupSettings.restrictions.allow}}" data-off-label="{{../i18n.devices.popupSettings.restrictions.deny}}">
-									<input class="not-pretty" type="checkbox" name="call_restriction.{{@key}}.action" {{#compare this.action '===' 'inherit'}}{{#unless this.disabled}} checked{{/unless}}{{/compare}}{{#if this.disabled}} disabled{{/if}}></input>
+								<div class="switch">
+								{{#monsterSwitch}}
+									<input class="restrictions-switch" type="checkbox" name="call_restriction.{{@key}}.action" data-on="{{../i18n.devices.popupSettings.restrictions.allow}}" data-off="{{../i18n.devices.popupSettings.restrictions.deny}}" {{#compare this.action '===' 'inherit'}}{{#unless this.disabled}} checked{{/unless}}{{/compare}}{{#if this.disabled}} disabled{{/if}}></input>
+								{{/monsterSwitch}}
 								</div>
 								<i class="restriction-matcher-sign icon-large icon-ok icon-green"></i>
 							</div>

views/devices-mobile.html

@@ -115,8 +115,10 @@
 								{{/if}}
 							</label>
 							<div class="controls">
-								<div class="switch" data-on="success" data-off="danger" data-on-label="{{../i18n.devices.popupSettings.restrictions.allow}}" data-off-label="{{../i18n.devices.popupSettings.restrictions.deny}}">
-									<input class="not-pretty" type="checkbox" name="call_restriction.{{@key}}.action" {{#compare this.action '===' 'inherit'}}{{#unless this.disabled}} checked{{/unless}}{{/compare}}{{#if this.disabled}} disabled{{/if}}></input>
+								<div class="switch">
+								{{#monsterSwitch}}
+									<input class="restrictions-switch" type="checkbox" name="call_restriction.{{@key}}.action" data-on="{{../i18n.devices.popupSettings.restrictions.allow}}" data-off="{{../i18n.devices.popupSettings.restrictions.deny}}" {{#compare this.action '===' 'inherit'}}{{#unless this.disabled}} checked{{/unless}}{{/compare}}{{#if this.disabled}} disabled{{/if}}></input>
+								{{/monsterSwitch}}
 								</div>
 								<i class="restriction-matcher-sign icon-large icon-ok icon-green"></i>
 							</div>

views/devices-row.html

@@ -16,8 +16,10 @@
 			{{userName}}
 		</div>
 		<div class="enable grid-cell centered">
-			<div class="switch" data-on="success" data-off="danger" data-on-label="{{i18n.on}}" data-off-label="{{i18n.off}}">
-			    <input type="checkbox"{{#if enabled}} checked="checked"{{/if}}></input>
+			<div class="switch">
+			{{#monsterSwitch}}
+				<input class="switch-state" type="checkbox"{{#if enabled}} checked="checked"{{/if}}></input>
+			{{/monsterSwitch}}
 			</div>
 		</div>
 		<div class="edit grid-cell centered">

views/devices-sip_device.html

@@ -149,8 +149,10 @@
 								{{/if}}
 							</label>
 							<div class="controls">
-								<div class="switch" data-on="success" data-off="danger" data-on-label="{{../i18n.devices.popupSettings.restrictions.allow}}" data-off-label="{{../i18n.devices.popupSettings.restrictions.deny}}">
-									<input class="not-pretty" type="checkbox" name="call_restriction.{{@key}}.action" {{#compare this.action '===' 'inherit'}}{{#unless this.disabled}} checked{{/unless}}{{/compare}}{{#if this.disabled}} disabled{{/if}}></input>
+								<div class="switch">
+								{{#monsterSwitch}}
+									<input class="restrictions-switch" type="checkbox" name="call_restriction.{{@key}}.action" data-on="{{../i18n.devices.popupSettings.restrictions.allow}}" data-off="{{../i18n.devices.popupSettings.restrictions.deny}}" {{#compare this.action '===' 'inherit'}}{{#unless this.disabled}} checked{{/unless}}{{/compare}}{{#if this.disabled}} disabled{{/if}}></input>
+								{{/monsterSwitch}}
 								</div>
 								<i class="restriction-matcher-sign icon-large icon-ok icon-green"></i>
 							</div>

views/devices-smartphone.html

@@ -145,8 +145,10 @@
 								{{/if}}
 							</label>
 							<div class="controls">
-								<div class="switch" data-on="success" data-off="danger" data-on-label="{{../i18n.devices.popupSettings.restrictions.allow}}" data-off-label="{{../i18n.devices.popupSettings.restrictions.deny}}">
-									<input class="not-pretty" type="checkbox" name="call_restriction.{{@key}}.action" {{#compare this.action '===' 'inherit'}}{{#unless this.disabled}} checked{{/unless}}{{/compare}}{{#if this.disabled}} disabled{{/if}}></input>
+								<div class="switch">
+								{{#monsterSwitch}}
+									<input class="restrictions-switch" type="checkbox" name="call_restriction.{{@key}}.action" data-on="{{../i18n.devices.popupSettings.restrictions.allow}}" data-off="{{../i18n.devices.popupSettings.restrictions.deny}}" {{#compare this.action '===' 'inherit'}}{{#unless this.disabled}} checked{{/unless}}{{/compare}}{{#if this.disabled}} disabled{{/if}}></input>
+								{{/monsterSwitch}}
 								</div>
 								<i class="restriction-matcher-sign icon-large icon-ok icon-green"></i>
 							</div>

views/devices-softphone.html

@@ -109,8 +109,10 @@
 								{{/if}}
 							</label>
 							<div class="controls">
-								<div class="switch" data-on="success" data-off="danger" data-on-label="{{../i18n.devices.popupSettings.restrictions.allow}}" data-off-label="{{../i18n.devices.popupSettings.restrictions.deny}}">
-									<input class="not-pretty" type="checkbox" name="call_restriction.{{@key}}.action" {{#compare this.action '===' 'inherit'}}{{#unless this.disabled}} checked{{/unless}}{{/compare}}{{#if this.disabled}} disabled{{/if}}></input>
+								<div class="switch">
+								{{#monsterSwitch}}
+									<input class="restrictions-switch" type="checkbox" name="call_restriction.{{@key}}.action" data-on="{{../i18n.devices.popupSettings.restrictions.allow}}" data-off="{{../i18n.devices.popupSettings.restrictions.deny}}" {{#compare this.action '===' 'inherit'}}{{#unless this.disabled}} checked{{/unless}}{{/compare}}{{#if this.disabled}} disabled{{/if}}></input>
+								{{/monsterSwitch}}
 								</div>
 								<i class="restriction-matcher-sign icon-large icon-ok icon-green"></i>
 							</div>

views/groups-feature-call_recording.html

@@ -4,8 +4,10 @@
 			<i class="{{group.extra.mapFeatures.call_recording.icon}}"></i>
 		</div>
 		{{ i18n.groups.callRecording.headline }}
-		<div class="switch" data-on="success" data-off="default" data-on-label="{{i18n.enabled}}" data-off-label="{{i18n.disabled}}">
-			<input type="checkbox"{{#if group.extra.mapFeatures.call_recording.active}} checked="checked"{{/if}}></input>
+		<div class="switch">
+		{{#monsterSwitch}}
+			<input class="switch-state" type="checkbox" data-on="{{i18n.enabled}}" data-off="{{i18n.disabled}}"{{#if group.extra.mapFeatures.call_recording.active}} checked="checked"{{/if}}></input>
+		{{/monsterSwitch}}
 		</div>
 	</div>
 

views/groups-feature-next_action.html

@@ -4,8 +4,10 @@
 			<i class="{{group.extra.mapFeatures.next_action.icon}}"></i>
 		</div>
 		{{ i18n.groups.nextAction.headline }}
-		<div class="switch" data-on="success" data-off="default" data-on-label="{{i18n.enabled}}" data-off-label="{{i18n.disabled}}">
-			<input type="checkbox"{{#if group.extra.mapFeatures.next_action.active}} checked="checked"{{/if}}></input>
+		<div class="switch">
+		{{#monsterSwitch}}
+			<input class="switch-state" type="checkbox" data-on="{{i18n.enabled}}" data-off="{{i18n.disabled}}"{{#if group.extra.mapFeatures.next_action.active}} checked="checked"{{/if}}></input>
+		{{/monsterSwitch}}
 		</div>
 	</div>
 

views/groups-feature-ringback.html

@@ -4,8 +4,10 @@
 			<i class="{{group.extra.mapFeatures.ringback.icon}}"></i>
 		</div>
 		{{ i18n.groups.ringback.headline }}
-		<div class="switch" data-on="success" data-off="default" data-on-label="{{i18n.enabled}}" data-off-label="{{i18n.disabled}}">
-			<input type="checkbox"{{#if group.extra.mapFeatures.ringback.active}} checked="checked"{{/if}}></input>
+		<div class="switch">
+		{{#monsterSwitch}}
+			<input class="switch-state" type="checkbox" data-on="{{i18n.enabled}}" data-off="{{i18n.disabled}}"{{#if group.extra.mapFeatures.ringback.active}} checked="checked"{{/if}}></input>
+		{{/monsterSwitch}}
 		</div>
 	</div>
 

views/users-feature-call_forward.html

@@ -4,9 +4,11 @@
             <i class="{{extra.mapFeatures.call_forward.icon}}"></i>
         </div>
         {{ i18n.users.call_forward.headline }}
-        <div class="switch" data-on="success" data-off="default" data-on-label="{{i18n.enabled}}" data-off-label="{{i18n.disabled}}">
-			<input type="checkbox" id="checkbox_call_forward"{{#if extra.mapFeatures.call_forward.active}} checked="checked"{{/if}}></input>
-        </div>
+		<div class="switch">
+		{{#monsterSwitch}}
+			<input class="switch-state" type="checkbox" id="checkbox_call_forward" data-on="{{i18n.enabled}}" data-off="{{i18n.disabled}}"{{#if extra.mapFeatures.call_forward.active}} checked="checked"{{/if}}></input>
+		{{/monsterSwitch}}
+		</div>
 	</div>
 
 	<div class="content{{#unless extra.mapFeatures.call_forward.active}} disabled{{/unless}}">

views/users-feature-call_recording.html

@@ -4,8 +4,10 @@
 			<i class="{{user.extra.mapFeatures.call_recording.icon}}"></i>
 		</div>
 		{{ i18n.users.callRecording.headline }}
-		<div class="switch" data-on="success" data-off="default" data-on-label="{{i18n.enabled}}" data-off-label="{{i18n.disabled}}">
-			<input type="checkbox"{{#if user.extra.mapFeatures.call_recording.active}} checked="checked"{{/if}}></input>
+		<div class="switch">
+		{{#monsterSwitch}}
+			<input class="switch-state" type="checkbox" data-on="{{i18n.enabled}}" data-off="{{i18n.disabled}}"{{#if user.extra.mapFeatures.call_recording.active}} checked="checked"{{/if}}></input>
+		{{/monsterSwitch}}
 		</div>
 	</div>
 

views/users-feature-caller_id.html

@@ -4,9 +4,11 @@
             <i class="{{extra.mapFeatures.caller_id.icon}}"></i>
         </div>
         {{ i18n.users.caller_id.headline }}
-        <div class="switch" data-on="success" data-off="default" data-on-label="{{i18n.enabled}}" data-off-label="{{i18n.disabled}}">
-			<input type="checkbox" id="checkbox_caller_id"{{#if extra.mapFeatures.caller_id.active}} checked="checked"{{/if}}></input>
-        </div>
+		<div class="switch">
+		{{#monsterSwitch}}
+			<input class="switch-state" type="checkbox" id="checkbox_caller_id" data-on-label="{{i18n.enabled}}" data-off-label="{{i18n.disabled}}"{{#if extra.mapFeatures.caller_id.active}} checked="checked"{{/if}}></input>
+		{{/monsterSwitch}}
+		</div>
 	</div>
 
 	<div class="content{{#unless extra.mapFeatures.caller_id.active}} disabled{{/unless}}">

views/users-feature-conferencing.html

@@ -4,9 +4,11 @@
             <i class="{{user.extra.mapFeatures.conferencing.icon}}"></i>
         </div>
         {{ i18n.users.conferencing.headline }}
-        <div class="switch" data-on="success" data-off="default" data-on-label="{{i18n.enabled}}" data-off-label="{{i18n.disabled}}">
-			<input type="checkbox" id="checkbox_caller_id"{{#if user.extra.mapFeatures.conferencing.active}} checked="checked"{{/if}}></input>
-        </div>
+		<div class="switch">
+		{{#monsterSwitch}}
+			<input class="switch-state" type="checkbox" id="checkbox_caller_id" data-on="{{i18n.enabled}}" data-off="{{i18n.disabled}}"{{#if user.extra.mapFeatures.conferencing.active}} checked="checked"{{/if}}></input>
+		{{/monsterSwitch}}
+		</div>
 	</div>
 
 	<div class="content{{#unless user.extra.mapFeatures.conferencing.active}} disabled{{/unless}}">

views/users-feature-faxing.html

@@ -4,9 +4,11 @@
             <i class="{{user.extra.mapFeatures.faxing.icon}}"></i>
         </div>
         {{ i18n.users.faxing.headline }}
-        <div class="switch" data-on="success" data-off="default" data-on-label="{{i18n.enabled}}" data-off-label="{{i18n.disabled}}">
-			<input type="checkbox" id="checkbox_caller_id"{{#if user.extra.mapFeatures.faxing.active}} checked="checked"{{/if}}></input>
-        </div>
+		<div class="switch">
+		{{#monsterSwitch}}
+			<input class="switch-state" type="checkbox" id="checkbox_caller_id" data-on="{{i18n.enabled}}" data-off="{{i18n.disabled}}"{{#if user.extra.mapFeatures.faxing.active}} checked="checked"{{/if}}></input>
+		{{/monsterSwitch}}
+		</div>
 	</div>
 
 	<div class="content{{#unless user.extra.mapFeatures.faxing.active}} disabled{{/unless}}">

views/users-feature-find_me_follow_me.html

@@ -4,8 +4,10 @@
 			<i class="{{currentUser.extra.mapFeatures.find_me_follow_me.icon}}"></i>
 		</div>
 		{{ i18n.users.find_me_follow_me.headline }}
-		<div class="switch" data-on="success" data-off="default" data-on-label="{{i18n.enabled}}" data-off-label="{{i18n.disabled}}">
-			<input type="checkbox" id="checkbox_find_me_follow_me"{{#if currentUser.extra.mapFeatures.find_me_follow_me.active}} checked="checked"{{/if}}></input>
+		<div class="switch">
+		{{#monsterSwitch}}
+			<input class="switch-state" type="checkbox" id="checkbox_find_me_follow_me" data-on="{{i18n.enabled}}" data-off="{{i18n.disabled}}"{{#if currentUser.extra.mapFeatures.find_me_follow_me.active}} checked="checked"{{/if}}></input>
+		{{/monsterSwitch}}
 		</div>
 	</div>
 

views/users-feature-hotdesk.html

@@ -4,9 +4,11 @@
             <i class="{{extra.mapFeatures.hotdesk.icon}}"></i>
         </div>
         {{ i18n.users.hotdesk.headline }}
-        <div class="switch" data-on="success" data-off="default" data-on-label="{{i18n.enabled}}" data-off-label="{{i18n.disabled}}">
-			<input type="checkbox" name="enabled" id="checkbox_hotdesk"{{#if extra.mapFeatures.hotdesk.active}} checked="checked"{{/if}}></input>
-        </div>
+		<div class="switch">
+		{{#monsterSwitch}}
+			<input class="switch-state" type="checkbox" name="enabled" id="checkbox_hotdesk" data-on="{{i18n.enabled}}" data-off="{{i18n.disabled}}"{{#if extra.mapFeatures.hotdesk.active}} checked="checked"{{/if}}></input>
+		{{/monsterSwitch}}
+		</div>
 	</div>
 
 	<div class="content{{#unless extra.mapFeatures.hotdesk.active}} disabled{{/unless}}">

views/users-feature-music_on_hold.html

@@ -4,8 +4,10 @@
 			<i class="{{user.extra.mapFeatures.music_on_hold.icon}}"></i>
 		</div>
 		{{ i18n.users.music_on_hold.headline }}
-		<div class="switch" data-on="success" data-off="default" data-on-label="{{i18n.enabled}}" data-off-label="{{i18n.disabled}}">
-			<input type="checkbox"{{#if user.extra.mapFeatures.music_on_hold.active}} checked="checked"{{/if}}></input>
+		<div class="switch">
+		{{#monsterSwitch}}
+			<input class="switch-state" type="checkbox" data-on="{{i18n.enabled}}" data-off="{{i18n.disabled}}"{{#if user.extra.mapFeatures.music_on_hold.active}} checked="checked"{{/if}}></input>
+		{{/monsterSwitch}}
 		</div>
 	</div>
 

views/users-feature-vm_to_email.html

@@ -4,8 +4,10 @@
 			<i class="{{extra.mapFeatures.vm_to_email.icon}}"></i>
 		</div>
 		{{ i18n.users.vm_to_email.headline }}
-		<div class="switch" data-on="success" data-off="default" data-on-label="{{i18n.enabled}}" data-off-label="{{i18n.disabled}}">
-			<input type="checkbox" id="checkbox_vm_to_email"{{#if extra.mapFeatures.vm_to_email.active}} checked="checked"{{/if}}></input>
+		<div class="switch">
+		{{#monsterSwitch}}
+			<input class="switch-state" type="checkbox" id="checkbox_vm_to_email" data-on="{{i18n.enabled}}" data-off="{{i18n.disabled}}"{{#if extra.mapFeatures.vm_to_email.active}} checked="checked"{{/if}}></input>
+		{{/monsterSwitch}}
 		</div>
 	</div>