mirror of
				https://github.com/KevinMidboe/vue-js-modal.git
				synced 2025-10-29 18:00:20 +00:00 
			
		
		
		
	Added code linting & cleaned code acording to JavaScript Standard Style
This commit is contained in:
		| @@ -30,7 +30,7 @@ | ||||
| <script> | ||||
|   export default { | ||||
|     name: 'Dialog', | ||||
|     data() { | ||||
|     data () { | ||||
|       return { | ||||
|         params: {}, | ||||
|         defaultButtons: [{ title: 'CLOSE' }] | ||||
|   | ||||
| @@ -41,7 +41,7 @@ | ||||
|       }, | ||||
|       delay: { | ||||
|         type: Number, | ||||
|         default: 0, | ||||
|         default: 0 | ||||
|       }, | ||||
|       resizable: { | ||||
|         type: Boolean, | ||||
| @@ -72,7 +72,7 @@ | ||||
|       }, | ||||
|       classes: { | ||||
|         type: [String, Array], | ||||
|         default: 'v--modal', | ||||
|         default: 'v--modal' | ||||
|       }, | ||||
|       minWidth: { | ||||
|         type: Number, | ||||
| @@ -94,8 +94,8 @@ | ||||
|         validator (value) { | ||||
|           if (typeof value === 'string') { | ||||
|             let width = parseNumber(value) | ||||
|             return (width.type === '%' || width.type === 'px') | ||||
|               && width.value > 0 | ||||
|             return (width.type === '%' || width.type === 'px') && | ||||
|               width.value > 0 | ||||
|           } | ||||
|  | ||||
|           return value >= 0 | ||||
| @@ -111,8 +111,8 @@ | ||||
|             } | ||||
|  | ||||
|             let height = parseNumber(value) | ||||
|             return (height.type === '%' || height.type === 'px') | ||||
|               && height.value > 0 | ||||
|             return (height.type === '%' || height.type === 'px') && | ||||
|               height.value > 0 | ||||
|           } | ||||
|  | ||||
|           return value >= 0 | ||||
| @@ -201,7 +201,7 @@ | ||||
|  | ||||
|           this.toggle(state, params) | ||||
|         } | ||||
|       }); | ||||
|       }) | ||||
|  | ||||
|       window.addEventListener('resize', this.onWindowResize) | ||||
|       this.onWindowResize() | ||||
| @@ -229,8 +229,8 @@ | ||||
|        * pivots, window size and modal size | ||||
|        */ | ||||
|       position () { | ||||
|         const { window, modal, shift, pivotX, pivotY, | ||||
|           trueModalWidth, trueModalHeight, isAutoHeight } = this | ||||
|         const { window, shift, pivotX, pivotY, | ||||
|           trueModalWidth, trueModalHeight } = this | ||||
|  | ||||
|         const maxLeft = window.width - trueModalWidth | ||||
|         const maxTop = window.height - trueModalHeight | ||||
| @@ -338,18 +338,15 @@ | ||||
|        * Generates event object | ||||
|        */ | ||||
|       genEventObject (params) { | ||||
|         //todo: clean this up (change to ...) | ||||
|         // @todo: clean this up (change to ...) | ||||
|         var data = { | ||||
|           name: this.name, | ||||
|           timestamp: Date.now(), | ||||
|           canceled: false, | ||||
|           ref: this.$refs.modal, | ||||
|           stop: function() { | ||||
|             this.canceled = true | ||||
|           } | ||||
|           ref: this.$refs.modal | ||||
|         } | ||||
|  | ||||
|         return Vue.util.extend(data, params || {}); | ||||
|         return Vue.util.extend(data, params || {}) | ||||
|       }, | ||||
|       /** | ||||
|        * Event handler which is triggered on modal resize | ||||
| @@ -362,7 +359,7 @@ | ||||
|         this.modal.height = event.size.height | ||||
|  | ||||
|         const { size } = this.modal | ||||
|         const resizeEvent = this.genEventObject({ size }); | ||||
|         const resizeEvent = this.genEventObject({ size }) | ||||
|  | ||||
|         this.$emit('resize', resizeEvent) | ||||
|       }, | ||||
| @@ -403,12 +400,6 @@ | ||||
|         } | ||||
|       }, | ||||
|  | ||||
|       emitCancelableEvent (data) { | ||||
|         let stopEventExecution = false | ||||
|         let stop = () => { stopEventExecution = true } | ||||
|         let event = this.genEventObject(data) | ||||
|       }, | ||||
|  | ||||
|       getDraggableElement () { | ||||
|         var selector = typeof this.draggable !== 'string' | ||||
|           ? '.v--modal-box' | ||||
| @@ -432,7 +423,7 @@ | ||||
|  | ||||
|       addDraggableListeners () { | ||||
|         if (!this.draggable) { | ||||
|           return; | ||||
|           return | ||||
|         } | ||||
|  | ||||
|         let dragger = this.getDraggableElement() | ||||
| @@ -444,9 +435,9 @@ | ||||
|           let cachedShiftY = 0 | ||||
|  | ||||
|           let getPosition = (event) => { | ||||
|               return event.touches && event.touches.length > 0 | ||||
|                 ? event.touches[0] | ||||
|                 : event | ||||
|             return event.touches && event.touches.length > 0 | ||||
|               ? event.touches[0] | ||||
|               : event | ||||
|           } | ||||
|  | ||||
|           let mousedown = (event) => { | ||||
| @@ -493,7 +484,7 @@ | ||||
|       //  console.log('removing draggable handlers') | ||||
|       } | ||||
|     } | ||||
|   }; | ||||
|   } | ||||
| </script> | ||||
| <style> | ||||
|   .v--modal-overlay { | ||||
|   | ||||
| @@ -15,7 +15,7 @@ export default { | ||||
|       type: Number, | ||||
|       default: 0 | ||||
|     }}, | ||||
|   data() { | ||||
|   data () { | ||||
|     return { | ||||
|       clicked: false, | ||||
|       size: {} | ||||
| @@ -30,7 +30,7 @@ export default { | ||||
|     } | ||||
|   }, | ||||
|   methods: { | ||||
|     start(event) { | ||||
|     start (event) { | ||||
|       this.clicked = true | ||||
|  | ||||
|       window.addEventListener('mousemove', this.mousemove, false) | ||||
| @@ -39,7 +39,7 @@ export default { | ||||
|       event.stopPropagation() | ||||
|       event.preventDefault() | ||||
|     }, | ||||
|     stop() { | ||||
|     stop () { | ||||
|       this.clicked = false | ||||
|  | ||||
|       window.removeEventListener('mousemove', this.mousemove, false) | ||||
| @@ -48,12 +48,12 @@ export default { | ||||
|       this.$emit('resize-stop', { | ||||
|         element: this.$el.parentElement, | ||||
|         size: this.size | ||||
|       }); | ||||
|       }) | ||||
|     }, | ||||
|     mousemove(event) { | ||||
|     mousemove (event) { | ||||
|       this.resize(event) | ||||
|     }, | ||||
|     resize(event) { | ||||
|     resize (event) { | ||||
|       var el = this.$el.parentElement | ||||
|  | ||||
|       if (el) { | ||||
|   | ||||
| @@ -1,26 +1,21 @@ | ||||
| // Parses string with float number and suffix: | ||||
| // "0.001" => { type: "px", value: 0.001 } | ||||
| // "0.001px" => { type: "px", value: 0.001 } | ||||
| // "0.1%" => { type: "px", value: 0.1 } | ||||
| // "foo"  => { type: "", value: "foo" } | ||||
| // "auto" => { type: "auto", value: 0 } | ||||
| const floatRegexp = '[-+]?[0-9]*.?[0-9]+' | ||||
|  | ||||
| var floatRegexp = '[-+]?[0-9]*\.?[0-9]+' | ||||
|  | ||||
| var types = [ | ||||
| const types = [ | ||||
|   { | ||||
|     name: 'px', | ||||
|     regexp: new RegExp(`^${floatRegexp}px\$`) | ||||
|     regexp: new RegExp(`^${floatRegexp}px$`) | ||||
|   }, | ||||
|   { | ||||
|     name: '%', | ||||
|     regexp: new RegExp(`^${floatRegexp}%\$`) | ||||
|     regexp: new RegExp(`^${floatRegexp}%$`) | ||||
|   }, | ||||
|   // Fallback option: | ||||
|   // If no suffix specified, assign to px | ||||
|   /** | ||||
|    * Fallback optopn | ||||
|    * If no suffix specified, assigning "px" | ||||
|    */ | ||||
|   { | ||||
|     name: 'px', | ||||
|     regexp: new RegExp(`^${floatRegexp}\$`) | ||||
|     regexp: new RegExp(`^${floatRegexp}$`) | ||||
|   } | ||||
| ] | ||||
|  | ||||
|   | ||||
							
								
								
									
										11
									
								
								src/util.js
									
									
									
									
									
								
							
							
						
						
									
										11
									
								
								src/util.js
									
									
									
									
									
								
							| @@ -1,3 +1,12 @@ | ||||
| /** | ||||
|  * | ||||
|  * @param {Number} from  Lower limit | ||||
|  * @param {Number} to    Upper limit | ||||
|  * @param {Number} value Checked number value | ||||
|  * | ||||
|  * @return {Number} Either source value itself or limit value if range limits | ||||
|  *   are exceeded | ||||
|  */ | ||||
| export const inRange = (from, to, value) => { | ||||
|   if (value < from) { | ||||
|     return from | ||||
| @@ -8,6 +17,8 @@ export const inRange = (from, to, value) => { | ||||
|   } | ||||
|  | ||||
|   return value | ||||
|   // lol | ||||
|   // return value < from ? from : (value > to ? to : value) | ||||
| } | ||||
|  | ||||
| export default { inRange } | ||||
|   | ||||
		Reference in New Issue
	
	Block a user