Кнопка "случайная страница" и оптимизированный переключатель для: top. / dev :: top.joyreactor :: реактор

Кнопка "случайная страница" и оптимизированный переключатель для: top.joyreactor.cc



Оптимизированный переключатель
⠀На top.joyreactor.cc при переключении из sfw или nsfw наступить по середине (то есть нужно нажать два раза) и появляется одна ненужная загрузка страницы страницы. Что бы этого избежать я предлагаю заменить "переключатель" на три кнопки.
⠀Также я написал такой переключатель при необходимости можете использовать его или создать своё решение.

Как работает мой вариант
*Через JS генерируется советизированные три ссылки (элемента <a>) на основе вопроса: текший адрес содержит параметр "sfw" или "nsfw"?
*Вроде бы самодостаточный встраивается куда угодно но возможно чего то не хватает
⠀*Нечего не подгружает из вне
*Основа CSS взята из top.joyreactor.cc но итоговый вариант немного длиннее возможны другие отличия
⠀*Добавлена подсветка но плавная анимация подсветки отключена мне она показалась "пьяной" в данном месте
*Проверено в:
⠀*Chrome 49.????? 32 windows (полная работоспособность)
⠀*FireFox 52.????? 32 windows (полная работоспособность)
⠀*Internet Exploer 7 32 windows (техническая работоспособность css заработал не весь возможно из за отсутствия правильного <!DOCKTYPE>)

Мой код переключателя (при "постинге" возможно сломается)

<span style=color:#756e62;font-family:open-sans,sans-serif;font-size:13px;font-weight:700>sfw<div style="display:inline-block;border:solid 2px #756e62;width:76px;height:28px;box-sizing:border-box;border-radius:14px;vertical-align:middle;margin:9px"><script>document.write(
'<a href='+(window.location.href.split('?')[0]+'?sfw')+' style="display:inline-block;outline:0;width:18px;height:18px;border-radius:9px;margin:3px;cursor:pointer;/*transition:background 0.5s;*/background:'+(window.location.href.split('?')[1]=='sfw'?'#756e62':'none')+'" onmouseover=this.style.background="#fca91a" onmouseout=this.style.background="'+(window.location.href.split('?')[1]=='sfw'?'#756e62':'none')+'"></a>'+
'<a href='+window.location.href.split('?')[0]+' style="display:inline-block;outline:0;width:18px;height:18px;border-radius:9px;margin:3px;cursor:pointer;/*transition:background 0.5s;*/background:'+(window.location.href.split('?')[1]==undefined?'#756e62':'none')+'" onmouseover=this.style.background="#fca91a" onmouseout=this.style.background="'+(window.location.href.split('?')[1]==undefined?'#756e62':'none')+'"></a>'+
'<a href='+(window.location.href.split('?')[0]+'?nsfw')+' style="display:inline-block;outline:0;width:18px;height:18px;border-radius:9px;margin:3px;cursor:pointer;/*transition:background 0.5s;*/background:'+(window.location.href.split('?')[1]=='nsfw'?'#756e62':'none')+'" onmouseover=this.style.background="#fca91a" onmouseout=this.style.background="'+(window.location.href.split('?')[1]=='nsfw'?'#756e62':'none')+'"></a>'
)</script></div>nsfw</span>


Кнопка "случайная страница" top.joyreactor.cc
Пост: http://joyreactor.cc/post/4760382 (второй мини пост)
"Также на старте проекта мне хватало кнопки "random"(открыть случайную страницу)"






Реализация моего варианта
*Перенаправление через onclick на процедурно с генерированную ссылку
*Имеет 5 режимов работы замените значение "type1='auto'" в начале в одинарных кавычках для:
⠀*type1='auto', /*определяет текущее состаяние страницы sfw, nsfw или нечего и создаёт соответствующею ссылку*/
⠀*type1='sfw', /*создаёт sfw ссылку*/
⠀*type1='nsfw', /*создаёт nsfw ссылку*/
⠀*type1='random', /*случайная ссылка sfw, nsfw или нечего*/
⠀*type1='', или type1='someWord', /*ссылка без sfw или nsfw*/
*JS ссылку проверял в полу ручном режиме всё что нужно вроде бы есть а лишнего нет но я возможно что забыл
*Вроде бы самодостаточный встраивается куда угодно но возможно чего то не хватает
⠀*Нечего не подгружает из вне
*Основа CSS взята из top.joyreactor.cc но итоговый вариант немного отличается
*Проверено в:
⠀*Chrome 49.????? 32 windows (полная работоспособность)
⠀*FireFox 52.????? 32 windows (полная работоспособность)
⠀*Internet Exploer 7 32 windows (на данный момент не поддерживается, недодержка в будущем пока не планируются)

