148 lines
3.5 KiB
JavaScript
148 lines
3.5 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
|
|
|