fix for zero-state for shadow-control

This commit is contained in:
Henry Jameson 2018-11-22 03:55:45 +03:00
parent cd6c5b3e33
commit 379144f4ab
4 changed files with 23 additions and 23 deletions

View file

@ -4,13 +4,17 @@ import { getCssShadow } from '../../services/style_setter/style_setter.js'
import { hex2rgb } from '../../services/color_convert/color_convert.js'
export default {
// 'Value' and 'Fallback' can be undefined, but if they are
// initially vue won't detect it when they become something else
// therefore i'm using "ready" which should be passed as true when
// data becomes available
props: [
'value', 'fallback'
'value', 'fallback', 'ready'
],
data () {
return {
selectedId: 0,
cValue: this.value || this.fallback
cValue: this.value || this.fallback || []
}
},
components: {
@ -42,27 +46,28 @@ export default {
},
computed: {
selected () {
return this.isReady && this.cValue[this.selectedId] || {
x: 0,
y: 0,
blur: 0,
spread: 0,
inset: false,
color: '#000000',
alpha: 1
if (this.ready && this.cValue.length > 0) {
return this.cValue[this.selectedId]
} else {
return {
x: 0,
y: 0,
blur: 0,
spread: 0,
inset: false,
color: '#000000',
alpha: 1
}
}
},
moveUpValid () {
return this.isReady && this.selectedId > 0
return this.ready && this.selectedId > 0
},
moveDnValid () {
return this.isReady && this.selectedId < this.cValue.length - 1
},
isReady () {
return typeof this.cValue !== 'undefined'
return this.ready && this.selectedId < this.cValue.length - 1
},
present () {
return this.isReady &&
return this.ready &&
typeof this.cValue[this.selectedId] !== 'undefined' &&
!this.usingFallback
},
@ -73,7 +78,7 @@ export default {
return hex2rgb(this.selected.color)
},
style () {
return this.isReady ? {
return this.ready ? {
boxShadow: getCssShadow(this.cValue)
} : {}
}

View file

@ -182,7 +182,6 @@ export default {
},
previewTheme () {
if (!this.preview.theme.colors) return { colors: {}, opacity: {}, radii: {}, shadows: {} }
console.log(this.preview.theme.radii)
return this.preview.theme
},
// This needs optimization maybe
@ -382,8 +381,6 @@ export default {
normalizeLocalState (input, version = 0) {
const colors = input.colors || input
const radii = input.radii || input
console.log('Benis')
console.log(JSON.stringify(radii, null, 2))
const opacity = input.opacity || input
const shadows = input.shadows || {}

View file

@ -170,7 +170,7 @@
<label class="checkbox-label" for="override"></label>
</div>
</div>
<shadow-control :fallback="currentShadowFallback" v-model="currentShadow"/>
<shadow-control :ready="!!currentShadowFallback" :fallback="currentShadowFallback" v-model="currentShadow"/>
</div>
</tab-switcher>
</keep-alive>

View file

@ -107,7 +107,6 @@ const getCssShadow = (input) => {
}
const getCssColor = (input, a) => {
console.log(input)
let rgb = {}
if (typeof input === 'object') {
rgb = input
@ -120,7 +119,6 @@ const getCssColor = (input, a) => {
return input
}
}
console.log(rgb2rgba({ ...rgb, a }))
return rgb2rgba({ ...rgb, a })
}