Add web-ui based on previous code

5 files changed, 380 insertions, 0 deletions

diff --git a/web-ui/app/js/page/default.js b/web-ui/app/js/page/default.js
new file mode 100644
index 00000000..e47b2f4d
--- /dev/null
+++ b/web-ui/app/js/page/default.js
@@ -0,0 +1,87 @@
+define(
+  [
+    'mail_view/ui/compose_box',
+    'mail_list_actions/ui/mail_list_actions',
+    'user_alerts/ui/user_alerts',
+    'mail_list/ui/mail_list',
+    'mail_view/ui/no_message_selected_pane',
+    'mail_view/ui/mail_view',
+    'mail_view/ui/mail_actions',
+    'mail_view/ui/reply_section',
+    'mail_view/data/mail_sender',
+    'services/mail_service',
+    'services/delete_service',
+    'tags/ui/tag_list',
+    'tags/data/tags',
+    'page/router',
+    'dispatchers/right_pane_dispatcher',
+    'dispatchers/middle_pane_dispatcher',
+    'dispatchers/left_pane_dispatcher',
+    'search/search_trigger',
+    'search/results_highlighter',
+    'foundation/off_canvas',
+    'page/pane_contract_expand',
+    'views/i18n',
+    'views/recipientListFormatter',
+    'flight/lib/logger'
+  ],
+
+  function (
+    composeBox,
+    mailListActions,
+    userAlerts,
+    mailList,
+    noMessageSelectedPane,
+    mailView,
+    mailViewActions,
+    replyButton,
+    mailSender,
+    mailService,
+    deleteService,
+    tagList,
+    tags,
+    router,
+    rightPaneDispatcher,
+    middlePaneDispatcher,
+    leftPaneDispatcher,
+    searchTrigger,
+    resultsHighlighter,
+    offCanvas,
+    paneContractExpand,
+    viewI18n,
+    recipientListFormatter,
+    withLogging) {
+
+    'use strict';
+    function initialize(path) {
+      viewI18n.init(path);
+      paneContractExpand.attachTo(document);
+
+      userAlerts.attachTo('#user-alerts');
+
+      mailList.attachTo('#mail-list');
+      mailListActions.attachTo('#list-actions');
+
+      searchTrigger.attachTo('#search-trigger');
+      resultsHighlighter.attachTo(document);
+
+      mailSender.attachTo(document);
+
+      mailService.attachTo(document);
+      deleteService.attachTo(document);
+
+      tags.attachTo(document);
+      tagList.attachTo('#tag-list');
+
+      router.attachTo(document);
+
+      rightPaneDispatcher.attachTo(document);
+      middlePaneDispatcher.attachTo(document);
+      leftPaneDispatcher.attachTo(document);
+
+      offCanvas.attachTo(document);
+    }
+
+    return initialize;
+  }
+);
diff --git a/web-ui/app/js/page/events.js b/web-ui/app/js/page/events.js
new file mode 100644
index 00000000..6b39096c
--- /dev/null
+++ b/web-ui/app/js/page/events.js
@@ -0,0 +1,168 @@
+define(function () {
+  'use strict';
+
+  var events = {
+    router: {
+      pushState: 'router:pushState'
+    },
+    ui: {
+      sendbutton: {
+        enable: 'ui:sendbutton:enable'
+      },
+      middlePane: {
+        expand: 'ui:middlePane:expand',
+        contract: 'ui:middlePane:contract'
+      },
+      userAlerts: {
+        displayMessage: 'ui:userAlerts:displayMessage'
+      },
+      tag: {
+        selected: 'ui:tagSelected',
+        select: 'ui:tagSelect'
+      },
+      tags: {
+        loaded: 'ui:tagsLoaded'
+      },
+      tagList: {
+        refresh: 'ui:tagList:refresh',
+        load: 'ui:tagList:load'
+      },
+      mails: {
+        refresh: 'ui:mails:refresh',
+        fetchByTag: 'ui:mails:fetchByTag',
+        cleanSelected: 'ui:mails:cleanSelected',
+        checkAll: 'ui:mails:checkAll',
+        uncheckAll: 'ui:mails:uncheckAll',
+        hasMailsChecked: 'ui:mails:hasMailsChecked'
+      },
+      mail: {
+        open: 'ui:mail:open',
+        updateSelected: 'ui:mail:updateSelected',
+        delete: 'ui:mail:delete',
+        deleteMany: 'ui:mail:deleteMany',
+        wantChecked: 'ui:mail:wantChecked',
+        hereChecked: 'ui:mail:hereChecked',
+        checked: 'ui:mail:checked',
+        unchecked: 'ui:mail:unchecked',
+        changedSinceLastSave: 'ui:mail:changedSinceLastSave',
+        send: 'ui:mail:send',
+        recipientsUpdated: 'ui:mail:recipientsUpdated'
+      },
+      page: {
+        previous: 'ui:page:previous',
+        next: 'ui:page:next',
+        changed: 'ui:page:changed'
+      },
+      composeBox: {
+        newMessage: 'ui:composeBox:newMessage',
+        newReply: 'ui:composeBox:newReply',
+        trashReply: 'ui:composeBox:trashReply',
+        requestCancelReply: 'ui:composeBox:requestCancelReply'
+      },
+      replyBox: {
+        showReply: 'ui:replyBox:showReply',
+        showReplyAll: 'ui:replyBox:showReplyAll'
+      },
+      recipients: {
+        entered: 'ui:recipients:entered',
+        updated: 'ui:recipients:updated',
+        deleteLast: 'ui:recipients:deleteLast',
+        selectLast: 'ui:recipients:selectLast',
+        unselectAll: 'ui:recipients:unselectAll',
+        addressesExist: 'ui:recipients:addressesExist',
+        inputHasMail: 'ui:recipients:inputHasMail',
+        inputHasNoMail: 'ui:recipients:inputHasNoMail',
+        doCompleteInput: 'ui:recipients:doCompleteInput',
+        doCompleteRecipients: 'ui:recipients:doCompleteRecipients'
+      }
+    },
+    search: {
+      perform: 'search:perform',
+      results: 'search:results',
+      empty: 'search:empty',
+      highlightResults: 'search:highlightResults'
+    },
+    mail: {
+      here: 'mail:here',
+      want: 'mail:want',
+      send: 'mail:send',
+      sent: 'mail:sent',
+      read: 'mail:read',
+      unread: 'mail:unread',
+      delete: 'mail:delete',
+      deleteMany: 'mail:deleteMany',
+      deleted: 'mail:deleted',
+      saveDraft: 'draft:save',
+      draftSaved: 'draft:saved',
+      draftReply: {
+        want: 'mail:draftReply:want',
+        here: 'mail:draftReply:here',
+        notFound: 'mail:draftReply:notFound'
+      },
+      notFound: 'mail:notFound',
+      save: 'mail:saved',
+      tags: {
+        update: 'mail:tags:update',
+        updated: 'mail:tags:updated'
+      }
+    },
+    mails: {
+      available: 'mails:available',
+      availableForRefresh: 'mails:available:refresh',
+      teardown: 'mails:teardown'
+    },
+    tags: {
+      want: 'tags:want',
+      received: 'tags:received',
+      teardown: 'tags:teardown'
+    },
+    route: {
+      toUrl: 'route:toUrl'
+    },
+
+    components: {
+      composeBox: {
+        open: 'components:composeBox:open',
+        close: 'components:composeBox:close'
+      },
+      mailPane: {
+        open: 'components:mailPane:open',
+        close: 'components:mailPane:close'
+      },
+      mailView: {
+        show: 'components:mailView:show',
+        close: 'components:mailView:close'
+      },
+      replySection: {
+        initialize: 'components:replySection:initialize',
+        close: 'components:replySection:close'
+      },
+      noMessageSelectedPane: {
+        open: 'components:noMessageSelectedPane:open',
+        close: 'components:noMessageSelectedPane:close'
+      }
+    },
+
+    dispatchers: {
+      rightPane: {
+        openComposeBox: 'dispatchers:rightPane:openComposeBox',
+        openNoMessageSelected: 'dispatchers:rightPane:openNoMessageSelected',
+        openNoMessageSelectedWithoutPushState: 'dispatchers:rightPane:openNoMessageSelectedWithoutPushState',
+        refreshMailList: 'dispatchers:rightPane:refreshMailList',
+        openDraft: 'dispatchers:rightPane:openDraft',
+        selectTag: 'dispatchers:rightPane:selectTag',
+        clear: 'dispatchers:rightPane:clear'
+      },
+      middlePane: {
+        refreshMailList: 'dispatchers:middlePane:refreshMailList',
+        cleanSelected: 'dispatchers:middlePane:unselect',
+        resetScroll: 'dispatchers:middlePane:resetScroll'
+      },
+      tags: {
+        refreshTagList: 'dispatchers:tag:refresh'
+      }
+    }
+  };
+
+  return events;
+});
diff --git a/web-ui/app/js/page/pane_contract_expand.js b/web-ui/app/js/page/pane_contract_expand.js
new file mode 100644
index 00000000..464c78b0
--- /dev/null
+++ b/web-ui/app/js/page/pane_contract_expand.js
@@ -0,0 +1,34 @@
+'use strict';
+
+define(['flight/lib/component', 'page/events'], function (describeComponent, events) {
+
+  return describeComponent(paneContractExpand);
+
+  function paneContractExpand() {
+    this.defaultAttrs({
+      RIGHT_PANE_EXPAND_CLASSES: 'small-7 medium-7 large-7 columns',
+      RIGHT_PANE_CONTRACT_CLASSES: 'small-7 medium-4 large-4 columns',
+      MIDDLE_PANE_EXPAND_CLASSES: 'small-5 medium-8 large-8 columns no-padding',
+      MIDDLE_PANE_CONTRACT_CLASSES: 'small-5 medium-5 large-5 columns no-padding'
+    });
+
+    this.expandMiddlePaneContractRightPane = function () {
+      $('#middle-pane-container').attr('class', this.attr.MIDDLE_PANE_EXPAND_CLASSES);
+      $('#right-pane').attr('class', this.attr.RIGHT_PANE_CONTRACT_CLASSES);
+    };
+
+    this.contractMiddlePaneExpandRightPane = function () {
+      $('#middle-pane-container').attr('class', this.attr.MIDDLE_PANE_CONTRACT_CLASSES);
+      $('#right-pane').attr('class', this.attr.RIGHT_PANE_EXPAND_CLASSES);
+    };
+
+    this.after('initialize', function () {
+      this.on(document, events.ui.mail.open, this.contractMiddlePaneExpandRightPane);
+      this.on(document, events.dispatchers.rightPane.openComposeBox, this.contractMiddlePaneExpandRightPane);
+      this.on(document, events.dispatchers.rightPane.openDraft, this.contractMiddlePaneExpandRightPane);
+      this.on(document, events.dispatchers.rightPane.openNoMessageSelected, this.expandMiddlePaneContractRightPane);
+      this.expandMiddlePaneContractRightPane()
+    });
+
+  }
+});
diff --git a/web-ui/app/js/page/router.js b/web-ui/app/js/page/router.js
new file mode 100644
index 00000000..cc51100b
--- /dev/null
+++ b/web-ui/app/js/page/router.js
@@ -0,0 +1,51 @@
+define(['flight/lib/component', 'page/events', 'page/router/url_params'], function (defineComponent, events, urlParams) {
+  'use strict';
+
+  return defineComponent(function () {
+    this.defaultAttrs({
+      history: window.history
+    });
+
+    function createHash(data) {
+      var hash = "/#/" + data.tag;
+      if (!_.isUndefined(data.mailIdent)) {
+        hash += '/mail/' + data.mailIdent;
+      }
+      return hash;
+    }
+
+    function createState(data, previousState) {
+      return {
+        tag: data.tag || (previousState && previousState.tag) || urlParams.defaultTag(),
+        mailIdent: data.mailIdent,
+        isDisplayNoMessageSelected: !!data.isDisplayNoMessageSelected
+      };
+    }
+
+    this.smailPushState = function (ev, data) {
+      if (!data.fromPopState) {
+        var nextState = createState(data, this.attr.history.state);
+        this.attr.history.pushState(nextState, '', createHash(nextState));
+      }
+    };
+
+    this.smailPopState = function (ev) {
+      var state = ev.state || {};
+
+      this.trigger(document, events.ui.tag.select, {
+        tag: state.tag || urlParams.getTag(),
+        mailIdent: state.mailIdent,
+        fromPopState: true
+      });
+
+      if (ev.state.isDisplayNoMessageSelected) {
+        this.trigger(document, events.dispatchers.rightPane.openNoMessageSelectedWithoutPushState);
+      }
+    };
+
+    this.after('initialize', function () {
+      this.on(document, events.router.pushState, this.smailPushState);
+      window.onpopstate = this.smailPopState.bind(this);
+    });
+  });
+});
diff --git a/web-ui/app/js/page/router/url_params.js b/web-ui/app/js/page/router/url_params.js
new file mode 100644
index 00000000..d4fb28f5
--- /dev/null
+++ b/web-ui/app/js/page/router/url_params.js
@@ -0,0 +1,40 @@
+define([], function () {
+
+  function defaultTag() {
+    return 'inbox';
+  }
+
+  function getDocumentHash() {
+    return document.location.hash.replace(/\/$/, '');
+  }
+
+  function hashTag(hash) {
+    if (hasMailIdent(hash)) {
+      return /\/(.+)\/mail\/\d+$/.exec(getDocumentHash())[1];
+    }
+    return hash.substring(2);
+  }
+
+
+  function getTag() {
+    if (document.location.hash !== '') {
+      return hashTag(getDocumentHash());
+    }
+    return defaultTag();
+  }
+
+  function hasMailIdent() {
+    return getDocumentHash().match(/mail\/\d+$/);
+  }
+
+  function getMailIdent() {
+    return /mail\/(\d+)$/.exec(getDocumentHash())[1];
+  }
+
+  return {
+    getTag: getTag,
+    hasMailIdent: hasMailIdent,
+    getMailIdent: getMailIdent,
+    defaultTag: defaultTag
+  };
+});