From deb4dc108945f09e609ed2d15264c4d4efe76844 Mon Sep 17 00:00:00 2001 From: flashwave Date: Sat, 23 Oct 2021 19:26:01 +0200 Subject: [PATCH] Enable spookiness. --- assets/css/misuzu/_msz.css | 6 +- assets/css/misuzu/footer.css | 1 - assets/css/misuzu/header.css | 3 +- assets/js/misuzu/_main.js | 1 + assets/js/misuzu/userrels.js | 104 +++++++++++++++++++++++++++++++++++ 5 files changed, 112 insertions(+), 3 deletions(-) create mode 100644 assets/js/misuzu/userrels.js diff --git a/assets/css/misuzu/_msz.css b/assets/css/misuzu/_msz.css index afe7f675..9b3b0b1a 100644 --- a/assets/css/misuzu/_msz.css +++ b/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 { diff --git a/assets/css/misuzu/footer.css b/assets/css/misuzu/footer.css index 79360e95..6c4d1548 100644 --- a/assets/css/misuzu/footer.css +++ b/assets/css/misuzu/footer.css @@ -5,7 +5,6 @@ color: inherit; text-decoration: none; } -.footer__link:focus, .footer__link:hover { text-decoration: underline; } diff --git a/assets/css/misuzu/header.css b/assets/css/misuzu/header.css index c7e810cb..d96878f2 100644 --- a/assets/css/misuzu/header.css +++ b/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; } } diff --git a/assets/js/misuzu/_main.js b/assets/js/misuzu/_main.js index 062c1120..27f15a15 100644 --- a/assets/js/misuzu/_main.js +++ b/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(); diff --git a/assets/js/misuzu/userrels.js b/assets/js/misuzu/userrels.js new file mode 100644 index 00000000..791c4933 --- /dev/null +++ b/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); + } + ); +};