Files
homework-vocabulary/javascript/homeworkPage.js

96 lines
3.4 KiB
JavaScript

class HomeworkPage extends HomeworkElement {
constructor (type) {
super()
this.innerHTML =
`
<div id="page-header">
<h2 id="text005" class="text"></h2>
<div id="buttons">
<div id="new" class="button">
<span id="text035" class="button-text text"></span>
</div>
<div id="save" class="button">
<span id="text037" class="button-text text"></span>
</div>
<div id="train" class="button">
<span id="text036" class="button-text text"></span>
</div>
</div>
</div>
<div id="sub-headers">
<p class="text source-language"></p>
<p class="text target-language"></p>
</div>
<div id="content">
</div>
`
let languageTextId = ""
let sourceLanguageTextId = "text030"
let targetLanguageTextId = ""
switch(type) {
case HomeworkTypes.VOCABULARY_ENGLISH:
console.log("English vocabulary")
languageTextId = "text005"
targetLanguageTextId = "text031"
break
case HomeworkTypes.VOCABULARY_FRENCH:
console.log("French vocabulary")
languageTextId = "text025"
targetLanguageTextId = "text032"
break
case HomeworkTypes.VOCABULARY_GERMAN:
console.log("German vocabulary")
languageTextId = "text024"
targetLanguageTextId = "text034"
break
case HomeworkTypes.VOCABULARY_SPANISH:
console.log("Spanish vocabulary")
languageTextId = "text026"
targetLanguageTextId = "text033"
break
default:
console.log("Math")
languageTextId = "text004"
}
this.type = type
this.headingText = this.querySelector('h2')
this.headingText.setAttribute("id", languageTextId)
this.languageHeaders = this.querySelectorAll('#sub-headers > p')
this.sourceLanguage = this.languageHeaders[0]
this.targetLanguage = this.languageHeaders[1]
this.sourceLanguage.setAttribute("id", sourceLanguageTextId)
this.targetLanguage.setAttribute("id", targetLanguageTextId)
this.content = this.querySelector('#content')
this.newButton = this.querySelector('#new')
this.newButton.addEventListener("click", this.newVocabulary.bind(this))
this.saveButton = this.querySelector('#save')
this.saveButton.addEventListener("click", this.saveVocabularies.bind(this))
this.trainButton = this.querySelector('#train')
this.trainButton.addEventListener("click", this.trainVocabulary.bind(this))
}
connectedCallback() {
console.log("Page of type " + this.type + " added to session")
if(this.type == HomeworkTypes.VOCABULARY_ENGLISH) {
const row = new HomeworkVocabularyTask()
this.content.append(row)
}
}
newVocabulary() {
if(this.type == HomeworkTypes.VOCABULARY_ENGLISH) {
const row = new HomeworkVocabularyTask()
this.content.append(row)
console.log("New row in page")
}
}
saveVocabularies() {
console.log("Saving page content")
}
trainVocabulary() {
console.log("Train!!")
}
}
customElements.define('homework-page', HomeworkPage)