Disabled state for all templates

Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>

12 files changed, 58 insertions, 34 deletions

diff --git a/templates/contactDetails.html b/templates/contactDetails.html
index 249892a3..568610c8 100644
--- a/templates/contactDetails.html
+++ b/templates/contactDetails.html
@@ -12,15 +12,18 @@
 			<div id="details-contact-infos">
 				<h2>
 					<input type="text" id="details-fullName" class="contactdetails__name" placeholder="{{ctrl.t.placeholderName}}" autocomplete="off" autocorrect="off" spellcheck="false"
-						   name="fullname" ng-model="ctrl.contact.fullName" ng-model-options="{ getterSetter: true, debounce: 500 }" ng-change="ctrl.updateContact()" value="" />
+						   name="fullname" ng-model="ctrl.contact.fullName" ng-model-options="{ getterSetter: true, debounce: 500 }" ng-change="ctrl.updateContact()" value=""
+						   ng-disabled="ctrl.addressBook.readOnly" />
 				</h2>
 				<div id="details-org-container">
 					<input type="text" id="details-org" class="contactdetails__org" placeholder="{{ctrl.t.placeholderOrg}}" autocomplete="off" autocorrect="off" spellcheck="false"
 						   name="org" ng-model="ctrl.contact.org" ng-model-options="{ getterSetter: true, debounce: 500 }" ng-change="ctrl.updateContact()" value=""
-						   inputresize size="{{ctrl.contact.org().length > 1 ? ctrl.contact.org().length : '1'}}" />
+						   inputresize size="{{ctrl.contact.org().length > 1 ? ctrl.contact.org().length : '1'}}"
+						   ng-disabled="ctrl.addressBook.readOnly" />
 					<input type="text" id="details-title" class="contactdetails__title" placeholder="{{ctrl.t.placeholderTitle}}" autocomplete="off" autocorrect="off" spellcheck="false"
 						   name="title" ng-model="ctrl.contact.title" ng-model-options="{ getterSetter: true, debounce: 500 }" ng-change="ctrl.updateContact()" value=""
-						   inputresize size="{{ctrl.contact.title().length > 1 ? ctrl.contact.title().length : '1'}}" />
+						   inputresize size="{{ctrl.contact.title().length > 1 ? ctrl.contact.title().length : '1'}}"
+						   ng-disabled="ctrl.addressBook.readOnly" />
 				</div>
 			</div>
 			<div id="details-actions">
@@ -28,7 +31,7 @@
 				<a href="{{ctrl.contact.data.url}}" id="contact-export-link"
 				   class="icon-download-white" title="{{ctrl.t.download}}"
 				   download="{{ ctrl.contact.readableFilename() }}"></a>
-				<button ng-click="ctrl.deleteContact()" class="icon-delete-white" title="{{ctrl.t.delete}}"></button>
+				<button ng-click="ctrl.deleteContact()" ng-if="!ctrl.addressBook.readOnly" class="icon-delete-white" title="{{ctrl.t.delete}}"></button>
 			</div>
 		</header>
 		<section>
@@ -36,13 +39,13 @@
 				<detailsItem ng-repeat="propData in prop" name="prop.$key" data="propData" model="ctrl" index="$index"
 							 class="details-item-{{prop.$key}}" ng-class="{ 'failed': ctrl.contact.failedProps.indexOf(prop.$key) !== -1 }"></detailsItem>
 			</div>
-			<div class="select-addressbook" ng-if="ctrl.addressBooks.length > 1">
+			<div class="select-addressbook" ng-if="ctrl.addressBooks.length > 1 && !ctrl.addressBook.readOnly">
 				<label for="details-addressbook">{{ctrl.t.addressBook}}</label>
 				<select ng-model="ctrl.addressBook" ng-change="ctrl.changeAddressBook(ctrl.addressBook)" id="details-addressbook"
 						ng-options="book.displayName for book in ctrl.addressBooks | filter: {readOnly: false}">
 				</select>
 			</div>
