Skip to content

Commit ba31fd8

Browse files
marcelklehrmarcelklehr
committed
feat(SidebarBookmark): Add back openInViewer for archived files
Signed-off-by: Marcel Klehr <mklehr@gmx.net>
1 parent dc2019e commit ba31fd8

2 files changed

Lines changed: 127 additions & 25 deletions

File tree

‎lib/Controller/WebViewController.php‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,7 @@
1515
use OCA\Bookmarks\Db\PublicFolderMapper;
1616
use OCA\Bookmarks\Service\SettingsService;
1717
use OCA\Bookmarks\Service\UserSettingsService;
18+
use OCA\Viewer\Event\LoadViewer;
1819
use OCP\App\IAppManager;
1920
use OCP\AppFramework\Controller;
2021
use OCP\AppFramework\Db\DoesNotExistException;
@@ -24,6 +25,7 @@
2425
use OCP\AppFramework\Http\NotFoundResponse;
2526
use OCP\AppFramework\Http\StreamResponse;
2627
use OCP\AppFramework\Http\Template\PublicTemplateResponse;
28+
use OCP\EventDispatcher\IEventDispatcher;
2729
use OCP\IConfig;
2830
use OCP\IL10N;
2931
use OCP\IRequest;
@@ -53,6 +55,7 @@ public function __construct(
5355
private SettingsService $settings,
5456
private IAppManager $appManager,
5557
private IConfig $config,
58+
private IEventDispatcher $eventDispatcher,
5659
) {
5760
parent::__construct($appName, $request);
5861
$this->userId = $userId;
@@ -64,6 +67,9 @@ public function __construct(
6467
* @NoCSRFRequired
6568
*/
6669
public function index(): AugmentedTemplateResponse {
70+
if (class_exists(LoadViewer::class)) {
71+
$this->eventDispatcher->dispatchTyped(new LoadViewer());
72+
}
6773
$res = new AugmentedTemplateResponse($this->appName, 'main', ['url' => $this->urlGenerator]);
6874

6975
$policy = new ContentSecurityPolicy();

‎src/components/SidebarBookmark.vue‎

Lines changed: 121 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -39,8 +39,15 @@
3939
</template>
4040
<div class="sidebar">
4141
<div v-if="!editingTarget" class="details__line">
42-
<OpenInNewIcon :size="20" :aria-label="t('bookmarks', 'Link')" :title="t('bookmarks', 'Link')" />
43-
<a class="details__url" :href="bookmark.target === bookmark.url ? bookmark.target : 'javascript:void(0)'">{{ bookmark.target }}</a>
42+
<OpenInNewIcon :size="20"
43+
:aria-label="t('bookmarks', 'Link')"
44+
:title="t('bookmarks', 'Link')" />
45+
<a class="details__url"
46+
:href="
47+
bookmark.target === bookmark.url
48+
? bookmark.target
49+
: 'javascript:void(0)'
50+
">{{ bookmark.target }}</a>
4451
<NcActions v-if="isEditable" class="details__action">
4552
<NcActionButton @click="onEditTarget">
4653
<template #icon>
@@ -50,7 +57,9 @@
5057
</NcActions>
5158
</div>
5259
<div v-else class="details__line">
53-
<OpenInNewIcon :size="20" :aria-label="t('bookmarks', 'Link')" :title="t('bookmarks', 'Link')" />
60+
<OpenInNewIcon :size="20"
61+
:aria-label="t('bookmarks', 'Link')"
62+
:title="t('bookmarks', 'Link')" />
5463
<input v-model="target" class="details__url">
5564
<NcActions class="details__action">
5665
<NcActionButton @click="onEditTargetSubmit">
@@ -75,12 +84,20 @@
7584
v-tooltip="getFolderPath(folderId)"
7685
class="folders__folder"
7786
@click="onOpenFolder(folderId)">
78-
<FolderIcon :size="20" /> {{ getFolder(folderId).title || (getFolder(folderId).parent_folder ? t('bookmarks', 'Untitled folder') : t('bookmarks', 'Root folder')) }}
87+
<FolderIcon :size="20" />
88+
{{
89+
getFolder(folderId).title ||
90+
(getFolder(folderId).parent_folder
91+
? t('bookmarks', 'Untitled folder')
92+
: t('bookmarks', 'Root folder'))
93+
}}
7994
</span>
8095
</div>
8196
</div>
8297
<div class="details__line">
83-
<TagIcon :size="20" :aria-label="t('bookmarks', 'Tags')" :title="t('bookmarks', 'Tags')" />
98+
<TagIcon :size="20"
99+
:aria-label="t('bookmarks', 'Tags')"
100+
:title="t('bookmarks', 'Tags')" />
84101
<NcSelect class="tags"
85102
:value="tags"
86103
:auto-limit="false"
@@ -89,32 +106,45 @@
89106
:multiple="true"
90107
:taggable="true"
91108
open-direction="below"
92-
:placeholder="t('bookmarks', 'Select tags and create new ones')"
109+
:placeholder="
110+
t('bookmarks', 'Select tags and create new ones')
111+
"
93112
:disabled="!isEditable"
94113
@input="onTagsChange"
95114
@tag="onAddTag" />
96115
</div>
97116
<div class="details__line">
98117
<PencilBoxIcon :size="20"
99118
role="figure"
119+
:fill-color="colorMainText"
100120
:aria-label="t('bookmarks', 'Notes')"
101121
:title="t('bookmarks', 'Notes')" />
102122
<NcRichContenteditable :value.sync="bookmark.description"
103123
:contenteditable="isEditable"
104124
:auto-complete="() => {}"
105-
:placeholder="t('bookmarks', 'Notes for this bookmark …')"
125+
:placeholder="
126+
t('bookmarks', 'Notes for this bookmark …')
127+
"
106128
:multiline="true"
107129
class="notes"
108130
@update:value="onNotesChange" />
109131
</div>
110132
<div v-if="archivedFile" class="details__line">
111133
<FileDocumentIcon :size="20"
134+
:fill-color="colorMainText"
112135
role="figure"
113136
:aria-label="t('bookmarks', 'Archived file')"
114137
:title="t('bookmarks', 'Archived file')" />
115-
<NcButton :href="archivedFileUrl" target="_blank" type="primary">
138+
<NcButton type="primary" @click="openViewer">
116139
<template #icon>
117-
<DownloadIcon :size="18" :fill-color="colorMainText" />
140+
<FileDocumentIcon :size="20"
141+
:fill-color="colorPrimaryText" />
142+
</template>{{ t('bookmarks', 'Open file') }}
143+
</NcButton>
144+
<NcButton :href="archivedFileUrl" target="_blank" type="secondary">
145+
<template #icon>
146+
<DownloadIcon :size="18"
147+
:fill-color="colorMainText" />
118148
</template>{{ t('bookmarks', 'Download file') }}
119149
</NcButton>
120150
<NcButton :href="archivedFile" target="_blank">
@@ -126,8 +156,27 @@
126156
</NcAppSidebar>
127157
</template>
128158
<script>
129-
import { NcAppSidebar, NcRichContenteditable, NcActionButton, NcActions, NcSelect, NcAppSidebarTab, NcButton } from '@nextcloud/vue'
130-
import { FileDocumentIcon, FolderIcon, InformationVariantIcon, PencilIcon, ArrowRightIcon, TagIcon, OpenInNewIcon, CloseIcon, PencilBoxIcon, DownloadIcon } from './Icons.js'
159+
import {
160+
NcAppSidebar,
161+
NcRichContenteditable,
162+
NcActionButton,
163+
NcActions,
164+
NcSelect,
165+
NcAppSidebarTab,
166+
NcButton,
167+
} from '@nextcloud/vue'
168+
import {
169+
FileDocumentIcon,
170+
FolderIcon,
171+
InformationVariantIcon,
172+
PencilIcon,
173+
ArrowRightIcon,
174+
TagIcon,
175+
OpenInNewIcon,
176+
CloseIcon,
177+
PencilBoxIcon,
178+
DownloadIcon,
179+
} from './Icons.js'
131180
132181
import { getCurrentUser } from '@nextcloud/auth'
133182
import { generateRemoteUrl, generateUrl } from '@nextcloud/router'
@@ -138,7 +187,25 @@ const MAX_RELATIVE_DATE = 1000 * 60 * 60 * 24 * 7 // one week
138187
139188
export default {
140189
name: 'SidebarBookmark',
141-
components: { NcAppSidebar, NcAppSidebarTab, NcSelect, NcActions, NcActionButton, NcRichContenteditable, FileDocumentIcon, FolderIcon, InformationVariantIcon, PencilIcon, ArrowRightIcon, TagIcon, OpenInNewIcon, CloseIcon, PencilBoxIcon, DownloadIcon, NcButton },
190+
components: {
191+
NcAppSidebar,
192+
NcAppSidebarTab,
193+
NcSelect,
194+
NcActions,
195+
NcActionButton,
196+
NcRichContenteditable,
197+
FileDocumentIcon,
198+
FolderIcon,
199+
InformationVariantIcon,
200+
PencilIcon,
201+
ArrowRightIcon,
202+
TagIcon,
203+
OpenInNewIcon,
204+
CloseIcon,
205+
PencilBoxIcon,
206+
DownloadIcon,
207+
NcButton,
208+
},
142209
data() {
143210
return {
144211
title: '',
@@ -155,10 +222,16 @@ export default {
155222
},
156223
bookmark() {
157224
if (!this.isActive) return
158-
return this.$store.getters.getBookmark(this.$store.state.sidebar.id)
225+
return this.$store.getters.getBookmark(
226+
this.$store.state.sidebar.id,
227+
)
159228
},
160229
background() {
161-
return this.bookmark.lastPreview ? generateUrl(`/apps/bookmarks/bookmark/${this.bookmark.id}/image`) : undefined
230+
return this.bookmark.lastPreview
231+
? generateUrl(
232+
`/apps/bookmarks/bookmark/${this.bookmark.id}/image`,
233+
)
234+
: undefined
162235
},
163236
addedDate() {
164237
const date = new Date(Number(this.bookmark.added) * 1000)
@@ -170,23 +243,29 @@ export default {
170243
largest: 1,
171244
round: true,
172245
})
173-
return this.t('bookmarks', 'Created {time} ago', { time: duration })
246+
return this.t('bookmarks', 'Created {time} ago', {
247+
time: duration,
248+
})
174249
} else {
175-
return this.t('bookmarks', 'Created on {date}', { date: date.toLocaleDateString() })
250+
return this.t('bookmarks', 'Created on {date}', {
251+
date: date.toLocaleDateString(),
252+
})
176253
}
177254
},
178255
tags() {
179256
return this.bookmark.tags
180257
},
181258
allTags() {
182-
return this.$store.state.tags.map(tag => tag.name)
259+
return this.$store.state.tags.map((tag) => tag.name)
183260
},
184261
isOwner() {
185262
const currentUser = getCurrentUser()
186263
return currentUser && this.bookmark.userId === currentUser.uid
187264
},
188265
permissions() {
189-
return this.$store.getters.getPermissionsForBookmark(this.bookmark.id)
266+
return this.$store.getters.getPermissionsForBookmark(
267+
this.bookmark.id,
268+
)
190269
},
191270
isEditable() {
192271
return this.isOwner || (!this.isOwner && this.permissions.canWrite)
@@ -199,12 +278,14 @@ export default {
199278
},
200279
archivedFileUrl() {
201280
// remove `/username/files/`
202-
const barePath = this.bookmark.archivedFilePath.split('/').slice(3).join('/')
281+
const barePath = this.bookmark.archivedFilePath
282+
.split('/')
283+
.slice(3)
284+
.join('/')
203285
return generateRemoteUrl(`webdav/${barePath}`)
204286
},
205287
},
206-
created() {
207-
},
288+
created() {},
208289
methods: {
209290
onClose() {
210291
this.$store.commit(mutations.SET_SIDEBAR, null)
@@ -254,12 +335,18 @@ export default {
254335
scheduleSave() {
255336
if (this.changeTimeout) clearTimeout(this.changeTimeout)
256337
this.changeTimeout = setTimeout(async () => {
257-
await this.$store.dispatch(actions.SAVE_BOOKMARK, this.bookmark.id)
338+
await this.$store.dispatch(
339+
actions.SAVE_BOOKMARK,
340+
this.bookmark.id,
341+
)
258342
await this.$store.dispatch(actions.LOAD_TAGS)
259343
}, 1000)
260344
},
261345
onOpenFolder(id) {
262-
this.$router.push({ name: this.routes.FOLDER, params: { folder: id } })
346+
this.$router.push({
347+
name: this.routes.FOLDER,
348+
params: { folder: id },
349+
})
263350
this.onClose()
264351
},
265352
getFolder(id) {
@@ -268,13 +355,22 @@ export default {
268355
return folder
269356
},
270357
getFolderPath(id) {
271-
const path = this.$store.getters.getFolder(id).reverse().map(folder => folder.title)
358+
const path = this.$store.getters
359+
.getFolder(id)
360+
.reverse()
361+
.map((folder) => folder.title)
272362
return '/' + path.join('/')
273363
},
274364
openViewer() {
275365
try {
276366
OCA.Viewer.open({
277-
path: '/' + this.bookmark.archivedFilePath.split('/').slice(2).join('/'),
367+
path:
368+
'/'
369+
+ this.bookmark.archivedFilePath
370+
.split('/')
371+
.slice(3)
372+
.join('/'),
373+
list: [],
278374
})
279375
} catch (e) {
280376
this.$store.commit(mutations.SHOW_ERROR, e.message)

0 commit comments

Comments
 (0)