128 lines
3.4 KiB
JavaScript
128 lines
3.4 KiB
JavaScript
import Card from './card.js'
|
|
|
|
/**
|
|
* Extends the card with scatter functionality.
|
|
*
|
|
* @class ScatterCard
|
|
*/
|
|
export default class ScatterCard extends Card {
|
|
/**
|
|
* TODO: Find a more suitable name.
|
|
* Adjusts the HTML to work in the new context.
|
|
*
|
|
* @static
|
|
* @param {*} domElement
|
|
* @param {*} htmlString
|
|
* @param {*} basePath
|
|
* @param {*} [opts={}]
|
|
* @memberof Card
|
|
*/
|
|
static setup(context, htmlString, { basePath = './', modules = [] } = {}) {
|
|
context.classList.add('info-card')
|
|
|
|
this.relativePath = basePath
|
|
htmlString = this._adjustRelativeLinks(htmlString)
|
|
|
|
let parser = new DOMParser()
|
|
let html = parser.parseFromString(htmlString, 'text/html')
|
|
|
|
/**
|
|
* Conflicts with the FindTarget method of the Abstract scatter.
|
|
*/
|
|
this._replaceAttributes(html, 'onclick', this._replaceCallback)
|
|
|
|
let content = html.querySelector('.mainview')
|
|
context.appendChild(content)
|
|
|
|
super.setup(context, modules)
|
|
return context
|
|
}
|
|
|
|
/**
|
|
* Appends a close listener to the scatter element.
|
|
*
|
|
* @static
|
|
* @param {*} element
|
|
* @param {*} callback
|
|
* @memberof Card
|
|
*/
|
|
static addOnCloseListener(element, callback) {
|
|
if (callback) {
|
|
element.onClose = callback
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Creates a scatter for the card and applies the card to it,
|
|
*
|
|
* @static
|
|
* @param {*} html
|
|
* @param {*} scatterContainer
|
|
* @param {string} [basePath=""]
|
|
* @param {*} [opts={}]
|
|
* @returns
|
|
* @memberof Card
|
|
*/
|
|
static createCardScatter(html, scatterContainer, { basePath = './', modules = [] } = {}) {
|
|
let element = document.createElement('div')
|
|
|
|
scatterContainer.element.appendChild(element)
|
|
new DOMScatter(element, scatterContainer, {
|
|
width: 1400,
|
|
height: 1200
|
|
})
|
|
|
|
this.setup(element, html, {
|
|
basePath,
|
|
modules
|
|
})
|
|
return element
|
|
}
|
|
|
|
/**
|
|
*Utility function to create a fully functional card scatter.
|
|
*
|
|
* @static
|
|
* @param {*} scatterContainer
|
|
* @param {*} path
|
|
* @param {string} [basePath="."]
|
|
* @param {*} opts
|
|
* @returns
|
|
* @memberof CardScatter
|
|
*/
|
|
static loadAndCreateScatterCard(scatterContainer, item, { basePath = '../', modules = [], onClose = null } = {}) {
|
|
console.log(basePath)
|
|
return new Promise((resolve, reject) => {
|
|
let url = basePath + '/' + item + '/index.html'
|
|
console.log('Loading', url)
|
|
this.loadHTML(url)
|
|
.then(html => {
|
|
console.log('Received', html)
|
|
let element = this.createCardScatter(html, scatterContainer, {
|
|
basePath,
|
|
modules
|
|
})
|
|
if (onClose) this.addOnCloseListener(element, onClose)
|
|
resolve(element)
|
|
})
|
|
.catch(e => reject(e))
|
|
})
|
|
}
|
|
|
|
static _setLanguage(context, language) {
|
|
context.language = language
|
|
}
|
|
|
|
static _getLanguage(context) {
|
|
return context.language
|
|
}
|
|
}
|
|
|
|
ScatterCard.selectedLanguage = 0
|
|
ScatterCard.languages = ['Deutsch', 'English']
|
|
ScatterCard.languageTags = {
|
|
Deutsch: 'de',
|
|
English: 'en'
|
|
}
|
|
ScatterCard.scatterContainer = null
|