Website now runs on Dart’s webdev
langue.phundrak.com now runs using the `webdev` tool from Dart. Javascript code has been replaced with Dart code, and CSS code has been replaced with SCSS code. To run the project, execute `webdev serve` at the project’s root.
This commit is contained in:
11
web/dart/cookie.dart
Normal file
11
web/dart/cookie.dart
Normal file
@@ -0,0 +1,11 @@
|
||||
@JS()
|
||||
library cookie;
|
||||
|
||||
import 'package:js/js.dart';
|
||||
|
||||
@JS()
|
||||
class Cookies {
|
||||
// external factory Cookie();
|
||||
external static String get(String name);
|
||||
external static void set(String name, String value);
|
||||
}
|
||||
59
web/dart/main.dart
Normal file
59
web/dart/main.dart
Normal file
@@ -0,0 +1,59 @@
|
||||
@JS()
|
||||
library main;
|
||||
|
||||
import 'dart:html';
|
||||
|
||||
import 'package:js/js.dart';
|
||||
import './cookie.dart';
|
||||
|
||||
void main() {
|
||||
reorganizeHtml();
|
||||
createThemeSwitcher();
|
||||
querySelector('.themeBtn').onClick.listen(themeSwitch);
|
||||
}
|
||||
|
||||
void createThemeSwitcher() {
|
||||
// set the correct CSS depending on the cookie, dark is enabled by default
|
||||
var isDark = isThemeDark();
|
||||
// Set the correct symbol in the theme switcher button
|
||||
querySelector('body').append(DivElement()..className = 'themeBtn');
|
||||
querySelector('.themeBtn')
|
||||
.children
|
||||
.add(Element.tag('i')..className = 'fas fa-' + (isDark ? 'sun' : 'moon'));
|
||||
}
|
||||
|
||||
bool isThemeDark() {
|
||||
if (Cookies.get('theme') == 'light') {
|
||||
return false;
|
||||
}
|
||||
Cookies.set('theme', 'dark');
|
||||
return true;
|
||||
}
|
||||
|
||||
bool setTheme(bool dark) {
|
||||
Cookies.set('theme', (dark ? 'dark' : 'light'));
|
||||
return !dark;
|
||||
}
|
||||
|
||||
void themeSwitch(MouseEvent event) {
|
||||
print('Switch theme');
|
||||
bool isDark = setTheme(isThemeDark());
|
||||
querySelector('.fas').className = 'fas fa-' + (isDark ? 'sun' : 'moon');
|
||||
querySelector('#theme').attributes['href'] =
|
||||
'/css/' + (isDark ? 'dark' : 'light') + '.css';
|
||||
}
|
||||
|
||||
void reorganizeHtml() {
|
||||
// Add a <hr> element after the content div
|
||||
querySelector('#content').appendHtml('<hr>');
|
||||
|
||||
// Move the postamble in the content div
|
||||
querySelector('#content').append(querySelector('#postamble'));
|
||||
|
||||
for (var table in querySelectorAll('table')) {
|
||||
var largetable = DivElement();
|
||||
largetable.className = 'largetable';
|
||||
table.before(largetable);
|
||||
largetable.children.add(table);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user