react-timepicker
Advanced tools
Comparing version 2.0.1 to 2.0.2
{ | ||
"name": "react-timepicker", | ||
"version": "2.0.1", | ||
"version": "2.0.2", | ||
"license": "MIT", | ||
@@ -29,5 +29,4 @@ "author": "Radosław Miernik", | ||
"babel-cli": "6.26.0", | ||
"babel-plugin-transform-react-remove-prop-types": "0.4.9", | ||
"babel-preset-env": "1.6.0", | ||
"babel-preset-minify": "0.2.0", | ||
"babel-plugin-transform-react-remove-prop-types": "0.4.10", | ||
"babel-preset-env": "1.6.1", | ||
"babel-preset-react": "6.24.1" | ||
@@ -34,0 +33,0 @@ }, |
@@ -1,2 +0,2 @@ | ||
'use strict';var _createClass=function(){function a(a,b){for(var c,d=0;d<b.length;d++)c=b[d],c.enumerable=c.enumerable||!1,c.configurable=!0,'value'in c&&(c.writable=!0),Object.defineProperty(a,c.key,c)}return function(b,c,d){return c&&a(b.prototype,c),d&&a(b,d),b}}(),_propTypes=require('prop-types'),_propTypes2=_interopRequireDefault(_propTypes),_react=require('react'),_react2=_interopRequireDefault(_react);Object.defineProperty(exports,'__esModule',{value:!0}),exports.Clock=exports.Info=exports.Timepicker=void 0;function _interopRequireDefault(a){return a&&a.__esModule?a:{default:a}}function _classCallCheck(a,b){if(!(a instanceof b))throw new TypeError('Cannot call a class as a function')}function _possibleConstructorReturn(a,b){if(!a)throw new ReferenceError('this hasn\'t been initialised - super() hasn\'t been called');return b&&('object'==typeof b||'function'==typeof b)?b:a}function _inherits(a,b){if('function'!=typeof b&&null!==b)throw new TypeError('Super expression must either be null or a function, not '+typeof b);a.prototype=Object.create(b&&b.prototype,{constructor:{value:a,enumerable:!1,writable:!0,configurable:!0}}),b&&(Object.setPrototypeOf?Object.setPrototypeOf(a,b):a.__proto__=b)}var Timepicker=exports.Timepicker=function(a){function b(a){var c=a.hours,d=a.minutes,e=a.mode;_classCallCheck(this,b);var f=_possibleConstructorReturn(this,(b.__proto__||Object.getPrototypeOf(b)).apply(this,arguments));return f.state={hours:c,minutes:d,mode:e},f.onChange=f.onChange.bind(f),f.onChangeMode=f.onChangeMode.bind(f),f}return _inherits(b,a),_createClass(b,[{key:'componentWillReceiveProps',value:function componentWillReceiveProps(a){var b=a.hours,c=a.minutes,d=a.mode,e={},f=this.props;f.hours!==b&&(e.hours=b),f.minutes!==c&&(e.minutes=c),f.mode!==d&&(e.mode=d),this.setState(e)}},{key:'render',value:function render(){var a=this.state,c=a.hours,d=a.minutes,e=a.mode,f=this.props,g=f.formatNumber,h=f.militaryTime,i=f.radius,j=f.size;return _react2.default.createElement('div',{className:'timepicker'},_react2.default.createElement(b.Info,{formatNumber:g,hours:c,minutes:d,mode:e,onChangeMode:this.onChangeMode,size:j}),_react2.default.createElement(b.Clock,{hours:c,minutes:d,mode:e,size:j,formatNumber:g,onChangeMode:this.onChangeMode,militaryTime:h,radius:i,onChange:this.onChange}))}},{key:'onChange',value:function onChange(a,b){this.setState({hours:a,minutes:b}),this.props.onChange&&this.props.onChange(a,b)}},{key:'onChangeMode',value:function onChangeMode(a){this.setState({mode:a}),this.props.onChangeMode&&this.props.onChangeMode(a)}}]),b}(_react2.default.Component);Timepicker.HOURS=!0,Timepicker.MINUTES=!1,Timepicker.propTypes='production'===process.env.NODE_ENV?{}:{formatNumber:_propTypes2.default.func,hours:_propTypes2.default.number,militaryTime:_propTypes2.default.bool,minutes:_propTypes2.default.number,mode:_propTypes2.default.bool,onChange:_propTypes2.default.func,onChangeMode:_propTypes2.default.func,radius:_propTypes2.default.number,size:_propTypes2.default.number},Timepicker.defaultProps={formatNumber:function formatNumber(a){return 10>a?'0'+a:a},hours:0,militaryTime:!0,minutes:0,mode:Timepicker.HOURS,radius:125,size:300};var Info=exports.Info=function(a){function b(){_classCallCheck(this,b);var a=_possibleConstructorReturn(this,(b.__proto__||Object.getPrototypeOf(b)).apply(this,arguments));return a.onClickHours=a.onClickHours.bind(a),a.onClickMinutes=a.onClickMinutes.bind(a),a}return _inherits(b,a),_createClass(b,[{key:'render',value:function render(){var a=this.props,b=a.formatNumber,c=a.hours,d=a.minutes,e=a.mode,f=a.size;return _react2.default.createElement('p',{className:'timepicker-info',style:{width:f}},_react2.default.createElement('span',{className:'timepicker-info-digits'+(e===Timepicker.HOURS?' active':''),onClick:this.onClickHours},b(c,'info')),':',_react2.default.createElement('span',{className:'timepicker-info-digits'+(e===Timepicker.MINUTES?' active':''),onClick:this.onClickMinutes},b(d,'info')))}},{key:'onClickHours',value:function onClickHours(){this.props.onChangeMode&&this.props.onChangeMode(Timepicker.HOURS)}},{key:'onClickMinutes',value:function onClickMinutes(){this.props.onChangeMode&&this.props.onChangeMode(Timepicker.MINUTES)}}]),b}(_react2.default.Component);Info.propTypes='production'===process.env.NODE_ENV?{}:{formatNumber:_propTypes2.default.func.isRequired,hours:_propTypes2.default.number.isRequired,minutes:_propTypes2.default.number.isRequired,mode:_propTypes2.default.bool.isRequired,onChangeMode:_propTypes2.default.func,size:_propTypes2.default.number.isRequired},Timepicker.Info=Info;var Clock=exports.Clock=function(a){function b(a){var c=a.hours,d=a.militaryTime,e=a.minutes,f=a.mode;_classCallCheck(this,b);var g=_possibleConstructorReturn(this,(b.__proto__||Object.getPrototypeOf(b)).apply(this,arguments));return g.state={even:!0,hours:c%(d?24:12),minutes:e%60,mode:f,positionsHours:g.calculatePositionsHours(),positionsMinutes:g.calculatePositionsMinutes()},g.onHand1=g.onHand1.bind(g),g.onHand2=g.onHand2.bind(g),g}var c=Math.sin,d=Math.round,e=Math.cos,f=Math.PI;return _inherits(b,a),_createClass(b,[{key:'componentWillReceiveProps',value:function componentWillReceiveProps(a){var b=a.hours,c=a.militaryTime,d=a.minutes,e=a.mode,f=a.radius,g=a.size,h=this.props;g!==h.size||f!==h.radius?this.setState({positionsHours:this.calculatePositionsHours(),positionsMinutes:this.calculatePositionsMinutes()}):c!==h.militaryTime&&this.setState({positionsHours:this.calculatePositionsHours()}),e!==h.mode&&this.setState({mode:e}),b!==h.hours&&this.setState({hours:b%(c?24:12)}),d!==h.minutes&&this.setState({minutes:d%60})}},{key:'componentDidMount',value:function componentDidMount(){this.componentDidUpdate({})}},{key:'componentDidUpdate',value:function componentDidUpdate(a,b){var c=Math.ceil,d=Math.sqrt,e=this.props,f=e.militaryTime,g=e.mode,h=e.size,i=this.state,j=i.even,k=i.hours,l=i.minutes,m=i.positionsHours,n=i.positionsMinutes;if(a.mode!==g||b.hours!==k||b.minutes!==l){var o=j?this.hand1:this.hand2,p=j?this.hand2:this.hand1;o.setAttribute('x2',g?m[0===k?f?23:11:k-1][0]:n[l][0]),o.setAttribute('y2',g?m[0===k?f?23:11:k-1][1]:n[l][1]),a.mode!==g&&(p.setAttribute('x2',h/2),p.setAttribute('y2',h/2));var q=o.getAttribute('x1')-o.getAttribute('x2'),r=o.getAttribute('y1')-o.getAttribute('y2'),s=p.getAttribute('x1')-p.getAttribute('x2'),t=p.getAttribute('y1')-p.getAttribute('y2'),u=c(d(q*q+r*r)),v=c(d(s*s+t*t));o.style.strokeDasharray=u,p.style.strokeDasharray=v,o.style.strokeDashoffset=u,p.style.strokeDashoffset='0',o.style.transitionProperty='none',p.style.transitionProperty='none',o.getBoundingClientRect(),p.getBoundingClientRect(),o.style.transitionProperty='stroke-dashoffset',p.style.transitionProperty='stroke-dashoffset',o.style.strokeDashoffset='0',p.style.strokeDashoffset=v}}},{key:'render',value:function render(){var a=this.props.size,b=this.state.mode;return _react2.default.createElement('svg',{height:a,width:a},_react2.default.createElement('line',{ref:this.onHand1,className:'timepicker-hand',x1:a/2,y1:a/2,x2:a/2,y2:a/2}),_react2.default.createElement('line',{ref:this.onHand2,className:'timepicker-hand',x1:a/2,y1:a/2,x2:a/2,y2:a/2}),_react2.default.createElement('g',{className:'timepicker-'+(b?'visible':'invisible')},this.renderHoursBubbles()),_react2.default.createElement('g',{className:'timepicker-'+(b?'invisible':'visible')},this.renderMinutesBubbles()))}},{key:'renderHoursBubbles',value:function renderHoursBubbles(){for(var a=this.props.formatNumber,b=this.state,c=b.hours,d=b.positionsHours,e=[],f=0;f<d.length;++f){var g=d[f][0],h=d[f][1],i=(f+1)%24,j=this.onClickHour(i),k=this.onMouseMoveHour(i);e.push(_react2.default.createElement('g',{className:'timepicker-bubble'+(c===i?' active':''),key:f,onClick:j,onMouseMove:k,onMouseUp:k},_react2.default.createElement('circle',{cx:g,cy:h,r:15}),_react2.default.createElement('text',{x:g,y:h},a(i,'clock'))))}return bubbles}},{key:'renderMinutesBubbles',value:function renderMinutesBubbles(){for(var a=this.props.formatNumber,b=this.state,c=b.minutes,d=b.positionsMinutes,e=[],f=0;f<d.length;++f){var g=d[f][0],h=d[f][1],i=this.onClickMinute(f),j=this.onMouseMoveMinute(f);e.push(_react2.default.createElement('g',{className:'timepicker-bubble'+(f%5?' small':'')+(c===f?' active':''),key:f,onClick:i,onMouseMove:j},_react2.default.createElement('circle',{cx:g,cy:h,r:f%5?c===f?5:0:15}),f%5?_react2.default.createElement('circle',{cx:g,cy:h,r:10}):_react2.default.createElement('text',{x:g,y:h},a(f,'clock'))))}return bubbles}},{key:'onChange',value:function onChange(){this.props.onChange&&this.props.onChange(this.state.hours,this.state.minutes),this.props.onChangeMode&&this.props.onChangeMode(this.state.mode)}},{key:'onClickHour',value:function onClickHour(a){var b=this;return function(c,d){b.state.hours===a&&d||b.setState({even:!b.state.even,hours:a,mode:d?b.state.mode===Timepicker.HOURS?Timepicker.HOURS:Timepicker.MINUTES:b.state.mode===Timepicker.HOURS?Timepicker.MINUTES:Timepicker.HOURS},function(){return b.onChange()})}}},{key:'onClickMinute',value:function onClickMinute(a){var b=this;return function(){b.state.minutes===a||b.setState({minutes:a,even:!b.state.even},function(){return b.onChange()})}}},{key:'onHand1',value:function onHand1(a){this.hand1=a}},{key:'onHand2',value:function onHand2(a){this.hand2=a}},{key:'onMouseMoveHour',value:function onMouseMoveHour(a){var b=this.onClickHour(a);return function(a){var c='mouseup'===a.type;(c||1===a.buttons)&&b(a,!c)}}},{key:'onMouseMoveMinute',value:function onMouseMoveMinute(a){var b=this.onClickMinute(a);return function(a){1===a.buttons&&b()}}},{key:'calculatePositionsHours',value:function calculatePositionsHours(){for(var a=this.props,b=a.militaryTime,g=a.radius,h=a.size,i=[],j=1;j<=(b?24:12);++j)i.push([d(h/2+g*(b?12<j?1:0.65:1)*e((j%12/6-0.5)*f)),d(h/2+g*(b?12<j?1:0.65:1)*c((j%12/6-0.5)*f))]);return positions}},{key:'calculatePositionsMinutes',value:function calculatePositionsMinutes(){for(var a=this.props,b=a.radius,g=a.size,h=[],i=0;60>i;++i)h.push([d(g/2+b*e((i/30-0.5)*f)),d(g/2+b*c((i/30-0.5)*f))]);return positions}}]),b}(_react2.default.Component);Clock.propTypes='production'===process.env.NODE_ENV?{}:{formatNumber:_propTypes2.default.func.isRequired,hours:_propTypes2.default.number.isRequired,militaryTime:_propTypes2.default.bool.isRequired,minutes:_propTypes2.default.number.isRequired,mode:_propTypes2.default.bool.isRequired,onChange:_propTypes2.default.func,onChangeMode:_propTypes2.default.func,radius:_propTypes2.default.number.isRequired,size:_propTypes2.default.number.isRequired},Timepicker.Clock=Clock; | ||
'use strict';Object.defineProperty(exports,'__esModule',{value:true});exports.Clock=exports.Info=exports.Timepicker=undefined;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 _propTypes=require('prop-types');var _propTypes2=_interopRequireDefault(_propTypes);var _react=require('react');var _react2=_interopRequireDefault(_react);function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default: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):subClass.__proto__=superClass}var Timepicker=exports.Timepicker=function(_React$Component){_inherits(Timepicker,_React$Component);function Timepicker(_ref){var hours=_ref.hours,minutes=_ref.minutes,mode=_ref.mode;_classCallCheck(this,Timepicker);var _this=_possibleConstructorReturn(this,(Timepicker.__proto__||Object.getPrototypeOf(Timepicker)).apply(this,arguments));_this.state={hours:hours,minutes:minutes,mode:mode};_this.onChange=_this.onChange.bind(_this);_this.onChangeMode=_this.onChangeMode.bind(_this);return _this}_createClass(Timepicker,[{key:'componentWillReceiveProps',value:function componentWillReceiveProps(_ref2){var hours=_ref2.hours,minutes=_ref2.minutes,mode=_ref2.mode;var diff={};var props=this.props;if(props.hours!==hours)diff.hours=hours;if(props.minutes!==minutes)diff.minutes=minutes;if(props.mode!==mode)diff.mode=mode;this.setState(diff)}},{key:'render',value:function render(){var _state=this.state,hours=_state.hours,minutes=_state.minutes,mode=_state.mode;var _props=this.props,formatNumber=_props.formatNumber,militaryTime=_props.militaryTime,radius=_props.radius,size=_props.size;return _react2.default.createElement('div',{className:'timepicker'},_react2.default.createElement(Timepicker.Info,{formatNumber:formatNumber,hours:hours,minutes:minutes,mode:mode,onChangeMode:this.onChangeMode,size:size}),_react2.default.createElement(Timepicker.Clock,{hours:hours,minutes:minutes,mode:mode,size:size,formatNumber:formatNumber,onChangeMode:this.onChangeMode,militaryTime:militaryTime,radius:radius,onChange:this.onChange}))}},{key:'onChange',value:function onChange(hours,minutes){this.setState({hours:hours,minutes:minutes});if(this.props.onChange)this.props.onChange(hours,minutes)}},{key:'onChangeMode',value:function onChangeMode(mode){this.setState({mode:mode});if(this.props.onChangeMode)this.props.onChangeMode(mode)}}]);return Timepicker}(_react2.default.Component);Timepicker.HOURS=true;Timepicker.MINUTES=false;Timepicker.propTypes=process.env.NODE_ENV!=='production'?{formatNumber:_propTypes2.default.func,hours:_propTypes2.default.number,militaryTime:_propTypes2.default.bool,minutes:_propTypes2.default.number,mode:_propTypes2.default.bool,onChange:_propTypes2.default.func,onChangeMode:_propTypes2.default.func,radius:_propTypes2.default.number,size:_propTypes2.default.number}:{};Timepicker.defaultProps={formatNumber:function formatNumber(value/*, mode */){return value<10?'0'+value:value},hours:0,militaryTime:true,minutes:0,mode:Timepicker.HOURS,radius:125,size:300};var Info=exports.Info=function(_React$Component2){_inherits(Info,_React$Component2);function Info(){_classCallCheck(this,Info);var _this2=_possibleConstructorReturn(this,(Info.__proto__||Object.getPrototypeOf(Info)).apply(this,arguments));_this2.onClickHours=_this2.onClickHours.bind(_this2);_this2.onClickMinutes=_this2.onClickMinutes.bind(_this2);return _this2}_createClass(Info,[{key:'render',value:function render(){var _props2=this.props,formatNumber=_props2.formatNumber,hours=_props2.hours,minutes=_props2.minutes,mode=_props2.mode,size=_props2.size;return _react2.default.createElement('p',{className:'timepicker-info',style:{width:size}},_react2.default.createElement('span',{className:'timepicker-info-digits'+(mode===Timepicker.HOURS?' active':''),onClick:this.onClickHours},formatNumber(hours,'info')),':',_react2.default.createElement('span',{className:'timepicker-info-digits'+(mode===Timepicker.MINUTES?' active':''),onClick:this.onClickMinutes},formatNumber(minutes,'info')))}},{key:'onClickHours',value:function onClickHours(){if(this.props.onChangeMode)this.props.onChangeMode(Timepicker.HOURS)}},{key:'onClickMinutes',value:function onClickMinutes(){if(this.props.onChangeMode)this.props.onChangeMode(Timepicker.MINUTES)}}]);return Info}(_react2.default.Component);Info.propTypes=process.env.NODE_ENV!=='production'?{formatNumber:_propTypes2.default.func.isRequired,hours:_propTypes2.default.number.isRequired,minutes:_propTypes2.default.number.isRequired,mode:_propTypes2.default.bool.isRequired,onChangeMode:_propTypes2.default.func,size:_propTypes2.default.number.isRequired}:{};Timepicker.Info=Info;var Clock=exports.Clock=function(_React$Component3){_inherits(Clock,_React$Component3);function Clock(_ref3){var hours=_ref3.hours,militaryTime=_ref3.militaryTime,minutes=_ref3.minutes,mode=_ref3.mode;_classCallCheck(this,Clock);var _this3=_possibleConstructorReturn(this,(Clock.__proto__||Object.getPrototypeOf(Clock)).apply(this,arguments));_this3.state={even:true,hours:hours%(militaryTime?24:12),minutes:minutes%60,mode:mode,positionsHours:_this3.calculatePositionsHours(),positionsMinutes:_this3.calculatePositionsMinutes()};_this3.onHand1=_this3.onHand1.bind(_this3);_this3.onHand2=_this3.onHand2.bind(_this3);return _this3}_createClass(Clock,[{key:'componentWillReceiveProps',value:function componentWillReceiveProps(_ref4){var hours=_ref4.hours,militaryTime=_ref4.militaryTime,minutes=_ref4.minutes,mode=_ref4.mode,radius=_ref4.radius,size=_ref4.size;var props=this.props;if(size!==props.size||radius!==props.radius){this.setState({positionsHours:this.calculatePositionsHours(),positionsMinutes:this.calculatePositionsMinutes()})}else if(militaryTime!==props.militaryTime){this.setState({positionsHours:this.calculatePositionsHours()})}if(mode!==props.mode)this.setState({mode:mode});if(hours!==props.hours)this.setState({hours:hours%(militaryTime?24:12)});if(minutes!==props.minutes)this.setState({minutes:minutes%60})}},{key:'componentDidMount',value:function componentDidMount(){this.componentDidUpdate({})}},{key:'componentDidUpdate',value:function componentDidUpdate(previousProps,previousState){var _props3=this.props,militaryTime=_props3.militaryTime,mode=_props3.mode,size=_props3.size;var _state2=this.state,even=_state2.even,hours=_state2.hours,minutes=_state2.minutes,positionsHours=_state2.positionsHours,positionsMinutes=_state2.positionsMinutes;if(previousProps.mode===mode&&previousState.hours===hours&&previousState.minutes===minutes)return;var hand1=even?this.hand1:this.hand2;var hand2=even?this.hand2:this.hand1;hand1.setAttribute('x2',mode?positionsHours[hours===0?militaryTime?23:11:hours-1][0]:positionsMinutes[minutes][0]);hand1.setAttribute('y2',mode?positionsHours[hours===0?militaryTime?23:11:hours-1][1]:positionsMinutes[minutes][1]);if(previousProps.mode!==mode){hand2.setAttribute('x2',size/2);hand2.setAttribute('y2',size/2)}var dx1=hand1.getAttribute('x1')-hand1.getAttribute('x2');var dy1=hand1.getAttribute('y1')-hand1.getAttribute('y2');var dx2=hand2.getAttribute('x1')-hand2.getAttribute('x2');var dy2=hand2.getAttribute('y1')-hand2.getAttribute('y2');var hand1Length=Math.ceil(Math.sqrt(dx1*dx1+dy1*dy1));var hand2Length=Math.ceil(Math.sqrt(dx2*dx2+dy2*dy2));hand1.style.strokeDasharray=hand1Length;hand2.style.strokeDasharray=hand2Length;hand1.style.strokeDashoffset=hand1Length;hand2.style.strokeDashoffset='0';hand1.style.transitionProperty='none';hand2.style.transitionProperty='none';hand1.getBoundingClientRect();hand2.getBoundingClientRect();hand1.style.transitionProperty='stroke-dashoffset';hand2.style.transitionProperty='stroke-dashoffset';hand1.style.strokeDashoffset='0';hand2.style.strokeDashoffset=hand2Length}},{key:'render',value:function render(){var size=this.props.size;var mode=this.state.mode;return _react2.default.createElement('svg',{height:size,width:size},_react2.default.createElement('line',{ref:this.onHand1,className:'timepicker-hand',x1:size/2,y1:size/2,x2:size/2,y2:size/2}),_react2.default.createElement('line',{ref:this.onHand2,className:'timepicker-hand',x1:size/2,y1:size/2,x2:size/2,y2:size/2}),_react2.default.createElement('g',{className:'timepicker-'+(mode?'visible':'invisible')},this.renderHoursBubbles()),_react2.default.createElement('g',{className:'timepicker-'+(mode?'invisible':'visible')},this.renderMinutesBubbles()))}},{key:'renderHoursBubbles',value:function renderHoursBubbles(){var formatNumber=this.props.formatNumber;var _state3=this.state,hours=_state3.hours,positions=_state3.positionsHours;var bubbles=[];for(var index=0;index<positions.length;++index){var x=positions[index][0];var y=positions[index][1];var hour=(index+1)%24;var onClick=this.onClickHour(hour);var onMouseMove=this.onMouseMoveHour(hour);bubbles.push(_react2.default.createElement('g',{className:'timepicker-bubble'+(hours===hour?' active':''),key:index,onClick:onClick,onMouseMove:onMouseMove,onMouseUp:onMouseMove},_react2.default.createElement('circle',{cx:x,cy:y,r:15}),_react2.default.createElement('text',{x:x,y:y},formatNumber(hour,'clock'))))}return bubbles}},{key:'renderMinutesBubbles',value:function renderMinutesBubbles(){var formatNumber=this.props.formatNumber;var _state4=this.state,minutes=_state4.minutes,positions=_state4.positionsMinutes;var bubbles=[];for(var minute=0;minute<positions.length;++minute){var x=positions[minute][0];var y=positions[minute][1];var onClick=this.onClickMinute(minute);var onMouseMove=this.onMouseMoveMinute(minute);bubbles.push(_react2.default.createElement('g',{className:'timepicker-bubble'+(minute%5?' small':'')+(minutes===minute?' active':''),key:minute,onClick:onClick,onMouseMove:onMouseMove},_react2.default.createElement('circle',{cx:x,cy:y,r:minute%5?minutes===minute?5:0:15}),minute%5?_react2.default.createElement('circle',{cx:x,cy:y,r:10}):_react2.default.createElement('text',{x:x,y:y},formatNumber(minute,'clock'))))}return bubbles}},{key:'onChange',value:function onChange(){if(this.props.onChange)this.props.onChange(this.state.hours,this.state.minutes);if(this.props.onChangeMode)this.props.onChangeMode(this.state.mode)}},{key:'onClickHour',value:function onClickHour(hours){var _this4=this;return function(event,preventChangeMode){if(_this4.state.hours===hours&&preventChangeMode)return;_this4.setState({even:!_this4.state.even,hours:hours,mode:preventChangeMode?_this4.state.mode===Timepicker.HOURS?Timepicker.HOURS:Timepicker.MINUTES:_this4.state.mode===Timepicker.HOURS?Timepicker.MINUTES:Timepicker.HOURS},function(){return _this4.onChange()})}}},{key:'onClickMinute',value:function onClickMinute(minutes){var _this5=this;return function(){if(_this5.state.minutes===minutes)return;_this5.setState({minutes:minutes,even:!_this5.state.even},function(){return _this5.onChange()})}}},{key:'onHand1',value:function onHand1(hand1){this.hand1=hand1}},{key:'onHand2',value:function onHand2(hand2){this.hand2=hand2}},{key:'onMouseMoveHour',value:function onMouseMoveHour(hours){var onClickHour=this.onClickHour(hours);return function(event){var isMouseUp=event.type==='mouseup';if(isMouseUp||event.buttons===1)onClickHour(event,!isMouseUp)}}},{key:'onMouseMoveMinute',value:function onMouseMoveMinute(minutes){var onClickMinute=this.onClickMinute(minutes);return function(event){if(event.buttons===1)onClickMinute()}}},{key:'calculatePositionsHours',value:function calculatePositionsHours(){var _props4=this.props,militaryTime=_props4.militaryTime,radius=_props4.radius,size=_props4.size;var positions=[];for(var index=1;index<=(militaryTime?24:12);++index){positions.push([Math.round(size/2+radius*(militaryTime?index>12?1:0.65:1)*Math.cos((index%12/6-0.5)*Math.PI)),Math.round(size/2+radius*(militaryTime?index>12?1:0.65:1)*Math.sin((index%12/6-0.5)*Math.PI))])}return positions}},{key:'calculatePositionsMinutes',value:function calculatePositionsMinutes(){var _props5=this.props,radius=_props5.radius,size=_props5.size;var positions=[];for(var index=0;index<60;++index){positions.push([Math.round(size/2+radius*Math.cos((index/30-0.5)*Math.PI)),Math.round(size/2+radius*Math.sin((index/30-0.5)*Math.PI))])}return positions}}]);return Clock}(_react2.default.Component);Clock.propTypes=process.env.NODE_ENV!=='production'?{formatNumber:_propTypes2.default.func.isRequired,hours:_propTypes2.default.number.isRequired,militaryTime:_propTypes2.default.bool.isRequired,minutes:_propTypes2.default.number.isRequired,mode:_propTypes2.default.bool.isRequired,onChange:_propTypes2.default.func,onChangeMode:_propTypes2.default.func,radius:_propTypes2.default.number.isRequired,size:_propTypes2.default.number.isRequired}:{};Timepicker.Clock=Clock; | ||
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Minified code
QualityThis package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Minified code
QualityThis package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.
Found 1 instance in 1 package
33734
4
507