-			<select class="add-field" ng-model="ctrl.field" ng-change="ctrl.addField(ctrl.field)">
+			<select class="add-field" ng-model="ctrl.field" ng-change="ctrl.addField(ctrl.field)" ng-if="!ctrl.addressBook.readOnly">
 				<option value=''>{{ctrl.t.selectField}}</option>
 				<option ng-repeat="field in ctrl.fieldDefinitions | fieldFilter: ctrl.contact | orderBy : 'name'" value="{{field.id}}">{{field.name}}</option>
 			</select>
diff --git a/templates/detailItems/adr.html b/templates/detailItems/adr.html
index c5688ce8..0a41e038 100644
--- a/templates/detailItems/adr.html
+++ b/templates/detailItems/adr.html
@@ -1,30 +1,36 @@
-<select ng-model="ctrl.type" ng-model-options="{ debounce: 500 }" ng-change="ctrl.changeType(ctrl.type)">
+<select ng-model="ctrl.type" ng-model-options="{ debounce: 500 }" ng-change="ctrl.changeType(ctrl.type)" ng-disabled="ctrl.addressBook.readOnly">
 	<option ng-repeat="option in ctrl.availableOptions" value="{{option.id}}">{{option.name}}</option>
 </select>
-<button ng-click="ctrl.deleteField()" class="icon-delete" title="{{ctrl.t.delete}}"></button>
+<button ng-click="ctrl.deleteField()" class="icon-delete" title="{{ctrl.t.delete}}" ng-if="!ctrl.addressBook.readOnly"></button>
 <div>
 
 	<label for="details-pobox-{{ctrl.index}}">{{ctrl.t.poBox}}</label>
-	<input type="text" id="details-pobox-{{ctrl.index}}" name="address" ng-model="ctrl.data.value[0]" ng-model-options="{ debounce: 500 }" ng-change="ctrl.model.updateContact()"  value="" />
+	<input type="text" id="details-pobox-{{ctrl.index}}" name="address" ng-model="ctrl.data.value[0]" ng-model-options="{ debounce: 500 }" ng-change="ctrl.model.updateContact()"  value=""
+	ng-disabled="ctrl.addressBook.readOnly" />
 </div>
 <div>
 	<label for="details-address-{{ctrl.index}}">{{ctrl.t.address}}</label>
 	<input type="text" id="details-address-{{ctrl.index}}" name="address" ng-model="ctrl.data.value[2]" ng-model-options="{ debounce: 500 }" ng-change="ctrl.model.updateContact()" value=""
+	ng-disabled="ctrl.addressBook.readOnly"
 		   focus-expression="$parent.ctrl.focus === ctrl.name" />
 </div>
 <div>
 	<label for="details-postal-code-{{ctrl.index}}">{{ctrl.t.postalCode}}</label>
-	<input type="text" id="details-postal-code-{{ctrl.index}}" name="postal-code" ng-model="ctrl.data.value[5]" ng-model-options="{ debounce: 500 }" ng-change="ctrl.model.updateContact()" value="" />
+	<input type="text" id="details-postal-code-{{ctrl.index}}" name="postal-code" ng-model="ctrl.data.value[5]" ng-model-options="{ debounce: 500 }" ng-change="ctrl.model.updateContact()" value=""
+	ng-disabled="ctrl.addressBook.readOnly" />
 </div>
 <div>
 	<label for="details-city-{{ctrl.index}}">{{ctrl.t.city}}</label>
-	<input type="text" id="details-city-{{ctrl.index}}" name="city" ng-model="ctrl.data.value[3]" ng-model-options="{ debounce: 500 }" ng-change="ctrl.model.updateContact()" value="" />
+	<input type="text" id="details-city-{{ctrl.index}}" name="city" ng-model="ctrl.data.value[3]" ng-model-options="{ debounce: 500 }" ng-change="ctrl.model.updateContact()" value=""
+	ng-disabled="ctrl.addressBook.readOnly" />
 </div>
 <div>
 	<label for="details-state-{{ctrl.index}}">{{ctrl.t.state}}</label>
