UI-294: Create faxbox form

submodules/users/users.css

@@ -687,6 +687,23 @@
 	padding-right: 13px;
 }
 
+.feature-popup-container[data-feature="faxing"] {
+	overflow: hidden;
+}
+
+.feature-popup-container[data-feature="faxing"] #faxbox_form {
+	margin-bottom: 0;
+}
+
+.feature-popup-container[data-feature="faxing"] #printer_link {
+	margin-left: 10px;
+	line-height: 30px;
+}
+
+.feature-popup-container[data-feature="faxing"] #fax_timezone_chosen {
+	margin-left: 10px;
+}
+
 /* Change Password Popup */
 .change-password-popup {
 	width: 430px;

submodules/users/users.js

@@ -1149,12 +1149,32 @@ define(function(require){
 
 								callback && callback(null, existingCallflow)
 							});
+						},
+						faxboxes: function(callback) {
+							self.callApi({
+								resource: 'faxbox.list',
+								data: {
+									accountId: self.accountId
+								},
+								success: function(_data) {
+									var userFaxboxes = [];
+
+									_.each(_data.data, function(val){
+										if ( val.owner_id === currentUser.id ) {
+											userFaxboxes.push(val);
+										}
+									});
+
+									callback && callback(null, userFaxboxes);
+								}
+							})
 						}
 					},
 					function(err, results) {
 						results.user = currentUser;
-
-						self.usersRenderFaxing(results);
+console.log(results);
+						self.usersRenderFaxboxes(results);
+						// self.usersRenderFaxing(results);
 					}
 				);
 			});
