@clickview/player 0.0.8-dev.5 → 0.0.8-dev.7

package/dist/projects/player/src/components/mouse-time-display/mouse-time-display.d.ts

@@ -1,3 +1,16 @@
+import videojs, { VideoJsPlayer } from 'video.js';
 import 'projects/player/components/time-tooltip/time-tooltip';
 import 'projects/player/components/thumbnail-display/thumbnail-display';
 import './mouse-time-display.scss';
+declare const BaseMouseTimeDisplay: {
+    new (player: VideoJsPlayer, options?: videojs.ComponentOptions): videojs.MouseTimeDisplay;
+    prototype: videojs.MouseTimeDisplay;
+};
+export declare class MouseTimeDisplay extends BaseMouseTimeDisplay {
+    private el_;
+    constructor(player: VideoJsPlayer, options: videojs.ComponentOptions);
+    update(seekBarRect: ClientRect, seekBarPoint: number): void;
+    forceShow(): void;
+    removeForceShow(): void;
+}
+export {};

package/dist/projects/player/src/players/interactive-player.d.ts

@@ -1,7 +1,9 @@
 import { HtmlPortalNode } from 'react-reverse-portal';
 import { HashObject } from 'libs/analytics/interfaces';
 import { CurrentUser } from 'libs/shared/interfaces';
+import { ShareActivityStatus } from 'libs/shared/enums/ShareActivityStatus';
 import 'projects/player/plugins/favourite-plugin/favourite-plugin';
+import 'projects/player/plugins/activity-status-plugin/activity-status-plugin';
 import 'projects/player/plugins/interactive-plugin/interactive-plugin';
 import { InteractiveMode } from 'projects/player/plugins/interactive-plugin/interfaces';
 import { PlaybackObject } from 'projects/player/interfaces/models/PlaybackObject';
