Enable spookiness.

assets/css/misuzu/_msz.css

@@ -21,7 +21,7 @@ body {
 :root {
     --font-size: 12px;
     --line-height: 20px;
-    --font-regular: Verdana, Geneva, 'Dejavu Sans', Arial, Helvetica, sans-serif;
+    --font-regular: Tahoma, Geneva, 'Dejavu Sans', Arial, Helvetica, sans-serif;
     --font-monospace: Consolas, 'Liberation Mono', Menlo, Courier, monospace;
 
     --site-max-width: 1200px;
@@ -53,6 +53,10 @@ body {
     --user-header: url('/images/pixel.png');
     --accent-colour: #8559a5;
     --header-accent-colour: var(--accent-colour);
+
+    /** octobre **/
+    --site-logo: url('/images/logos/imouto-halloween.png');
+    --accent-colour: #ee9400;
 }
 
 html {

assets/css/misuzu/footer.css

@@ -5,7 +5,6 @@
     color: inherit;
     text-decoration: none;
 }
-.footer__link:focus,
 .footer__link:hover {
     text-decoration: underline;
 }

assets/css/misuzu/header.css

@@ -55,6 +55,7 @@
 .header__desktop__link:focus {
     background-color: rgba(255, 255, 255, .2);
 }
+
 .header__desktop__link:active {
     background-color: rgba(255, 255, 255, .1);
 }
@@ -281,6 +282,6 @@
 @media (max-width: 800px) {
     .header__desktop { display: none; }
 }
-@media (min-width: 801px) {
+@media (min-width: 800px) {
     .header__mobile { display: none; }
 }

assets/js/misuzu/_main.js

@@ -15,6 +15,7 @@ var Misuzu = function() {
     Misuzu.CSRF.init();
     Misuzu.Urls.loadFromDocument();
     Misuzu.User.refreshLocalUser();
+    Misuzu.UserRelations.init();
     Misuzu.FormUtils.initDataRequestMethod();
     Misuzu.initQuickSubmit();
     Misuzu.Comments.init();

assets/js/misuzu/userrels.js

@@ -0,0 +1,104 @@
+Misuzu.UserRelations = {};
+Misuzu.UserRelations.Type = DefineEnum({ none: 0, follow: 1, });
+Misuzu.UserRelations.init = function() {
+    var buttons = document.getElementsByClassName('js-user-relation-action');
+
+    for(var i = 0; i < buttons.length; ++i) {
+        switch(buttons[i].tagName.toLowerCase()) {
+            case 'a':
+                buttons[i].removeAttribute('href');
+                buttons[i].removeAttribute('target');
+                buttons[i].removeAttribute('rel');
+                break;
+        }
+
+        buttons[i].addEventListener('click', Misuzu.UserRelations.setRelationHandler);
+    }
+};
+Misuzu.UserRelations.setRelation = function(user, type, onSuccess, onFailure) {
+    var xhr = new XMLHttpRequest;
+    xhr.addEventListener('readystatechange', function() {
+        if(xhr.readyState !== 4)
+            return;
+
+        Misuzu.CSRF.setToken(xhr.getResponseHeader('X-Misuzu-CSRF'));
+
+        var json = JSON.parse(xhr.responseText),
+            message = json.error || json.message;
+
+        if(message && onFailure)
+            onFailure(message);
+        else if(!message && onSuccess)
+            onSuccess(json);
+    });
+    xhr.open('GET', Misuzu.Urls.format('user-relation-create', [Misuzu.Urls.v('user', user), Misuzu.Urls.v('type', type)]));
+    xhr.setRequestHeader('X-Misuzu-XHR', 'user_relation');
+    xhr.setRequestHeader('X-Misuzu-CSRF', Misuzu.CSRF.getToken());
+    xhr.send();
+};
+Misuzu.UserRelations.ICO_ADD = 'fas fa-user-plus';
+Misuzu.UserRelations.ICO_REM = 'fas fa-user-minus';
+Misuzu.UserRelations.ICO_BUS = 'fas fa-spinner fa-pulse';
+Misuzu.UserRelations.BTN_BUS = 'input__button--busy';
+Misuzu.UserRelations.setRelationHandler = function(ev) {
+    var target       = this,
+        userId       = parseInt(target.dataset.relationUser),
+        relationType = parseInt(target.dataset.relationType),
+        isButton     = target.classList.contains('input__button'),
+        icon         = target.querySelector('[class^="fa"]');
+
+    if(isButton) {
+        if(target.classList.contains(Misuzu.UserRelations.BTN_BUS))
+            return;
+        target.classList.add(Misuzu.UserRelations.BTN_BUS);
+    }
+
+    if(icon)
+        icon.className = Misuzu.UserRelations.ICO_BUS;
+
+    Misuzu.UserRelations.setRelation(
+        userId,
+        relationType,
+        function(info) {
+            target.classList.remove(Misuzu.UserRelations.BTN_BUS);
+
+            switch(info.relation_type) {
+                case Misuzu.UserRelations.Type.none:
+                    if(isButton) {
+                        if(target.classList.contains('input__button--destroy'))
+                            target.classList.remove('input__button--destroy');
+
+                        target.textContent = 'Follow';
+                    }
+
+                    if(icon) {
+                        icon.className = Misuzu.UserRelations.ICO_ADD;
+                        target.title = 'Follow';
+                    }
+
+                    target.dataset.relationType = Misuzu.UserRelations.Type.follow.toString();
+                    break;
+
+                case Misuzu.UserRelations.Type.follow:
+                    if(isButton) {
+                        if(!target.classList.contains('input__button--destroy'))
+                            target.classList.add('input__button--destroy');
+
+                        target.textContent = 'Unfollow';
+                    }
+
+                    if(icon) {
+                        icon.className = Misuzu.UserRelations.ICO_REM;
+                        target.title = 'Unfollow';
+                    }
+
+                    target.dataset.relationType = Misuzu.UserRelations.Type.none.toString();
+                    break;
+            }
+        },
+        function(msg) {
+            target.classList.remove(Misuzu.UserRelations.BTN_BUS);
+            Misuzu.showMessageBox(msg);
+        }
+    );
+};