@@ -1329,16 +1349,21 @@ define(function(require){
 		usersFormatFaxingData: function(data) {
 			var listNumbers = [];
 
+			_.each(data.numbers, function(value, number) {
+				listNumbers.push(number);
+			});
+
+			listNumbers.sort(function(a, b) {
+				return a < b ? -1 : 1;
+			});
+
 			if(data.callflows) {
 				if(data.callflows.numbers.length > 0) {
-					listNumbers.push(data.callflows.numbers[0]);
+					// listNumbers.push(data.callflows.numbers[0]);
+					listNumbers.unshift(data.callflows.numbers[0]);
 				}
 			}
 
-			_.each(data.numbers, function(value, number) {
-				listNumbers.push(number);
-			});
-
 			data.extra = $.extend(true, {}, data.extra, {
 				listNumbers: listNumbers
 			});
@@ -1457,6 +1482,99 @@ define(function(require){
 		},
 
 
+
+
+
+		usersRenderFaxboxes: function(data) {
+			var self = this,
+				data = self.usersFormatFaxingData(data),
+				featureTemplate = $(monster.template(self, 'users-feature-faxing', data)),
+				switchFeature = featureTemplate.find('.switch').bootstrapSwitch();
+
+			timezone.populateDropdown(featureTemplate.find('#fax_timezone'));
+
+			featureTemplate.find('#fax_timezone').chosen({search_contains: true, width: "78.48%"});
+
+			monster.ui.prettyCheck.create(featureTemplate.find('.content'));
+
+			if ( data.extra.listNumbers.length > 0 ) {
+				var popup = monster.ui.dialog(featureTemplate, {
+						title: data.user.extra.mapFeatures.faxing.title,
+						position: ['center', 20]
+					});
+			} else {
+				monster.ui.alert('error', self.i18n.active().users.errorNumberFaxing);
+			}
+
+			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();
+			});
+
+			featureTemplate.find('.save').on('click', function() {
+				var faxboxData = form2object('faxbox_form', '.', true),
+					args = {
+						openedTab: 'features',
+						callback: function() {
+							popup.dialog('close').remove();
+						}
+					};
+console.log(data);
+				if ( switchFeature.bootstrapSwitch('status') ) {
+					faxboxData.owner_id = !faxboxData.hasOwnProperty('owner_id') ? data.user.id : faxboxData.owner_id;
+					faxboxData.smtp_permission_list = faxboxData.smtp_permission_list.split(' ');
+
+					if ( data.hasOwnProperty('faxbox') && data.faxbox.hasOwnProperty('id') ) {
+						self.callApi({
+							resource: 'faxbox.update',
+							data: {
+								accountId: self.accountId,
+								faxboxId: faxboxId,
+								data: faxboxData
+							},
+							success: function(_data, status) {
+console.log(_data);
+								// self.usersUpdateFaxing(data, newNumber, function(results) {
+								// 	args.userId = results.callflows.owner_id;
+
+								// 	self.usersRender(args);
+								// });
+							}
+						});
+					} else {
+						self.callApi({
+							resource: 'faxbox.create',
+							data: {
+								accountId: self.accountId,
+								data: faxboxData
+							},
+							success: function(_data, status) {
+console.log(_data);
+								// self.usersUpdateFaxing(data, newNumber, function(results) {
+								// 	args.userId = results.callflows.owner_id;
+
+								// 	self.usersRender(args);
+								// });
+							}
+						})
+					}
+				} else {
+					self.usersDeleteFaxing(data.user.id, function() {
+						args.userId = data.user.id;
+
+						self.usersRender(args);
+					});
+				}
+			});
+		},
+
+
+
+
+
 		usersRenderHotdesk: function(currentUser) {
 			var self = this,
 				featureTemplate = $(monster.template(self, 'users-feature-hotdesk', currentUser)),
@@ -3590,9 +3708,11 @@ define(function(require){
 							numbers: [ newNumber ],
 							flow: {
 								data: {
-									owner_id: data.user.id
+									faxbox_id: data.faxbox.id
+									// owner_id: data.user.id
 								},
-								module: 'receive_fax',
+								module: 'faxbox',
+								// module: 'receive_fax',
 								children: {}
 							}
 						};

views/users-feature-faxing.html

@@ -10,21 +10,86 @@
 	</div>
 
 	<div class="content{{#unless user.extra.mapFeatures.faxing.active}} disabled{{/unless}}">
-        {{ i18n.users.faxing.dropdownLabel }}
-		<select class="dropdown-numbers">
-			{{#each extra.listNumbers}}
-				<option value="{{this}}">{{this}}</option>
-			{{/each}}
-		</select>
-
-		<div class="help-box gray-box">
-            <div class="wrapper-icon">
-                &nbsp;<i class="icon-info-sign2"></i>&nbsp;
-            </div>
-            <div class="text-wrapper">
-                <p>{{replaceVar i18n.users.faxing.help this.user.email }}</p>
-            </div>
-        </div>
+		<form class="form-horizontal" id="faxbox_form">
+			<div class="control-group">
+				<label for="name" class="control-label">Name</label>
+				<div class="controls">
+					<input type="text" name="name" id="name" value="{{faxbox.name}}" placeholder="Faxbox name">
+				</div>
+			</div>
+			<div class="control-group">
+				<label for="notifications_inbound_email" class="control-label">Notification inbound email</label>
+				<div class="controls">
+					<input type="email" name="notifications.inbound.email.send_to" id="notifications_inbound_email" value="{{faxbox.notifications.inbound.email.send_to}}">
+				</div>
+			</div>
+			<div class="control-group">
+				<label for="notifications.outbound.email.send_to" class="control-label">Notifications outbound email</label>
+				<div class="controls">
+					<input type="email" name="notifications.outbound.email.send_to" id="notifications_outbound_email" value="{{faxbox.notifications.outbound.email.send_to}}">
+				</div>
+			</div>
+			<div class="control-group">
+				<label for="caller_name" class="control-label">Caller name</label>
+				<div class="controls">
+					<input type="text" name="caller_name" id="caller_name" value="{{faxbox.caller_name}}">
+				</div>
+			</div>
+			<div class="control-group">
+				<label for="caller_id" class="control-label">Caller ID</label>
+				<div class="controls">
+					<select name="caller_id" id="caller_id">
+					{{#each extra.listNumbers}}
+						<option value="{{this}}">{{formatPhoneNumber this}}</option>
+					{{/each}}
+					</select>
+				</div>
+			</div>
+			<div class="control-group">
+				<label for="fax_header" class="control-label">Fax header</label>
+				<div class="controls">
+					<input type="text" name="fax_header" id="fax_header" value="{{faxbox.fax_header}}">
+				</div>
+			</div>
+			<div class="control-group">
+				<label for="fax_identity" class="control-label">Fax identity</label>
+				<div class="controls">
+					<input type="text" name="fax_identity" id="fax_identity" value="{{faxbox.fax_identity}}">
+				</div>
+			</div>
+			<div class="control-group">
+				<label for="smtp_permission_list" class="control-label">SMTP permission list</label>
+				<div class="controls">
+					<input type="text" name="smtp_permission_list" id="smtp_permission_list" value="{{faxbox.smtp_permission_list}}">
+				</div>
+			</div>
+			<div class="control-group">
+				<label for="custom_smtp_email_address" class="control-label">Custom SMTP address</label>
+				<div class="controls">
+					<input type="email" name="custom_smtp_email_address" id="custom_smtp_email_address" value="{{faxbox.custom_smtp_email_address}}">
+				</div>
+			</div>
+			{{#if faxbox.cloud_connector_claim_url}}
+			<div class="control-group">
+				<label for="printer_link" class="control-label">Link to Google printer</label>
+				<div class="controls">
+					<a id="printer_link" href="{{faxbox.cloud_connector_claim_url}}" target="_blank">{{faxbox.cloud_connector_claim_url}}</a>
+				</div>
+			</div>
+			{{/if}}
+			<div class="control-group">
+				<label for="retries" class="control-label">Retries</label>
+				<div class="controls">
+					<input type="text" name="retries" id="retries" value="{{faxbox.retries}}">
+				</div>
+			</div>
+			<div class="control-group">
+				<label for="fax_timezone" class="control-label">Fax timezone</label>
+				<div class="controls">
+					<select id="fax_timezone" name="fax_timezone" data-original_value="{{faxbox.fax_timezone}}"></select>
+				</div>
+			</div>
+		</form>
 	</div>
 
 	<div class="actions clearfix">