Commit f1fd8e44 authored by anton's avatar anton

Fix broken data model references for mosys

parent 2edf118c
Pipeline #29590 passed with stage
in 1 minute and 8 seconds
......@@ -3,7 +3,7 @@
.cell-item-inner(:class="{'display-preview': preview, 'display-full': display}")
template(v-if="cell")
component.animated-opacity(
:is="cell.component",
:is="cell.configuration._value.component",
:cell="cell",
:class="cellClasses",
:display="display",
......@@ -38,9 +38,9 @@
cellClasses () {
let classes = ['cell-content']
if (this.cell) {
if (this.cell.component) classes.push(`cell-type-${this.cell.component.toLowerCase()}`)
if (this.cell.styleClass) {
classes = classes.concat(this.cell.styleClass.split(' '))
if (this.cell.configuration._value.component) classes.push(`cell-type-${this.cell.configuration._value.component.toLowerCase()}`)
if (this.cell.stylesheet && this.cell.stylesheet.value) {
classes = classes.concat(this.cell.stylesheet.value.split(' '))
}
}
return classes
......
......@@ -8,7 +8,7 @@
// q-item.q-py-sm(:class="[isMobile ? 'q-pr-sm' : 'q-pr-none']")
q-item.q-pa-none.q-mb-sm(:class="[isMobile ? '' : 'q-py-xs q-mt-sm']")
q-item-main.text-dark
strong {{ itemSpecs[cell.component][0].type }}
strong {{ itemSpecs[cell.configuration._value.component][0].type }}
q-item-side.mobile-only.text-dark.text-right
......@@ -23,13 +23,13 @@
q-icon(name="clear", size="20px")
//----- preview image
q-item.q-pa-none.q-mx-none.q-mb-md(v-if="cell.component === 'CellImage'",
q-item.q-pa-none.q-mx-none.q-mb-md(v-if="cell.configuration._value.component === 'CellImage'",
:class="[isMobile ? '' : 'q-mt-sm']")
img(:src="cell.data.content", style="max-height: 50vh; max-width: 100%; margin: 0 auto;")
img(:src="cell.source._value.content", style="max-height: 50vh; max-width: 100%; margin: 0 auto;")
//----- input-field
q-item.q-pa-none(v-for="spec in itemSpecs[cell.component]", :key="`${spec.component}-${spec.path}`",
v-if="cell.data.path === spec.path",
q-item.q-pa-none(v-for="spec in itemSpecs[cell.configuration._value.component]", :key="`${spec.component}-${spec.path}`",
v-if="cell.configuration._value.path === spec.path",
:class="[isMobile ? '' : 'q-mt-sm']")
q-item-main.bg-grey-2.q-py-sm(style="border-radius: .35rem;")
......@@ -56,7 +56,7 @@
//----- media-/annotation-button
// q-item.q-pa-none(v-if="['CellMedia', 'CellAnnotationList'].includes(cell.component)")
q-item.q-pa-none.q-mt-md(v-if="cell.component === 'CellMedia' || cell.component === 'CellAnnotationList'")
q-item.q-pa-none.q-mt-md(v-if="cell.configuration._value.component === 'CellMedia' || cell.configuration._value.component === 'CellAnnotationList'")
//----- media
q-btn.bg-primary.text-white.media-button(@click="", flat)
......@@ -311,7 +311,7 @@
this.cellsData = []
for (let i = 0; i < cells.length; i++) {
let c = await this.$store.dispatch('cells/get', cells[i].body.source.id)
c.data.path = 'content'
c.configuration = Object.assign({}, c.configuration._value, { path: 'content' })
this.cellsData.push(c)
}
},
......@@ -328,14 +328,18 @@
},
async updateCellContent (value, cell, path) {
if (cell.id) {
cell.data[path] = value
await this.$store.dispatch('cells/patch', [cell.id, { data: { [path]: value } }])
const sourceValue = Object.assign({}, cell.source._value)
sourceValue[path] = value
cell.source.value = sourceValue
await this.$store.dispatch('cells/patch', [cell.id, { source: cell.source }])
}
},
async updateCellConfig (value, cell, path) {
if (cell.id) {
cell.config[path] = value
await this.$store.dispatch('cells/patch', [cell.id, { config: { [path]: value } }])
const configurationValue = Object.assign({}, cell.configuration._value)
configurationValue[path] = value
cell.configuration.value = configurationValue
await this.$store.dispatch('cells/patch', [cell.id, { configuration: cell.configuration }])
}
}
}
......
......@@ -15,7 +15,8 @@
},
methods: {
setClass () {
return this.cell.data.content.length > 0 ? 'text-dark' : 'text-red'
return this.cell.source._value.content &&
this.cell.source._value.content.length > 0 ? 'text-dark' : 'text-red'
},
shortenType (type) {
return type.substr(0, type.length - 5)
......
......@@ -171,6 +171,7 @@
import { mapGetters } from 'vuex'
import CellEditor from './CellEditor'
import CellHandler from './CellHandler'
import constants from 'mbjs-data-models/src/constants'
const nullImage = new Image()
nullImage.src = 'data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=='
......@@ -250,7 +251,7 @@
}),
cachedNewCellType () {
if (this.cachedNewCell) {
let type = this.cachedNewCell.component
let type = this.cachedNewCell.configuration._value.component
return type.substr(4, type.length - 4)
}
},
......@@ -321,6 +322,7 @@
this.data = await this.$store.dispatch('mosys/getGrid', this.gridUuid)
this.updateGridDimensions()
this.resetScrollPosition()
this.updateAnnotationUIStates()
document.addEventListener('keydown', this.keyHandler)
},
watch: {
......@@ -564,7 +566,7 @@
// ----- existing cell
if (pannedCell.annotation.id) {
const parsed = pannedCell.annotation.target.selector.parse()
const parsed = pannedCell.annotation.target.selector._value
x = pos.x - parsed.xywh[0]
y = pos.y - parsed.xywh[1]
w = parsed.xywh[2]
......@@ -640,9 +642,13 @@
const _cell = await this.$store.dispatch('cells/get', annotation.body.source.id)
const resourceCell = {
data: { content: '' },
config: {},
component: _cell.component
source: {
value: { content: '' }
},
configuration: {
value: {},
component: _cell.configuration._value.component
}
}
this.$store.commit('mosys/cacheNewCell', resourceCell)
},
......@@ -699,7 +705,7 @@
resizeHandler = this.cellHandler.resize,
fullCell = this.gridDimensions.full.cell,
tempCell = this.tempCell,
parsed = annotation.target.selector.parse(),
parsed = annotation.target.selector._value,
x = parsed.xywh[0],
y = parsed.xywh[1],
w = parsed.xywh[2],
......@@ -724,7 +730,7 @@
async getCellType (annotation) {
let
cell = await this.$store.dispatch('cells/get', annotation.body.source.id),
cellType = cell.component
cellType = cell.configuration._value.component
this.selectedCell.type = cellType.substr(4, cellType.length - 4)
},
async setCellPosition (annotation, x, y) {
......@@ -732,7 +738,7 @@
if (annotation) {
let
parsed = annotation.target.selector.parse(),
parsed = annotation.target.selector._value,
target = this.data.grid.get2DArea([x, y], parsed.xywh.slice(2))
annotation.target.selector.value = target.selector.value
......@@ -746,7 +752,7 @@
async setCellDimensions (annotation, _w, _h) {
if (annotation) {
let
parsed = annotation.target.selector.parse(),
parsed = annotation.target.selector._value,
sliced = parsed.xywh.slice(0, 4),
x = sliced[0],
y = sliced[1]
......@@ -766,7 +772,7 @@
return _this.annotationUIStates[k].selected
}).map(k => {
// return _this.cells.find(c => c._uuid === k)
return _this.annotations.find(c => c._uuid === k)
return _this.data.annotations.find(c => c._uuid === k)
})
this.$store.commit('mosys/setSelectedCells', selectedCells)
},
......@@ -776,13 +782,13 @@
return _this.annotationUIStates[k].editing
}).map(k => {
// return _this.cells.find(c => c._uuid === k)
return _this.annotations.find(c => c._uuid === k)
return _this.data.annotations.find(c => c._uuid === k)
})
this.$store.commit('mosys/setEditingCells', editingCells)
},
updateAnnotationUIStates () {
let newAnnotationUIStates = {}
this.annotations.forEach(a => {
this.data.annotations.forEach(a => {
newAnnotationUIStates[a._uuid] = {
selected: false,
editing: false,
......@@ -801,19 +807,20 @@
//
async handleGridDrop () {
let cachedNewCell = this.cachedNewCell
console.log('cached cell', cachedNewCell)
if (cachedNewCell) {
let
tempCell = this.tempCell,
annotation = this.annotations.find(a => a.id === cachedNewCell.id),
annotation = this.data.annotations.find(a => a.id === cachedNewCell.id),
target = this.data.grid.get2DArea([tempCell.x, tempCell.y], [tempCell.width, tempCell.height])
const
{ data, config, component } = cachedNewCell,
cell = await this.$store.dispatch('cells/post', { data, config, component })
{ source, configuration } = cachedNewCell,
cell = await this.$store.dispatch('cells/post', { source, configuration })
annotation = await this.$store.dispatch('annotations/post', {
body: {
type: 'Cell',
type: `${constants.BASE_URI_NS}cell.jsonld`,
purpose: 'linking',
source: {
id: cell.id
......@@ -821,7 +828,7 @@
},
target: target
})
this.annotations.push(annotation)
this.data.annotations.push(annotation)
this.updateAnnotationUIStates()
}
this.$store.commit('mosys/setSourceCellInput', undefined)
......@@ -886,7 +893,7 @@
async handleGridContextMenuInsertColumnLeft () {
let position = this.contextMenuClickPosition
for (let annotation of this.data.annotations) {
const parsed = annotation.target.selector.parse()
const parsed = annotation.target.selector._value
if (parsed.xywh[0] >= position.x) {
parsed.xywh[0] += 1
annotation.target.selector.value = parsed
......@@ -900,8 +907,8 @@
},
async handleGridContextMenuDeleteColumn () {
let position = this.contextMenuClickPosition
for (let annotation of this.annotations) {
const parsed = annotation.target.selector.parse()
for (let annotation of this.data.annotations) {
const parsed = annotation.target.selector._value
if (parsed.xywh[0] > position.x) {
parsed.xywh[0] -= 1
annotation.target.selector.value = parsed
......@@ -915,8 +922,8 @@
},
async handleGridContextMenuInsertRowAbove () {
let position = this.contextMenuClickPosition
for (let annotation of this.annotations) {
const parsed = annotation.target.selector.parse()
for (let annotation of this.data.annotations) {
const parsed = annotation.target.selector._value
if (parsed.xywh[1] >= position.y) {
parsed.xywh[1] += 1
annotation.target.selector.value = parsed
......@@ -930,8 +937,8 @@
},
async handleGridContextMenuDeleteRow () {
let position = this.contextMenuClickPosition
for (let annotation of this.annotations) {
const parsed = annotation.target.selector.parse()
for (let annotation of this.data.annotations) {
const parsed = annotation.target.selector._value
if (parsed.xywh[1] > position.y) {
parsed.xywh[1] -= 1
annotation.target.selector.value = parsed
......@@ -1009,8 +1016,6 @@
getCellStyle (obj) {
let x, y, w, h
console.log('cell', obj)
// ----- existing cell
if (obj.id) {
const parsed = obj.target.selector._value
......
......@@ -97,7 +97,7 @@ export default {
}
},
async mounted () {
this.video = await this.$store.dispatch('annotations/get', this.cell.data.id)
this.video = await this.$store.dispatch('annotations/get', this.cell.source.id)
this.videoTime = DateTime.fromMillis(this.video.target.selector._valueMillis)
try {
const meta = await this.$store.dispatch('metadata/get', this.video)
......@@ -235,11 +235,11 @@ export default {
}
// let regCheck
if (this.cell.textfilter) {
annotationsQuery['body.value'] = RegExp(`.*${this.cell.textfilter}.*`, 'ig')
if (this.cell.configuration._value.textfilter) {
annotationsQuery['body.value'] = RegExp(`.*${this.cell.configuration._value.textfilter}.*`, 'ig')
}
else if (this.cell.regexp) {
let regexp = this.cell.regexp
else if (this.cell.configuration._value.regexp) {
let regexp = this.cell.configuration._value.regexp
if (process.env.IS_VIEWER) {
if (RegExp('^/.+/.*$').test(regexp)) {
const parts = regexp.match(RegExp('^/(.+)/(.*)$'))
......
......@@ -26,7 +26,7 @@
},
computed: {
iframeSrc () {
return this.cell.data.content
return this.cell.source._value.content
}
},
methods: {
......
......@@ -35,7 +35,7 @@
user: 'auth/getUserState'
}),
imgSrc () {
let src = this.cell.data.content
let src = this.cell.source._value.content
if (process.env.STORAGE_HOST && src.indexOf(process.env.STORAGE_HOST) === 0) {
if (this.user && localStorage.getItem('access_token')) {
src += src.indexOf('?') === -1 ? '?' : '&'
......@@ -46,7 +46,7 @@
},
link () {
if (!this.cell) return
return this.cell.link
return this.cell.source._value.link
}
},
mounted () {
......
......@@ -24,7 +24,7 @@
internalLink () {
// TODO: only link to paths that are visible to public / user?
return {
path: this.cell.data.content
path: this.cell.source._value.content
}
}
}
......
......@@ -46,7 +46,7 @@
type: 'Media',
purpose: 'linking',
source: {
id: this.cell ? this.cell.data.content : undefined
id: this.cell ? this.cell.source._value.content : undefined
}
}
}
......@@ -66,7 +66,7 @@
},
async mounted () {
if (this.cell && this.cell.data.id) {
this.video = await this.$store.dispatch('annotations/get', this.cell.data.id)
this.video = await this.$store.dispatch('annotations/get', this.cell.source.id)
if (this.video) {
this.videoTime = DateTime.fromMillis(this.video.target.selector._valueMillis)
this.contextTime = this.videoTime
......@@ -96,9 +96,9 @@
},
methods: {
onCanPlay () {
if (this.cell && this.cell.config.start) {
if (this.cell && this.cell.configuration._value.start) {
if (this.player) {
this.player.currentTime(this.cell.config.start)
this.player.currentTime(this.cell.configuration._value.start)
this.showPlayer = true
}
}
......
......@@ -23,7 +23,7 @@ export default {
},
computed: {
textContent () {
if (this.cell) return this.cell.data.content
if (this.cell && this.cell.source._value) return this.cell.source._value.content
}
}
}
......
......@@ -25,10 +25,10 @@ export default {
},
computed: {
titleContent () {
if (this.cell) return this.cell.data.content
if (this.cell && this.cell.source._value) return this.cell.source._value.content
},
link () {
if (this.cell) return this.cell.data.link
if (this.cell && this.cell.source._value) return this.cell.source._value.link
}
}
}
......
......@@ -153,9 +153,16 @@
},
cacheNewCell (item) {
const resourceCell = {
data: { content: item.value },
config: {},
component: item.component
source: {
value: {
content: item.value
}
},
configuration: {
value: {
component: item.component
}
}
}
this.$store.commit('mosys/cacheNewCell', resourceCell)
if (this.isMobile) this.$store.commit('mosys/toggleSources')
......
......@@ -69,12 +69,16 @@
},
handleItemDragStart (event, item) {
const resourceCell = {
data: {
content: `${process.env.STORAGE_HOST}/files/${this.bucketName}/${item.name}`,
type: this.getSimpleType(item.metaData['content-type'], true)
source: {
value: {
content: `${process.env.STORAGE_HOST}/files/${this.bucketName}/${item.name}`,
type: this.getSimpleType(item.metaData['content-type'], true)
}
},
config: {},
component: 'CellImage'
configuration: {
value: {},
component: 'CellImage'
}
}
event.dataTransfer.setData('text/plain', JSON.stringify(resourceCell))
}
......
......@@ -67,12 +67,17 @@
methods: {
cacheNewCell (item, component = 'CellMedia') {
const resourceCell = {
component,
config: {},
data: {
id: item.id,
sourceUuid: item._uuid,
content: component === 'CellMedia' ? item.body.source.id : item.id
configuration: {
value: {
component
}
},
source: {
value: {
id: item.id,
sourceUuid: item._uuid,
content: component === 'CellMedia' ? item.body.source.id : item.id
}
}
}
this.$store.commit('mosys/cacheNewCell', resourceCell)
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment