@annotorious/core 3.0.0-pre-alpha-43

package/src/presence/PresenceState.ts

@@ -0,0 +1,145 @@
+import { nanoid } from 'nanoid';
+import { createNanoEvents, type Unsubscribe } from 'nanoevents';
+import type { User } from '../model';
+import type { PresentUser } from './PresentUser';
+import type { PresenceEvents } from './PresenceEvents';
+import { createDefaultAppearenceProvider } from './AppearanceProvider';
+import type { AppearanceProvider } from './AppearanceProvider';
+
+export interface PresenceState {
+
+  // Get users currently present to this room
+  getPresentUsers(): PresentUser[];
+
+  // Notify of a given present user's activity on the given annotations
+  notifyActivity(presenceKey: string, annotationIds: string[]): void;
+
+  // Add a listener for the given presence event
+  on<E extends keyof PresenceEvents>(event: E, callback: PresenceEvents[E]): Unsubscribe;
+
+  // Initial sync - which users are present under which keys
+  syncUsers(state: { presenceKey: string, user: User }[]): void;
+
+  // Update the selection state for the given prresent user
+  updateSelection(presenceKey: string, selection: string[] | null): void;
+
+}
+
+const isListEqual = (listA: any[], listB: any[]) => 
+  listA.every(a => listA.includes(a)) && listB.every(b => listA.includes(b));
+
+// This client's presence key
+export const PRESENCE_KEY = nanoid();
+
+export const createPresenceState = (
+  appearanceProvider: AppearanceProvider = createDefaultAppearenceProvider()
+): PresenceState => {
+
+  const emitter = createNanoEvents<PresenceEvents>();
+
+  const presentUsers = new Map<string, PresentUser>();
+
+  const selectionStates = new Map<string, string[]>();
+
+  const addUser = (presenceKey: string, user: User) => {
+    if (presentUsers.has(presenceKey)) {
+      console.warn('Attempt to add user that is already present', presenceKey, user);
+      return;    
+    }
+
+    const appearance = appearanceProvider.addUser(presenceKey, user);
+
+    presentUsers.set(presenceKey, { 
+      ...user,
+      presenceKey,
+      appearance
+    });
+  }
+
+  const removeUser = (presenceKey: string) => {
+    const user = presentUsers.get(presenceKey);
+    if (!user) {
+      console.warn('Attempt to remove user that is not present', presenceKey);
+      return;
+    }
+
+    appearanceProvider.removeUser(user);
+
+    presentUsers.delete(presenceKey);
+  }
+
+  const syncUsers = (state: { presenceKey: string, user: User }[]) => {
+    // const keys = new Set(others.map(s => s.presenceKey));
+    const keys = new Set(state.map(s => s.presenceKey));
+
+    // These users need to be added to the presentUsers list
+    // const toAdd = others.filter(({ presenceKey }) => !presentUsers.has(presenceKey));
+    const toAdd = state.filter(({ presenceKey }) => !presentUsers.has(presenceKey));
+
+    // These users need to be dropped from the list
+    const toRemove = Array.from(presentUsers.values()).filter(presentUser =>
+      !keys.has(presentUser.presenceKey));
+
+    toAdd.forEach(({ presenceKey, user }) => addUser(presenceKey, user));
+
+    toRemove.forEach(user => {
+      const { presenceKey } = user;
+
+      // If this user has a selection, fire deselect event
+      if (selectionStates.has(presenceKey))
+        emitter.emit('selectionChange', user, null);
+
+      removeUser(presenceKey)
+    });
+
+    if (toAdd.length > 0 || toRemove.length > 0)
+      emitter.emit('presence', getPresentUsers());
+  }
+
+  const notifyActivity = (presenceKey: string, annotationIds: string[]) => {    
+    const user = presentUsers.get(presenceKey);
+    
+    if (!user) {
+      console.warn('Activity notification from user that is not present');
+      return;
+    }
+
+    const currentSelection = selectionStates.get(presenceKey);
+
+    // Was there a selection change we might have missed?
+    if (!currentSelection || !isListEqual(currentSelection, annotationIds)) {
+      selectionStates.set(presenceKey, annotationIds);
+      emitter.emit('selectionChange', user, annotationIds);
+    }
+  }
+
+  const updateSelection = (presenceKey: string, selection: string[] | null) => {
+    const from = presentUsers.get(presenceKey);
+    if (!from) {
+      console.warn('Selection change for user that is not present', presenceKey);
+      return;
+    }
+
+    if (selection)
+      selectionStates.set(presenceKey, selection);
+    else 
+      selectionStates.delete(presenceKey);
+
+    emitter.emit('selectionChange', from, selection);
+  }
+
+  const getPresentUsers = () =>
+    [...Array.from(presentUsers.values())];
+    
+  const on = <E extends keyof PresenceEvents>(event: E, callback: PresenceEvents[E]) =>
+    emitter.on(event, callback);
+
+  return {
+    getPresentUsers,
+    notifyActivity,
+    on,
+    syncUsers,
+    updateSelection
+  }
+
+}

