4 * Copyright 2016 RIFT.IO Inc
6 * Licensed under the Apache License, Version 2.0 (the "License");
7 * you may not use this file except in compliance with the License.
8 * You may obtain a copy of the License at
10 * http://www.apache.org/licenses/LICENSE-2.0
12 * Unless required by applicable law or agreed to in writing, software
13 * distributed under the License is distributed on an "AS IS" BASIS,
14 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
15 * See the License for the specific language governing permissions and
16 * limitations under the License.
21 import React
from 'react'
22 import Range
from './Range'
23 import numeral
from 'numeral'
24 import PureRenderMixin
from 'react-addons-pure-render-mixin'
25 import CanvasEditorActions
from '../actions/CanvasEditorActions'
26 import SelectionManager
from '../libraries/SelectionManager'
28 import '../styles/CanvasZoom.scss'
30 const CanvasZoom
= React
.createClass({
31 mixins
: [PureRenderMixin
],
32 getInitialState: function () {
35 getDefaultProps: function () {
43 componentWillMount: function () {
45 componentDidMount: function () {
47 componentDidUpdate: function () {
49 componentWillUnmount: function () {
52 const zoom
= this.props
.zoom
|| this.props
.defaultZoom
53 const displayValue
= numeral(zoom
).format('0.0') + '%';
55 <div ref
="canvasZoom" className
="CanvasZoom" style
={this.props
.style
} onClick
={event
=> event
.preventDefault()}>
57 value
={zoom
} min
={this.props
.min
} max
={this.props
.max
}
58 title
="Zoom the canvas. Double Click to reset to 100%."
59 onChange
={this.onChange
} onDoubleClick
={this.onDblClick
} />
60 <span
>{displayValue
}</span
>
65 const zoom
= event
.target
.value
;
66 CanvasEditorActions
.setCanvasZoom(zoom
);
69 const zoom
= this.props
.defaultZoom
;
70 CanvasEditorActions
.setCanvasZoom(zoom
);
74 export default CanvasZoom
;