'use strict';

Object.defineProperty(exports, "__esModule", {
  value: true
});

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _propTypes = require('prop-types');

var _propTypes2 = _interopRequireDefault(_propTypes);

var _openseadragon = require('openseadragon');

var _openseadragon2 = _interopRequireDefault(_openseadragon);

var _blank = require('../../../images/blank.svg');

var _blank2 = _interopRequireDefault(_blank);

var _imageFullscreen = require('../../../images/imageFullscreen.svg');

var _imageFullscreen2 = _interopRequireDefault(_imageFullscreen);

var _imageFullscreenActive = require('../../../images/imageFullscreenActive.svg');

var _imageFullscreenActive2 = _interopRequireDefault(_imageFullscreenActive);

var _imageHome = require('../../../images/imageHome.svg');

var _imageHome2 = _interopRequireDefault(_imageHome);

var _imageHomeActive = require('../../../images/imageHomeActive.svg');

var _imageHomeActive2 = _interopRequireDefault(_imageHomeActive);

var _imageZoomIn = require('../../../images/imageZoomIn.svg');

var _imageZoomIn2 = _interopRequireDefault(_imageZoomIn);

var _imageZoomInActive = require('../../../images/imageZoomInActive.svg');

var _imageZoomInActive2 = _interopRequireDefault(_imageZoomInActive);

var _imageZoomOut = require('../../../images/imageZoomOut.svg');

var _imageZoomOut2 = _interopRequireDefault(_imageZoomOut);

var _imageZoomOutActive = require('../../../images/imageZoomOutActive.svg');

var _imageZoomOutActive2 = _interopRequireDefault(_imageZoomOutActive);

var _ImageViewer = require('../../../styles/cspace-ui/ImageViewer.css');

var _ImageViewer2 = _interopRequireDefault(_ImageViewer);

var _ImageViewerSaveLink = require('../../../styles/cspace-ui/ImageViewerSaveLink.css');

var _ImageViewerSaveLink2 = _interopRequireDefault(_ImageViewerSaveLink);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

/* global document */

const propTypes = {
  blobUrl: _propTypes2.default.string.isRequired,
  filename: _propTypes2.default.string
};

const defaultProps = {
  filename: ''
};

class ImageViewer extends _react.Component {
  constructor() {
    super();

    this.handleContainerRef = this.handleContainerRef.bind(this);
  }

  componentDidMount() {
    var _props = this.props;
    const blobUrl = _props.blobUrl,
          filename = _props.filename;


    const viewer = (0, _openseadragon2.default)({
      element: this.containerElement,
      navImages: {
        zoomIn: {
          REST: _imageZoomIn2.default,
          GROUP: _blank2.default,
          HOVER: _imageZoomInActive2.default,
          DOWN: _imageZoomInActive2.default
        },
        zoomOut: {
          REST: _imageZoomOut2.default,
          GROUP: _blank2.default,
          HOVER: _imageZoomOutActive2.default,
          DOWN: _imageZoomOutActive2.default
        },
        home: {
          REST: _imageHome2.default,
          GROUP: _blank2.default,
          HOVER: _imageHomeActive2.default,
          DOWN: _imageHomeActive2.default
        },
        fullpage: {
          REST: _imageFullscreen2.default,
          GROUP: _blank2.default,
          HOVER: _imageFullscreenActive2.default,
          DOWN: _imageFullscreenActive2.default
        }
      },
      prefixUrl: '',
      showNavigator: true,
      tileSources: {
        type: 'image',
        url: blobUrl
      }
    });

    const saveLink = document.createElement('a');
    saveLink.className = _ImageViewerSaveLink2.default.common;
    saveLink.href = blobUrl;
    saveLink.download = filename;
    saveLink.title = 'Save';

    viewer.buttons.element.appendChild(saveLink);

    this.viewer = viewer;
  }

  componentWillUnmount() {
    if (this.viewer) {
      this.viewer.destroy();
    }

    this.viewer = null;
  }

  handleContainerRef(ref) {
    this.containerElement = ref;
  }

  render() {
    return _react2.default.createElement(
      'div',
      { className: _ImageViewer2.default.common },
      _react2.default.createElement('div', { ref: this.handleContainerRef })
    );
  }
}

exports.default = ImageViewer;
ImageViewer.propTypes = propTypes;
ImageViewer.defaultProps = defaultProps;