package/src/presence/PresentUser.ts

@@ -0,0 +1,10 @@
+import type { User } from '../model';
+import type { Appearance } from './Appearance';
+
+export interface PresentUser extends User {
+
+  presenceKey: string;
+
+  appearance: Appearance
+
+}

package/src/presence/index.ts

@@ -0,0 +1,6 @@
+export * from './Appearance';
+export * from './AppearanceProvider';
+export * from './PresenceEvents';
+export * from './PresenceProvider';
+export * from './PresenceState';
+export * from './PresentUser';

package/src/state/Hover.ts

@@ -0,0 +1,34 @@
+import { writable } from 'svelte/store';
+import type { Annotation } from '../model';
+import type { Store } from './Store';
+
+export type HoverState<T extends Annotation> = ReturnType<typeof createHoverState<T>>;
+
+export const createHoverState = <T extends Annotation>(store: Store<T>) => {
+
+  const { subscribe, set } = writable<string>(null);
+
+  let currentHover: string = null;
+
+  subscribe(updated => currentHover = updated);
+
+  // Track store delete and update events
+  store.observe(( { changes }) => {    
+    if (currentHover) {
+      const isDeleted = changes.deleted.some(a => a.id === currentHover);
+      if (isDeleted)
+        set(null);
+    
+      const updated = changes.updated.find(({ oldValue }) => oldValue.id === currentHover);
+      if (updated)
+        set(updated.newValue.id);
+    }
+  });
+
+  return { 
+    get current() { return currentHover },
+    subscribe, 
+    set 
+  };
+
+}

package/src/state/Selection.ts