-	<input type="text" id="details-state-{{ctrl.index}}" name="state" ng-model="ctrl.data.value[4]" ng-model-options="{ debounce: 500 }" ng-change="ctrl.model.updateContact()" value="" />
+	<input type="text" id="details-state-{{ctrl.index}}" name="state" ng-model="ctrl.data.value[4]" ng-model-options="{ debounce: 500 }" ng-change="ctrl.model.updateContact()" value=""
+	ng-disabled="ctrl.addressBook.readOnly" />
 </div>
 <div>
 	<label for="details-country-{{ctrl.index}}">{{ctrl.t.country}}</label>
-	<input type="text" id="details-country-{{ctrl.index}}" name="state" ng-model="ctrl.data.value[6]" ng-model-options="{ debounce: 500 }" ng-change="ctrl.model.updateContact()" value="" />
+	<input type="text" id="details-country-{{ctrl.index}}" name="state" ng-model="ctrl.data.value[6]" ng-model-options="{ debounce: 500 }" ng-change="ctrl.model.updateContact()" value=""
+	ng-disabled="ctrl.addressBook.readOnly" />
 </div>
diff --git a/templates/detailItems/date.html b/templates/detailItems/date.html
index bc538d51..ebd77223 100644
--- a/templates/detailItems/date.html
+++ b/templates/detailItems/date.html
@@ -3,5 +3,6 @@
 	   ng-model="ctrl.data.value" datepicker ng-model-options="{ debounce: 500 }"
 	   ng-change="ctrl.dateInputChanged()" value=""
 	   focus-expression="$parent.ctrl.focus === ctrl.name"
+	   ng-disabled="ctrl.addressBook.readOnly"
 />
-<button ng-click="ctrl.deleteField()" class="icon-delete" title="{{ctrl.t.delete}}"></button>
+<button ng-click="ctrl.deleteField()" class="icon-delete" title="{{ctrl.t.delete}}" ng-if="!ctrl.addressBook.readOnly"></button>
diff --git a/templates/detailItems/email.html b/templates/detailItems/email.html
index d297bf9d..0955690a 100644
--- a/templates/detailItems/email.html
+++ b/templates/detailItems/email.html
@@ -1,4 +1,4 @@
-<select ng-model="ctrl.type" ng-model-options="{ debounce: 500 }" ng-change="ctrl.changeType(ctrl.type)">
+<select ng-model="ctrl.type" ng-model-options="{ debounce: 500 }" ng-change="ctrl.changeType(ctrl.type)" ng-disabled="ctrl.addressBook.readOnly">
     <option ng-repeat="option in ctrl.availableOptions" value="{{option.id}}">{{option.name}}</option>
 </select>
 <a ng-if="ctrl.data.value.length" class="item-action" href="mailto:{{ctrl.data.value}}">
@@ -9,5 +9,6 @@
        ng-change="ctrl.model.updateContact()" value=""
        placeholder="{{ctrl.meta.readableName}}"
        focus-expression="$parent.ctrl.focus === ctrl.name"
+       ng-disabled="ctrl.addressBook.readOnly"
 />
-<button ng-click="ctrl.deleteField()" class="icon-delete" title="{{ctrl.t.delete}}"></button>
+<button ng-click="ctrl.deleteField()" class="icon-delete" title="{{ctrl.t.delete}}" ng-if="!ctrl.addressBook.readOnly"></button>
diff --git a/templates/detailItems/groups.html b/templates/detailItems/groups.html
index a698113a..0a666bed 100644
--- a/templates/detailItems/groups.html
+++ b/templates/detailItems/groups.html
@@ -1,7 +1,8 @@
 <label ng-if="ctrl.availableOptions.length === 0" for="details-{{ctrl.name}}-{{ctrl.index}}">{{ctrl.meta.readableName}}</label>
 <ui-select id="details-{{ctrl.name}}-{{ctrl.index}}" multiple tagging tagging-label="{{ctrl.t.newGroup}}" ng-model="ctrl.data.value"
 		   on-remove="ctrl.model.updateContact()" on-select="ctrl.model.updateContact()"