Мой код кнопки (при "постинге" возможно сломается)
*JS без новых строк но с немногочисленными комментариями

<button onclick="(function(type1='auto',/* 'auto' 'nsfw' 'sfw' 'random' '' */randomDate1=new Date(new Date(2009,2,21)-(-Math.floor(Math.random()*(Date.now()-new Date(2009,2,21)-604800000/*-week*/-(Date.now()-new Date(new Date(Date.now()).getUTCFullYear(),new Date(Date.now()).getUTCMonth(),new Date(Date.now()).getUTCDate()).getTime())/*-part last week*/-('6012345'[new Date(Date.now()).getUTCDay()]*86400000)/*-part last day*/))))/* random date */){window.location.href='http://top.joyreactor.cc'+(randomDate1.getUTCFullYear()>=2009&&randomDate1.getUTCFullYear()<new Date(Date.now()).getUTCFullYear()?(Math.floor(Math.random()*13)==0?/*or (Math.round(Math.random()*12)==0?*/'/yearTop/'+randomDate1.getUTCFullYear():('/weekTop/'+randomDate1.getUTCFullYear()+'/'+(randomDate1.getUTCFullYear()==2009?12+(Math.round(Math.random()*(53-12))):Math.ceil(Math.random()*53)))):(randomDate1>=Date.now()-604800000-604800000/*-two week*/-(Date.now()-new Date(new Date(Date.now()).getUTCFullYear(),new Date(Date.now()).getUTCMonth(),new Date(Date.now()).getUTCDate()).getTime())/*-part last week*/-('6012345'[new Date(Date.now()).getUTCDay()]*86400000)/*-part last day*/?'':'/weekTop/'+randomDate1.getUTCFullYear()+'/'+Math.ceil(Math.random()*(randomDate1-new Date(new Date(Date.now()).getUTCFullYear(),0,1))/604800000)))+(type1=='auto'?(window.location.href.split('?')[1]=='nsfw'?'?nsfw':window.location.href.split('?')[1]=='sfw'?'?sfw':''):type1=='nsfw'?'?nsfw':type1=='sfw'?'?sfw':type1=='random'?['?nsfw','?sfw',''][Math.floor(Math.random()*['?nsfw','?sfw',''].length)]:'')})()" style="color:#756e62;font-family:open-sans,sans-serif;font-size:14px;font-weight:700;display:inline-block;border:solid 2px #756e62;height:28px;box-sizing:border-box;border-radius:14px;vertical-align:middle;margin:9px;padding:3px 9px;transition:color 0.5s;background:none;cursor:pointer" onmouseover=this.style.color='#fca91a' onmouseout=this.style.color='#756e62'>RANDOM</button>


Запосной вариант сборка на случай если "постинг" зажуёт код сборка всё в одном в Base64 URL (выделять от пустой строки снизу вверх запускать из адресной строки для работы переключателя сохранить как файл)