@@ -0,0 +1,113 @@
+import { writable } from 'svelte/store';
+import type {  Annotation } from '../model';
+import type { Store } from './Store';
+   
+export type Selection = {
+
+  selected: { id: string, editable?: boolean }[],
+
+  pointerEvent?: PointerEvent;
+
+}
+
+export type SelectionState<T extends Annotation> = ReturnType<typeof createSelectionState<T>>;
+
+export enum PointerSelectAction {
+
+  EDIT = 'EDIT', // Make annotation target(s) editable on pointer select
+  
+  HIGHLIGHT = 'HIGHLIGHT',  // Just hightlight on select, but don't make editable
+
+  NONE = 'NONE' // Click won't select - annotation is completely inert
+
+}
+
+const EMPTY: Selection = { selected: [] };
+
+export const createSelectionState = <T extends Annotation>(
+  store: Store<T>,
+  selectAction: PointerSelectAction | ((a: Annotation) => PointerSelectAction)
+) => {
+  const { subscribe, set } = writable<Selection>(EMPTY);
+
+  let currentSelection: Selection = EMPTY;
+
+  subscribe(updated => currentSelection = updated);
+
+  const clear = () => set(EMPTY);
+
+  const isEmpty = () => currentSelection.selected?.length === 0;
+
+  const isSelected = (annotationOrId: T | string) => {
+    if (currentSelection.selected.length === 0)
+      return false;
+
+    const id = typeof annotationOrId === 'string' ? annotationOrId : annotationOrId.id;
+    return currentSelection.selected.some(i => i.id === id);
+  }
+
+  // TODO enable CTRL select
+  const clickSelect = (id: string, pointerEvent: PointerEvent) => {
+    const annotation = store.getAnnotation(id);
+    if (annotation) {
+      const action = onPointerSelect(annotation, selectAction);
+      if (action === PointerSelectAction.EDIT)
+        set({ selected: [{ id, editable: true }], pointerEvent }); 
+      else if (action === PointerSelectAction.HIGHLIGHT)
+        set({ selected: [{ id }], pointerEvent }); 
+      else
+        set({ selected: [], pointerEvent });
+    } else {
+      console.warn('Invalid selection: ' + id);
+    }
+  }
+
+  const setSelected = (idOrIds: string | string[], editable: boolean = true) => {
+    const ids = Array.isArray(idOrIds) ? idOrIds : [idOrIds];
+
+    // Remove invalid
+    const annotations = 
+      ids.map(id => store.getAnnotation(id)).filter(a => a); 
+
+    set({ selected: annotations.map(({ id }) => ({ id, editable })) });
+    
+    if (annotations.length !== ids.length)
+      console.warn('Invalid selection', idOrIds);
+  }
+
+  const removeFromSelection = (ids: string[]) => {
+    if (currentSelection.selected.length === 0)
+      return false;
+
+    const { selected } = currentSelection;
+
+    // Checks which of the given annotations are actually in the selection
+    const toRemove = selected.filter(({ id  }) => ids.includes(id))
+
+    if (toRemove.length > 0)
+      set({ selected: selected.filter(({ id }) => !ids.includes(id)) });
+  }
+
+  // Track store delete and update events
+  store.observe(({ changes }) =>
+    removeFromSelection(changes.deleted.map(a => a.id)));
+
+  return { 
+    clear, 
+    clickSelect, 
+    get selected() { return currentSelection ? [...currentSelection.selected ] : null},
+    get pointerEvent() { return currentSelection ? currentSelection.pointerEvent : null },
+    isEmpty, 
+    isSelected, 
+    setSelected, 
+    subscribe 
+  };
+
+}
+
+export const onPointerSelect = (
+  annotation: Annotation, 
+  action?: PointerSelectAction | ((a: Annotation) => PointerSelectAction)
+): PointerSelectAction => (typeof action === 'function') ?
+    (action(annotation) || PointerSelectAction.EDIT) : 
+    (action || PointerSelectAction.EDIT);

package/src/state/Store.ts

