diff --git a/app.js b/app.js index c4ce665..c6b0502 100644 --- a/app.js +++ b/app.js @@ -47,17 +47,17 @@ define(function(require) { self.getFaxData(function(results) { self.appFlags.faxboxes = _.keyBy(results.faxboxes, 'id'); - +console.log(_.size(self.appFlags.faxboxes)); var menus = [ { tabs: [ { text: self.i18n.active().fax.menuTitles.inbound, - callback: self.renderInbound + callback: self.renderNewInbound }, { text: self.i18n.active().fax.menuTitles.outbound, - callback: self.renderOutbound + callback: self.renderNewOutbound }, { text: self.i18n.active().fax.menuTitles.logs, @@ -102,83 +102,31 @@ define(function(require) { }); }, - getStorage: function(callback) { + renderNewInbound: function(pArgs) { var self = this; - self.callApi({ - resource: 'storage.get', - data: { - accountId: self.accountId, - generateError: false - }, - success: function(data) { - callback(data.data); - }, - error: function(data, error, globalHandler) { - if (error.status === 404) { - callback(undefined); - } else { - globalHandler(data); - } - } - }); - }, - - renderStorage: function(pArgs) { - var self = this, - args = pArgs || {}, - parent = args.container || $('#fax_app_container .app-content-wrapper'); - - self.getStorage(function(storage) { - var formattedData = self.storageFormatData(storage), - template = $(monster.template(self, 'storage', formattedData)); - - self.storageBindEvents(template); - - monster.pub('common.storagePlanManager.render', { - container: template.find('.control-container'), - forceTypes: ['fax'], - hideOtherTypes: true - }); - - parent - .fadeOut(function() { - $(this) - .empty() - .append(template) - .fadeIn(); - }); - }); + self.renderCommon(pArgs, 'inbound'); }, - storageBindEvents: function(template) { + renderNewOutbound: function(pArgs) { var self = this; - }, - storageFormatData: function(data) { - return data; + self.renderCommon(pArgs, 'outbound'); }, - renderFaxes: function(pArgs) { + renderCommon: function(pArgs, type) { var self = this, args = pArgs || {}, parent = args.container || $('#fax_app_container .app-content-wrapper'), - dates = monster.util.getDefaultRangeDates(self.appFlags.ranges.default), - fromDate = dates.from, - toDate = dates.to, - type = pArgs.type; - - var template = $(monster.template(self, type + '-faxes', { faxboxes: self.appFlags.faxboxes })); - - self.bindCommon(template); + dataTemplate = { + faxboxes: self.appFlags.faxboxes, + count: _.size(self.appFlags.faxboxes) + }, + template = $(monster.template(self, type + '-faxes', dataTemplate)); - if (type === 'inbound') { - self.bindInbound(template); - } else { - self.bindOutbound(template); - } + self.initDatePickerFaxboxes(type, parent, template); - self.initDatePicker(template, fromDate, toDate); + self.bindFaxboxes(type, template); parent .fadeOut(function() { @@ -187,174 +135,130 @@ define(function(require) { .append(template) .fadeIn(); }); - - self.displayFaxesList(type, template, fromDate, toDate); }, - renderInbound: function(pArgs) { - var self = this; - - pArgs.type = 'inbound'; - - self.renderFaxes(pArgs); - }, - - renderOutbound: function(pArgs) { - var self = this; - - pArgs.type = 'outbound'; - - self.renderFaxes(pArgs); - }, - - displayFaxesList: function(type, container, fromDate, toDate, selectedFaxbox) { - var self = this; - - container - .find('.data-state') - .hide(); - - container - .find('.loading-state') - .show(); + initDatePickerFaxboxes: function(type, parent, template) { + var self = this, + dates = monster.util.getDefaultRangeDates(self.appFlags.ranges.default), + fromDate = dates.from, + toDate = dates.to; - self.getTemplateData(type, container, fromDate, toDate, selectedFaxbox, function(template) { - monster.ui.footable(template.find('.footable')); - self.bindTableCommon(template); + var optionsDatePicker = { + container: template, + range: self.appFlags.ranges.max + }; - container.removeClass('empty'); + monster.ui.initRangeDatepicker(optionsDatePicker); - container.find('.main-select-message').prop('checked', false); + template.find('#startDate').datepicker('setDate', fromDate); + template.find('#endDate').datepicker('setDate', toDate); - container - .find('.data-state') - .empty() - .append(template) - .show(); + template.find('.apply-filter').on('click', function(e) { + var faxboxId = template.find('#select_faxbox').val(); - container - .find('.loading-state') - .hide(); + self.displayListFaxes(type, parent, faxboxId); + }); - if (selectedFaxbox && selectedFaxbox !== 'none') { - container.find('#select_faxbox').val(selectedFaxbox).trigger('change'); - } + template.find('.toggle-filter').on('click', function() { + template.find('.filter-by-date').toggleClass('active'); }); }, - getTemplateData: function(type, container, fromDate, toDate, selectedFaxbox, callback) { - var self = this; - - if (type === 'inbound') { - self.getInboundData(fromDate, toDate, function(data) { - var dataTemplate = self.formatInboundData(data), - template = $(monster.template(self, 'inbound-faxes-list', { faxes: dataTemplate })); + bindFaxboxes: function(type, template) { + var self = this, + $selectFaxbox = template.find('.select-faxbox'); - callback && callback(template); - }); - } else { - self.getOutboundData(fromDate, toDate, function(data) { - var dataTemplate = self.formatOutboundData(data), - template = $(monster.template(self, 'outbound-faxes-list', { faxes: dataTemplate })); + monster.ui.tooltips(template); + monster.ui.footable(template.find('.footable')); - callback && callback(template); - }); - } - }, + $selectFaxbox.chosen({ search_contains: true, placeholder_text_single: self.i18n.active().fax.actionBar.selectFaxbox.none }); - bindTableCommon: function(template) { - var self = this; + $selectFaxbox.on('change', function() { + var faxboxId = $(this).val(); - template.find('#fax_list').on('click', '.details-fax', function() { - var $this = $(this), - type = $this.parents('.faxes-table').data('type'), - id = $(this).parents('tr').data('id'); + template.find('.select-faxbox').val(faxboxId).trigger('chosen:updated'); - self.renderDetailsFax(type, id); + self.displayListFaxes(type, template, faxboxId); }); - }, - renderDetailsFax: function(type, id) { - var self = this; + template.find('#refresh_faxbox').on('click', function() { + var faxboxId = $selectFaxbox.val(); - self.getFaxDetails(type, id, function(faxDetails) { - var template = $(monster.template(self, 'fax-CDRDialog')); + if (faxboxId !== 'none') { + self.displayListFaxes(type, template, faxboxId); + } + }); - monster.ui.renderJSON(faxDetails, template.find('#jsoneditor')); + template.find('#delete_faxes').on('click', function() { + var faxboxId = $selectFaxbox.val(), + listSelected = [], + type = $(this).data('type'); - monster.ui.dialog(template, { title: self.i18n.active().fax.CDRPopup.title }); - }); - }, + template.find('.select-fax:checked').each(function(a, el) { + listSelected.push($(el).data('id')); + }); + var content = monster.template(self, '!' + self.i18n.active().fax.deleteConfirm.content, { variable: listSelected.length }); - initDatePicker: function(template, fromDate, toDate) { - var self = this; + monster.ui.confirm(content, function() { + template.find('.select-fax:checked').each(function(a, el) { + listSelected.push($(el).data('id')); + }); - var optionsDatePicker = { - container: template, - range: self.appFlags.ranges.max - }; + template.find('.data-state') + .hide(); - monster.ui.initRangeDatepicker(optionsDatePicker); + template.find('.loading-state') + .show(); - template.find('#startDate').datepicker('setDate', fromDate); - template.find('#endDate').datepicker('setDate', toDate); + self.deleteFaxes(listSelected, type, function() { + toastr.success(self.i18n.active().fax.deleteConfirm.success); - template.find('.apply-filter').on('click', function(e) { - self.refreshFaxes(template); + self.displayListFaxes(type, template, faxboxId); + }); + }, undefined, { + title: self.i18n.active().fax.deleteConfirm.title, + confirmButtonText: self.i18n.active().fax.deleteConfirm.confirmButtonText, + confirmButtonClass: 'monster-button-danger' + }); }); - }, - refreshFaxes: function(template) { - var self = this, - type = template.hasClass('inbound-faxes') ? 'inbound' : 'outbound', - fromDate = template.find('input.filter-from').datepicker('getDate'), - toDate = template.find('input.filter-to').datepicker('getDate'), - selectedFaxbox = template.find('#select_faxbox').val(); - - self.displayFaxesList(type, template, fromDate, toDate, selectedFaxbox); - }, + template.find('#resend_faxes').on('click', function() { + var faxboxId = $selectFaxbox.val(), + listSelected = []; - bindCommon: function(template) { - var self = this, - $selectFaxbox = template.find('#select_faxbox'); + template.find('.select-fax:checked').each(function(a, el) { + listSelected.push($(el).data('id')); + }); - monster.ui.tooltips(template); + var content = monster.template(self, '!' + self.i18n.active().fax.resendConfirm.content, { variable: listSelected.length }); + monster.ui.confirm(content, function() { + self.resendFaxes(listSelected, function() { + toastr.success(self.i18n.active().fax.resendConfirm.success); - $selectFaxbox.chosen({ - search_contains: true, - width: '220px', - placeholder_text_single: self.i18n.active().fax.actionBar.selectFax.none + self.displayListFaxes(type, template, faxboxId); + }); + }, undefined, { + title: self.i18n.active().fax.resendConfirm.title, + confirmButtonText: self.i18n.active().fax.resendConfirm.confirmButtonText + }); }); - $selectFaxbox.on('change', function(e) { - var filtering = FooTable.get('#fax_list').use(FooTable.Filtering), - filter = $(this).val(); - - if (filter === 'all') { - filtering.removeFilter('faxbox_filter'); - } else { - filtering.addFilter('faxbox_filter', filter, [0]); - } - - filtering.filter(); + template.on('click', '.details-fax', function() { + var id = $(this).parents('tr').data('id'); - afterSelect(); + self.renderDetailsFax(type, id); }); function afterSelect() { if (template.find('.select-fax:checked').length) { + template.find('.hidable').removeClass('hidden'); template.find('.main-select-fax').prop('checked', true); - template.find('.actionable').show(); } else { + template.find('.hidable').addClass('hidden'); template.find('.main-select-fax').prop('checked', false); - template.find('.actionable').hide(); } } - template.find('#refresh_faxbox').on('click', function() { - self.refreshFaxes(template); - }); - template.on('click', '.select-fax', function() { afterSelect(); }); @@ -385,91 +289,95 @@ define(function(require) { afterSelect(); }); - template.find('#delete_faxes').on('click', function() { - var listSelected = [], - type = $(this).data('type'); - - template.find('.select-fax:checked').each(function(a, el) { - listSelected.push($(el).data('id')); - }); - var content = monster.template(self, '!' + self.i18n.active().fax.deleteConfirm.content, { variable: listSelected.length }); + template.on('click', '.select-line', function() { + var cb = $(this).parents('.fax-row').find('.select-fax'); - monster.ui.confirm(content, function() { - template.find('.select-fax:checked').each(function(a, el) { - listSelected.push($(el).data('id')); - }); - - self.deleteFaxes(listSelected, type, function() { - toastr.success(self.i18n.active().fax.deleteConfirm.success); - - self.refreshFaxes(template); - }); - }, undefined, { - title: self.i18n.active().fax.deleteConfirm.title, - confirmButtonText: self.i18n.active().fax.deleteConfirm.confirmButtonText, - confirmButtonClass: 'monster-button-danger' - }); + cb.prop('checked', !cb.prop('checked')); + afterSelect(); }); }, - bindInbound: function(template) { - var self = this; - }, + displayListFaxes: function(type, container, faxboxId) { + var self = this, + fromDate = container.find('input.filter-from').datepicker('getDate'), + toDate = container.find('input.filter-to').datepicker('getDate'), + filterByDate = container.find('.filter-by-date').hasClass('active'); - bindOutbound: function(template) { - var self = this; + container.removeClass('empty'); - template.find('#resend_faxes').on('click', function() { - var listSelected = []; - template.find('.select-fax:checked').each(function(a, el) { - listSelected.push($(el).data('id')); - }); - var content = monster.template(self, '!' + self.i18n.active().fax.resendConfirm.content, { variable: listSelected.length }); + // Gives a better feedback to the user if we empty it as we click... showing the user something is happening. + container.find('.data-state') + .hide(); - monster.ui.confirm(content, function() { - self.resendFaxes(listSelected, function() { - toastr.success(self.i18n.active().fax.resendConfirm.success); + container.find('.loading-state') + .show(); - self.refreshFaxes(template); - }); - }, undefined, { - title: self.i18n.active().fax.resendConfirm.title, - confirmButtonText: self.i18n.active().fax.resendConfirm.confirmButtonText - }); - }); - }, + container.find('.hidable').addClass('hidden'); + container.find('.main-select-fax').prop('checked', false); - getInboundData: function(fromDate, toDate, callback) { - var self = this; + monster.ui.footable(container.find('.faxbox-table .footable'), { + getData: function(filters, callback) { + if (filterByDate) { + filters = $.extend(true, filters, { + created_from: monster.util.dateToBeginningOfGregorianDay(fromDate), + created_to: monster.util.dateToEndOfGregorianDay(toDate) + }); + } + // we do this to keep context + self.getRowsFaxes(type, filters, faxboxId, callback); + }, + afterInitialized: function() { + container.find('.data-state') + .show(); - self.getInboundFaxes(fromDate, toDate, function(faxes) { - callback && callback(faxes); + container.find('.loading-state') + .hide(); + }, + backendPagination: { + enabled: false + } }); }, - getOutboundData: function(fromDate, toDate, callback) { + getRowsFaxes: function(type, filters, faxboxId, callback) { var self = this; - self.getOutboundFaxes(fromDate, toDate, function(faxes) { - callback && callback(faxes); + self.getFaxMessages(type, filters, faxboxId, function(data) { + var formattedData = self.formatFaxData(data.data, type), + dataTemplate = { + faxes: formattedData + }, + $rows = $(monster.template(self, type + '-faxes-rows', dataTemplate)); + + callback && callback($rows, data); }); }, - formatInboundData: function(data) { + getFaxMessages: function(type, filters, faxboxId, callback) { var self = this, - formattedFaxes = self.formatFaxes(data, 'inbound'); + resource = type === 'inbound' ? 'faxes.listInbound' : 'faxes.listOutbound'; - return formattedFaxes; - }, + self.callApi({ + resource: resource, + data: { + accountId: self.accountId, + //faxboxId: faxboxId, API Doesn't allow filter here for now, we'll do it in JS instead + filters: filters + }, + success: function(data) { + var formattedData = data, + filteredData = _.filter(data.data, function(a) { + return a.faxbox_id === faxboxId; + }); - formatOutboundData: function(data) { - var self = this, - formattedFaxes = self.formatFaxes(data, 'outbound'); + formattedData.data = filteredData; - return formattedFaxes; + callback && callback(formattedData); + } + }); }, - formatFaxes: function(data, type) { + formatFaxData: function(data, type) { var self = this; _.each(data, function(fax) { @@ -501,14 +409,56 @@ define(function(require) { return self.apiUrl + 'accounts/' + self.accountId + '/faxes/' + type + '/' + mediaId + '/attachment?auth_token=' + self.getAuthToken(); }, - oldRenderLogs: function(pArgs) { + renderDetailsFax: function(type, id) { + var self = this; + + self.getFaxDetails(type, id, function(faxDetails) { + var template = $(monster.template(self, 'fax-CDRDialog')); + + monster.ui.renderJSON(faxDetails, template.find('#jsoneditor')); + + monster.ui.dialog(template, { title: self.i18n.active().fax.CDRPopup.title }); + }); + }, + + getStorage: function(callback) { + var self = this; + + self.callApi({ + resource: 'storage.get', + data: { + accountId: self.accountId, + generateError: false + }, + success: function(data) { + callback(data.data); + }, + error: function(data, error, globalHandler) { + if (error.status === 404) { + callback(undefined); + } else { + globalHandler(data); + } + } + }); + }, + + renderStorage: function(pArgs) { var self = this, args = pArgs || {}, - parent = args.container || $('#fax_app_container .app-content-wrapper'), - template = $(monster.template(self, 'logs-layout')); + parent = args.container || $('#fax_app_container .app-content-wrapper'); - self.logsInitTable(template, function() { - self.logsBindEvents(template); + self.getStorage(function(storage) { + var formattedData = self.storageFormatData(storage), + template = $(monster.template(self, 'storage', formattedData)); + + self.storageBindEvents(template); + + monster.pub('common.storagePlanManager.render', { + container: template.find('.control-container'), + forceTypes: ['fax'], + hideOtherTypes: true + }); parent .fadeOut(function() { @@ -520,6 +470,14 @@ define(function(require) { }); }, + storageBindEvents: function(template) { + var self = this; + }, + + storageFormatData: function(data) { + return data; + }, + renderLogs: function(pArgs) { var self = this, args = pArgs || {}, @@ -638,44 +596,6 @@ define(function(require) { }); }, - getInboundFaxes: function(fromDate, toDate, callback) { - var self = this; - - self.callApi({ - resource: 'faxes.listInbound', - data: { - accountId: self.accountId, - filters: { - created_from: monster.util.dateToBeginningOfGregorianDay(fromDate), - created_to: monster.util.dateToEndOfGregorianDay(toDate), - paginate: false - } - }, - success: function(data) { - callback && callback(data.data); - } - }); - }, - - getOutboundFaxes: function(fromDate, toDate, callback) { - var self = this; - - self.callApi({ - resource: 'faxes.listOutbound', - data: { - accountId: self.accountId, - filters: { - created_from: monster.util.dateToBeginningOfGregorianDay(fromDate), - created_to: monster.util.dateToEndOfGregorianDay(toDate), - paginate: false - } - }, - success: function(data) { - callback && callback(data.data); - } - }); - }, - listFaxboxes: function(callback) { var self = this; diff --git a/i18n/en-US.json b/i18n/en-US.json index c54bc65..1474f83 100644 --- a/i18n/en-US.json +++ b/i18n/en-US.json @@ -29,6 +29,12 @@ }, "noData": "N/A" }, + "empty": { + "headline1": "There are", + "headline2": "faxboxes recognized on this account", + "subHeadlineInbound": "Select a box to manage the inbound faxes it contains.", + "subHeadlineOutbound": "Select a box to manage the outbound faxes it sent." + }, "actionBar": { "select": { "all": "All on page", @@ -36,9 +42,8 @@ "completed": "Completed", "none": "None" }, - "selectFax": { - "none": "Filter to a specific Faxbox", - "all": "Show All Faxboxes" + "selectFaxbox": { + "none": "Select a Fax Box" }, "from": "From", "to": "To", @@ -48,11 +53,9 @@ "select": "Select", "resend": "Resend", "delete": "Delete" - } - }, - "empty": { - "headline": "In order to view and manage faxes, first select the desired fax box in this account.", - "subtitle": "Use the 'Filter to a specific Faxbox' above and to the left." + }, + "currentlyViewing": "Currently Viewing", + "filterByDate": "Filter By Dates" }, "CDRPopup": { "title": "Fax Details" @@ -88,4 +91,4 @@ } } } -} \ No newline at end of file +} diff --git a/style/app.css b/style/app.css deleted file mode 100644 index 8e5706f..0000000 --- a/style/app.css +++ /dev/null @@ -1,188 +0,0 @@ -/* Default empty state */ -.faxes-container.empty .empty-state { - display: block; -} - -.faxes-container .empty-state { - background: #FFF; - border: 1px dashed #ccc; - display: none; - padding: 0 10px 40px; - text-align: center; -} - -.faxes-container .empty-state .icon-title { - color: #333; - font-size: 148px; -} - -.faxes-container .empty-state .headline { - margin-top: -10px; -} - -.faxes-container .empty-state .subtitle { - margin-top :10px; - color: #909099; -} - -.faxes-container .data-state { - display: none; -} - -.faxes-container.empty .loading-state { - top: 0; -} - -.faxes-container .loading-state { - display: none; - background: #fff none repeat scroll 0 0; - border: 1px dashed #aaa; - font-size: 60px; - padding: 50px; - text-align: center; - position: relative; - top: 50px; -} - -/* Action Bar */ -.faxes-container .filters.basic-actions { - width: 131px; -} - -.faxes-container.outbound-faxes .filters.basic-actions { - width: 186px; -} - -.faxes-container .action-bar .actionable { - display: none; -} - -.faxes-container .action-bar .filters > :first-child { - margin-left: 0; -} - -.faxes-container .action-bar .margin-left { - margin-left: 10px; -} - -.faxes-container .action-bar .faxbox-selector { - display: inline-block; -} - -.faxes-container .action-bar #select_faxbox { - width: 105px; - margin-bottom: 0; -} - -.faxes-container .action-bar .mark-as-wrapper { - display: inline-block; -} - -.faxes-container .action-bar .mark-as-wrapper.hidden { - display: none; -} - -@media (min-width: 1240px) { - .faxes-container .action-bar .faxbox-selector { - margin-right: 65px; - } -} - -.faxes-container .action-bar .sub-ranges { - display: inline-block; - margin-left: 10px; -} - -@media (max-width: 1250px) { - .faxes-container .action-bar .sub-ranges { - display: none; - } -} - -.faxes-container .action-bar .custom-range > * { - margin: 0 10px 0 0; - vertical-align: middle; -} - -.faxes-container .action-bar .custom-range > span { - margin-right: 5px; -} - -.faxes-container .action-bar .custom-range input.date-filter { - height: 24px; - width: 80px; -} - -/* Table */ -.faxes-container .faxes-table table { - margin-top: 0; -} - -.faxes-container .faxes-table table .footable-header th:nth-child(1) { - width: 25px; -} - -.faxes-container .faxes-table tbody tr { - height: 55px; -} - -.faxes-container .faxes-table tbody tr > td:first-child .monster-checkbox { - margin-right: 10px; - margin-top: 8px; -} - -.faxes-container .faxes-table table.highlighted tbody tr { - opacity: 0.3; -} - -.faxes-container .faxes-table table.highlighted tbody tr.active { - opacity: 1; -} - -.faxes-container .faxes-table .status { - font-weight: 600; - text-transform: uppercase; -} - -.faxes-container .faxes-table .status[data-status="success"] { - color: #33DB24; -} - -.faxes-container .faxes-table .status[data-status="processing"] { - color: #02a5ff; -} - -.faxes-container .faxes-table .status[data-status="failed"] { - color: #e01a00; -} - -.faxes-container .faxes-table .empty-vm-row td { - text-align: center !important; -} - -/* CDR Popup */ -#faxbox_cdr_details_dialog { - width: 750px; - margin: 15px; -} - -/* Faxes log */ -#smtp_logs_container .table .detail-link { - margin: 0px; -} - -#smtp_logs_grid { - clear: right; -} - -#smtp_logs_detail_dialog { - width: 700px; - padding: 15px; -} - -#smtp_logs_detail_dialog tr, -#smtp_logs_detail_dialog td { - line-height: 15px; - padding: 2px; - white-space: normal; -} \ No newline at end of file diff --git a/style/app.scss b/style/app.scss new file mode 100644 index 0000000..2fda975 --- /dev/null +++ b/style/app.scss @@ -0,0 +1,227 @@ +@import "../../../css/partials/base"; + +/* Default empty state */ +.faxes-container.empty .empty-state { + display: block; +} + +.faxes-container .empty-state { + display: none; + text-align: center; +} + +.faxes-container .empty-state .headline { + font-size: 22px; + margin-top: 35px; +} + +.faxes-container .empty-state .sub-headline { + color: #606069; + font-size: 16px; + margin-top: 13px; +} + +.faxes-container .empty-state .count { + font-weight: bold; + margin-left: 5px; + margin-right: 5px; +} + +.faxes-container .empty-state .faxboxes-list { + margin-top: 30px; + width: 450px; + text-align: left; +} + +.faxes-container .empty-state .chosen-drop { + width: 450px; +} + +.faxes-container .empty-state .chosen-container > a, +.faxes-container .main-header .chosen-container > a { + height: 40px; + line-height: 40px; + width: 450px; +} + +.faxes-container .main-header { + margin-bottom: 25px; +} + +.faxes-container .main-header .select-header { + color: #606069; + margin-bottom: 5px; +} + +.faxes-container .main-header .chosen-drop, +.faxes-container .main-header .chosen-container > a, +.faxes-container .main-header .faxboxes-list, +.faxes-container .main-header .faxbox-selector { + width: 300px; +} + +.faxes-container .main-header > * { + display: inline-block; + margin-right: 25px; +} + +.faxes-container .main-header #refresh_faxbox { + margin-top: 35px; +} + +.faxes-container .main-header .faxbox-selector .chosen-container .chosen-single span { + font-size: 18px; +} + +.faxes-container .data-state { + display: none; +} + +.faxes-container .loading-state { + display: none; + background: #fff none repeat scroll 0 0; + border: 1px dashed #aaa; + font-size: 60px; + padding: 50px; + text-align: center; + position: relative; + top: 50px; +} + +.faxes-container .faxboxes-list { + display: block; + margin: auto; + width: 400px; +} + +/* Action Bar */ +.faxes-container.empty .filters.search, +.faxes-container.empty .filters.basic-actions > *, +.faxes-container.empty .main-header { + display: none; +} + +.faxes-container .filters.basic-actions { + display: inline-block; +} + +.faxes-container:not(.empty) .action-bar { + display: block; +} + +.faxes-container .action-bar { + display: none; +} + +.faxes-container .action-bar .filters > :first-child { + margin-left: 0; +} + +.faxes-container .action-bar .margin-left { + margin-left: 10px; +} + +.faxes-container .action-bar .hidable { + display: inline-block; +} + +.faxes-container .action-bar .hidable.hidden { + display: none; +} + +/* Table */ +.faxes-container .faxbox-table table { + margin-top: 0; +} + +.faxes-container .faxbox-table tbody tr > td:first-child .monster-checkbox { + margin-right: 10px; + margin-top: 8px; +} + +.faxes-container .faxbox-table .select-cell { + min-width: 20px !important; + width: 20px; +} + +.faxes-container .faxbox-table .select-line { + cursor: pointer; +} + +.faxes-container .faxbox-table tr .bottom-line { + color: #707079; + font-size: 12px; +} + +.faxes-container .faxbox-table td.no-padding { + padding: 0; +} + +.faxes-container .faxbox-table .status { + text-transform: uppercase; +} + +.faxes-container .filter-by-date .date-ranges > * { + margin: 0 10px 0 0; + vertical-align: middle; +} + +.faxes-container .filter-by-date .date-ranges > span { + margin-right: 5px; +} + +.faxes-container .filter-by-date .date-ranges input.date-filter { + height: 24px; + width: 90px; +} + +.faxes-container .filter-by-date .date-ranges i.fa-calendar { + margin-left: -30px; + margin-right: 20px; +} + +.faxes-container .filter-by-date { + float: right; + line-height: 30px; + margin-left: 30px; +} + +.faxes-container .filter-by-date.active .expand-dates { + float: right; +} + +.faxes-container .filter-by-date .date-ranges, +.faxes-container .filter-by-date.active .expand-dates { + display: none; +} + +.faxes-container .filter-by-date.active .date-ranges { + display: block; +} + +/* CDR Popup */ +#faxbox_cdr_details_dialog { + width: 750px; + margin: 15px; +} + +/* Faxes log */ +#smtp_logs_container .table .detail-link { + margin: 0px; +} + +#smtp_logs_grid { + clear: right; +} + +#smtp_logs_detail_dialog { + width: 700px; + padding: 15px; +} + +#smtp_logs_detail_dialog tr, +#smtp_logs_detail_dialog td { + line-height: 15px; + padding: 2px; + white-space: normal; +} diff --git a/views/inbound-faxes-rows.html b/views/inbound-faxes-rows.html new file mode 100644 index 0000000..e4116b6 --- /dev/null +++ b/views/inbound-faxes-rows.html @@ -0,0 +1,23 @@ +{{#each faxes}} + + + {{#monsterCheckbox}} + + {{/monsterCheckbox}} + + +
{{toFriendlyDate created 'date'}}
+
{{toFriendlyDate created 'time'}}
+ + {{#monsterNumberWrapper formatted.sendingNumber}}{{/monsterNumberWrapper}} + {{formatted.receivingFaxbox}} + {{#monsterNumberWrapper formatted.receivingNumber}}{{/monsterNumberWrapper}} + {{formatted.pages}} + + + + + + + +{{/each}} diff --git a/views/inbound-faxes.html b/views/inbound-faxes.html index 0e24b8c..ba59897 100644 --- a/views/inbound-faxes.html +++ b/views/inbound-faxes.html @@ -1,59 +1,100 @@ -
-
-
-
-
  • - - {{#monsterCheckbox}} - - {{/monsterCheckbox}} - - - -
    • -
    - -
    - +
    +
    +
    +
    +
    + {{ i18n.fax.actionBar.currentlyViewing }} +
    +
    -
    - + +
    +
    +
    +
    +
    +
  • + + {{#monsterCheckbox}} + + {{/monsterCheckbox}} + + + +
    • +
    - -
    +
    + +
    +
    -
    -
    - {{i18n.startDate}} - - {{i18n.endDate}} - - +
    +
    + {{ i18n.fax.actionBar.filterByDate }} +
    +
    + {{i18n.startDate}} + + + {{i18n.endDate}} + + + + {{i18n.cancel}} +
    -
    -
    -
    +
    +
    +
    {{ i18n.fax.empty.headline1 }}{{count}}{{ i18n.fax.empty.headline2 }}
    +
    {{ i18n.fax.empty.subHeadlineInbound }}
    -
    -
    - +
    + +
    +
    +
    +
    + + + + + + + + + + + + + + + +
    {{ i18n.fax.table.columns.received }}{{ i18n.fax.table.columns.from }}{{ i18n.fax.table.columns.receivingFaxbox }}{{ i18n.fax.table.columns.receivingNumber }}{{ i18n.fax.table.columns.pages }}
    +
    +
    +
    + +
    -
    \ No newline at end of file +
    diff --git a/views/inbound-faxes-list.html b/views/old-inbound-faxes-list.html similarity index 100% rename from views/inbound-faxes-list.html rename to views/old-inbound-faxes-list.html diff --git a/views/old-inbound-faxes.html b/views/old-inbound-faxes.html new file mode 100644 index 0000000..0e24b8c --- /dev/null +++ b/views/old-inbound-faxes.html @@ -0,0 +1,59 @@ +
    +
    +
    +
    +
  • + + {{#monsterCheckbox}} + + {{/monsterCheckbox}} + + + +
    • +
    + +
    + +
    +
    + +
    + + + +
    + +
    +
    + {{i18n.startDate}} + + {{i18n.endDate}} + + +
    +
    +
    + +
    +
    + +
    +
    + +
    +
    +
    \ No newline at end of file diff --git a/views/outbound-faxes-list.html b/views/old-outbound-faxes-list.html similarity index 100% rename from views/outbound-faxes-list.html rename to views/old-outbound-faxes-list.html diff --git a/views/old-outbound-faxes.html b/views/old-outbound-faxes.html new file mode 100644 index 0000000..a1cc77f --- /dev/null +++ b/views/old-outbound-faxes.html @@ -0,0 +1,65 @@ +
    +
    +
    +
    +
  • + + {{#monsterCheckbox}} + + {{/monsterCheckbox}} + + + +
    • +
    + +
    + + + +
    +
    + +
    + + + +
    + +
    +
    + {{i18n.startDate}} + + {{i18n.endDate}} + + +
    +
    +
    + +
    +
    + +
    +
    + +
    +
    +
    \ No newline at end of file diff --git a/views/outbound-faxes-rows.html b/views/outbound-faxes-rows.html new file mode 100644 index 0000000..89922a5 --- /dev/null +++ b/views/outbound-faxes-rows.html @@ -0,0 +1,39 @@ +{{#each faxes}} + + + {{#monsterCheckbox}} + + {{/monsterCheckbox}} + + + + {{#compare status "===" "success"}} + {{status}} + {{else}} + {{#compare status "===" "failed"}} + {{status}} + {{else}} + {{status}} + {{/compare}} + {{/compare}} + + + +
    {{toFriendlyDate created 'date'}}
    +
    {{toFriendlyDate created 'time'}}
    + + {{formatted.sendingFaxbox}} + {{#monsterNumberWrapper formatted.sendingNumber}}{{/monsterNumberWrapper}} + {{#monsterNumberWrapper formatted.receivingNumber}}{{/monsterNumberWrapper}} + {{formatted.pages}} + + + + + + + + +{{/each}} diff --git a/views/outbound-faxes.html b/views/outbound-faxes.html index a1cc77f..9644734 100644 --- a/views/outbound-faxes.html +++ b/views/outbound-faxes.html @@ -1,65 +1,105 @@ -
    -
    -
    -
    -
  • - - {{#monsterCheckbox}} - - {{/monsterCheckbox}} - - - -
    • -
    - -
    - - - +
    +
    +
    +
    +
    + {{ i18n.fax.actionBar.currentlyViewing }} +
    +
    -
    - + +
    +
    +
    +
    +
    +
  • + + {{#monsterCheckbox}} + + {{/monsterCheckbox}} + + + +
    • +
    - -
    +
    + + + +
    +
    -
    -
    - {{i18n.startDate}} - - {{i18n.endDate}} - - +
    +
    + {{ i18n.fax.actionBar.filterByDate }} +
    +
    + {{i18n.startDate}} + + + {{i18n.endDate}} + + + + {{i18n.cancel}} +
    -
    -
    -
    +
    +
    +
    {{ i18n.fax.empty.headline1 }}{{count}}{{ i18n.fax.empty.headline2 }}
    +
    {{ i18n.fax.empty.subHeadlineOutbound }}
    -
    -
    - +
    + +
    +
    +
    +
    + + + + + + + + + + + + + + + + +
    {{ i18n.fax.table.columns.status }}{{ i18n.fax.table.columns.sent }}{{ i18n.fax.table.columns.sendingFaxbox }}{{ i18n.fax.table.columns.sendingNumber }}{{ i18n.fax.table.columns.receivingNumber }}{{ i18n.fax.table.columns.pages }}
    +
    +
    +
    + +
    -
    \ No newline at end of file +