UI-727: Added an info box to let the user know why some restrictions are disabled

i18n/en-US.json

@@ -167,7 +167,8 @@
 					"denyMessage": "This device will not be allowed to place a call to {{phoneNumber}}."
 				},
 				"__comment": "UI-727, v3.19_s2: Updating the way call restrictions are displayed on devices.",
-				"allow": "Allow"
+				"allow": "Allow",
+				"disabledRestrictionsInfo": "Some types of call have been restricted for your entire account and can not be enabled per-device."
 			},
 			"video": {
 				"menuTitle": "Video",

i18n/fr-FR.json

@@ -149,7 +149,8 @@
 					"denyMessage": "Ce téléphone ne sera pas autorisé à appeler le numéro {{phoneNumber}}."
 				},
 				"__comment": "UI-727, v3.19_s2: Updating the way call restrictions are displayed on devices.",
-				"allow": "Autoriser"
+				"allow": "Autoriser",
+				"disabledRestrictionsInfo": "Certains types d'appels on été bloqués pour votre compte et ne peuvent pas être activés sur vos téléphones."
 			},
 			"video": {
 				"menuTitle": "Vidéo",

submodules/devices/devices.css

@@ -267,8 +267,12 @@
 	font-weight: bold;
 }
 
+.edit-device .restrictions-container {
+	position: relative;
+}
+
 .edit-device .restriction-matcher-div {
-	margin-right: 50px;
+	margin-right: 40px;
 	float: right;
 }
 
@@ -291,12 +295,19 @@
 
 .edit-device .restriction-message {
 	width: 275px;
-	margin: 0 0 0 20px !important;
+	margin: 0 0 0 30px !important;
 	padding: 10px;
 	vertical-align: top;
 	display: none;
 }
 