-		   theme="select2" focus-expression="$parent.$parent.ctrl.focus === ctrl.name">
+		   theme="select2" focus-expression="$parent.$parent.ctrl.focus === ctrl.name"
+		   ng-disabled="ctrl.addressBook.readOnly">
 	<ui-select-match placeholder="{{ctrl.meta.readableName}}">{{$item}}</ui-select-match>
 	<ui-select-choices repeat="group in ctrl.availableGroups | filter:$select.search">
 		{{group}}
diff --git a/templates/detailItems/n.html b/templates/detailItems/n.html
index 21615e60..433bb1a2 100644
--- a/templates/detailItems/n.html
+++ b/templates/detailItems/n.html
@@ -1,27 +1,32 @@
 <label ng-if="ctrl.availableOptions.length === 0">{{ctrl.meta.readableName}}</label>
-<button ng-click="ctrl.deleteField()" class="icon-delete" title="{{ctrl.t.delete}}"></button>
+<button ng-click="ctrl.deleteField()" class="icon-delete" title="{{ctrl.t.delete}}" ng-if="!ctrl.addressBook.readOnly"></button>
 <div>
 	<label for="details-honorificPrefix-{{ctrl.index}}">{{ctrl.t.honorificPrefix}}</label>
 	<input type="text" id="details-honorificPrefix-{{ctrl.index}}" name="honorificPrefix" ng-model="ctrl.data.value[3]" ng-model-options="{ debounce: 500 }" ng-change="ctrl.updateDetailedName()"
-		   autocomplete="off" autocorrect="off" spellcheck="false" value="" />
+		   autocomplete="off" autocorrect="off" spellcheck="false" value=""
+		   ng-disabled="ctrl.addressBook.readOnly" />
 </div>
 <div>
 	<label for="details-firstName-{{ctrl.index}}">{{ctrl.t.firstName}}</label>
 	<input type="text" id="details-firstName-{{ctrl.index}}" name="firstName" ng-model="ctrl.data.value[1]" ng-model-options="{ debounce: 500 }" ng-change="ctrl.updateDetailedName()"
-		   autocomplete="off" autocorrect="off" spellcheck="false"  value="" />
+		   autocomplete="off" autocorrect="off" spellcheck="false"  value=""
+		   ng-disabled="ctrl.addressBook.readOnly" />
 </div>
 <div>
 	<label for="details-additionalNames-{{ctrl.index}}">{{ctrl.t.additionalNames}}</label>
 	<input type="text" id="details-additionalNames-{{ctrl.index}}" name="additionalNames" ng-model="ctrl.data.value[2]" ng-model-options="{ debounce: 500 }" ng-change="ctrl.updateDetailedName()"
-		   autocomplete="off" autocorrect="off" spellcheck="false"  value="" />
+		   autocomplete="off" autocorrect="off" spellcheck="false"  value=""
+		   ng-disabled="ctrl.addressBook.readOnly" />
 </div>
 <div>
 	<label for="details-familyName-{{ctrl.index}}">{{ctrl.t.familyName}}</label>
 	<input type="text" id="details-familyName-{{ctrl.index}}" name="familyName" ng-model="ctrl.data.value[0]" ng-model-options="{ debounce: 500 }" ng-change="ctrl.updateDetailedName()"
-		   autocomplete="off" autocorrect="off" spellcheck="false"  value="" />
+		   autocomplete="off" autocorrect="off" spellcheck="false"  value=""
+		   ng-disabled="ctrl.addressBook.readOnly" />
 </div>
 <div>
 	<label for="details-honorificSuffix-{{ctrl.index}}">{{ctrl.t.honorificSuffix}}</label>
 	<input type="text" id="details-honorificSuffix-{{ctrl.index}}" name="honorificSuffix" ng-model="ctrl.data.value[4]" ng-model-options="{ debounce: 500 }" ng-change="ctrl.updateDetailedName()"
