Skip to content

Commit 43cc321

Browse files
tadziktadzik
committed
refactor(email): Split the webmail into a separate app
Because it's now no longer the "main" app, and only loaded when it's actually needed it won't interfere with the usage of Runbox7 unrelated to emails themselves: for example allowing to renew the account through payments-app without the searchservice and checks for new messages interfering and failing due to an expired account.
1 parent 1a74229 commit 43cc321

12 files changed

+1361
-1260
lines changed

‎src/app/app.component.html

Lines changed: 2 additions & 237 deletions
Original file line numberDiff line numberDiff line change
@@ -1,237 +1,2 @@
1-
<mat-sidenav-container autosize>
2-
<mat-sidenav #sidemenu [mode]="mobileQuery.matches ? 'over' : 'side'"
3-
[fixedInViewport]="mobileQuery.matches"
4-
fixedTopGap="0"
5-
id="sideMenu"
6-
style="width: 330px"
7-
appResizable>
8-
<mat-nav-list dense>
9-
<div class="sidenavMainMenu">
10-
<div id="sidenavLogoContainer">
11-
<a mat-button routerLink="/"
12-
id="sidenavLogoButton"
13-
(click)="this.sidemenu.close();">
14-
<img src="assets/runbox7.png" id="logoSidenav" alt="Runbox 7" />
15-
</a>
16-
<br />
17-
</div>
18-
</div>
19-
20-
<div id="sidenavGreeting">
21-
<p>Good {{timeOfDay}}, {{(rmmapi.me | async)?.user_address}}.</p>
22-
<p id="sidenavGreetingContent">Welcome to the <a href="https://blog.runbox.com/2018/11/runbox-7-webmail-entering-open-beta-phase/" target="blog" class="textLink">Runbox 7 Webmail beta</a>!<br /> Please <a href="https://community.runbox.com/" target="forum" class="textLink">visit our Runbox 7 forum</a> for help and feedback.</p>
23-
</div>
24-
25-
<mat-divider></mat-divider>
26-
27-
<div class="sidenavMainMenu">
28-
<a mat-button (click)="compose();" matTooltip="Compose">
29-
<mat-icon color="primary">edit</mat-icon></a>
30-
<a mat-button (click)="drafts();" matTooltip="Drafts">
31-
<mat-icon color="primary">drafts</mat-icon></a>
32-
<a mat-button (click)="logoutservice.logout()" matTooltip="Log out">
33-
<mat-icon>power_settings_new</mat-icon></a>
34-
</div>
35-
36-
<mat-list-item (click)="compose();" id="composeButton">
37-
<mat-icon mat-list-icon class="folderIconStandard">edit</mat-icon>
38-
<p mat-line class="folderName">Compose</p>
39-
</mat-list-item>
40-
41-
<mat-list-item (click)="drafts()" id="draftsButton" [ngClass]="{'selectedFolder' : selectedFolder == 'Drafts'}">
42-
<mat-icon mat-list-icon class="folderIconStandard">drafts</mat-icon>
43-
<p mat-line class="folderName">Drafts</p>
44-
</mat-list-item>
45-
46-
<mat-divider></mat-divider>
47-
</mat-nav-list>
48-
49-
<rmm-folderlist #folderListComponent (folderSelected)="selectFolder($event)" (droppedToFolder)="dropToFolder($event)"></rmm-folderlist>
50-
51-
<mat-divider></mat-divider>
52-
53-
<mat-nav-list *ngIf="dataReady">
54-
<mat-list-item
55-
(click)="deleteLocalIndex()"
56-
matTooltip="Stop synchronization and remove index stored on your device">
57-
<mat-icon mat-list-icon>sync_disabled</mat-icon>
58-
<p mat-line>Stop index synchronization</p>
59-
</mat-list-item>
60-
</mat-nav-list>
61-
62-
<mat-nav-list *ngIf="(xapianLoaded | async) && !dataReady && searchService.downloadProgress===null">
63-
<mat-list-item (click)="downloadIndexFromServer()" matTooltip="Synchronize index with your device">
64-
<mat-icon mat-list-icon>sync</mat-icon>
65-
<p mat-line>Synchronize index</p>
66-
</mat-list-item>
67-
</mat-nav-list>
68-
69-
<mat-divider></mat-divider>
70-
71-
<p style="text-align: center; font-size: 12px">Runbox 7 build time: {{buildtimestampstring}}</p>
72-
</mat-sidenav>
73-
<mat-sidenav *ngIf="mailViewerOnRightSide" position="end" mode="side"
74-
[opened]=true
75-
[style.width]="mailViewerRightSideWidth"
76-
id="rightPane"
77-
appResizable>
78-
<single-mail-viewer #singlemailviewer
79-
[messageActionsHandler]="messageActionsHandler"
80-
[adjustableHeight]="false"
81-
(orientationChangeRequest)="mailViewerOrientationChangeRequest($event)"
82-
(onClose)="singleMailViewerClosed($event)"></single-mail-viewer>
83-
<div *ngIf="mailViewerOnRightSide && !singlemailviewer.messageId"
84-
class="noMessageSelectedNotification">
85-
No Message Selected
86-
</div>
87-
</mat-sidenav>
88-
<div style="overflow: hidden; position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; width: 100%">
89-
<mat-toolbar style="display: flex">
90-
<button mat-icon-button (click)="sidemenu.toggle();" matTooltip="Toggle folder pane" id="toggleFolderPaneIcon">
91-
<mat-icon>menu</mat-icon>
92-
</button>
93-
94-
<ng-container *ngIf="!hasChildRouterOutlet">
95-
<app-multiple-search-fields-input
96-
*ngIf="showMultipleSearchFields && searchService.downloadProgress===null"
97-
[currentFolder]="selectedFolder"
98-
(close)="showMultipleSearchFields = false"
99-
(searchexpression)="searchFieldKeyUp($event)">
100-
</app-multiple-search-fields-input>
101-
<mat-form-field id="searchField" style="flex-grow: 1" floatLabel="auto"
102-
*ngIf="searchService.downloadProgress===null">
103-
<input matInput #searchInputField type="text"
104-
(focus)="searchTextFieldFocus()"
105-
(blur)="searchTextFieldBlur()" [placeholder]="dynamicSearchFieldPlaceHolder ? dynamicSearchFieldPlaceHolder: 'Start typing to search messages'"
106-
[value]="searchText" (keyup)="searchFieldKeyUp($event.target.value)" />
107-
<!-- <app-search-expression-builder
108-
[searchInputField]="searchInputField"
109-
[currentFolder]="selectedFolder"
110-
matSuffix matTooltip="Show search options"></app-search-expression-builder> -->
111-
<button *ngIf="!showMultipleSearchFields"
112-
mat-icon-button
113-
matSuffix
114-
(click)="showMultipleSearchFields = true"
115-
matTooltip="Multiple search fields">
116-
<mat-icon>build</mat-icon>
117-
</button>
118-
<button *ngIf="searchText!==''"
119-
mat-icon-button
120-
matSuffix
121-
(click)="searchFieldKeyUp('')"
122-
matTooltip="Clear search">
123-
<mat-icon>clear</mat-icon>
124-
</button>
125-
</mat-form-field>
126-
127-
<ng-container *ngIf="dataReady">
128-
<!-- currently only supporting threading / unread for local index -->
129-
<button mat-icon-button (click)="updateViewMode('conversations')" *ngIf="!searchtextfieldfocused && viewmode==='singleconversation'"
130-
matTooltip="Back to conversations list">
131-
<mat-icon>arrow_back</mat-icon>
132-
</button>
133-
134-
<mat-menu #tableViewOptionsMenu="matMenu">
135-
<mat-list>
136-
<mat-list-item>
137-
<mat-checkbox
138-
*ngIf="canvastable"
139-
[(ngModel)]="canvastable.showContentTextPreview"
140-
matLine
141-
(click)="$event.stopPropagation()"
142-
class="tableViewOptionsMenuElement"
143-
>
144-
<mat-icon class="tableViewOptionsMenuElement" matTooltip="Inline message previews">format_align_right</mat-icon>
145-
Inline previews
146-
</mat-checkbox>
147-
</mat-list-item>
148-
<mat-list-item>
149-
<mat-checkbox [(ngModel)]="conversationGroupingCheckbox"
150-
matLine
151-
(change)="updateViewMode($event.source.checked ? 'conversations' : 'messages')"
152-
(click)="$event.stopPropagation()"
153-
class="tableViewOptionsMenuElement"
154-
>
155-
<mat-icon class="tableViewOptionsMenuElement" matTooltip="Threaded conversation view">view_list</mat-icon>
156-
Threaded view
157-
</mat-checkbox>
158-
</mat-list-item>
159-
<mat-list-item>
160-
<mat-checkbox [(ngModel)]="unreadMessagesOnlyCheckbox"
161-
matLine
162-
(change)="updateSearch(true)"
163-
(click)="$event.stopPropagation()"
164-
[disabled]="viewmode==='conversations'"
165-
class="tableViewOptionsMenuElement"
166-
>
167-
<mat-icon class="tableViewOptionsMenuElement" matTooltip="Unread messages only">markunread</mat-icon>
168-
Unread only
169-
</mat-checkbox>
170-
</mat-list-item>
171-
</mat-list>
172-
</mat-menu>
173-
<button mat-icon-button [matMenuTriggerFor]="tableViewOptionsMenu" matTooltip="Show view options">
174-
<mat-icon>more_vert</mat-icon>
175-
</button>
176-
</ng-container>
177-
</ng-container>
178-
<div *ngIf="searchService.downloadProgress!==null" id="syncMessage">
179-
Synchronizing account index
180-
</div>
181-
</mat-toolbar>
182-
<mat-progress-bar *ngIf="searchService.downloadProgress!==null"
183-
[mode]="searchService.downloadProgress===0 ? 'indeterminate' : 'determinate'"
184-
[value]="searchService.downloadProgress">
185-
186-
</mat-progress-bar>
187-
188-
<mat-progress-bar *ngIf="websocketsearchservice.searchInProgress" mode="indeterminate">
189-
</mat-progress-bar>
190-
191-
<mat-progress-bar
192-
*ngIf="searchService.partitionDownloadProgress!==null && searchService.partitionDownloadProgress!==1"
193-
[value]="searchService.partitionDownloadProgress*100">
194-
</mat-progress-bar>
195-
196-
<div [hidden]="hasChildRouterOutlet">
197-
<div id="canvasTableContainerArea" [ngStyle]="{'bottom.px': !mailViewerOnRightSide ? singlemailviewer.height: 0}">
198-
<canvastablecontainer [canvastableselectlistener]="this" (sortToggled)="updateSearch(true)"></canvastablecontainer>
199-
</div>
200-
201-
<single-mail-viewer #singlemailviewer *ngIf="!mailViewerOnRightSide"
202-
[adjustableHeight]="true"
203-
[showVerticalSplitButton]="allowMailViewerOrientationChange"
204-
[messageActionsHandler]="messageActionsHandler"
205-
(orientationChangeRequest)="mailViewerOrientationChangeRequest($event)"
206-
(onClose)="singleMailViewerClosed($event)"></single-mail-viewer>
207-
</div>
208-
</div>
209-
<router-outlet (activate)="hasChildRouterOutlet=true" (deactivate)="hasChildRouterOutlet=false"></router-outlet>
210-
</mat-sidenav-container>
211-
212-
<div class="contextToolButtons" *ngIf="!hasChildRouterOutlet && showSelectOperations && !singlemailviewer.messageId">
213-
<button mat-fab matTooltip="Move&nbsp;to&nbsp;folder" (click)="moveToFolder()">
214-
<mat-icon>folder</mat-icon>
215-
</button>
216-
<button mat-fab matTooltip="Move&nbsp;to&nbsp;Trash" (click)="trashMessages()">
217-
<mat-icon>delete</mat-icon>
218-
</button>
219-
<button mat-fab matTooltip="Toggle unread" (click)="toggleRead()">
220-
<mat-icon>markunread</mat-icon>
221-
</button>
222-
<button mat-fab matTooltip="Toggle flag" (click)="toggleFlagged()">
223-
<mat-icon>flag</mat-icon>
224-
</button>
225-
<button *ngIf="selectedFolder!==messagelistservice.spamFolderName" mat-fab matTooltip="Report spam" (click)="trainSpam({is_spam:1})">
226-
<mat-icon>report</mat-icon>
227-
</button>
228-
<button mat-fab *ngIf="selectedFolder===messagelistservice.spamFolderName" matTooltip="Not spam" (click)="trainSpam({is_spam:0})">
229-
<mat-icon>report_off</mat-icon>
230-
</button>
231-
</div>
232-
233-
<div style="position: absolute; bottom: 2px; right: 2px; z-index: 10000;"
234-
*ngIf="progressService.httpRequestInProgress | async"
235-
>
236-
<mat-spinner diameter="20" ></mat-spinner>
237-
</div>
1+
<router-outlet name="headertoolbar"></router-outlet>
2+
<router-outlet></router-outlet>

0 commit comments

Comments
 (0)