annotation user interface

Prepare connection to picker

src/common/redux/states/renderer/readerRootState.ts

@@ -18,11 +18,13 @@ import { LocatorExtended } from "@r2-navigator-js/electron/renderer";
 
 import { TBookmarkState } from "../bookmark";
 import { TAnnotationState } from "../annotation";
+import { IAnnotationUserInterfaceState } from "readium-desktop/renderer/reader/redux/state/annotation";
 
 export interface IReaderRootState extends ICommonRootState {
     reader: IReaderStateReader;
     picker: IPickerState;
     search: ISearchState;
+    annotation: IAnnotationUserInterfaceState;
     mode: ReaderMode;
 }
 

src/renderer/reader/components/ReaderMenu.tsx

@@ -35,7 +35,6 @@ import SideMenu from "./sideMenu/SideMenu";
 import { SectionData } from "./sideMenu/sideMenuData";
 import UpdateBookmarkForm from "./UpdateBookmarkForm";
 import { IAnnotationState } from "readium-desktop/common/redux/states/annotation";
-import { IRangeInfo } from "r2-navigator-js/dist/es8-es2017/src/electron/common/selection";
 
 // eslint-disable-next-line @typescript-eslint/no-empty-interface
 interface IBaseProps extends TranslatorProps, IReaderMenuProps {
@@ -825,14 +824,14 @@ export class ReaderMenu extends React.Component<IProps, IState> {
     }
 
     // from src/renderer/reader/redux/sagas/search.ts
-    private createLocatorLink(href: string, rangeInfo: IRangeInfo): Locator {
-        return {
-            href,
-            locations: {
-                cssSelector: rangeInfo.startContainerElementCssSelector,
-            },
-        };
-    }
+    // private createLocatorLink(href: string, rangeInfo: IRangeInfo): Locator {
+    //     return {
+    //         href,
+    //         locations: {
+    //             cssSelector: rangeInfo.startContainerElementCssSelector,
+    //         },
+    //     };
+    // }
 }
 
 const mapStateToProps = (state: IReaderRootState, _props: IBaseProps) => {

src/renderer/reader/redux/actions/annotationUI/cancel.ts

@@ -0,0 +1,26 @@
+// ==LICENSE-BEGIN==
+// Copyright 2017 European Digital Reading Lab. All rights reserved.
+// Licensed to the Readium Foundation under one or more contributor license agreements.
+// Use of this source code is governed by a BSD-style license
+// that can be found in the LICENSE file exposed on Github (readium) in the project repository.
+// ==LICENSE-END==
+
+import { Action } from "readium-desktop/common/models/redux";
+import { IAnnotationUserInterfaceState, annotationDefaultState } from "../../state/annotation";
+
+export const ID = "READER_ANNOTATION_CANCEL";
+
+// eslint-disable-next-line @typescript-eslint/no-empty-interface
+interface IPayload extends Partial<IAnnotationUserInterfaceState> {
+}
+
+export function build():
+    Action<typeof ID, IPayload> {
+
+    return {
+        type: ID,
+        payload: annotationDefaultState(),
+    };
+}
+build.toString = () => ID; // Redux StringableActionCreator
+export type TAction = ReturnType<typeof build>;

src/renderer/reader/redux/actions/annotationUI/color.ts

@@ -0,0 +1,29 @@
+// ==LICENSE-BEGIN==
+// Copyright 2017 European Digital Reading Lab. All rights reserved.
+// Licensed to the Readium Foundation under one or more contributor license agreements.
+// Use of this source code is governed by a BSD-style license
+// that can be found in the LICENSE file exposed on Github (readium) in the project repository.
+// ==LICENSE-END==
+
+import { Action } from "readium-desktop/common/models/redux";
+import { IColor } from "@r2-navigator-js/electron/common/highlight";
+import { IAnnotationUserInterfaceState } from "../../state/annotation";
+
+export const ID = "READER_ANNOTATION_COLOR";
+
+// eslint-disable-next-line @typescript-eslint/no-empty-interface
+interface IPayload extends Partial<IAnnotationUserInterfaceState> {
+}
+
+export function build(color: IColor):
+    Action<typeof ID, IPayload> {
+
+    return {
+        type: ID,
+        payload: {
+            color,
+        },
+    };
+}
+build.toString = () => ID; // Redux StringableActionCreator
+export type TAction = ReturnType<typeof build>;

src/renderer/reader/redux/actions/annotationUI/enable.ts

@@ -0,0 +1,28 @@
+// ==LICENSE-BEGIN==
+// Copyright 2017 European Digital Reading Lab. All rights reserved.
+// Licensed to the Readium Foundation under one or more contributor license agreements.
+// Use of this source code is governed by a BSD-style license
+// that can be found in the LICENSE file exposed on Github (readium) in the project repository.
+// ==LICENSE-END==
+
+import { Action } from "readium-desktop/common/models/redux";
+import { IAnnotationUserInterfaceState } from "../../state/annotation";
+
+export const ID = "READER_ANNOTATION_ENABLE";
+
+// eslint-disable-next-line @typescript-eslint/no-empty-interface
+interface IPayload extends Partial<IAnnotationUserInterfaceState> {
+}
+
+export function build():
+    Action<typeof ID, IPayload> {
+
+    return {
+        type: ID,
+        payload: {
+            enable: true,
+        },
+    };
+}
+build.toString = () => ID; // Redux StringableActionCreator
+export type TAction = ReturnType<typeof build>;

src/renderer/reader/redux/actions/annotationUI/focus.ts

@@ -0,0 +1,32 @@
+// ==LICENSE-BEGIN==
+// Copyright 2017 European Digital Reading Lab. All rights reserved.
+// Licensed to the Readium Foundation under one or more contributor license agreements.
+// Use of this source code is governed by a BSD-style license
+// that can be found in the LICENSE file exposed on Github (readium) in the project repository.
+// ==LICENSE-END==
+
+import { Action } from "readium-desktop/common/models/redux";
+import { diReaderGet } from "readium-desktop/renderer/reader/di";
+import { IAnnotationUserInterfaceState } from "../../state/annotation";
+
+export const ID = "READER_ANNOTATION_FOCUS";
+
+// eslint-disable-next-line @typescript-eslint/no-empty-interface
+interface IPayload extends Partial<IAnnotationUserInterfaceState> {
+}
+
+export function build(focusUUId: IAnnotationUserInterfaceState["newFocusAnnotationUUID"]):
+    Action<typeof ID, IPayload> {
+
+    const store = diReaderGet("store");
+    const { newFocusAnnotationUUID: oldFocusUUId } = store.getState().annotation;
+    return {
+        type: ID,
+        payload: {
+            newFocusAnnotationUUID: focusUUId,
+            oldFocusAnnotationUUID: oldFocusUUId,
+        },
+    };
+}
+build.toString = () => ID; // Redux StringableActionCreator
+export type TAction = ReturnType<typeof build>;

src/renderer/reader/redux/actions/annotationUI/index.ts

@@ -0,0 +1,18 @@
+// ==LICENSE-BEGIN==
+// Copyright 2017 European Digital Reading Lab. All rights reserved.
+// Licensed to the Readium Foundation under one or more contributor license agreements.
+// Use of this source code is governed by a BSD-style license
+// that can be found in the LICENSE file exposed on Github (readium) in the project repository.
+// ==LICENSE-END==
+
+import * as enable from "./enable";
+import * as focus from "./focus";
+import * as color from "./color";
+import * as cancel from "./cancel";
+
+export {
+    focus,
+    color,
+    enable,
+    cancel,
+};

src/renderer/reader/redux/actions/index.ts

@@ -7,6 +7,7 @@
 
 import * as readerLocalActionBookmarks from "./bookmarks";
 import * as readerLocalActionAnnotations from "./annotations";
+import * as readerLocalActionAnnotationUI from "./annotationUI";
 import * as readerLocalActionDivina from "./divina";
 import * as readerLocalActionHighlights from "./highlights";
 import * as readerLocalActionLocatorHrefChanged from "./locatorHrefChanged";
@@ -24,5 +25,6 @@ export {
     readerLocalActionSearch,
     readerLocalActionBookmarks,
     readerLocalActionAnnotations,
+    readerLocalActionAnnotationUI,
     readerLocalActionDivina,
 };

src/renderer/reader/redux/reducers/annotationUI.ts

@@ -0,0 +1,32 @@
+// ==LICENSE-BEGIN==
+// Copyright 2017 European Digital Reading Lab. All rights reserved.
+// Licensed to the Readium Foundation under one or more contributor license agreements.
+// Use of this source code is governed by a BSD-style license
+// that can be found in the LICENSE file exposed on Github (readium) in the project repository.
+// ==LICENSE-END==
+
+import { readerLocalActionAnnotationUI } from "../actions";
+import { IAnnotationUserInterfaceState, annotationDefaultState } from "../state/annotation";
+
+export function annotationUIReducer(
+    state: IAnnotationUserInterfaceState = annotationDefaultState(),
+    action: readerLocalActionAnnotationUI.color.TAction |
+    readerLocalActionAnnotationUI.enable.TAction |
+    readerLocalActionAnnotationUI.focus.TAction |
+    readerLocalActionAnnotationUI.cancel.TAction,
+): IAnnotationUserInterfaceState {
+
+    switch (action.type) {
+        case readerLocalActionAnnotationUI.cancel.ID:
+        case readerLocalActionAnnotationUI.enable.ID:
+        case readerLocalActionAnnotationUI.focus.ID:
+        case readerLocalActionAnnotationUI.color.ID:
+
+            return {
+                ...state,
+                ...action.payload,
+            };
+        default:
+            return state;
+    }
+}

src/renderer/reader/redux/reducers/index.ts

@@ -31,6 +31,7 @@ import { priorityQueueReducer } from "readium-desktop/utils/redux-reducers/pqueu
 import { winModeReducer } from "readium-desktop/common/redux/reducers/winModeReducer";
 import { readerDivinaReducer } from "./divina";
 import { IAnnotationState } from "readium-desktop/common/redux/states/annotation";
+import { annotationUIReducer } from "./annotationUI";
 
 export const rootReducer = () => {
     return combineReducers<IReaderRootState>({
@@ -155,6 +156,7 @@ export const rootReducer = () => {
             divina: readerDivinaReducer,
         }),
         search: searchReducer,
+        annotation: annotationUIReducer,
         picker: pickerReducer,
         win: winReducer,
         dialog: dialogReducer,

src/renderer/reader/redux/state/annotation.ts

@@ -0,0 +1,24 @@
+// ==LICENSE-BEGIN==
+// Copyright 2017 European Digital Reading Lab. All rights reserved.
+// Licensed to the Readium Foundation under one or more contributor license agreements.
+// Use of this source code is governed by a BSD-style license
+// that can be found in the LICENSE file exposed on Github (readium) in the project repository.
+// ==LICENSE-END==
+
+import { IAnnotationState } from "readium-desktop/common/redux/states/annotation";
+import { IColor } from "@r2-navigator-js/electron/common/highlight";
+
+export interface IAnnotationUserInterfaceState {
+    enable: boolean;
+    newFocusAnnotationUUID: IAnnotationState["uuid"];
+    oldFocusAnnotationUUID: IAnnotationState["uuid"];
+    color: IColor
+}
+
+export const annotationDefaultState = (): IAnnotationUserInterfaceState =>
+    ({
+        enable: false,
+        newFocusAnnotationUUID: "",
+        oldFocusAnnotationUUID: "",
+        color: {red: 0, green: 0, blue: 0},
+    });