-		   autocomplete="off" autocorrect="off" spellcheck="false"  value="" />
+		   autocomplete="off" autocorrect="off" spellcheck="false"  value=""
+		   ng-disabled="ctrl.addressBook.readOnly" />
 </div>
diff --git a/templates/detailItems/select.html b/templates/detailItems/select.html
index 259e74a8..3d35bdee 100644
--- a/templates/detailItems/select.html
+++ b/templates/detailItems/select.html
@@ -1,5 +1,7 @@
 <label ng-if="ctrl.availableOptions.length > 0" for="details-{{ctrl.name}}">{{ctrl.meta.readableName}}</label>
-<select id="details-{{ctrl.name}}" name="{{ctrl.name}}" ng-if="ctrl.availableOptions.length > 0" ng-model="ctrl.data.value" ng-model-options="{ debounce: 500 }" ng-change="ctrl.model.updateContact()">
+<select id="details-{{ctrl.name}}" name="{{ctrl.name}}" ng-if="ctrl.availableOptions.length > 0"
+		ng-model="ctrl.data.value" ng-model-options="{ debounce: 500 }" ng-change="ctrl.model.updateContact()"
+		ng-disabled="ctrl.addressBook.readOnly">
 	<option ng-repeat="option in ctrl.availableOptions" value="{{option.id}}">{{option.name}}</option>
 </select>
-<button ng-click="ctrl.deleteField()" class="icon-delete" title="{{ctrl.t.delete}}"></button>
+<button ng-click="ctrl.deleteField()" class="icon-delete" title="{{ctrl.t.delete}}" ng-if="!ctrl.addressBook.readOnly"></button>
diff --git a/templates/detailItems/tel.html b/templates/detailItems/tel.html
index 340d90cc..20b754b8 100644
--- a/templates/detailItems/tel.html
+++ b/templates/detailItems/tel.html
@@ -1,4 +1,4 @@
-<select ng-model="ctrl.type" ng-model-options="{ debounce: 500 }" ng-change="ctrl.changeType(ctrl.type)">
+<select ng-model="ctrl.type" ng-model-options="{ debounce: 500 }" ng-change="ctrl.changeType(ctrl.type)" ng-disabled="ctrl.addressBook.readOnly">
     <option ng-repeat="option in ctrl.availableOptions" value="{{option.id}}">{{option.name}}</option>
 </select>
 <a ng-if="ctrl.data.value.length" class="item-action" href="tel:{{ctrl.data.value}}">
@@ -9,5 +9,6 @@
        ng-change="ctrl.model.updateContact()" value=""
        placeholder="{{ctrl.meta.readableName}}"
        focus-expression="$parent.ctrl.focus === ctrl.name"
+       ng-disabled="ctrl.addressBook.readOnly"
 />
-<button ng-click="ctrl.deleteField()" class="icon-delete" title="{{ctrl.t.delete}}"></button>
+<button ng-click="ctrl.deleteField()" class="icon-delete" title="{{ctrl.t.delete}}" ng-if="!ctrl.addressBook.readOnly"></button>
diff --git a/templates/detailItems/text.html b/templates/detailItems/text.html
index b55bee68..beccff43 100644
--- a/templates/detailItems/text.html
+++ b/templates/detailItems/text.html
@@ -1,4 +1,4 @@
-<select ng-if="ctrl.availableOptions.length > 0" ng-model="ctrl.type" ng-model-options="{ debounce: 500 }" ng-change="ctrl.changeType(ctrl.type)">
+<select ng-if="ctrl.availableOptions.length > 0" ng-model="ctrl.type" ng-model-options="{ debounce: 500 }" ng-change="ctrl.changeType(ctrl.type)" ng-disabled="ctrl.addressBook.readOnly">
 	<option ng-repeat="option in ctrl.availableOptions" value="{{option.id}}">{{option.name}}</option>
 </select>
 <label ng-if="ctrl.availableOptions.length === 0" for="details-{{ctrl.name}}-{{ctrl.index}}">{{ctrl.meta.readableName}}</label>
