Skip to content
Snippets Groups Projects
Select Git revision
  • 3202b019c84ab1285f4abda904d29f248bde43e2
  • mui5-annotation-on-video-stable default
  • get_setter_canvasSizeInformations
  • fix-error-div-into-p
  • annotation-on-video-v2
  • detached
  • annotation-on-video-r17
  • mui5
  • mui5-react-18
  • jacob-test
  • annotation-on-video protected
  • master
  • test-antoinev1
  • 20-fetch-thumbnail-on-annotation
  • add-research-field
  • Save
  • add-plugin
  • 14-wip-no-seek-to
  • 14-bug-on-video-time-control
  • 9_wip_videotests
  • _upgrade_material_ui
  • latest-tetras-16
  • v3.3.0
  • v3.2.0
  • v3.1.1
  • v3.1.0
  • v3.0.0
  • v3.0.0-rc.7
  • v3.0.0-rc.6
  • v3.0.0-rc.5
  • v3.0.0-rc.4
  • v3.0.0-rc.3
  • v3.0.0-rc.2
  • v3.0.0-rc.1
  • v3.0.0-beta.10
  • v3.0.0-beta.9
  • v3.0.0-beta.8
  • v3.0.0-beta.7
  • v3.0.0-beta.6
  • v3.0.0-beta.5
  • v3.0.0-beta.3
41 results

WindowTopMenuButton.test.js

Blame
  • ViewerNavigation.js 2.11 KiB
    import React, { Component } from 'react';
    import IconButton from '@material-ui/core/IconButton';
    import NavigationIcon from '@material-ui/icons/PlayCircleOutlineSharp';
    import PropTypes from 'prop-types';
    import ns from '../config/css-ns';
    
    /**
     */
    export class ViewerNavigation extends Component {
      /**
       */
      constructor(props) {
        super(props);
    
        this.nextCanvas = this.nextCanvas.bind(this);
        this.previousCanvas = this.previousCanvas.bind(this);
      }
    
      /**
       */
      nextCanvas() {
        const { window, setCanvas } = this.props;
        if (this.hasNextCanvas()) {
          setCanvas(window.id, window.canvasIndex + this.canvasIncrementor());
        }
      }
    
      /**
       */
      hasNextCanvas() {
        const { window, canvases } = this.props;
        return window.canvasIndex < canvases.length - this.canvasIncrementor();
      }
    
      /**
       */
      previousCanvas() {
        const { window, setCanvas } = this.props;
        if (this.hasPreviousCanvas()) {
          setCanvas(window.id, Math.max(0, window.canvasIndex - this.canvasIncrementor()));
        }
      }
    
      /**
       */
      hasPreviousCanvas() {
        const { window } = this.props;
        return window.canvasIndex > 0;
      }
    
      /**
       */
      canvasIncrementor() {
        const { window } = this.props;
        switch (window.view) {
          case 'book':
            return 2;
          default:
            return 1;
        }
      }
    
      /**
       * Renders things
       */
      render() {
        return (
          <div className={ns('osd-navigation')}>
            <IconButton
              className={ns('previous-canvas-button')}
              disabled={!this.hasPreviousCanvas()}
              onClick={this.previousCanvas}
            >
              <NavigationIcon style={{ transform: 'rotate(180deg)' }} />
            </IconButton>
            <IconButton
              className={ns('next-canvas-button')}
              disabled={!this.hasNextCanvas()}
              onClick={this.nextCanvas}
            >
              <NavigationIcon />
            </IconButton>
          </div>
        );
      }
    }
    
    ViewerNavigation.propTypes = {
      canvases: PropTypes.array.isRequired, // eslint-disable-line react/forbid-prop-types
      setCanvas: PropTypes.func.isRequired,
      window: PropTypes.object.isRequired, // eslint-disable-line react/forbid-prop-types
    };