You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
84 lines
1.7 KiB
JavaScript
84 lines
1.7 KiB
JavaScript
export class PageSettings extends HTMLElement {
|
|
textEn = {
|
|
netAccess: 'Direct network access (CSP)',
|
|
}
|
|
|
|
textEs = {
|
|
netAccess: 'Acceso directo a la red (CSP)',
|
|
}
|
|
|
|
constructor() {
|
|
super()
|
|
this.attachShadow({mode: 'open'})
|
|
this.language = navigator.language
|
|
const netSelectHeading = document.createElement('div')
|
|
netSelectHeading.classList.add('heading')
|
|
netSelectHeading.innerText = this.text.netAccess
|
|
this.network = document.createElement(
|
|
'm-settings-network-settings'
|
|
)
|
|
this.shadowRoot.append(
|
|
netSelectHeading,
|
|
this.network,
|
|
)
|
|
}
|
|
|
|
connectedCallback() {
|
|
const style = document.createElement('style')
|
|
style.textContent = `
|
|
:host {
|
|
max-height: 55vh;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: stretch;
|
|
overflow-y: auto;
|
|
}
|
|
* {
|
|
padding-left: 10px;
|
|
}
|
|
div.heading {
|
|
display: flex;
|
|
flex-direction: row;
|
|
justify-content: flex-start;
|
|
background: #f2dbd8;
|
|
padding: 3px;
|
|
margin-bottom: 5px;
|
|
font-weight: bold;
|
|
}
|
|
`
|
|
this.shadowRoot.append(style)
|
|
}
|
|
|
|
get data() {
|
|
return {
|
|
...this.network.data,
|
|
}
|
|
}
|
|
|
|
set data(value) {
|
|
this.network.data = {
|
|
networkAccess: value.networkAccess
|
|
}
|
|
}
|
|
|
|
set cspProfiles(value) {
|
|
this.network.cspProfiles = value
|
|
}
|
|
|
|
get language() {
|
|
return this._language
|
|
}
|
|
|
|
set language(language) {
|
|
this._language = language
|
|
this.text = this.langEs ? this.textEs : this.textEn
|
|
}
|
|
|
|
get langEs() {
|
|
return /^es\b/.test(this.language)
|
|
}
|
|
|
|
get lang() {
|
|
return this.language.split('-')[0]
|
|
}
|
|
} |