"use strict"; var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })(); var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; desc = parent = undefined; continue _function; } } else if ("value" in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } }; function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } 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) : subClass.__proto__ = superClass; } var CorrectionClip = (function (_React$Component) { _inherits(CorrectionClip, _React$Component); function CorrectionClip(props) { _classCallCheck(this, CorrectionClip); _get(Object.getPrototypeOf(CorrectionClip.prototype), "constructor", this).call(this, props); this.state = { playing: false, finished: false }; } _createClass(CorrectionClip, [{ key: "componentDidMount", value: function componentDidMount() { var startTime = Math.max(0, this.props.seconds - 15); var endTime = startTime + 20; this.setState({ startTime: startTime, endTime: endTime }); } }, { key: "playpause", value: function playpause() { var state = this.state.playing; if (state) { this.player.pause(); $(this.overlay).fadeIn(); } else { this.player.play(); $(this.overlay).fadeOut(); CAMBLY.logUIEvent('correctionsExpVideoClick'); } this.setState({ playing: !state, finished: false }); } }, { key: "timeUpdated", value: function timeUpdated() { // check if we need to show the replay/done buttons if (this.player.currentTime >= this.state.endTime) { this.player.pause(); this.player.currentTime = this.state.startTime; this.setState({ playing: false, finished: true }); $(this.overlay).fadeIn(); } } }, { key: "render", value: function render() { var _this = this; var _props = this.props; var review = _props.review; var videoUrl = _props.videoUrl; return React.createElement("div", { className: "correctionClip" }, React.createElement("video", { id: "player", ref: function ref(player) { return _this.player = player; }, onTimeUpdate: this.timeUpdated.bind(this), onClick: this.playpause.bind(this), src: videoUrl + ("#t=" + this.state.startTime + "," + this.state.endTime) }, React.createElement("source", { type: "video/mp4" })), React.createElement("div", { className: "overlay", ref: function ref(overlay) { return _this.overlay = overlay; } }, !this.state.finished ? React.createElement("img", { key: "play", src: "/static/images/icons/play2x.png", onClick: this.playpause.bind(this) }) : [React.createElement("div", { className: "icon", key: "repeat", onClick: this.playpause.bind(this) }, React.createElement("i", { className: "fa fa-repeat" }), React.createElement("br", null), "replay"), React.createElement("div", { className: "icon", key: "done", onClick: function onClick() { return review(); } }, React.createElement("i", { className: "fa fa-check" }), React.createElement("br", null), "done")])); } }]); return CorrectionClip; })(React.Component);