Make JS a bit simpler

diff --git a/js/05-makedom.js b/js/05-makedom.js
index 389fe4cd893fe1c0405b70ef0706e31af6f597cc..a938d2cb4e13a94183430c5052861b0d481e5936 100644 (file)
--- a/js/05-makedom.js
+++ b/js/05-makedom.js
@@ -3,3 +3,7 @@ function m(html) {
        div.innerHTML = html;
        return div.firstChild;
 }
        div.innerHTML = html;
        return div.firstChild;
 }

+
+function q(selector) {
+       return document.querySelector(selector);
+}

diff --git a/js/10-modal.js b/js/10-modal.js
index 3a8a214a6c1716bda539d27ed58ff7b2313bd0e2..d930f44ef0b6b3f956f0076b8055295c8f73de1e 100644 (file)
--- a/js/10-modal.js
+++ b/js/10-modal.js
@@ -13,8 +13,8 @@ function hide_modal () {
 }
 
 $(function() {
 }
 
 $(function() {

-       modal = $('.modal')[0];
-       backdrop = $('.backdrop')[0];
+       modal = q('.modal');
+       backdrop = q('.backdrop');

        $(modal).on('transitionend', el => {
                if(!document.body.classList.contains('modal-open'))
                        modal.classList.add('hidden');
        $(modal).on('transitionend', el => {
                if(!document.body.classList.contains('modal-open'))
                        modal.classList.add('hidden');

diff --git a/js/80-sidebar.js b/js/80-sidebar.js
index 2f6ca8ac734a7e107c2209cbd12fa891826a3b0c..5120df52eee0be2b289203e1949500b4e4446b1a 100644 (file)
--- a/js/80-sidebar.js
+++ b/js/80-sidebar.js
@@ -1,6 +1,6 @@
 $(function() {
        if(!document.getElementById('sidebar')) {
 $(function() {
        if(!document.getElementById('sidebar')) {

-        const content = $('main')[0];
+        const content = q('main');

                content.innerHTML = '<div class="col-md-9">' + content.innerHTML + '</div><aside id="sidebar" class="col-md-3"></aside>';
                content.classList.add('row');
     }
                content.innerHTML = '<div class="col-md-9">' + content.innerHTML + '</div><aside id="sidebar" class="col-md-3"></aside>';
                content.classList.add('row');
     }

diff --git a/js/90-divine-format.js b/js/90-divine-format.js
index da4885695889324bcd9a0712920901b7b5385cee..a842de1353c790ea649ba05cdfff7ce53f67a178 100644 (file)
--- a/js/90-divine-format.js
+++ b/js/90-divine-format.js
@@ -30,11 +30,11 @@ const ext_table = {
 }
 
 function divine_format() {
 }
 
 function divine_format() {

-       const filename = $('#prog')[0].value;
+       const filename = q('#prog').value;

        const ext = /\.([^.]*)$/.exec(filename)[1];
 
        if(ext_table[ext])
        const ext = /\.([^.]*)$/.exec(filename)[1];
 
        if(ext_table[ext])

-               $('#prog_format')[0].value = ext_table[ext];
+               q('#prog_format').value = ext_table[ext];

 }
 
 $(() => $('#prog').on('change', divine_format));
 }
 
 $(() => $('#prog').on('change', divine_format));

diff --git a/js/90-form.js b/js/90-form.js
index aa5e9eff1428750ba2ec818136dd424f60f7cfd8..a30e7f4fc81f68c1aa3b25a9bebde8c04f099b90 100644 (file)
--- a/js/90-form.js
+++ b/js/90-form.js
@@ -1,5 +1,5 @@
 $(function(){
 $(function(){

-       const result = $('#result')[0];
+       const result = q('#result');

        $('.jsform > input[type="submit"]').on('click', e => {
                const form_data = new FormData(this.parentElement);
                const form = this.parentNode;
        $('.jsform > input[type="submit"]').on('click', e => {
                const form_data = new FormData(this.parentElement);
                const form = this.parentNode;

diff --git a/js/90-mobilenav.js b/js/90-mobilenav.js
index 36e7298b9b4b43e834b9fd6c7be2a41f97b72e45..bd47c8f90091af3f3fe1744931e6bae949f25748 100644 (file)
--- a/js/90-mobilenav.js
+++ b/js/90-mobilenav.js
@@ -1,6 +1,6 @@
 $(function(){
 $(function(){

-       const nav = $('nav')[0];
+       const nav = q('nav');

        nav.classList.add('hidden-xs');
        nav.classList.add('hidden-xs');

-       $('#title')[0].insertAdjacentHTML('beforebegin', '<div class="text-center visible-xs-block">Tap title to toggle menu</div>');
+       q('#title').insertAdjacentHTML('beforebegin', '<div class="text-center visible-xs-block">Tap title to toggle menu</div>');

        $('#title').on('click', () => nav.classList.toggle('hidden-xs'));
 });
        $('#title').on('click', () => nav.classList.toggle('hidden-xs'));
 });

diff --git a/js/90-nav.js b/js/90-nav.js
index b4127d6390eb55977b1a5f4b7f0f2e5d060d31d9..36aec02c3b8c9b9229b6129778e78ba3fb9db93d 100644 (file)
--- a/js/90-nav.js
+++ b/js/90-nav.js
@@ -12,5 +12,5 @@ $(function(){
        const path = location.pathname;
        for (const nav in NAVS)
                if(path.match(NAVS[nav]))
        const path = location.pathname;
        for (const nav in NAVS)
                if(path.match(NAVS[nav]))

-                       $('#nav-' + nav)[0].classList.add('active');
+                       q('#nav-' + nav).classList.add('active');

 });
 });

diff --git a/js/90-themes.js b/js/90-themes.js
index a9d9b5185ebf5f1bd905dffc0767b46841b7bf4e..3f761fc47a27179b635d90d9c1b1bd893ec3da4f 100644 (file)
--- a/js/90-themes.js
+++ b/js/90-themes.js
@@ -4,7 +4,7 @@ function set_style(name, trans){
                setTimeout(() => document.body.classList.remove('transition-color'), 1000);
        }
        $('link[title]').each(e => e.disabled = true);
                setTimeout(() => document.body.classList.remove('transition-color'), 1000);
        }
        $('link[title]').each(e => e.disabled = true);

-       $('link[title="' + name + '"]')[0].disabled = false;
+       q('link[title="' + name + '"]').disabled = false;

        localStorage.setItem("theme", name);
 }
 
        localStorage.setItem("theme", name);
 }
 


@@ -13,7 +13,7 @@ $(function() {
                '<li><a role="button" data-theme="cyborg">Black</a>' +
                '<li><a role="button" data-theme="slate">Grey</a>' +
                '<li><a role="button" data-theme="readable">White</a></ul>';
                '<li><a role="button" data-theme="cyborg">Black</a>' +
                '<li><a role="button" data-theme="slate">Grey</a>' +
                '<li><a role="button" data-theme="readable">White</a></ul>';

-       const sidebar = $('#sidebar')[0];
+       const sidebar = q('#sidebar');

        sidebar.insertBefore(m(theme_ul), sidebar.firstChild);
        $('#themes a').on('click', e => set_style(e.target.dataset.theme, true));
 });
        sidebar.insertBefore(m(theme_ul), sidebar.firstChild);
        $('#themes a').on('click', e => set_style(e.target.dataset.theme, true));
 });

diff --git a/js/90-tracker.js b/js/90-tracker.js
index b7f5e57bacf36f6ff56a03e7fa5220c069daf286..6b73fb34808e332a6ae1bf50656a97f58b4241d9 100644 (file)
--- a/js/90-tracker.js
+++ b/js/90-tracker.js
@@ -31,11 +31,11 @@ function update_tracker(){
        data.contests.forEach(e => contests[e.contest] = 1);
 
        clean_tracker();
        data.contests.forEach(e => contests[e.contest] = 1);
 
        clean_tracker();

-       $('#tracker_userlink')[0].innerHTML = data.name;
-       $('#tracker_solved')[0].innerHTML = solvednr;
-       $('#tracker_attempted')[0].innerHTML = attemptednr;
-       $('#tracker_contests')[0].innerHTML = data.contests.length;
-       $('#tracker_log')[0].setAttribute('href', '/log/?owner=' + user);
+       q('#tracker_userlink').innerHTML = data.name;
+       q('#tracker_solved').innerHTML = solvednr;
+       q('#tracker_attempted').innerHTML = attemptednr;
+       q('#tracker_contests').innerHTML = data.contests.length;
+       q('#tracker_log').setAttribute('href', '/log/?owner=' + user);

 
        if(location.pathname == '/pb/')
                $('table .name a').each(el => {
 
        if(location.pathname == '/pb/')
                $('table .name a').each(el => {


@@ -73,8 +73,8 @@ function update_tracker(){
 
 function start_tracking(user){
        localStorage.setItem('tracker_username', user);
 
 function start_tracking(user){
        localStorage.setItem('tracker_username', user);

-       $('#tracker_userlink')[0].setAttribute('href', '/us/' + user);
-       $('#tracker_userlink')[0].innerHTML = user;
+       q('#tracker_userlink').setAttribute('href', '/us/' + user);
+       q('#tracker_userlink').innerHTML = user;

        tracker.classList.remove('hidden');
        update_tracker();
        const lastfetch = localStorage.getItem('tracker_lastfetch');
        tracker.classList.remove('hidden');
        update_tracker();
        const lastfetch = localStorage.getItem('tracker_lastfetch');


@@ -104,7 +104,7 @@ function stop_tracking(){
 
 $(function(){
        tracker = m('<div id="tracker" class="hidden">Tracking <a id="tracker_userlink"></a>.<br><a id="tracker_stop" role="button">Stop tracking</a><br><a id="tracker_log">Job log</a><dl class="dl-horizontal"><dt>Solved</dt>    <dd id="tracker_solved">?</dd><dt>Attempted</dt> <dd id="tracker_attempted">?</dd><dt>Contests</dt>  <dd id="tracker_contests">?</dd></dl></div>');
 
 $(function(){
        tracker = m('<div id="tracker" class="hidden">Tracking <a id="tracker_userlink"></a>.<br><a id="tracker_stop" role="button">Stop tracking</a><br><a id="tracker_log">Job log</a><dl class="dl-horizontal"><dt>Solved</dt>    <dd id="tracker_solved">?</dd><dt>Attempted</dt> <dd id="tracker_attempted">?</dd><dt>Contests</dt>  <dd id="tracker_contests">?</dd></dl></div>');

-       const sidebar = $('#sidebar')[0];
+       const sidebar = q('#sidebar');

        sidebar.insertBefore(tracker, sidebar.firstChild);
        $('#tracker_stop').on('click', stop_tracking);
        $('#track_user').on('click', function() { stop_tracking(); start_tracking(this.dataset.user) });
        sidebar.insertBefore(tracker, sidebar.firstChild);
        $('#tracker_stop').on('click', stop_tracking);
        $('#track_user').on('click', function() { stop_tracking(); start_tracking(this.dataset.user) });

diff --git a/js/95-login.js b/js/95-login.js
index aad77d370682a1ad5b47eef8a9ec7f80f59197d0..6036aef912343ba1049dc0795ca6ba8b845b25c0 100644 (file)
--- a/js/95-login.js
+++ b/js/95-login.js
@@ -1,5 +1,5 @@
 $(function(){
 $(function(){

-       const sidebar = $('#sidebar')[0];
+       const sidebar = q('#sidebar');

        const login = document.createElement('div');
        login.innerHTML = '<a role="button" id="login" class="show">Log in</a>';
        sidebar.insertBefore(login, sidebar.firstChild);
        const login = document.createElement('div');
        login.innerHTML = '<a role="button" id="login" class="show">Log in</a>';
        sidebar.insertBefore(login, sidebar.firstChild);