V:: v.0.5.4

French translation. An option to hide the full-page mode switch.
RussCoder · Jan 16, 2021 · 16802f4 · 16802f4
1 parent a8ab06b
commit 16802f4
Show file tree

Hide file tree

Showing 12 changed files with 86 additions and 41 deletions.
diff --git a/TRANSLATION.md b/TRANSLATION.md
@@ -3,8 +3,9 @@
 If you want to add one more translation to the viewer, 
 you need to fulfill the following steps:
 
-1. Copy [the Russian dictionary file](viewer/src/locales/Russian.js) and rename it
-according to the name of your language in English.
+1. Copy [the Russian dictionary file](viewer/src/locales/Russian.js) and rename
+   it according to the name of your language in English. Put your file into the
+   same directory, where the Russian file is.
 
 2. Then change all the Russian translations of English phrases with your own. 
 You can look at the  [the English dictionary file](viewer/src/locales/English.js), 

diff --git a/extension/initializer.js b/extension/initializer.js
@@ -6,7 +6,11 @@ window.onunload = () => chrome.runtime.sendMessage("unregister_viewer_tab");
 
 window.onload = () => {
     chrome.runtime.sendMessage("register_viewer_tab", () => {
-        viewer = new DjVu.Viewer();
+        viewer = new DjVu.Viewer({
+            uiOptions: {
+                hideFullPageSwitch: true,
+            }
+        });
         viewer.render(document.getElementById('root'));
 
         viewer.on(DjVu.Viewer.Events.DOCUMENT_CHANGED, () => {

diff --git a/extension/manifest.json b/extension/manifest.json
@@ -2,7 +2,7 @@
     "manifest_version": 2,
     "name": "DjVu.js Viewer",
     "short_name": "DV",
-    "version": "0.5.3.1",
+    "version": "0.5.4.0",
     "author": "RussCoder",
     "homepage_url": "https://github.com/RussCoder/djvujs",
     "description": "Opens links to .djvu files. Allows opening .djvu files from a local disk. Processes djvu <object> & <embed> tags.",

diff --git a/viewer/CHANGELOG.md b/viewer/CHANGELOG.md
@@ -1,5 +1,10 @@
 # DjVu.js Viewer's Changelog
 
+## v.0.5.4 (16.01.2021)
+
+- French translation.
+- An option to hide the full-page mode switch.
+
 ## v.0.5.3 (08.12.2020)
 
 - Fix: styles in the help window.

diff --git a/viewer/src/DjVuViewer.js b/viewer/src/DjVuViewer.js
@@ -17,20 +17,28 @@ const Events = constant({
 
 export default class DjVuViewer extends EventEmitter {
 
-    static VERSION = '0.5.3';
+    static VERSION = '0.5.4';
 
     static Events = Events;
 
     static getAvailableLanguages() {
         return Object.keys(dictionaries);
     };
 
-    constructor({ language = null } = {}) {
+    /**
+     * Technically, we can pass the same config as to the configure() method.
+     * But all other options are reset when a new document is loaded.
+     * So there is not sense to pass them into the constructor.
+     */
+    constructor({ language = null, uiOptions = null } = {}) {
         super();
         this.store = configureStore(this.eventMiddleware);
 
-        if (language) {
-            this.configure({ language: language });
+        if (language || uiOptions) {
+            this.configure({
+                language: language,
+                uiOptions: uiOptions,
+            });
         }
     }
 
@@ -87,10 +95,13 @@ export default class DjVuViewer extends EventEmitter {
         );
     }
 
-    configure({ pageNumber, pageRotation, pageScale, language, theme } = {}) {
+    /**
+     * The config object is destructed merely for the purpose of documentation
+     */
+    configure({ pageNumber, pageRotation, pageScale, language, theme, uiOptions } = {}) {
         this.store.dispatch({
             type: ActionTypes.CONFIGURE,
-            pageNumber, pageRotation, pageScale, language, theme,
+            pageNumber, pageRotation, pageScale, language, theme, uiOptions,
         });
 
         return this;

diff --git a/viewer/src/components/Footer/Footer.jsx b/viewer/src/components/Footer/Footer.jsx
@@ -5,6 +5,8 @@ import HelpButton from './HelpButton';
 import FullPageViewButton from './FullPageViewButton';
 import styled from 'styled-components';
 import { ControlButton } from '../StyledPrimitives';
+import { useSelector } from "react-redux";
+import { get } from "../../reducers";
 
 const Root = styled.div`
     width: 100%;
@@ -18,17 +20,17 @@ const Root = styled.div`
     }
 `;
 
-class Footer extends React.Component {
-    render() {
-        return (
-            <Root>
-                <StatusBar />
-                <FilePanel />
-                <HelpButton />
-                <FullPageViewButton />
-            </Root>
-        );
-    }
+function Footer() {
+    const { hideFullPageSwitch } = useSelector(get.uiOptions);
+
+    return (
+        <Root>
+            <StatusBar />
+            <FilePanel />
+            <HelpButton />
+            {hideFullPageSwitch ? null : <FullPageViewButton />}
+        </Root>
+    );
 }
 
 export default Footer;
diff --git a/viewer/src/components/ModalWindows/HelpWindow.jsx b/viewer/src/components/ModalWindows/HelpWindow.jsx
@@ -36,6 +36,7 @@ export default () => {
     const isShown = useSelector(get.isHelpWindowShown);
     const dispatch = useDispatch();
     const t = useTranslation();
+    const { hideFullPageSwitch } = useSelector(get.uiOptions);
 
     if (!isShown) {
         return null;
@@ -69,14 +70,18 @@ export default () => {
                     <em>{'\u2192'}</em><span>- {t('go to the next page')}</span>
                 </HotkeyGrid>
 
-                <Header>{t('Controls')}</Header>
-                <div>
-                    {t("#expandIcon and #collapseIcon are to switch the viewer to the full page mode and back.", {
-                        "#expandIcon": <FontAwesomeIcon icon={faExpand} />,
-                        "#collapseIcon": <FontAwesomeIcon icon={faCompress} />,
-                    })}
-                    {' ' + t("If you work with the browser extension, these buttons will cause no effect, since the viewer takes the whole page by default.")}
-                </div>
+                {hideFullPageSwitch ? null :
+                    <>
+                        <Header>{t('Controls')}</Header>
+                        <div>
+                            {t("#expandIcon and #collapseIcon are to switch the viewer to the full page mode and back.", {
+                                "#expandIcon": <FontAwesomeIcon icon={faExpand} />,
+                                "#collapseIcon": <FontAwesomeIcon icon={faCompress} />,
+                            })}
+                            {' ' + t("If you work with the browser extension, these buttons will cause no effect, since the viewer takes the whole page by default.")}
+                        </div>
+                    </>
+                }
             </Root>
         </ModalWindow>
     );

diff --git a/viewer/src/constants/actionTypes.js b/viewer/src/constants/actionTypes.js
@@ -14,4 +14,5 @@ export const ActionTypes = constant({
     UPDATE_FILE_PROCESSING_PROGRESS: null,
     ERROR: null,
     SAVE_DOCUMENT: null,
+    SET_UI_OPTIONS: null,
 });
diff --git a/French.js → viewer/src/locales/French.js b/French.js → viewer/src/locales/French.js
diff --git a/viewer/src/locales/index.js b/viewer/src/locales/index.js
@@ -1,9 +1,11 @@
 import English from './English';
 import Russian from './Russian';
 import Swedish from './Swedish';
+import French from "./French";
 
 export default {
     'en': English,
     'ru': Russian,
-    'sv': Swedish
+    'sv': Swedish,
+    'fr': French,
 };
diff --git a/viewer/src/reducers/commonReducer.js b/viewer/src/reducers/commonReducer.js
@@ -16,19 +16,34 @@ const initialState = Object.freeze({
     isHelpWindowShown: false,
     isContinuousScrollMode: false,
     isIndirect: false,
-    options: {
+    options: { // all these options are saved in localStorage
         interceptHttpRequests: false,
         analyzeHeaders: false,
         locale: 'en',
         theme: window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light',
         preferContinuousScroll: false,
     },
+    uiOptions: { // aren't saved, should be set programmatically, if required
+        hideFullPageSwitch: false,
+    },
 });
 
+function getInitialStateWithOptions(state) {
+    return {
+        ...initialState,
+        isFullPageView: state.isFullPageView,
+        options: state.options,
+        uiOptions: state.uiOptions,
+    };
+}
+
 export default (state = initialState, action) => {
     const payload = action.payload;
     switch (action.type) {
 
+        case ActionTypes.SET_UI_OPTIONS:
+            return { ...state, uiOptions: { ...state.uiOptions, ...payload } };
+
         case ActionTypes.UPDATE_OPTIONS:
             return { ...state, options: { ...state.options, ...payload } };
 
@@ -72,23 +87,17 @@ export default (state = initialState, action) => {
 
         case Constants.DOCUMENT_CREATED_ACTION:
             return {
-                ...initialState,
+                ...getInitialStateWithOptions(state),
                 documentId: state.documentId + 1,
                 isLoading: true,
-                isFullPageView: state.isFullPageView,
                 isContinuousScrollMode: state.options.preferContinuousScroll ? true : state.isContinuousScrollMode,
                 pagesQuantity: action.pagesQuantity,
                 fileName: action.fileName,
                 isIndirect: action.isIndirect,
-                options: state.options,
             };
 
         case Constants.CLOSE_DOCUMENT_ACTION:
-            return {
-                ...initialState,
-                isFullPageView: state.isFullPageView,
-                options: state.options,
-            };
+            return getInitialStateWithOptions(state);
 
         case Constants.CONTENTS_IS_GOTTEN_ACTION:
             return {
@@ -129,6 +138,7 @@ export default (state = initialState, action) => {
 }
 
 export const get = {
+    uiOptions: state => state.uiOptions,
     documentId: state => state.documentId,
     userScale: state => state.userScale,
     pageRotation: state => state.pageRotation,

diff --git a/viewer/src/sagas/rootSaga.js b/viewer/src/sagas/rootSaga.js
@@ -110,10 +110,14 @@ class RootSaga {
         yield put(Actions.pagesSizesAreGottenAction(pagesSizes));
     }
 
-    * configure({ pageNumber, pageRotation, pageScale, language, theme }) {
+    * configure({ pageNumber, pageRotation, pageScale, language, theme, uiOptions }) {
         if (pageNumber) yield put(Actions.setNewPageNumberAction(pageNumber, true));
         if (pageRotation) yield put(Actions.setPageRotationAction(pageRotation));
         if (pageScale) yield put(Actions.setUserScaleAction(pageScale));
+        if (uiOptions) yield put({
+            type: ActionTypes.SET_UI_OPTIONS,
+            payload: uiOptions,
+        });
 
         const options = {};
         if (language) {
@@ -190,7 +194,7 @@ class RootSaga {
         // set the current number to start page fetching saga
         // fetchPageData should be called via yield* directly, otherwise it won't be cancelled by takeLatest effect
         const state = yield select();
-        yield put(Actions.setNewPageNumberAction(get.currentPageNumber(state), true)); // set the current number to start page fetching saga   
+        yield put(Actions.setNewPageNumberAction(get.currentPageNumber(state), true)); // set the current number to start page fetching saga
     }
 
     * setPageByUrl(action) {