mirador-annotation-editor-video 0.0.21 → 0.0.23

package/demo/src/index.js

@@ -13,6 +13,7 @@ const config = {
         {manifestId: "https://files.tetras-libre.fr/dev/youtube_withannot.json"},
         {manifestId: "https://files.tetras-libre.fr/dev/peertube.json"},
         {manifestId: "https://files.tetras-libre.fr/dev/cats_simplify_video_with_annot.json"},
+        { manifestId: "https://files.tetras-libre.fr/dev/sun-400x400.json"}
     ],
     theme: {
         palette: {

package/demo/src/manifestsCatalog.js

@@ -13,4 +13,5 @@ export const manifestsCatalog = [
   { manifestId: 'https://iiif.io/api/cookbook/recipe/0074-multiple-language-captions/manifest.json' },
   { manifestId: 'https://iiif.harvardartmuseums.org/manifests/object/299843' },
   { manifestId: 'https://iiif.io/api/cookbook/recipe/0002-mvm-audio/manifest.json' },
+  { manifestId: 'https://files.tetras-libre.fr/dev/sun-400x400.json' }
 ];

package/es/locales.js

@@ -0,0 +1,96 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _default = exports.default = {
+  en: {
+    cancel: 'Cancel',
+    container_size: 'Container Size',
+    create_annotation: 'Create annotation',
+    delete: 'Delete',
+    detected_media_type: 'We detect {{mediaType}} media type.',
+    document: 'Document',
+    drawings_and_text_in_overlay: 'Drawings and text in overlay',
+    edit: 'Edit',
+    edit_annotation: 'Edit annotation',
+    edit_iiif_json_code: 'Edit directly the IIIF json code',
+    expert_mode: 'Expert mode',
+    export_annotation: 'Export Annotations',
+    export_annotation_for: 'Export annotations for "${label}"',
+    export_local_annotation: 'Export local annotations for visible items',
+    image: 'Image',
+    image_displayed: 'Image Displayed',
+    image_in_overlay_with_note: 'Image in overlay with a note',
+    image_true_size: 'Image True Size',
+    invalid_url: 'Invalid URL',
+    maev_github_link: 'https://github.com/SCENE-CE/mirador-annotation-editor-video',
+    manifest_url: 'Manifest URL',
+    media_not_supported: 'Media not supported',
+    new_annotation: 'New annotation',
+    no_annotation: 'No annotations stored yet.',
+    note: 'Note',
+    overlay: 'Overlay',
+    save: 'Save',
+    scale: 'Scale',
+    select_cursor: 'Select Cursor',
+    shape_selection: 'Shape Selection',
+    svg_selection: 'SVG selection',
+    switch_view: 'Switch to single view',
+    switch_view_h2: 'Switch view type to single view?',
+    tag: 'Tag',
+    tag_with_target: 'Tag with target',
+    target: 'Target',
+    textual_note_with_target: 'Textual note with target',
+    tool_selection: 'Tool Selection',
+    unsupported_media_message: 'Your current canvas media type is not supported by the annotation editor.',
+    video_annotation_instruction: 'If you want to annotate video media, you must install MAEV to create and edit annotations on video:',
+    your_tag_here: 'Your tag here:',
+    zoom: 'Zoom'
+  },
+  fr: {
+    cancel: 'Annuler',
+    container_size: 'Taille du conteneur',
+    create_annotation: 'Créer une annotation',
+    delete: 'Supprimer',
+    detected_media_type: 'Nous détectons un média de type {{mediaType}}.',
+    document: 'Document',
+    drawings_and_text_in_overlay: 'Dessins et texte en superposition',
+    edit: 'Éditer',
+    edit_annotation: "Editer l'annotation",
+    edit_iiif_json_code: 'Modifier directement le code JSON IIIF',
+    expert_mode: 'Mode expert',
+    export_annotation: 'Exporter les annotations',
+    export_annotation_for: 'Exporter les annotations pour "${label}"',
+    export_local_annotation: 'Exporter les annotations locales pour les éléments visibles',
+    image: 'Image',
+    image_displayed: 'Image affichée',
+    image_in_overlay_with_note: 'Image en superposition avec une note',
+    image_true_size: 'Taille réelle de l\'image',
+    invalid_url: 'URL invalide',
+    maev_github_link: 'https://github.com/SCENE-CE/mirador-annotation-editor-video',
+    manifest_url: 'URL du manifeste',
+    media_not_supported: 'Média non pris en charge',
+    new_annotation: 'Nouvelle annotation',
+    no_annotation: 'Aucune annotation enregistrée pour le moment.',
+    note: 'Note',
+    overlay: 'Superposition',
+    save: 'Sauvegarder',
+    scale: 'Échelle',
+    select_cursor: 'Sélectionner le curseur',
+    shape_selection: 'Sélection de forme',
+    svg_selection: 'Sélection SVG',
+    switch_view: 'Passer à la vue simple',
+    switch_view_h2: 'Changer le type de vue en vue simple?',
+    tag: 'Étiquette',
+    tag_with_target: 'Étiquette avec cible',
+    target: 'Target',
+    textual_note_with_target: 'Note textuelle avec cible',
+    tool_selection: 'Sélection d’outil',
+    unsupported_media_message: "Le type de média de votre canvas actuel n'est pas pris en charge par l'éditeur d'annotations.",
+    video_annotation_instruction: 'Si vous souhaitez annoter des vidéos, vous devez installer le plugin Mirador Annotation Editor Video (MAEV) pour créer et modifier des annotations sur les vidéos :',
+    your_tag_here: 'Votre étiquette',
+    zoom: 'Zoom'
+  }
+};

package/es/plugin/MiradorAnnotationEditionVideoPlugin.js

@@ -37,12 +37,15 @@ Object.defineProperty(exports, "windowSideBarButtonsPlugin", {
 var _AnnotationCreationWindowWrapper = _interopRequireDefault(require("../wrapper/AnnotationCreationWindowWrapper"));
 var _externalStorageAnnotationPlugin = _interopRequireDefault(require("mirador-annotations/src/plugins/externalStorageAnnotationPlugin"));
 var _canvasAnnotationsPlugin = _interopRequireDefault(require("mirador-annotations/src/plugins/canvasAnnotationsPlugin"));
-var _annotationCreationCompanionWindow = _interopRequireDefault(require("mirador-annotations/src/plugins/annotationCreationCompanionWindow"));
 var _windowSideBarButtonsPlugin = _interopRequireDefault(require("mirador-annotations/src/plugins/windowSideBarButtonsPlugin"));
 var _AnnotationCreationCompanionWindowWrapper = _interopRequireDefault(require("../wrapper/AnnotationCreationCompanionWindowWrapper"));
+var _locales = _interopRequireDefault(require("../locales.js"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 var _default = exports.default = [{
   component: _AnnotationCreationWindowWrapper.default,
   mode: 'wrap',
-  target: 'AnnotationSettings'
+  target: 'AnnotationSettings',
+  config: {
+    translations: _locales.default
+  }
 }, _externalStorageAnnotationPlugin.default, _canvasAnnotationsPlugin.default, _AnnotationCreationCompanionWindowWrapper.default, _windowSideBarButtonsPlugin.default];

package/es/wrapper/AnnotationCreationCompanionWindowWrapper.js

@@ -12,6 +12,8 @@ var _AnnotationForm = _interopRequireDefault(require("mirador-annotations/src/an
 var _playerReferences = require("mirador-annotations/src/playerReferences");
 var _OSDReferences = require("mirador/dist/es/src/plugins/OSDReferences");
 var _VideosReferences = require("mirador/dist/es/src/plugins/VideosReferences");
+var _reactI18next = require("react-i18next");
+var _locales = _interopRequireDefault(require("../locales"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
@@ -42,7 +44,12 @@ function mapStateToProps(state, {
   const canvases = (0, _canvases.getVisibleCanvases)(state, {
     windowId
   });
-  if (canvases[0].__jsonld.items) {
+  const videoResources = (0, _canvases.getVisibleCanvasVideoResources)(state, {
+    windowId
+  });
+  // TODO add check on audioResources  getVisibleCanvasAudioResources
+
+  if (videoResources) {
     _playerReferences.playerReferences.init(state, windowId, _VideosReferences.VideosReferences, actions);
   } else {
     _playerReferences.playerReferences.init(state, windowId, _OSDReferences.OSDReferences, actions);
@@ -65,15 +72,19 @@ function mapStateToProps(state, {
     currentTime,
     annotation,
     canvases,
-    config: state.config,
+    config: {
+      ...state.config,
+      translations: _locales.default
+    },
     getMediaAudio: (0, _canvases.getVisibleCanvasAudioResources)(state, {
       windowId
     })
   };
 }
+const AnnotationFormWithTranslation = (0, _reactI18next.withTranslation)()(_AnnotationForm.default);
 var _default = exports.default = {
   companionWindowKey: 'annotationCreation',
-  component: _AnnotationForm.default,
+  component: AnnotationFormWithTranslation,
   mapDispatchToProps,
   mapStateToProps
 };

package/es/wrapper/AnnotationCreationWindowWrapper.js

@@ -10,6 +10,7 @@ var _selectors = require("mirador/dist/es/src/state/selectors");
 var _canvases = require("mirador/dist/es/src/state/selectors/canvases");
 var _companionWindows = require("mirador/dist/es/src/state/selectors/companionWindows");
 var _window = require("mirador/dist/es/src/state/selectors/window");
+var _reactI18next = require("react-i18next");
 const MiradorAnnotation = require('mirador-annotations/src/plugins/miradorAnnotationPlugin').default;
 // TODO use selector in main componenent
 /**
@@ -44,5 +45,5 @@ function mapStateToProps(state, {
     currentTime: currrentTime
   };
 }
-const enhance = (0, _redux.compose)((0, _reactRedux.connect)(mapStateToProps));
+const enhance = (0, _redux.compose)((0, _reactRedux.connect)(mapStateToProps), (0, _reactI18next.withTranslation)());
 var _default = exports.default = enhance(MiradorAnnotation);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mirador-annotation-editor-video",
-  "version": "0.0.21",
+  "version": "0.0.23",
   "description": "Mirador 4 plugin wrapping Mirador Annotation Editor plugin and adding video annotation support",
   "main": "es/index.js",
   "module": "es/index.js",
@@ -24,7 +24,8 @@
   "dependencies": {
     "@mui/icons-material": "^5.11.16",
     "mirador": "npm:mirador-video@1.0.14",
-    "mirador-annotations": "git://github.com/SCENE-CE/mirador-annotation-editor"
+    "mirador-annotations": "npm:mirador-annotation-editor@1.0.65",
+    "react-i18next": "^15.4.0"
   },
   "peerDependencies": {
     "lodash": "^4.17.11",
@@ -32,7 +33,6 @@
     "react-dom": "^18.0.0"
   },
   "devDependencies": {
-    "@emotion/styled": "^11.11.0",
     "@babel/cli": "^7.25.9",
     "@babel/core": "^7.26.0",
     "@babel/node": "^7.26.0",
@@ -41,6 +41,7 @@
     "@babel/polyfill": "^7.12.1",
     "@babel/preset-env": "^7.26.0",
     "@babel/preset-react": "^7.24.6",
+    "@emotion/styled": "^11.11.0",
     "@pmmmwh/react-refresh-webpack-plugin": "^0.5.13",
     "css-loader": "^7.1.2",
     "html-webpack-plugin": "^5.6.0",
@@ -55,7 +56,7 @@
   },
   "overrides": {
     "mirador-annotations": {
-      "mirador": "npm:mirador-video@1.0.12"
+      "mirador": "npm:mirador-video@1.0.14"
     }
   },
   "author": "",

package/src/locales.js

@@ -0,0 +1,90 @@
+export default {
+  en: {
+    cancel: 'Cancel',
+    container_size: 'Container Size',
+    create_annotation: 'Create annotation',
+    delete: 'Delete',
+    detected_media_type: 'We detect {{mediaType}} media type.',
+    document: 'Document',
+    drawings_and_text_in_overlay: 'Drawings and text in overlay',
+    edit: 'Edit',
+    edit_annotation: 'Edit annotation',
+    edit_iiif_json_code: 'Edit directly the IIIF json code',
+    expert_mode: 'Expert mode',
+    export_annotation: 'Export Annotations',
+    export_annotation_for: 'Export annotations for "${label}"',
+    export_local_annotation: 'Export local annotations for visible items',
+    image: 'Image',
+    image_displayed: 'Image Displayed',
+    image_in_overlay_with_note: 'Image in overlay with a note',
+    image_true_size: 'Image True Size',
+    invalid_url: 'Invalid URL',
+    maev_github_link: 'https://github.com/SCENE-CE/mirador-annotation-editor-video',
+    manifest_url: 'Manifest URL',
+    media_not_supported: 'Media not supported',
+    new_annotation: 'New annotation',
+    no_annotation: 'No annotations stored yet.',
+    note: 'Note',
+    overlay: 'Overlay',
+    save: 'Save',
+    scale: 'Scale',
+    select_cursor: 'Select Cursor',
+    shape_selection: 'Shape Selection',
+    svg_selection: 'SVG selection',
+    switch_view: 'Switch to single view',
+    switch_view_h2: 'Switch view type to single view?',
+    tag: 'Tag',
+    tag_with_target: 'Tag with target',
+    target: 'Target',
+    textual_note_with_target: 'Textual note with target',
+    tool_selection: 'Tool Selection',
+    unsupported_media_message: 'Your current canvas media type is not supported by the annotation editor.',
+    video_annotation_instruction: 'If you want to annotate video media, you must install MAEV to create and edit annotations on video:',
+    your_tag_here: 'Your tag here:',
+    zoom: 'Zoom',
+  },
+  fr: {
+    cancel: 'Annuler',
+    container_size: 'Taille du conteneur',
+    create_annotation: 'Créer une annotation',
+    delete: 'Supprimer',
+    detected_media_type: 'Nous détectons un média de type {{mediaType}}.',
+    document: 'Document',
+    drawings_and_text_in_overlay: 'Dessins et texte en superposition',
+    edit: 'Éditer',
+    edit_annotation: "Editer l'annotation",
+    edit_iiif_json_code: 'Modifier directement le code JSON IIIF',
+    expert_mode: 'Mode expert',
+    export_annotation: 'Exporter les annotations',
+    export_annotation_for: 'Exporter les annotations pour "${label}"',
+    export_local_annotation: 'Exporter les annotations locales pour les éléments visibles',
+    image: 'Image',
+    image_displayed: 'Image affichée',
+    image_in_overlay_with_note: 'Image en superposition avec une note',
+    image_true_size: 'Taille réelle de l\'image',
+    invalid_url: 'URL invalide',
+    maev_github_link: 'https://github.com/SCENE-CE/mirador-annotation-editor-video',
+    manifest_url: 'URL du manifeste',
+    media_not_supported: 'Média non pris en charge',
+    new_annotation: 'Nouvelle annotation',
+    no_annotation: 'Aucune annotation enregistrée pour le moment.',
+    note: 'Note',
+    overlay: 'Superposition',
+    save: 'Sauvegarder',
+    scale: 'Échelle',
+    select_cursor: 'Sélectionner le curseur',
+    shape_selection: 'Sélection de forme',
+    svg_selection: 'Sélection SVG',
+    switch_view: 'Passer à la vue simple',
+    switch_view_h2: 'Changer le type de vue en vue simple?',
+    tag: 'Étiquette',
+    tag_with_target: 'Étiquette avec cible',
+    target: 'Target',
+    textual_note_with_target: 'Note textuelle avec cible',
+    tool_selection: 'Sélection d’outil',
+    unsupported_media_message: "Le type de média de votre canvas actuel n'est pas pris en charge par l'éditeur d'annotations.",
+    video_annotation_instruction: 'Si vous souhaitez annoter des vidéos, vous devez installer le plugin Mirador Annotation Editor Video (MAEV) pour créer et modifier des annotations sur les vidéos :',
+    your_tag_here: 'Votre étiquette',
+    zoom: 'Zoom',
+  },
+};

package/src/plugin/MiradorAnnotationEditionVideoPlugin.js

@@ -1,9 +1,9 @@
 import AnnotationCreationWindowWrapper from "../wrapper/AnnotationCreationWindowWrapper";
 import externalStorageAnnotationPlugin from 'mirador-annotations/src/plugins/externalStorageAnnotationPlugin';
 import canvasAnnotationsPlugin from 'mirador-annotations/src/plugins/canvasAnnotationsPlugin';
-import annotationCreationCompanionWindow from 'mirador-annotations/src/plugins/annotationCreationCompanionWindow';
 import windowSideBarButtonsPlugin from 'mirador-annotations/src/plugins/windowSideBarButtonsPlugin';
 import AnnotationCreationCompanionWindowWrapper from "../wrapper/AnnotationCreationCompanionWindowWrapper";
+import translations from '../locales.js'
 export{
     AnnotationCreationWindowWrapper,
     externalStorageAnnotationPlugin,canvasAnnotationsPlugin,AnnotationCreationCompanionWindowWrapper,
@@ -15,6 +15,10 @@ export default [
     component: AnnotationCreationWindowWrapper,
         mode:'wrap',
     target:'AnnotationSettings',
+    config: {
+        translations,
+    },
+
 },
     externalStorageAnnotationPlugin,
     canvasAnnotationsPlugin,

package/src/wrapper/AnnotationCreationCompanionWindowWrapper.js

@@ -1,11 +1,17 @@
 import * as actions from 'mirador/dist/es/src/state/actions';
 import { getCompanionWindow } from 'mirador/dist/es/src/state/selectors/companionWindows';
-import { getVisibleCanvasAudioResources, getVisibleCanvases } from 'mirador/dist/es/src/state/selectors/canvases';
+import {
+    getVisibleCanvasAudioResources,
+    getVisibleCanvases,
+    getVisibleCanvasVideoResources
+} from 'mirador/dist/es/src/state/selectors/canvases';
 import { getPresentAnnotationsOnSelectedCanvases } from 'mirador/dist/es/src/state/selectors/annotations';
 import annotationForm from 'mirador-annotations/src/annotationForm/AnnotationForm';
 import { playerReferences } from 'mirador-annotations/src/playerReferences';
 import { OSDReferences } from 'mirador/dist/es/src/plugins/OSDReferences';
 import {VideosReferences} from "mirador/dist/es/src/plugins/VideosReferences";
+import { withTranslation } from 'react-i18next';
+import translations from '../locales';
 
 /** */
 const mapDispatchToProps = (dispatch, { id, windowId }) => ({
@@ -25,10 +31,15 @@ function mapStateToProps(state, { id: companionWindowId, windowId }) {
     const cw = getCompanionWindow(state, { companionWindowId, windowId });
     const { annotationid } = cw;
     const canvases = getVisibleCanvases(state, { windowId });
-    if(canvases[0].__jsonld.items){
+
+    const videoResources = getVisibleCanvasVideoResources(state, { windowId });
+    // TODO add check on audioResources  getVisibleCanvasAudioResources
+
+    if(videoResources){
         playerReferences.init(state, windowId,VideosReferences, actions);
     }else{
-    playerReferences.init(state, windowId,OSDReferences, actions);
+
+        playerReferences.init(state, windowId,OSDReferences, actions);
     }
     // This could be removed but it's serve the useEffect in AnnotationForm for now.
     let annotation = getPresentAnnotationsOnSelectedCanvases(state, { windowId })
@@ -49,14 +60,17 @@ function mapStateToProps(state, { id: companionWindowId, windowId }) {
         currentTime,
         annotation,
         canvases,
-        config: state.config,
+        config: {...state.config, translations},
         getMediaAudio: getVisibleCanvasAudioResources(state, { windowId }),
     };
 }
 
+const AnnotationFormWithTranslation = withTranslation()(annotationForm);
+
+
 export default {
     companionWindowKey: 'annotationCreation',
-    component: annotationForm,
+    component: AnnotationFormWithTranslation,
     mapDispatchToProps,
     mapStateToProps,
 };

package/src/wrapper/AnnotationCreationWindowWrapper.js

@@ -4,6 +4,7 @@ import { getWindowViewType } from 'mirador/dist/es/src/state/selectors';
 import { getVisibleCanvases } from 'mirador/dist/es/src/state/selectors/canvases';
 import { getCompanionWindowsForContent } from 'mirador/dist/es/src/state/selectors/companionWindows';
 import { getWindowCurrentTime } from "mirador/dist/es/src/state/selectors/window";
+import {withTranslation} from "react-i18next";
 const MiradorAnnotation = require('mirador-annotations/src/plugins/miradorAnnotationPlugin').default;
 // TODO use selector in main componenent
 /**
@@ -28,6 +29,7 @@ function mapStateToProps(state, { targetProps: { windowId } }) {
 
 const enhance = compose(
     connect(mapStateToProps),
+    withTranslation(),
 );
 
 export default enhance(MiradorAnnotation);