data:text/html;base64,PHRpdGxlPlByZXZpZXc8L3RpdGxlPjxzcGFuIHN0eWxlPWJhY2tncm91bmQ6IzNhMmUxZTtkaXNwbGF5OmJsb2NrO2hlaWdodDo0NnB4PjxzcGFuIHN0eWxlPWNvbG9yOiM3NTZlNjI7Zm9udC1mYW1pbHk6b3Blbi1zYW5zLHNhbnMtc2VyaWY7Zm9udC1zaXplOjE0cHg7Zm9udC13ZWlnaHQ6NzAwO3BhZGRpbmc6OXB4PiBKb3lSZWFjdG9yPC9zcGFuPiA8YnV0dG9uIG9uY2xpY2s9IihmdW5jdGlvbih0eXBlMT0nYXV0bycsLyogJ2F1dG8nICduc2Z3JyAnc2Z3JyAncmFuZG9tJyAnJyAqL3JhbmRvbURhdGUxPW5ldyBEYXRlKG5ldyBEYXRlKDIwMDksMiwyMSktKC1NYXRoLmZsb29yKE1hdGgucmFuZG9tKCkqKERhdGUubm93KCktbmV3IERhdGUoMjAwOSwyLDIxKS02MDQ4MDAwMDAvKi13ZWVrKi8tKERhdGUubm93KCktbmV3IERhdGUobmV3IERhdGUoRGF0ZS5ub3coKSkuZ2V0VVRDRnVsbFllYXIoKSxuZXcgRGF0ZShEYXRlLm5vdygpKS5nZXRVVENNb250aCgpLG5ldyBEYXRlKERhdGUubm93KCkpLmdldFVUQ0RhdGUoKSkuZ2V0VGltZSgpKS8qLXBhcnQgbGFzdCB3ZWVrKi8tKCc2MDEyMzQ1J1tuZXcgRGF0ZShEYXRlLm5vdygpKS5nZXRVVENEYXkoKV0qODY0MDAwMDApLyotcGFydCBsYXN0IGRheSovKSkpKS8qIHJhbmRvbSBkYXRlICovKXt3aW5kb3cubG9jYXRpb24uaHJlZj0naHR0cDovL3RvcC5qb3lyZWFjdG9yLmNjJysocmFuZG9tRGF0ZTEuZ2V0VVRDRnVsbFllYXIoKT49MjAwOSYmcmFuZG9tRGF0ZTEuZ2V0VVRDRnVsbFllYXIoKTxuZXcgRGF0ZShEYXRlLm5vdygpKS5nZXRVVENGdWxsWWVhcigpPyhNYXRoLmZsb29yKE1hdGgucmFuZG9tKCkqMTMpPT0wPy8qb3IgKE1hdGgucm91bmQoTWF0aC5yYW5kb20oKSoxMik9PTA/Ki8nL3llYXJUb3AvJytyYW5kb21EYXRlMS5nZXRVVENGdWxsWWVhcigpOignL3dlZWtUb3AvJytyYW5kb21EYXRlMS5nZXRVVENGdWxsWWVhcigpKycvJysocmFuZG9tRGF0ZTEuZ2V0VVRDRnVsbFllYXIoKT09MjAwOT8xMisoTWF0aC5yb3VuZChNYXRoLnJhbmRvbSgpKig1My0xMikpKTpNYXRoLmNlaWwoTWF0aC5yYW5kb20oKSo1MykpKSk6KHJhbmRvbURhdGUxPj1EYXRlLm5vdygpLTYwNDgwMDAwMC02MDQ4MDAwMDAvKi10d28gd2VlayovLShEYXRlLm5vdygpLW5ldyBEYXRlKG5ldyBEYXRlKERhdGUubm93KCkpLmdldFVUQ0Z1bGxZZWFyKCksbmV3IERhdGUoRGF0ZS5ub3coKSkuZ2V0VVRDTW9udGgoKSxuZXcgRGF0ZShEYXRlLm5vdygpKS5nZXRVVENEYXRlKCkpLmdldFRpbWUoKSkvKi1wYXJ0IGxhc3Qgd2VlayovLSgnNjAxMjM0NSdbbmV3IERhdGUoRGF0ZS5ub3coKSkuZ2V0VVRDRGF5KCldKjg2NDAwMDAwKS8qLXBhcnQgbGFzdCBkYXkqLz8nJzonL3dlZWtUb3AvJytyYW5kb21EYXRlMS5nZXRVVENGdWxsWWVhcigpKycvJytNYXRoLmNlaWwoTWF0aC5yYW5kb20oKSoocmFuZG9tRGF0ZTEtbmV3IERhdGUobmV3IERhdGUoRGF0ZS5ub3coKSkuZ2V0VVRDRnVsbFllYXIoKSwwLDEpKS82MDQ4MDAwMDApKSkrKHR5cGUxPT0nYXV0byc/KHdpbmRvdy5sb2NhdGlvbi5ocmVmLnNwbGl0KCc/JylbMV09PSduc2Z3Jz8nP25zZncnOndpbmRvdy5sb2NhdGlvbi5ocmVmLnNwbGl0KCc/JylbMV09PSdzZncnPyc/c2Z3JzonJyk6dHlwZTE9PSduc2Z3Jz8nP25zZncnOnR5cGUxPT0nc2Z3Jz8nP3Nmdyc6dHlwZTE9PSdyYW5kb20nP1snP25zZncnLCc/c2Z3JywnJ11bTWF0aC5mbG9vcihNYXRoLnJhbmRvbSgpKlsnP25zZncnLCc/c2Z3JywnJ10ubGVuZ3RoKV06JycpfSkoKSIgc3R5bGU9ImNvbG9yOiM3NTZlNjI7Zm9udC1mYW1pbHk6b3Blbi1zYW5zLHNhbnMtc2VyaWY7Zm9udC1zaXplOjE0cHg7Zm9udC13ZWlnaHQ6NzAwO2Rpc3BsYXk6aW5saW5lLWJsb2NrO2JvcmRlcjpzb2xpZCAycHggIzc1NmU2MjtoZWlnaHQ6MjhweDtib3gtc2l6aW5nOmJvcmRlci1ib3g7Ym9yZGVyLXJhZGl1czoxNHB4O3ZlcnRpY2FsLWFsaWduOm1pZGRsZTttYXJnaW46OXB4O3BhZGRpbmc6M3B4IDlweDt0cmFuc2l0aW9uOmNvbG9yIDAuNXM7YmFja2dyb3VuZDpub25lO2N1cnNvcjpwb2ludGVyIiBvbm1vdXNlb3Zlcj10aGlzLnN0eWxlLmNvbG9yPScjZmNhOTFhJyBvbm1vdXNlb3V0PXRoaXMuc3R5bGUuY29sb3I9JyM3NTZlNjInPlJhbmRvbURhdGU8L2J1dHRvbj4gPHNwYW4gc3R5bGU9Y29sb3I6Izc1NmU2Mjtmb250LWZhbWlseTpvcGVuLXNhbnMsc2Fucy1zZXJpZjtmb250LXNpemU6MTNweDtmb250LXdlaWdodDo3MDA+c2Z3PGRpdiBzdHlsZT0iZGlzcGxheTppbmxpbmUtYmxvY2s7Ym9yZGVyOnNvbGlkIDJweCAjNzU2ZTYyO3dpZHRoOjc2cHg7aGVpZ2h0OjI4cHg7Ym94LXNpemluZzpib3JkZXItYm94O2JvcmRlci1yYWRpdXM6MTRweDt2ZXJ0aWNhbC1hbGlnbjptaWRkbGU7bWFyZ2luOjlweCI+PHNjcmlwdD5kb2N1bWVudC53cml0ZSgKJzxhIGhyZWY9Jysod2luZG93LmxvY2F0aW9uLmhyZWYuc3BsaXQoJz8nKVswXSsnP3NmdycpKycgc3R5bGU9ImRpc3BsYXk6aW5saW5lLWJsb2NrO291dGxpbmU6MDt3aWR0aDoxOHB4O2hlaWdodDoxOHB4O2JvcmRlci1yYWRpdXM6OXB4O21hcmdpbjozcHg7Y3Vyc29yOnBvaW50ZXI7Lyp0cmFuc2l0aW9uOmJhY2tncm91bmQgMC41czsqL2JhY2tncm91bmQ6Jysod2luZG93LmxvY2F0aW9uLmhyZWYuc3BsaXQoJz8nKVsxXT09J3Nmdyc/JyM3NTZlNjInOidub25lJykrJyIgb25tb3VzZW92ZXI9dGhpcy5zdHlsZS5iYWNrZ3JvdW5kPSIjZmNhOTFhIiBvbm1vdXNlb3V0PXRoaXMuc3R5bGUuYmFja2dyb3VuZD0iJysod2luZG93LmxvY2F0aW9uLmhyZWYuc3BsaXQoJz8nKVsxXT09J3Nmdyc/JyM3NTZlNjInOidub25lJykrJyI+PC9hPicrCic8YSBocmVmPScrd2luZG93LmxvY2F0aW9uLmhyZWYuc3BsaXQoJz8nKVswXSsnIHN0eWxlPSJkaXNwbGF5OmlubGluZS1ibG9jaztvdXRsaW5lOjA7d2lkdGg6MThweDtoZWlnaHQ6MThweDtib3JkZXItcmFkaXVzOjlweDttYXJnaW46M3B4O2N1cnNvcjpwb2ludGVyOy8qdHJhbnNpdGlvbjpiYWNrZ3JvdW5kIDAuNXM7Ki9iYWNrZ3JvdW5kOicrKHdpbmRvdy5sb2NhdGlvbi5ocmVmLnNwbGl0KCc/JylbMV09PXVuZGVmaW5lZD8nIzc1NmU2Mic6J25vbmUnKSsnIiBvbm1vdXNlb3Zlcj10aGlzLnN0eWxlLmJhY2tncm91bmQ9IiNmY2E5MWEiIG9ubW91c2VvdXQ9dGhpcy5zdHlsZS5iYWNrZ3JvdW5kPSInKyh3aW5kb3cubG9jYXRpb24uaHJlZi5zcGxpdCgnPycpWzFdPT11bmRlZmluZWQ/JyM3NTZlNjInOidub25lJykrJyI+PC9hPicrCic8YSBocmVmPScrKHdpbmRvdy5sb2NhdGlvbi5ocmVmLnNwbGl0KCc/JylbMF0rJz9uc2Z3JykrJyBzdHlsZT0iZGlzcGxheTppbmxpbmUtYmxvY2s7b3V0bGluZTowO3dpZHRoOjE4cHg7aGVpZ2h0OjE4cHg7Ym9yZGVyLXJhZGl1czo5cHg7bWFyZ2luOjNweDtjdXJzb3I6cG9pbnRlcjsvKnRyYW5zaXRpb246YmFja2dyb3VuZCAwLjVzOyovYmFja2dyb3VuZDonKyh3aW5kb3cubG9jYXRpb24uaHJlZi5zcGxpdCgnPycpWzFdPT0nbnNmdyc/JyM3NTZlNjInOidub25lJykrJyIgb25tb3VzZW92ZXI9dGhpcy5zdHlsZS5iYWNrZ3JvdW5kPSIjZmNhOTFhIiBvbm1vdXNlb3V0PXRoaXMuc3R5bGUuYmFja2dyb3VuZD0iJysod2luZG93LmxvY2F0aW9uLmhyZWYuc3BsaXQoJz8nKVsxXT09J25zZncnPycjNzU2ZTYyJzonbm9uZScpKyciPjwvYT4nCik8L3NjcmlwdD48L2Rpdj5uc2Z3PC9zcGFuPiA8c3BhbiBzdHlsZT1jb2xvcjojNzU2ZTYyO2ZvbnQtZmFtaWx5Om9wZW4tc2FucyxzYW5zLXNlcmlmO2ZvbnQtc2l6ZToxNHB4O2ZvbnQtd2VpZ2h0OjcwMDtwYWRkaW5nOjlweD5JT05FPC9zcGFuPgo=


⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀***
Небольшое опровержение для тех кто читал мой передушивший пост или будет читать мой пост
joyreactor.cc/post/4871110 ("ImageResizer")(*ImageRotator)
"≈Перезапись EXIF≈ позволяет избежать потерь качества при пере-сохранении сэкономить ресурсы устройства и ускорить редактирование изображений пользователем"
⠀Всё это может быть правдой но я не нашёл у себя "пользовательского" редактора работавшего так как указано выше все "пользовательские" редакторы что я опробовал переадресовали изображение и переписывали ориентацию EXIF.
⠀То есть вот именно так как указанно выше может быть, но мало кто делает возможно из за целесообразности...
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀~_^