Added build target without css, started using prettier intead of linting

This commit is contained in:
Yev Vlasenko
2017-12-28 18:27:58 +00:00
parent d302df7310
commit d3198e1388
11 changed files with 984 additions and 65 deletions

View File

@@ -54,40 +54,40 @@ export default {
default: 'fade'
}
},
data () {
data() {
return {
params: {},
defaultButtons: [{ title: 'CLOSE' }]
}
},
computed: {
buttons () {
buttons() {
return this.params.buttons || this.defaultButtons
},
/**
* Returns FLEX style with correct width for arbitrary number of
* buttons.
*/
buttonStyle () {
buttonStyle() {
return {
flex: `1 1 ${100 / this.buttons.length}%`
}
}
},
methods: {
beforeOpened (event) {
beforeOpened(event) {
window.addEventListener('keyup', this.onKeyUp)
this.params = event.params || {}
this.$emit('before-opened', event)
},
beforeClosed (event) {
beforeClosed(event) {
window.removeEventListener('keyup', this.onKeyUp)
this.params = {}
this.$emit('before-closed', event)
},
click (i, event, source = 'click') {
click(i, event, source = 'click') {
const button = this.buttons[i]
if (button && typeof button.handler === 'function') {
@@ -96,11 +96,12 @@ export default {
this.$modal.hide('dialog')
}
},
onKeyUp (event) {
onKeyUp(event) {
if (event.which === 13 && this.buttons.length > 0) {
const buttonIndex = this.buttons.length === 1
? 0
: this.buttons.findIndex(button => button.default)
const buttonIndex =
this.buttons.length === 1
? 0
: this.buttons.findIndex(button => button.default)
if (buttonIndex !== -1) {
this.click(buttonIndex, event, 'keypress')

View File

@@ -14,23 +14,24 @@ export default {
minWidth: {
type: Number,
default: 0
}},
data () {
}
},
data() {
return {
clicked: false,
size: {}
}
},
mounted () {
mounted() {
this.$el.addEventListener('mousedown', this.start, false)
},
computed: {
className () {
return {'vue-modal-resizer': true, 'clicked': this.clicked}
className() {
return { 'vue-modal-resizer': true, clicked: this.clicked }
}
},
methods: {
start (event) {
start(event) {
this.clicked = true
window.addEventListener('mousemove', this.mousemove, false)
@@ -39,7 +40,7 @@ export default {
event.stopPropagation()
event.preventDefault()
},
stop () {
stop() {
this.clicked = false
window.removeEventListener('mousemove', this.mousemove, false)
@@ -50,10 +51,10 @@ export default {
size: this.size
})
},
mousemove (event) {
mousemove(event) {
this.resize(event)
},
resize (event) {
resize(event) {
var el = this.$el.parentElement
if (el) {
@@ -63,7 +64,7 @@ export default {
width = inRange(this.minWidth, window.innerWidth, width)
height = inRange(this.minHeight, window.innerHeight, height)
this.size = {width, height}
this.size = { width, height }
el.style.width = width + 'px'
el.style.height = height + 'px'
@@ -104,6 +105,6 @@ export default {
}
.vue-modal-resizer.clicked::after {
border-bottom: 10px solid #369BE9;
border-bottom: 10px solid #369be9;
}
</style>

View File

@@ -4,7 +4,7 @@ import Dialog from './Dialog.vue'
const defaultComponentName = 'modal'
const Plugin = {
install (Vue, options = {}) {
install(Vue, options = {}) {
/**
* Makes sure that plugin can be insstalled only once
*/
@@ -18,15 +18,15 @@ const Plugin = {
* Plugin API
*/
Vue.prototype.$modal = {
show (name, params) {
show(name, params) {
Plugin.event.$emit('toggle', name, true, params)
},
hide (name, params) {
hide(name, params) {
Plugin.event.$emit('toggle', name, false, params)
},
toggle (name, params) {
toggle(name, params) {
Plugin.event.$emit('toggle', name, undefined, params)
}
}

View File

@@ -19,7 +19,7 @@ const types = [
}
]
var getType = (value) => {
var getType = value => {
if (value === 'auto') {
return {
type: value,
@@ -43,7 +43,7 @@ var getType = (value) => {
}
}
export const parse = (value) => {
export const parse = value => {
switch (typeof value) {
case 'number':
return { type: 'px', value }