+.edit-device .disabled-restrictions-info {
+	width: 270px;
+	position: absolute;
+	bottom: 0px;
+	right: 40px;
+}
+
 .edit-device .restriction-list .restriction-line.disabled .control-label {
     opacity: 0.5;
     cursor: default;

submodules/devices/devices.js

@@ -657,6 +657,7 @@ define(function(require){
 				&& name in data.accountLimits.call_restriction
 				&& data.accountLimits.call_restriction[name].action === 'deny') {
 					defaults.extra.restrictions[name].disabled = true;
+					defaults.extra.hasDisabledRestrictions = true;
 				}
 
 				if('call_restriction' in data.device && name in data.device.call_restriction) {

views/devices-ata.html

@@ -93,32 +93,44 @@
 			</div>
 
 			<div class="tabs-section clearfix" data-section="restrictions">
-				<div class="restriction-matcher-div">
-					<i class="help-popover icon-question-sign icon-large" data-original-title="{{i18n.devices.popupSettings.restrictions.matcher.help}}" data-placement="top" data-toggle="tooltip"></i>
-					<input type="text" class="restriction-matcher-input" placeholder="{{i18n.devices.popupSettings.restrictions.matcher.placeholder}}" />
-					<button type="button"  class="btn btn-primary restriction-matcher-button">{{i18n.devices.popupSettings.restrictions.matcher.button}}</button>
-				</div>
-				<div class="title">
-					{{ i18n.devices.popupSettings.restrictions.sectionTitle }}
-				</div>
-				<div class="restriction-list">
-				{{#each extra.restrictions}}
-					<div class="control-group restriction-line{{#if this.disabled}} disabled{{/if}}" data-restriction="{{@key}}">
-						<label class="control-label">{{this.friendly_name}}
-							{{#if this.help}}
-								<i class="help-popover icon-question-sign" data-original-title="{{this.help}}" data-placement="top" data-toggle="tooltip"></i>
-							{{/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="restrictions-container">
+					<div class="restriction-matcher-div">
+						<i class="help-popover icon-question-sign icon-large" data-original-title="{{i18n.devices.popupSettings.restrictions.matcher.help}}" data-placement="top" data-toggle="tooltip"></i>
+						<input type="text" class="restriction-matcher-input" placeholder="{{i18n.devices.popupSettings.restrictions.matcher.placeholder}}" />
+						<button type="button"  class="btn btn-primary restriction-matcher-button">{{i18n.devices.popupSettings.restrictions.matcher.button}}</button>
+					</div>
+					<div class="title">
+						{{ i18n.devices.popupSettings.restrictions.sectionTitle }}
+					</div>
+					<div class="restriction-list">
+					{{#each extra.restrictions}}
+						<div class="control-group restriction-line{{#if this.disabled}} disabled{{/if}}" data-restriction="{{@key}}">
+							<label class="control-label">{{this.friendly_name}}
+								{{#if this.help}}
+									<i class="help-popover icon-question-sign" data-original-title="{{this.help}}" data-placement="top" data-toggle="tooltip"></i>
+								{{/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>
+								<i class="restriction-matcher-sign icon-large icon-ok icon-green"></i>
 							</div>
-							<i class="restriction-matcher-sign icon-large icon-ok icon-green"></i>
 						</div>
+					{{/each}}
 					</div>
-				{{/each}}
-				</div>
-				<div class="restriction-message help-box">
+					<div class="restriction-message help-box">
+					</div>
+					{{#if extra.hasDisabledRestrictions}}
+					<div class="disabled-restrictions-info help-box gray-box">
+						<div class="wrapper-icon">
+							&nbsp;<i class="icon-info-sign2"></i>&nbsp;
+						</div>
+						<div class="text-wrapper">
+							<p>{{ i18n.devices.popupSettings.restrictions.disabledRestrictionsInfo }}</p>
+						</div>
+					</div>
+					{{/if}}
 				</div>
 			</div>
 

views/devices-fax.html

@@ -104,32 +104,44 @@
 			</div>
 
 			<div class="tabs-section clearfix" data-section="restrictions">
-				<div class="restriction-matcher-div">
-					<i class="help-popover icon-question-sign icon-large" data-original-title="{{i18n.devices.popupSettings.restrictions.matcher.help}}" data-placement="top" data-toggle="tooltip"></i>
-					<input type="text" class="restriction-matcher-input" placeholder="{{i18n.devices.popupSettings.restrictions.matcher.placeholder}}" />
-					<button type="button"  class="btn btn-primary restriction-matcher-button">{{i18n.devices.popupSettings.restrictions.matcher.button}}</button>
-				</div>
-				<div class="title">
-					{{ i18n.devices.popupSettings.restrictions.sectionTitle }}
-				</div>
-				<div class="restriction-list">
-				{{#each extra.restrictions}}
-					<div class="control-group restriction-line{{#if this.disabled}} disabled{{/if}}" data-restriction="{{@key}}">
-						<label class="control-label">{{this.friendly_name}}
-							{{#if this.help}}
-								<i class="help-popover icon-question-sign" data-original-title="{{this.help}}" data-placement="top" data-toggle="tooltip"></i>
-							{{/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="restrictions-container">
+					<div class="restriction-matcher-div">
+						<i class="help-popover icon-question-sign icon-large" data-original-title="{{i18n.devices.popupSettings.restrictions.matcher.help}}" data-placement="top" data-toggle="tooltip"></i>
+						<input type="text" class="restriction-matcher-input" placeholder="{{i18n.devices.popupSettings.restrictions.matcher.placeholder}}" />
+						<button type="button"  class="btn btn-primary restriction-matcher-button">{{i18n.devices.popupSettings.restrictions.matcher.button}}</button>
+					</div>
+					<div class="title">
+						{{ i18n.devices.popupSettings.restrictions.sectionTitle }}
+					</div>
+					<div class="restriction-list">
+					{{#each extra.restrictions}}
+						<div class="control-group restriction-line{{#if this.disabled}} disabled{{/if}}" data-restriction="{{@key}}">
+							<label class="control-label">{{this.friendly_name}}
+								{{#if this.help}}
+									<i class="help-popover icon-question-sign" data-original-title="{{this.help}}" data-placement="top" data-toggle="tooltip"></i>
+								{{/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>
+								<i class="restriction-matcher-sign icon-large icon-ok icon-green"></i>
 							</div>
-							<i class="restriction-matcher-sign icon-large icon-ok icon-green"></i>
 						</div>
+					{{/each}}
 					</div>
-				{{/each}}
-				</div>
-				<div class="restriction-message help-box">
+					<div class="restriction-message help-box">
+					</div>
+					{{#if extra.hasDisabledRestrictions}}
+					<div class="disabled-restrictions-info help-box gray-box">
+						<div class="wrapper-icon">
+							&nbsp;<i class="icon-info-sign2"></i>&nbsp;
+						</div>
+						<div class="text-wrapper">
+							<p>{{ i18n.devices.popupSettings.restrictions.disabledRestrictionsInfo }}</p>
+						</div>
+					</div>
+					{{/if}}
 				</div>
 			</div>
 

views/devices-mobile.html

@@ -131,32 +131,44 @@
 			</div>
 
 			<div class="tabs-section clearfix" data-section="restrictions">
-				<div class="restriction-matcher-div">
-					<i class="help-popover icon-question-sign icon-large" data-original-title="{{i18n.devices.popupSettings.restrictions.matcher.help}}" data-placement="top" data-toggle="tooltip"></i>
-					<input type="text" class="restriction-matcher-input" placeholder="{{i18n.devices.popupSettings.restrictions.matcher.placeholder}}" />
-					<button type="button"  class="btn btn-primary restriction-matcher-button">{{i18n.devices.popupSettings.restrictions.matcher.button}}</button>
-				</div>
-				<div class="title">
-					{{ i18n.devices.popupSettings.restrictions.sectionTitle }}
-				</div>
-				<div class="restriction-list">
-				{{#each extra.restrictions}}
-					<div class="control-group restriction-line{{#if this.disabled}} disabled{{/if}}" data-restriction="{{@key}}">
-						<label class="control-label">{{this.friendly_name}}
-							{{#if this.help}}
-								<i class="help-popover icon-question-sign" data-original-title="{{this.help}}" data-placement="top" data-toggle="tooltip"></i>
-							{{/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="restrictions-container">
+					<div class="restriction-matcher-div">
+						<i class="help-popover icon-question-sign icon-large" data-original-title="{{i18n.devices.popupSettings.restrictions.matcher.help}}" data-placement="top" data-toggle="tooltip"></i>
+						<input type="text" class="restriction-matcher-input" placeholder="{{i18n.devices.popupSettings.restrictions.matcher.placeholder}}" />
+						<button type="button"  class="btn btn-primary restriction-matcher-button">{{i18n.devices.popupSettings.restrictions.matcher.button}}</button>
+					</div>
+					<div class="title">
+						{{ i18n.devices.popupSettings.restrictions.sectionTitle }}
+					</div>
+					<div class="restriction-list">
+					{{#each extra.restrictions}}
+						<div class="control-group restriction-line{{#if this.disabled}} disabled{{/if}}" data-restriction="{{@key}}">
+							<label class="control-label">{{this.friendly_name}}
+								{{#if this.help}}
+									<i class="help-popover icon-question-sign" data-original-title="{{this.help}}" data-placement="top" data-toggle="tooltip"></i>
+								{{/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>
+								<i class="restriction-matcher-sign icon-large icon-ok icon-green"></i>
 							</div>
-							<i class="restriction-matcher-sign icon-large icon-ok icon-green"></i>
 						</div>
+					{{/each}}
 					</div>
-				{{/each}}
-				</div>
-				<div class="restriction-message help-box">
+					<div class="restriction-message help-box">
+					</div>
+					{{#if extra.hasDisabledRestrictions}}
+					<div class="disabled-restrictions-info help-box gray-box">
+						<div class="wrapper-icon">
+							&nbsp;<i class="icon-info-sign2"></i>&nbsp;
+						</div>
+						<div class="text-wrapper">
+							<p>{{ i18n.devices.popupSettings.restrictions.disabledRestrictionsInfo }}</p>
+						</div>
+					</div>
+					{{/if}}
 				</div>
 			</div>
 

views/devices-sip_device.html

@@ -167,32 +167,44 @@
 			</div>
 
 			<div class="tabs-section clearfix" data-section="restrictions">
-				<div class="restriction-matcher-div">
-					<i class="help-popover icon-question-sign icon-large" data-original-title="{{i18n.devices.popupSettings.restrictions.matcher.help}}" data-placement="top" data-toggle="tooltip"></i>
-					<input type="text" class="restriction-matcher-input" placeholder="{{i18n.devices.popupSettings.restrictions.matcher.placeholder}}" />
-					<button type="button"  class="btn btn-primary restriction-matcher-button">{{i18n.devices.popupSettings.restrictions.matcher.button}}</button>
-				</div>
-				<div class="title">
-					{{ i18n.devices.popupSettings.restrictions.sectionTitle }}
-				</div>
-				<div class="restriction-list">
-				{{#each extra.restrictions}}
-					<div class="control-group restriction-line{{#if this.disabled}} disabled{{/if}}" data-restriction="{{@key}}">
-						<label class="control-label">{{this.friendly_name}}
-							{{#if this.help}}
-								<i class="help-popover icon-question-sign" data-original-title="{{this.help}}" data-placement="top" data-toggle="tooltip"></i>
-							{{/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="restrictions-container">
+					<div class="restriction-matcher-div">
+						<i class="help-popover icon-question-sign icon-large" data-original-title="{{i18n.devices.popupSettings.restrictions.matcher.help}}" data-placement="top" data-toggle="tooltip"></i>
+						<input type="text" class="restriction-matcher-input" placeholder="{{i18n.devices.popupSettings.restrictions.matcher.placeholder}}" />
+						<button type="button"  class="btn btn-primary restriction-matcher-button">{{i18n.devices.popupSettings.restrictions.matcher.button}}</button>
+					</div>
+					<div class="title">
+						{{ i18n.devices.popupSettings.restrictions.sectionTitle }}
+					</div>
+					<div class="restriction-list">
+					{{#each extra.restrictions}}
+						<div class="control-group restriction-line{{#if this.disabled}} disabled{{/if}}" data-restriction="{{@key}}">
+							<label class="control-label">{{this.friendly_name}}
+								{{#if this.help}}
+									<i class="help-popover icon-question-sign" data-original-title="{{this.help}}" data-placement="top" data-toggle="tooltip"></i>
+								{{/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>
+								<i class="restriction-matcher-sign icon-large icon-ok icon-green"></i>
 							</div>
-							<i class="restriction-matcher-sign icon-large icon-ok icon-green"></i>
 						</div>
+					{{/each}}
 					</div>
-				{{/each}}
-				</div>
-				<div class="restriction-message help-box">
+					<div class="restriction-message help-box">
+					</div>
+					{{#if extra.hasDisabledRestrictions}}
+					<div class="disabled-restrictions-info help-box gray-box">
+						<div class="wrapper-icon">
+							&nbsp;<i class="icon-info-sign2"></i>&nbsp;
+						</div>
+						<div class="text-wrapper">
+							<p>{{ i18n.devices.popupSettings.restrictions.disabledRestrictionsInfo }}</p>
+						</div>
+					</div>
+					{{/if}}
 				</div>
 			</div>
 

views/devices-smartphone.html

@@ -159,32 +159,44 @@
 			</div>
 
 			<div class="tabs-section clearfix" data-section="restrictions">
-				<div class="restriction-matcher-div">
-					<i class="help-popover icon-question-sign icon-large" data-original-title="{{i18n.devices.popupSettings.restrictions.matcher.help}}" data-placement="top" data-toggle="tooltip"></i>
-					<input type="text" class="restriction-matcher-input" placeholder="{{i18n.devices.popupSettings.restrictions.matcher.placeholder}}" />
-					<button type="button"  class="btn btn-primary restriction-matcher-button">{{i18n.devices.popupSettings.restrictions.matcher.button}}</button>
-				</div>
-				<div class="title">
-					{{ i18n.devices.popupSettings.restrictions.sectionTitle }}
-				</div>
-				<div class="restriction-list">
-				{{#each extra.restrictions}}
-					<div class="control-group restriction-line{{#if this.disabled}} disabled{{/if}}" data-restriction="{{@key}}">
-						<label class="control-label">{{this.friendly_name}}
-							{{#if this.help}}
-								<i class="help-popover icon-question-sign" data-original-title="{{this.help}}" data-placement="top" data-toggle="tooltip"></i>
-							{{/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="restrictions-container">
+					<div class="restriction-matcher-div">
+						<i class="help-popover icon-question-sign icon-large" data-original-title="{{i18n.devices.popupSettings.restrictions.matcher.help}}" data-placement="top" data-toggle="tooltip"></i>
+						<input type="text" class="restriction-matcher-input" placeholder="{{i18n.devices.popupSettings.restrictions.matcher.placeholder}}" />
+						<button type="button"  class="btn btn-primary restriction-matcher-button">{{i18n.devices.popupSettings.restrictions.matcher.button}}</button>
+					</div>
+					<div class="title">
+						{{ i18n.devices.popupSettings.restrictions.sectionTitle }}
+					</div>
+					<div class="restriction-list">
+					{{#each extra.restrictions}}
+						<div class="control-group restriction-line{{#if this.disabled}} disabled{{/if}}" data-restriction="{{@key}}">
+							<label class="control-label">{{this.friendly_name}}
+								{{#if this.help}}
+									<i class="help-popover icon-question-sign" data-original-title="{{this.help}}" data-placement="top" data-toggle="tooltip"></i>
+								{{/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>
+								<i class="restriction-matcher-sign icon-large icon-ok icon-green"></i>
 							</div>
-							<i class="restriction-matcher-sign icon-large icon-ok icon-green"></i>
 						</div>
+					{{/each}}
 					</div>
-				{{/each}}
-				</div>
-				<div class="restriction-message help-box">
+					<div class="restriction-message help-box">
+					</div>
+					{{#if extra.hasDisabledRestrictions}}
+					<div class="disabled-restrictions-info help-box gray-box">
+						<div class="wrapper-icon">
+							&nbsp;<i class="icon-info-sign2"></i>&nbsp;
+						</div>
+						<div class="text-wrapper">
+							<p>{{ i18n.devices.popupSettings.restrictions.disabledRestrictionsInfo }}</p>
+						</div>
+					</div>
+					{{/if}}
 				</div>
 			</div>
 

views/devices-softphone.html

@@ -124,32 +124,44 @@
 			</div>
 
 			<div class="tabs-section clearfix" data-section="restrictions">
-				<div class="restriction-matcher-div">
-					<i class="help-popover icon-question-sign icon-large" data-original-title="{{i18n.devices.popupSettings.restrictions.matcher.help}}" data-placement="top" data-toggle="tooltip"></i>
-					<input type="text" class="restriction-matcher-input" placeholder="{{i18n.devices.popupSettings.restrictions.matcher.placeholder}}" />
-					<button type="button"  class="btn btn-primary restriction-matcher-button">{{i18n.devices.popupSettings.restrictions.matcher.button}}</button>
-				</div>
-				<div class="title">
-					{{ i18n.devices.popupSettings.restrictions.sectionTitle }}
-				</div>
-				<div class="restriction-list">
-				{{#each extra.restrictions}}
-					<div class="control-group restriction-line{{#if this.disabled}} disabled{{/if}}" data-restriction="{{@key}}">
-						<label class="control-label">{{this.friendly_name}}
-							{{#if this.help}}
-								<i class="help-popover icon-question-sign" data-original-title="{{this.help}}" data-placement="top" data-toggle="tooltip"></i>
-							{{/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="restrictions-container">
+					<div class="restriction-matcher-div">
+						<i class="help-popover icon-question-sign icon-large" data-original-title="{{i18n.devices.popupSettings.restrictions.matcher.help}}" data-placement="top" data-toggle="tooltip"></i>
+						<input type="text" class="restriction-matcher-input" placeholder="{{i18n.devices.popupSettings.restrictions.matcher.placeholder}}" />
+						<button type="button"  class="btn btn-primary restriction-matcher-button">{{i18n.devices.popupSettings.restrictions.matcher.button}}</button>
+					</div>
+					<div class="title">
+						{{ i18n.devices.popupSettings.restrictions.sectionTitle }}
+					</div>
+					<div class="restriction-list">
+					{{#each extra.restrictions}}
+						<div class="control-group restriction-line{{#if this.disabled}} disabled{{/if}}" data-restriction="{{@key}}">
+							<label class="control-label">{{this.friendly_name}}
+								{{#if this.help}}
+									<i class="help-popover icon-question-sign" data-original-title="{{this.help}}" data-placement="top" data-toggle="tooltip"></i>
+								{{/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>
+								<i class="restriction-matcher-sign icon-large icon-ok icon-green"></i>
 							</div>
-							<i class="restriction-matcher-sign icon-large icon-ok icon-green"></i>
 						</div>
+					{{/each}}
 					</div>
-				{{/each}}
-				</div>
-				<div class="restriction-message help-box">
+					<div class="restriction-message help-box">
+					</div>
+					{{#if extra.hasDisabledRestrictions}}
+					<div class="disabled-restrictions-info help-box gray-box">
+						<div class="wrapper-icon">
+							&nbsp;<i class="icon-info-sign2"></i>&nbsp;
+						</div>
+						<div class="text-wrapper">
+							<p>{{ i18n.devices.popupSettings.restrictions.disabledRestrictionsInfo }}</p>
+						</div>
+					</div>
+					{{/if}}
 				</div>
 			</div>