@@ -17,6 +19,7 @@ export interface InteractivePlayerOptions extends BasePlayerOptions {
     currentUser?: CurrentUser;
     questionListPortalNode?: HtmlPortalNode;
     summaryPortalNode?: HtmlPortalNode;
+    onShowSummary?: (showing: boolean) => void;
 }
 export declare class InteractivePlayer extends BasePlayer {
     protected options: InteractivePlayerOptions;
@@ -33,4 +36,5 @@ export declare class InteractivePlayer extends BasePlayer {
     protected getSeekBarOptions(): any;
     protected getAnalyticsPlayerType(): AnalyticsPlayerType;
     setFavourite(isFavourited: boolean, onClickFavourite: () => void): void;
+    setActivityStatus(status: ShareActivityStatus, onToggle: () => void): void;
 }

package/dist/projects/player/src/players/player.d.ts

@@ -1,5 +1,6 @@
 import { BasePlayer, BasePlayerOptions } from './base-player';
 import { PointOfInterest } from 'libs/shared/interfaces';
+import { ShareActivityStatus } from 'libs/shared/enums/ShareActivityStatus';
 import 'projects/player/plugins/clip-plugin/clip-plugin';
 import 'projects/player/plugins/next-video-plugin/next-video-plugin';
 import 'projects/player/plugins/create-clip-button-plugin/create-clip-button-plugin';
@@ -7,6 +8,7 @@ import 'projects/player/plugins/resources-plugin/resources-plugin';
 import 'projects/player/plugins/picture-in-picture-plugin/picture-in-picture-plugin';
 import 'projects/player/plugins/favourite-plugin/favourite-plugin';
 import 'projects/player/plugins/points-of-interest-plugin/points-of-interest-plugin';
+import 'projects/player/plugins/activity-status-plugin/activity-status-plugin';
 import { PlaybackObject } from 'projects/player/interfaces/models/PlaybackObject';
 import { NextVideo } from 'projects/player/interfaces/NextVideo';
 export interface PlayerOptions extends BasePlayerOptions {
@@ -23,4 +25,5 @@ export declare class Player extends BasePlayer {
     togglePictureInPicture(isInPictureInPicture: boolean): void;
     protected additionalSetup(playbackObject: PlaybackObject): Promise<void>;
     setFavourite(isFavourited: boolean, onClickFavourite: () => void): void;
+    setActivityStatus(status: ShareActivityStatus, onToggle: () => void): void;
 }

package/dist/projects/player/src/plugins/activity-status-plugin/activity-status-plugin.d.ts

@@ -0,0 +1,32 @@
+import videojs from 'video.js';
+import { ShareActivityStatus } from 'libs/shared/enums/ShareActivityStatus';
+declare const Plugin: {
+    new (player: VideoJsPlayer, options?: any): videojs.Plugin;
+    prototype: videojs.Plugin;
+    BASE_PLUGIN_NAME: string;
+    deregisterPlugin(name: string): void;
+    getPlugin(name: string): any;
+    getPluginVersion(name: string): string;
+    getPlugins(names?: string[]): {
+        [name: string]: videojs.Plugin;
+    };
+    isBasic(plugin: string | (() => any)): boolean;
+    registerPlugin<T, K>(name: string, plugin: (this: VideoJsPlayer, ...options: K[]) => T): (...options: K[]) => T;
+    registerPlugin<T_1 extends any>(name: string, plugin: T_1): () => T_1;
+};
+declare class ActivityStatusPlugin extends Plugin {
+    private activityStatus;
+    private onToggleStatus;
+    private button;
+    setActivityStatus(activityStatus: ShareActivityStatus, onToggleStatus: () => void): void;
+    private renderActivityStatusButton;
+}
+declare module 'video.js' {
+    interface VideoJsPlayer {
+        activityStatusPlugin(): ActivityStatusPlugin;
+        activePlugins_: {
+            activityStatusPlugin: boolean;
+        };
+    }
+}
+export {};

package/dist/projects/player/src/plugins/activity-status-plugin/components/activity-status-button.d.ts

@@ -0,0 +1,20 @@
+import videojs, { VideoJsPlayer } from 'video.js';
+import { ShareActivityStatus } from 'libs/shared/enums/ShareActivityStatus';
+declare const Button: {
+    new (player: VideoJsPlayer, options?: videojs.ComponentOptions): videojs.Button;
+    prototype: videojs.Button;
+};
+import './activity-status-button.scss';
+interface ActivityStatusButtonOptions extends videojs.ComponentOptions {
+    activityStatus: ShareActivityStatus;
+    clickHandler: () => void;
+}
+export declare class ActivityStatusButton extends Button {
+    options_: ActivityStatusButtonOptions;
+    controlText_: string;
+    constructor(player: VideoJsPlayer, options: ActivityStatusButtonOptions);
+    update(): void;
+    handleClick(...args: any[]): void;
+    buildCSSClass(): string;
+}
+export {};

package/dist/projects/player/src/plugins/interactive-plugin/components/interactive-summary/InteractiveSummaryWrapper.d.ts

@@ -1,18 +1,22 @@
 import React from 'react';
 import { VideoJsPlayer } from 'video.js';
 import { HtmlPortalNode } from 'react-reverse-portal';
-import { Interactive } from 'libs/shared/interfaces';
+import { CurrentUser, Interactive } from 'libs/shared/interfaces';
 import { InteractiveState } from 'projects/player/plugins/interactive-plugin/interfaces';
 import { ProgressEvent } from 'projects/player/plugins/progress-reporter-plugin/progress-reporter-plugin';
 import { ResultsService } from 'projects/player/plugins/interactive-plugin/utils/ResultsService';
 interface InteractiveSummaryWrapperProps {
+    title: string;
+    currentUser: CurrentUser;
     player: VideoJsPlayer;
     state: InteractiveState;
     progress?: ProgressEvent[];
     interactive: Interactive;
     portalNode: HtmlPortalNode;
     resultsService: ResultsService;
+    imageCdnUrl: string;
     goToTimepoint: (timepointId: string, interactionId: string) => void;
+    onShowSummary?: (showing: boolean) => void;
 }
 export declare function InteractiveSummaryWrapper(props: InteractiveSummaryWrapperProps): React.ReactElement;
 export {};

package/dist/projects/player/src/plugins/interactive-plugin/components/interactive-summary/getstudentAttempts.d.ts

@@ -0,0 +1,13 @@
+import { Interactive, StudentAttempt } from 'libs/shared/interfaces';
+import { InteractiveState } from 'projects/player/plugins/interactive-plugin/interfaces';
+interface GetStudentAttemptOptions {
+    interactive: Interactive;
+    state: InteractiveState;
+}
+export declare const getStudentAttempts: (options: GetStudentAttemptOptions) => {
+    correctCount: number;
+    total: number;
+    answered: number;
+    studentAttempts: StudentAttempt[];
+};
+export {};

package/dist/projects/player/src/plugins/interactive-plugin/components/interactive-summary/interaction-summary/interaction-summary.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+import { Interaction, Interactive, StudentResults, Timepoint } from 'libs/shared/interfaces';
+import { InteractiveState } from 'projects/player/plugins/interactive-plugin/interfaces';
+interface InteractionSummaryProps {
+    studentResults: StudentResults;
+    interaction: Interaction;
+    timepoint: Timepoint;
+    interactive: Interactive;
+    state: InteractiveState;
+    goToTimepoint: (timepointId: string, interactionId: string) => void;
+    interactionNumber: number;
+    imageCdnUrl: string;
+}
+export declare function InteractionSummary(props: InteractionSummaryProps): React.ReactElement;
+export {};

package/dist/projects/player/src/plugins/interactive-plugin/components/interactive-summary/interactive-summary.d.ts

@@ -1,13 +1,16 @@
 import React from 'react';
 import { HtmlPortalNode } from 'react-reverse-portal';
 import { VideoJsPlayer } from 'video.js';
-import { Interactive } from 'libs/shared/interfaces';
+import { ResultsService } from 'projects/player/plugins/interactive-plugin/utils/ResultsService';
+import { CurrentUser, Interactive } from 'libs/shared/interfaces';
 import { ProgressEvent } from 'projects/player/plugins/progress-reporter-plugin/progress-reporter-plugin';
 import { InteractiveState } from 'projects/player/plugins/interactive-plugin/interfaces';
-import { ResultsService } from 'projects/player/plugins/interactive-plugin/utils/ResultsService';
 interface InteractiveSummaryProps {
+    title: string;
     showSummary: boolean;
     setShowSummary: (show: boolean) => void;
+    imageCdnUrl: string;
+    currentUser: CurrentUser;
     player: VideoJsPlayer;
     state: InteractiveState;
     progress?: ProgressEvent[];

package/dist/projects/player/src/plugins/interactive-plugin/interactive-plugin.d.ts

@@ -23,6 +23,7 @@ declare const Plugin: {
     registerPlugin<T_1 extends any>(name: string, plugin: T_1): () => T_1;
 };
 interface InteractivePluginOptions {
+    title: string;
     currentUser?: CurrentUser;
     interactive: Interactive;
     mode?: InteractiveMode;
@@ -34,6 +35,7 @@ interface InteractivePluginOptions {
     latestSession?: LatestSession;
     clipOffset?: number;
     analyticsService: AnalyticsService;
+    onShowSummary?: (showing: boolean) => void;
 }
 declare class InteractivePlugin extends Plugin {
     private options;

package/dist/projects/player/src/plugins/interactive-plugin/utils/helpers.d.ts

@@ -1,2 +1,5 @@
+import { HashObject } from 'libs/common/react/interfaces';
+import { InteractionState } from '../interfaces';
 export declare const SLIDING_TIME = 400;
 export declare function isNewId(id: string): boolean;
+export declare function getFilteredState(state: InteractionState): HashObject;

package/dist/projects/player/src/plugins/points-of-interest-plugin/components/point-of-interest-indicator/point-of-interest-indicator.d.ts

@@ -54,6 +54,7 @@ interface PointOfInterestIndicatorOptions extends videojs.ComponentOptions {
 export declare class PointOfInterestIndicator extends Component {
     private el_;
     options_: PointOfInterestIndicatorOptions;
+    private eventsService;
     private pointOfInterest;
     private hasBuffered;
     private hasPlayed;
@@ -62,10 +63,12 @@ export declare class PointOfInterestIndicator extends Component {
     buildCSSClass(): string;
     createEl(tagName?: string, properties?: any, attributes?: any): Element;
     private bindListeners;
+    dispose(): void;
     private getPointOfInterestTime;
     private setPosition;
     updateBuffered(bufferEnd: number): void;
     updatePlaybackProgress(currentTime: number): void;
+    toggleVisibility(visible: boolean): void;
     /**
      * We want the POI description to be displayed in the TimeTooltip when the user
      * hovers over a POI.
@@ -76,8 +79,21 @@ export declare class PointOfInterestIndicator extends Component {
      */
     private onMouseOver;
     private onMouseLeave;
+    private onGlancePointOfInterestMouseEnter;
+    private onGlancePointOfInterestMouseLeave;
     private setTimeTooltipText;
     private clearTimeTooltipText;
+    /**
+     * We only need to call this when we're manually forcing the MouseTimeDisplay
+     * to show. If it's being triggered natively using pointer events then the time
+     * will be set automatically.
+     */
+    private setTimeTooltipTime;
+    private positionMouseTimeDisplay;
+    private showMouseTimeDisplay;
+    private hideMouseTimeDisplay;
+    private getSeekBar;
+    private getMouseTimeDisplay;
     private getTimeTooltip;
 }
 export {};

package/dist/projects/player/src/plugins/points-of-interest-plugin/components/points-of-interest-menu-item/points-of-interest-menu-item.d.ts

@@ -0,0 +1,31 @@
+import videojs, { VideoJsPlayer } from 'video.js';
+declare const MenuItem: {
+    new (player: VideoJsPlayer, options?: videojs.MenuItemOptions): videojs.MenuItem;
+    prototype: videojs.MenuItem;
+};
+interface PointsOfInterestMenuItemOptions extends videojs.MenuItemOptions {
+    pointsOfInterestVisible: boolean;
+}
+export declare class PointsOfInterestMenuItem extends MenuItem {
+    private toggleEl;
+    private pointsOfInterestVisible;
+    /**
+     * Because we want to bind our listener in createEl
+     * and createEl runs in super. We store if we've bounud
+     * our handler, so we only call bind once and
+     * the call to removeEventListener will still work
+     */
+    private handlerBound;
+    constructor(player: VideoJsPlayer, options: PointsOfInterestMenuItemOptions);
+    handleToggle(): void;
+    private toggle;
+    private toggleOn;
+    private toggleOff;
+    /**
+     * Because we extend MenuItem which will close the menu by default
+     * we need to halt the event propogation here
+     */
+    handleClick(event: videojs.EventTarget.Event): void;
+    createEl(tagName?: string, properties?: any, attributes?: any): HTMLLIElement;
+}
+export {};

package/dist/projects/player/src/plugins/points-of-interest-plugin/points-of-interest-plugin.d.ts

@@ -18,19 +18,21 @@ interface PointsOfInterestPluginOptions {
     pointsOfInterest: PointOfInterest[];
 }
 export declare class PointsOfInterestPlugin extends Plugin {
-    private pointsOfInterest;
     private pointOfInterestIndicators;
-    constructor(player: VideoJsPlayer, options: PointsOfInterestPluginOptions);
+    private pointsOfInterest?;
+    constructor(player: VideoJsPlayer, options?: PointsOfInterestPluginOptions);
     private initialize;
     private bindListeners;
+    togglePointsOfInterest(visible: boolean): void;
     private setupTrack;
     private createPointOfInterestIndicators;
+    private addMenuItem;
     private updateBuffered;
     private updatePlaybackProgress;
 }
 declare module 'video.js' {
     interface VideoJsPlayer {
-        pointsOfInterestPlugin(options: PointsOfInterestPluginOptions): void;
+        pointsOfInterestPlugin(options?: PointsOfInterestPluginOptions): PointsOfInterestPlugin;
     }
 }
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@clickview/player",
-  "version": "0.0.8-dev.5",
+  "version": "0.0.8-dev.7",
   "description": "ClickView Player",
   "main": "dist/player-app.js",
   "scripts": {
@@ -28,7 +28,7 @@
     "@babel/core": "7.11.6",
     "@clickview/eslint-config": "1.0.1",
     "@clickview/player-font": "0.0.12",
-    "@clickview/tooling": "0.0.26-dev.5",
+    "@clickview/tooling": "0.0.26-dev.7",
     "@storybook/react": "6.0.26",
     "@types/chromecast-caf-sender": "1.0.3",
     "@types/cropperjs": "1.3.0",
@@ -42,7 +42,7 @@
     "webpack-dev-server": "3.11.0"
   },
   "dependencies": {
-    "@clickview/styles": "1.0.19-dev.5",
+    "@clickview/styles": "1.0.19-dev.7",
     "@microsoft/signalr": "5.0.2",
     "cropperjs": "1.5.6",
     "draft-convert": "2.1.10",