Added code linting & cleaned code acording to JavaScript Standard Style

package.json

@@ -20,8 +20,9 @@
   "scripts": {
     "build:client": "webpack --config ./build/webpack.client.config.js --progress --hide-modules",
     "build:server": "webpack --config ./build/webpack.server.config.js --progress --hide-modules",
+    "lint": "eslint --ext .js,.vue src test/unit/specs",
     "unit": "karma start test/unit/karma.conf.js",
-    "build": "npm run unit && npm run build:client && npm run build:server"
+    "build": "npm run lint && npm run unit && npm run build:client && npm run build:server"
   },
   "license": "MIT",
   "devDependencies": {
@@ -43,6 +44,13 @@
     "karma-sourcemap-loader": "^0.3.7",
     "karma-spec-reporter": "0.0.31",
     "karma-webpack": "^2.0.2",
+    "eslint": "^3.19.0",
+    "eslint-config-standard": "^6.2.1",
+    "eslint-friendly-formatter": "^2.0.7",
+    "eslint-loader": "^1.7.1",
+    "eslint-plugin-html": "^2.0.0",
+    "eslint-plugin-promise": "^3.4.0",
+    "eslint-plugin-standard": "^2.0.1",
     "lolex": "^1.5.2",
     "mocha": "^3.2.0",
     "node-sass": "^4.5.0",

src/Dialog.vue

@@ -30,7 +30,7 @@
 <script>
   export default {
     name: 'Dialog',
-    data() {
+    data () {
       return {
         params: {},
         defaultButtons: [{ title: 'CLOSE' }]

src/Modal.vue

@@ -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 {

src/Resizer.vue

@@ -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) {

src/parser.js

@@ -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}$`)
   }
 ]
 

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 }