@@ -0,0 +1,297 @@
+import type { Annotation, AnnotationBody, AnnotationTarget } from '../model';
+import { diffAnnotations } from '../utils';
+import { Origin, shouldNotify, type Update, type ChangeSet } from './StoreObserver';
+import type { StoreObserver, StoreChangeEvent, StoreObserveOptions } from './StoreObserver';
+
+// Shorthand
+type AnnotationBodyIdentifier = { id: string, annotation: string }; 
+
+export type Store<T extends Annotation> = ReturnType<typeof createStore<T>>;
+
+export const createStore = <T extends Annotation>() => {
+
+  const annotationIndex = new Map<string, T>();
+
+  const bodyIndex = new Map<string, string>();
+
+  const observers: StoreObserver<T>[] = [];
+
+  const observe = (onChange: { (event: StoreChangeEvent<T>): void }, options: StoreObserveOptions = {}) =>
+    observers.push({ onChange, options });
+
+  const unobserve = (onChange: { (event: StoreChangeEvent<T>): void }) => {
+    const idx = observers.findIndex(observer => observer.onChange == onChange);
+    if (idx > -1)
+      observers.splice(idx, 1);
+  }
+
+  const emit = (origin: Origin, changes: ChangeSet<T>) => {
+    const event: StoreChangeEvent<T> = {
+      origin,
+      changes: {
+        created: changes.created || [],
+        updated: changes.updated || [],
+        deleted: changes.deleted || []
+      },
+      state: [...annotationIndex.values()]
+    };
+
+    observers.forEach(observer => {
+      if (shouldNotify(observer, event))
+        observer.onChange(event);
+    });
+  }
+
+  const addAnnotation = (annotation: T, origin = Origin.LOCAL) => {
+    const existing = annotationIndex.get(annotation.id);
+
+    if (existing) {
+      throw Error(`Cannot add annotation ${annotation.id} - exists already`);
+    } else {
+      annotationIndex.set(annotation.id, annotation);
+
+      annotation.bodies.forEach(b => bodyIndex.set(b.id, annotation.id));
+      emit(origin, { created: [annotation] });
+    }
+  }
+
+  const updateAnnotation = (annotation: T, origin = Origin.LOCAL) => {
+    const oldValue = annotationIndex.get(annotation.id);
+
+    if (oldValue) {
+      const update: Update<T> = diffAnnotations(oldValue, annotation);
+
+      annotationIndex.set(annotation.id, annotation);
+
+      emit(origin, { updated: [update] })
+    } else {
+      throw Error(`Cannot update annotation ${annotation.id} - does not exist`);
+    }
+  }
+
+  const addBody = (body: AnnotationBody, origin = Origin.LOCAL) => {
+    const oldValue = annotationIndex.get(body.annotation);
+    if (oldValue) {
+      const newValue = { 
+        ...oldValue,
+        bodies: [ ...oldValue.bodies, body ]
+      };
+
+      annotationIndex.set(oldValue.id, newValue);
+
+      bodyIndex.set(body.id, newValue.id);
+
+      const update: Update<T> = {
+        oldValue, newValue, bodiesCreated: [ body ]
+      };
+
+      emit(origin, { updated: [update] });
+    } else {
+      console.warn(`Attempt to add body to missing annotation: ${body.annotation}`);
+    }
+  }
+
+  const all = () => [...annotationIndex.values()];
+
+  const bulkAddAnnotation = (annotations: T[], replace = true, origin = Origin.LOCAL) => {
+    if (replace) {
+      // Delete existing first
+      const deleted = [...annotationIndex.values()];
+      annotationIndex.clear();
+      bodyIndex.clear();
+
+      annotations.forEach(annotation => {
+        annotationIndex.set(annotation.id, annotation);
+        annotation.bodies.forEach(b => bodyIndex.set(b.id, annotation.id));
+      });
+
+      emit(origin, { created: annotations, deleted });
+    } else {
+      // Don't allow overwriting of existing annotations
+      const existing = annotations.reduce((all, next) => {
+        const existing = annotationIndex.get(next.id);
+        return existing ? [...all, existing ] : all;
+      }, []);
+
+      if (existing.length > 0)
+        throw Error(`Bulk insert would overwrite the following annotations: ${existing.map(a => a.id).join(', ')}`);
+
+      annotations.forEach(annotation => {
+        annotationIndex.set(annotation.id, annotation);
+        annotation.bodies.forEach(b => bodyIndex.set(b.id, annotation.id));
+      });
+
+      emit(origin, { created: annotations });
+    }
+  }
+
+  const deleteOneAnnotation = (annotationOrId: T | string) => {
+    const id = typeof annotationOrId === 'string' ? annotationOrId : annotationOrId.id;
+
+    const existing = annotationIndex.get(id);
+    if (existing) {
+      annotationIndex.delete(id);
+      existing.bodies.forEach(b => bodyIndex.delete(b.id));
+      return existing;
+    } else {
+      console.warn(`Attempt to delete missing annotation: ${id}`);
+    }
+  }
+
+  const deleteAnnotation = (annotationOrId: T | string, origin = Origin.LOCAL) => {
+    const deleted = deleteOneAnnotation(annotationOrId);
+    if (deleted)
+      emit(origin, { deleted: [ deleted  ]});
+  }
+
+  const bulkDeleteAnnotation = (annotationsOrIds: (T | string)[], origin = Origin.LOCAL) => {
+    const deleted = annotationsOrIds.reduce((deleted, arg) => {
+      const existing = deleteOneAnnotation(arg);
+      return existing ? [...deleted, existing] : deleted;
+    }, [] as T[]);
+
+    if (deleted.length > 0)
+      emit(origin, { deleted });
+  }
+ 
+  const deleteBody = (body: AnnotationBodyIdentifier, origin = Origin.LOCAL) => {
+    const oldAnnotation = annotationIndex.get(body.annotation);
+
+    if (oldAnnotation) {
+      const oldBody = oldAnnotation.bodies.find(b => b.id === body.id);
+
+      if (oldBody) {
+        bodyIndex.delete(oldBody.id);
+
+        const newAnnotation = {
+          ...oldAnnotation,
+          bodies: oldAnnotation.bodies.filter(b => b.id !== body.id)
+        };
+
+        annotationIndex.set(oldAnnotation.id, newAnnotation);
+
+        const update: Update<T> = {
+          oldValue: oldAnnotation, newValue: newAnnotation, bodiesDeleted: [oldBody]
+        };
+
+        emit(origin, { updated: [update] });
+      } else {
+        console.warn(`Attempt to delete missing body ${body.id} from annotation ${body.annotation}`);
+      }
+    } else {
+      console.warn(`Attempt to delete body from missing annotation ${body.annotation}`);
+    }
+  }
+
+  const getAnnotation = (id: string): T | undefined => {
+    const a = annotationIndex.get(id);
+    return a ? {...a} : undefined;
+  }
+
+  const getBody = (id: string): AnnotationBody | undefined => {
+    const annotationId = bodyIndex.get(id);
+    if (annotationId) {
+      const annotation = getAnnotation(annotationId);
+      const body = annotation.bodies.find(b => b.id === id);
+      if (body) {
+        return body;
+      } else {
+        console.error(`Store integrity error: body ${id} in index, but not in annotation`);
+      }
+    } else {
+      console.warn(`Attempt to retrieve missing body: ${id}`);
+    }
+  }
+
+  const updateOneBody = (oldBodyId: AnnotationBodyIdentifier, newBody: AnnotationBody) => {
+    if (oldBodyId.annotation !== newBody.annotation)
+      throw 'Annotation integrity violation: annotation ID must be the same when updating bodies';
+
+    const oldAnnotation = annotationIndex.get(oldBodyId.annotation);
+    if (oldAnnotation) {
+      const oldBody = oldAnnotation.bodies.find(b => b.id === oldBodyId.id);
+
+      const newAnnotation = { 
+        ...oldAnnotation,
+        bodies: oldAnnotation.bodies.map(b => b.id === oldBody.id ? newBody : b)
+      };
+
+      annotationIndex.set(oldAnnotation.id, newAnnotation);
+
+      return {
+        oldValue: oldAnnotation, 
+        newValue: newAnnotation,
+        bodiesUpdated: [{ oldBody, newBody }]
+      }
+    } else {
+      console.warn(`Attempt to add body to missing annotation ${oldBodyId.annotation}`);
+    }
+  }
+
+  const updateBody = (oldBodyId: AnnotationBodyIdentifier, newBody: AnnotationBody, origin = Origin.LOCAL) => {
+    const update = updateOneBody(oldBodyId, newBody);
+    emit(origin, { updated: [ update ]} );
+  }
+
+  const bulkUpdateBodies = (bodies: AnnotationBody[], origin = Origin.LOCAL) => {
+    const updated = bodies.map(b => updateOneBody({ id: b.id, annotation: b.annotation }, b));
+    emit(origin, { updated });
+  }
+
+  const updateOneTarget = (target: AnnotationTarget): Update<T> => {
+    const oldValue = annotationIndex.get(target.annotation);
+    
+    if (oldValue) {
+      const newValue = { 
+        ...oldValue, 
+        target: {
+          ...oldValue.target,
+          ...target 
+        }
+      };
+
+      annotationIndex.set(oldValue.id, newValue);
+
+      return {
+        oldValue, newValue, targetUpdated: { 
+          oldTarget: oldValue.target,
+          newTarget: target
+        }
+      };
+    } else {
+      console.warn(`Attempt to update target on missing annotation: ${target.annotation}`);
+    }
+  }
+
+  const updateTarget = (target: AnnotationTarget, origin = Origin.LOCAL) => {
+    const update = updateOneTarget(target);
+    if (update)
+      emit(origin, { updated: [ update ]} );
+  }
+
+  const bulkUpdateTargets = (targets: AnnotationTarget[], origin = Origin.LOCAL) => {
+    const updated = targets.map(updateOneTarget).filter(val => val);
+    if (updated.length > 0)
+      emit(origin, { updated });
+  }
+
+	return {
+    addAnnotation,
+    addBody,
+    all,
+    bulkAddAnnotation,
+    bulkDeleteAnnotation,
+    bulkUpdateBodies,
+    bulkUpdateTargets,
+    deleteAnnotation,
+    deleteBody,
+    getAnnotation,
+    getBody,
+    observe,
+    unobserve,
+    updateAnnotation,
+    updateBody,
+    updateTarget
+	};
+
+}