File
Implements
Metadata
selector |
app-settings |
styleUrls |
app-settings.component.css |
templateUrl |
./app-settings.component.html |
import { Component, OnInit } from '@angular/core';
import { SizeService } from '../../services/size.service';
import { TranslationService } from '../../services/translation.service';
@Component({
selector: 'app-settings',
templateUrl: './app-settings.component.html',
styleUrls: ['./app-settings.component.css']
})
export class AppSettingsComponent implements OnInit {
constructor(private sizeService: SizeService, private translationService: TranslationService) {
this.lang = translationService.getActualLang();
}
size = 'auto';
lang: string;
ngOnInit() {
if (this.sizeService.getWidth() && this.sizeService.getHeight()) {
this.size = this.sizeService.getWidth() + 'x' + this.sizeService.getHeight();
}
}
changeSize() {
if (this.size === 'auto') {
this.sizeService.changeSize(null, null);
} else {
const size = this.size.split('x');
this.sizeService.changeSize(size[0], size[1]);
}
}
changeLang() {
this.translationService.changeLanguage(this.lang);
}
}
<!--
This file is part of Web Virtual DJ.
Web Virtual DJ is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
Web Virtual DJ is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
You should have received a copy of the GNU General Public License
along with Web Virtual DJ. If not, see <https://www.gnu.org/licenses/>.
-->
<div class="settings-container" id="app_settings">
<div class="question-container">
<div class="question">
<div class="question-label">{{ 'SETTINGS.LANGUAGE' | translate }}</div>
<select [(ngModel)]=lang (ngModelChange)="changeLang()">
<option value="en">English</option>
<option value="es">Spanish</option>
</select>
</div>
<!-- <div class="question">
<div class="question-label">Template</div>
<select>
<option value="li">Light</option>
<option value="da">Dark</option>
</select>
</div> -->
<div class="question">
<div class="question-label">{{ 'SETTINGS.RESOLUTION' | translate }}</div>
<select [(ngModel)]=size (ngModelChange)="changeSize()">
<option value="auto">{{ 'SETTINGS.AUTO' | translate }}</option>
<option value="1920x1200">1920x1200</option>
<option value="1920x1080">1920x1080</option>
<option value="1600x900">1600x900</option>
<option value="1680x1050">1680x1050</option>
<option value="1366x768">1366x768</option>
<option value="1360x768">1360x768</option>
<option value="1280x1024">1280x1024</option>
<option value="1280x800">1280x800</option>
<option value="1280x720">1280x720</option>
<option value="1024x768">1024x768</option>
</select>
</div>
</div>
</div>