@@ -7,5 +7,6 @@
 	   ng-change="ctrl.model.updateContact()" value=""
 	   placeholder="{{ctrl.meta.readableName}}"
 	   focus-expression="$parent.ctrl.focus === ctrl.name"
+	   ng-disabled="ctrl.addressBook.readOnly"
 />
-<button ng-click="ctrl.deleteField()" class="icon-delete" title="{{ctrl.t.delete}}"></button>
+<button ng-click="ctrl.deleteField()" class="icon-delete" title="{{ctrl.t.delete}}" ng-if="!ctrl.addressBook.readOnly"></button>
diff --git a/templates/detailItems/textarea.html b/templates/detailItems/textarea.html
index 79631980..739f962b 100644
--- a/templates/detailItems/textarea.html
+++ b/templates/detailItems/textarea.html
@@ -3,6 +3,7 @@
 	ng-model="ctrl.data.value" rows="3" cols="40"
 	ng-model-options="{ debounce: 500 }" ng-change="ctrl.model.updateContact()"
 	placeholder="{{ctrl.meta.readableName}}"
-	focus-expression="$parent.ctrl.focus === ctrl.name">
+	focus-expression="$parent.ctrl.focus === ctrl.name"
+	ng-disabled="ctrl.addressBook.readOnly">
 </textarea>
-<button ng-click="ctrl.deleteField()" class="icon-delete" title="{{ctrl.t.delete}}"></button>
+<button ng-click="ctrl.deleteField()" class="icon-delete" title="{{ctrl.t.delete}}" ng-if="!ctrl.addressBook.readOnly"></button>
diff --git a/templates/detailItems/url.html b/templates/detailItems/url.html
index e3bf47f0..44fecf7d 100644
--- a/templates/detailItems/url.html
+++ b/templates/detailItems/url.html
@@ -7,5 +7,6 @@
 	   ng-change="ctrl.model.updateContact()" value=""
 	   placeholder="https://…"
 	   focus-expression="$parent.ctrl.focus === ctrl.name"
+	   ng-disabled="ctrl.addressBook.readOnly"
 />
-<button ng-click="ctrl.deleteField()" class="icon-delete" title="{{ctrl.t.delete}}"></button>
+<button ng-click="ctrl.deleteField()" class="icon-delete" title="{{ctrl.t.delete}}" ng-if="!ctrl.addressBook.readOnly"></button>
diff --git a/templates/detailItems/username.html b/templates/detailItems/username.html
index 2b4f88ad..92a5655c 100644
--- a/templates/detailItems/username.html
+++ b/templates/detailItems/username.html
@@ -1,4 +1,4 @@
-<select ng-if="ctrl.availableOptions.length > 0" ng-model="ctrl.type" ng-model-options="{ debounce: 500 }" ng-change="ctrl.changeType(ctrl.type)">
+<select ng-if="ctrl.availableOptions.length > 0" ng-model="ctrl.type" ng-model-options="{ debounce: 500 }" ng-change="ctrl.changeType(ctrl.type)" ng-disabled="ctrl.addressBook.readOnly">
 	<option ng-repeat="option in ctrl.availableOptions" value="{{option.id}}">{{option.name}}</option>
 </select>
 <label ng-if="ctrl.availableOptions.length === 0" for="details-{{ctrl.name}}-{{ctrl.index}}">{{ctrl.meta.readableName}}</label>
@@ -7,5 +7,6 @@
 	   ng-change="ctrl.model.updateContact()" value=""
 	   placeholder="Username"
 	   focus-expression="$parent.ctrl.focus === ctrl.name"
+	   ng-disabled="ctrl.addressBook.readOnly"
 />
-<button ng-click="ctrl.deleteField()" class="icon-delete" title="{{ctrl.t.delete}}"></button>
+<button ng-click="ctrl.deleteField()" class="icon-delete" title="{{ctrl.t.delete}}" ng-if="!ctrl.addressBook.readOnly"></button>