skyquake/plugins/launchpad/src/carousel/ButtonEventListener.js

   1
   2 /*
   3  *
   4  *   Copyright 2016 RIFT.IO Inc
   5  *
   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
   9  *
  10  *       http://www.apache.org/licenses/LICENSE-2.0
  11  *
  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.
  17  *
  18  */
  19 var React = require('react');
  20
  21
  22 /**
  23  * Event listener Mixins. A vast majority of components are going to expose these events to the user so we're making
  24  * a central location to house all of them.
  25  */
  26 var MIXINS = {
  27   propTypes: {
  28     onClick:       React.PropTypes.func,
  29     onMouseUp:     React.PropTypes.func,
  30     onMouseDown:   React.PropTypes.func,
  31     onMouseOver:   React.PropTypes.func,
  32     onMouseEnter:  React.PropTypes.func,
  33     onMouseLeave:  React.PropTypes.func,
  34     onMouseOut:    React.PropTypes.func,
  35
  36     onTouchCancel: React.PropTypes.func,
  37     onTouchEnd:    React.PropTypes.func,
  38     onTouchMove:   React.PropTypes.func,
  39     onTouchStart:  React.PropTypes.func,
  40
  41     onKeyDown:     React.PropTypes.func,
  42     onKeyPress:    React.PropTypes.func,
  43     onKeyUp:       React.PropTypes.func,
  44
  45     onFocus:       React.PropTypes.func,
  46     onBlur:        React.PropTypes.func
  47   },
  48
  49   /**
  50    * A vast majority of these functions just check to see if the event function is defined and then passes the function
  51    * both the event and the local props.
  52    * @param e
  53    */
  54   onClick: function(e) {
  55     if (Boolean(this.props.onClick) && !this.state.isDisabled && !this.state.isReadOnly) {
  56       //this.props.isActive = true;
  57       this.props.onClick(e, this);
  58     } else {
  59       e.preventDefault();
  60     }
  61   },
  62   onMouseUp: function(e) {
  63     if (!this.state.isDisabled && !this.state.isReadOnly) {
  64       this.setState({isActive:false});
  65       if (Boolean(this.props.onMouseUp)) {
  66         this.props.onMouseUp(e, this);
  67       }
  68     } else {
  69       e.preventDefault();
  70     }
  71   },
  72   onMouseDown: function(e) {
  73     if (!this.state.isDisabled && !this.state.isReadOnly) {
  74       this.setState({isActive:true});
  75       if (Boolean(this.props.onMouseDown)) {
  76         this.props.onMouseDown(e, this);
  77       }
  78     }
  79   },
  80   onMouseOver: function(e) {
  81     if (Boolean(this.props.onMouseOver) && !this.state.isDisabled && !this.state.isReadOnly) {
  82       this.props.onMouseOver(e, this);
  83     } else {
  84       e.preventDefault();
  85     }
  86   },
  87   onMouseEnter: function(e) {
  88     if (!this.state.isDisabled && !this.state.isReadOnly) {
  89       this.setState({isHovered:true});
  90       if (this.props.onMouseEnter) {
  91         this.props.onMouseEnter(e, this);
  92       }
  93     } else {
  94       e.preventDefault();
  95     }
  96   },
  97   onMouseLeave: function(e) {
  98     if (!this.state.isDisabled && !this.state.isReadOnly) {
  99       this.setState({isHovered:false, isActive:false});
 100       if (Boolean(this.props.onMouseLeave)) {
 101         this.props.onMouseLeave(e, this);
 102       }
 103     }
 104   },
 105   onMouseOut: function(e) {
 106     if (!this.state.isDisabled && !this.state.isReadOnly) {
 107       if (Boolean(this.props.onMouseOut)) {
 108         this.props.onMouseOut(e, this);
 109       }
 110     } else {
 111       e.preventDefault();
 112     }
 113   },
 114   onTouchCancel: function(e) {
 115     if (!this.state.isDisabled && !this.state.isReadOnly) {
 116       this.setState({isActive: false});
 117       if (Boolean(this.props.onTouchCancel)) {
 118         this.props.onTouchCancel(e, this);
 119       }
 120     } else {
 121       e.preventDefault();
 122     }
 123   },
 124   onTouchEnd: function(e) {
 125     if (!this.state.isDisabled && !this.state.isReadOnly) {
 126       this.setState({isActive: false});
 127       if (Boolean(this.props.onTouchEnd)) {
 128         this.props.onTouchEnd(e, this);
 129       }
 130     } else {
 131       e.preventDefault();
 132     }
 133   },
 134   onTouchMove: function(e) {
 135     if (Boolean(this.props.onTouchMove) && !this.state.isDisabled && !this.state.isReadOnly) {
 136       this.props.onTouchMove(e, this);
 137     } else {
 138       e.preventDefault();
 139     }
 140   },
 141   onTouchStart: function(e) {
 142     if (!this.state.isDisabled && !this.state.isReadOnly) {
 143       this.setState({isActive: true});
 144       if (Boolean(this.props.onTouchStart)) {
 145         this.props.onTouchStart(e, this);
 146       }
 147     } else {
 148       e.preventDefault();
 149     }
 150   },
 151   onKeyDown: function(e) {
 152     if (Boolean(this.props.onKeyDown) && !this.state.isDisabled && !this.state.isReadOnly) {
 153       this.props.onKeyDown(e, this);
 154     } else {
 155       e.preventDefault();
 156     }
 157   },
 158   onKeyPress: function(e) {
 159     if (Boolean(this.props.onKeyPress) && !this.state.isDisabled && !this.state.isReadOnly) {
 160       this.props.onKeyPress(e, this);
 161     } else {
 162       e.preventDefault();
 163     }
 164   },
 165   onKeyUp: function(e) {
 166     if (Boolean(this.props.onKeyUp) && !this.state.isDisabled && !this.state.isReadOnly) {
 167       this.props.onKeyUp(e, this);
 168     } else {
 169       e.preventDefault();
 170     }
 171   },
 172   onFocus: function(e) {
 173     if (!this.state.isDisabled && !this.state.isReadOnly) {
 174       this.setState({isFocused: true});
 175       if (Boolean(this.props.onFocus)) {
 176         this.props.onFocus(e, this);
 177       }
 178     } else {
 179       e.preventDefault();
 180     }
 181   },
 182   onBlur: function(e) {
 183     if (!this.state.isDisabled && !this.state.isReadOnly) {
 184       this.setState({isFocused: false});
 185       if (Boolean(this.props.onBlur)) {
 186         this.props.onBlur(e, this);
 187       }
 188     } else {
 189       e.preventDefault();
 190     }
 191   },
 192
 193   /**
 194    * Generic clone function that takes an object and returns an independent clone of it.
 195    * Needed to give the user a clone of the props instead of the props themselves to prevent direct access to the props.
 196    * @param obj
 197    * @returns {*}
 198    **/
 199   clone: function(obj) {
 200     if (null == obj || "object" != typeof obj) return obj;
 201     var copy = obj.constructor();
 202     for (var attr in obj) {
 203       if (obj.hasOwnProperty(attr)) copy[attr] = obj[attr];
 204     }
 205     return copy;
 206   }
 207 };