uxcore-album/build/Photo.js

uxcore-album component for uxcore.

'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);

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

function _defaults(obj, defaults) { var keys = Object.getOwnPropertyNames(defaults); for (var i = 0; i < keys.length; i++) { var key = keys[i]; var value = Object.getOwnPropertyDescriptor(defaults, key); if (value && value.configurable && obj[key] === undefined) { Object.defineProperty(obj, key, value); } } return obj; }

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }

function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : _defaults(subClass, superClass); } /* eslint-disable class-methods-use-this */
/**
 * Album Component for uxcore
 * @author vincent.bian
 *
 * Copyright 2015-2016, Uxcore Team, Alinw.
 * All rights reserved.
 */


var Photo = function (_React$Component) {
  _inherits(Photo, _React$Component);

  function Photo(props) {
    _classCallCheck(this, Photo);

    var _this = _possibleConstructorReturn(this, _React$Component.call(this, props));

    var rotate = props.rotate,
        scale = props.scale;

    _this.state = { rotate: rotate || 0, scale: scale || 1 };
    return _this;
  }

  Photo.prototype.setStyle = function setStyle(rotate, scale) {
    this.setState({ rotate: rotate || 0, scale: scale || 1 });
  };

  Photo.prototype.getStyle = function getStyle() {
    var _state = this.state,
        rotate = _state.rotate,
        scale = _state.scale;

    var style = {};
    ['Webkit', 'Moz', 'ms', ''].forEach(function (prefix) {
      style[prefix + 'Transform'] = 'scale(' + scale + ') rotate(' + rotate + 'deg)';
    });
    return style;
  };

  Photo.prototype.handleMaskClick = function handleMaskClick(e) {
    var target = e.target;
    var _props = this.props,
        onMaskClick = _props.onMaskClick,
        maskClosable = _props.maskClosable;

    if (maskClosable === undefined) {
      maskClosable = true;
    }
    if (maskClosable === true && target.className === 'album-item') {
      if (typeof onMaskClick === 'function') {
        onMaskClick(e);
      }
    }
  };

  Photo.prototype.render = function render() {
    var _this2 = this;

    return _react2["default"].createElement(
      'div',
      {
        className: 'album-item',
        onClick: this.handleMaskClick.bind(this)
      },
      _react2["default"].createElement('img', { src: this.props.src, alt: '', ref: function ref(img) {
          return _this2.img = img;
        }, style: this.getStyle() })
    );
  };

  return Photo;
}(_react2["default"].Component);

exports["default"] = Photo;


Photo.defaultProps = {
  src: ''
};

// http://facebook.github.io/react/docs/reusable-components.html
Photo.propTypes = {
  src: _propTypes2["default"].string
};

Photo.displayName = 'Photo';
module.exports = exports['default'];