From 0b67fe5db736fb29a34e4c0e15baeedbc8bb8769 Mon Sep 17 00:00:00 2001 From: llj Date: Wed, 22 Nov 2023 11:29:01 +0800 Subject: [PATCH] [favicon] use file type icon as favicon for 'file view, shared file view' pages for different types of files (#5775) --- frontend/src/components/file-view/file-view.js | 5 +++++ .../src/components/shared-file-view/shared-file-view.js | 4 ++++ frontend/src/pages/markdown-editor/index.js | 3 +++ frontend/src/pages/sdoc/sdoc-editor/index.js | 7 +++++++ frontend/src/shared-file-view-sdoc.js | 5 +++++ frontend/src/utils/utils.js | 2 ++ seahub/templates/base.html | 2 +- seahub/templates/base_for_react.html | 2 +- seahub/templates/markdown_file_view_react.html | 4 ++-- 9 files changed, 30 insertions(+), 4 deletions(-) diff --git a/frontend/src/components/file-view/file-view.js b/frontend/src/components/file-view/file-view.js index 72673632908..387812b49df 100644 --- a/frontend/src/components/file-view/file-view.js +++ b/frontend/src/components/file-view/file-view.js @@ -38,6 +38,11 @@ class FileView extends React.Component { }; } + componentDidMount() { + const fileIcon = Utils.getFileIconUrl(fileName, 192); + document.getElementById('favicon').href = fileIcon; + } + toggleDetailsPanel = () => { this.setState({isDetailsPanelOpen: !this.state.isDetailsPanelOpen}); }; diff --git a/frontend/src/components/shared-file-view/shared-file-view.js b/frontend/src/components/shared-file-view/shared-file-view.js index 268b92dc137..892c2d5bb49 100644 --- a/frontend/src/components/shared-file-view/shared-file-view.js +++ b/frontend/src/components/shared-file-view/shared-file-view.js @@ -56,6 +56,10 @@ class SharedFileView extends React.Component { }; componentDidMount() { + + const fileIcon = Utils.getFileIconUrl(fileName, 192); + document.getElementById('favicon').href = fileIcon; + if (trafficOverLimit) { toaster.danger(gettext('File download is disabled: the share link traffic of owner is used up.'), { duration: 3 diff --git a/frontend/src/pages/markdown-editor/index.js b/frontend/src/pages/markdown-editor/index.js index 5e5f5bdad03..ecbc769f950 100644 --- a/frontend/src/pages/markdown-editor/index.js +++ b/frontend/src/pages/markdown-editor/index.js @@ -261,6 +261,9 @@ class MarkdownEditor extends React.Component { async componentDidMount() { + const fileIcon = Utils.getFileIconUrl(fileName, 192); + document.getElementById('favicon').href = fileIcon; + // get file info const fileInfoRes = await seafileAPI.getFileInfo(repoID, filePath); const { mtime, size, starred, permission, last_modifier_name, id } = fileInfoRes.data; diff --git a/frontend/src/pages/sdoc/sdoc-editor/index.js b/frontend/src/pages/sdoc/sdoc-editor/index.js index 65b6cf09054..39ca48ef999 100644 --- a/frontend/src/pages/sdoc/sdoc-editor/index.js +++ b/frontend/src/pages/sdoc/sdoc-editor/index.js @@ -1,6 +1,7 @@ import React, { Fragment } from 'react'; import { SimpleEditor } from '@seafile/sdoc-editor'; import ExternalOperations from './external-operations'; +import { Utils } from '../../../utils/utils'; export default class SdocEditor extends React.Component { @@ -13,6 +14,12 @@ export default class SdocEditor extends React.Component { }; } + componentDidMount() { + const { docName } = window.seafile; + const fileIcon = Utils.getFileIconUrl(docName, 192); + document.getElementById('favicon').href = fileIcon; + } + toggleStar = (isStarred) => { this.setState({isStarred: isStarred}); }; diff --git a/frontend/src/shared-file-view-sdoc.js b/frontend/src/shared-file-view-sdoc.js index 1d4714d655d..6c3bcd20b56 100644 --- a/frontend/src/shared-file-view-sdoc.js +++ b/frontend/src/shared-file-view-sdoc.js @@ -39,6 +39,11 @@ window.seafile = { assetsUrl, }; +(function() { + const fileIcon = Utils.getFileIconUrl(docName, 192); + document.getElementById('favicon').href = fileIcon; +})(); + ReactDom.render( }> diff --git a/frontend/src/utils/utils.js b/frontend/src/utils/utils.js index 822405ac571..42f75846851 100644 --- a/frontend/src/utils/utils.js +++ b/frontend/src/utils/utils.js @@ -87,7 +87,9 @@ export const Utils = { 'mp3' : 'music.png', 'oga' : 'music.png', 'ogg' : 'music.png', + 'wav' : 'music.png', 'flac' : 'music.png', + 'opus' : 'music.png', 'aac' : 'music.png', 'ac3' : 'music.png', 'wma' : 'music.png', diff --git a/seahub/templates/base.html b/seahub/templates/base.html index bf671eaced6..e2e056380f8 100644 --- a/seahub/templates/base.html +++ b/seahub/templates/base.html @@ -11,7 +11,7 @@ {% endblock %} - + {% block extra_base_style %} diff --git a/seahub/templates/base_for_react.html b/seahub/templates/base_for_react.html index 166e4d17ced..36d76238541 100644 --- a/seahub/templates/base_for_react.html +++ b/seahub/templates/base_for_react.html @@ -13,7 +13,7 @@ {% endblock %} {% block extra_ogp_tags %}{% endblock %} - + diff --git a/seahub/templates/markdown_file_view_react.html b/seahub/templates/markdown_file_view_react.html index b5666f11614..0c03da87927 100644 --- a/seahub/templates/markdown_file_view_react.html +++ b/seahub/templates/markdown_file_view_react.html @@ -7,7 +7,7 @@ {{ filename }} - + @@ -46,7 +46,7 @@ hasDraft: '{{ has_draft }}' === 'True', draftFilePath: '{{ draft_file_path }}', draftOriginFilePath: '{{ draft_origin_file_path }}', - shareLinkForceUsePassword: {% if share_link_force_use_password %} true {% else %} false {% endif %}, + shareLinkForceUsePassword: {% if share_link_force_use_password %} true {% else %} false {% endif %}, shareLinkPasswordMinLength: {{ share_link_password_min_length }}, shareLinkPasswordStrengthLevel: {{ share_link_password_strength_level }}, shareLinkExpireDaysDefault: {{ share_link_expire_days_default }},