Adding easter egg explaining the logo for mobile users.

This commit is contained in:
Sergiotarxz 2023-08-25 01:29:03 +02:00
parent 27bbe79cc6
commit be286a3260
5 changed files with 35 additions and 1 deletions

View File

@ -1,6 +1,9 @@
<category>
<title>Información de Burguillos.</title>
<description>
<div class="burguillos-logo-container">
<img alt="The logo of Burguillos.info" src="/img/burguillos-new-logo.svg"/>
</div>
<p>Burguillos.info no está afiliado con el Ayuntamiento de Burguillos.</p>
<p>Esta página está destinada a informar de los sucesos y negocios de nuestro pueblo, cualquiera puede redactar una noticia para que aparezca en este medio mientras pase un proceso de revisión por parte del staff de Burguillos.info.</p>

View File

@ -9,6 +9,7 @@ window.onload = () => {
const tables = document.querySelectorAll('table')
loadAd()
addEasterEggAnimation()
if (menu_expand !== null && mobile_foldable !== null) {
menu_expand.addEventListener('click', () => {
@ -30,6 +31,16 @@ window.onload = () => {
}
};
function addEasterEggAnimation() {
const logoContainer = document.querySelector('div.burguillos-logo-container')
if (logoContainer === null) {
return;
}
logoContainer.addEventListener('click', () => {
logoContainer.classList.toggle('active')
})
}
let current_ad_number = null
function expand_page_contents() {

View File

@ -174,6 +174,14 @@ body {
vertical-align: middle;
width: 40px;
height: 40px; }
body div.page-contents nav > a > img.index-image-menu, body div.page-contents div.burguillos-logo-container > img {
transition-property: transform;
transition-duration: 2s;
transition-delay: 2s; }
body div.page-contents nav > a.selected > img.index-image-menu,
body div.page-contents nav > a:hover > img.index-image-menu,
body div.page-contents div.burguillos-logo-container.active > img {
transform: rotate(-1.5rad); }
body div.page-contents nav.desktop {
display: none; }
body div.page-contents nav.desktop a {

View File

@ -257,6 +257,18 @@ body {
height: 40px;
}
nav > a > img.index-image-menu, div.burguillos-logo-container > img {
transition-property: transform;
transition-duration: 2s;
transition-delay: 2s;
}
nav > a.selected > img.index-image-menu,
nav > a:hover > img.index-image-menu,
div.burguillos-logo-container.active > img {
transform: rotate(-1.5rad);
}
nav.desktop {
display: none;

View File

@ -16,7 +16,7 @@
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var tablesort__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tablesort */ \"./node_modules/tablesort/src/tablesort.js\");\n/* harmony import */ var tablesort__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(tablesort__WEBPACK_IMPORTED_MODULE_0__);\n\n\nwindow.Tablesort = __webpack_require__(/*! tablesort */ \"./node_modules/tablesort/src/tablesort.js\");\n__webpack_require__(/*! tablesort/src/sorts/tablesort.number */ \"./node_modules/tablesort/src/sorts/tablesort.number.js\");\n\nwindow.onload = () => {\n const menu_expand = document.querySelector('a.menu-expand');\n const mobile_foldable = document.querySelector('nav.mobile-foldable');\n const tables = document.querySelectorAll('table')\n\n loadAd()\n\n if (menu_expand !== null && mobile_foldable !== null) {\n menu_expand.addEventListener('click', () => {\n mobile_foldable.classList.toggle('show');\n });\n }\n\n for (const table of tables) {\n const header = table.querySelector('tr');\n if (header !== null) {\n header.setAttribute('data-sort-method', 'none')\n for (const th of header.querySelectorAll('th')) {\n if (th.getAttribute('data-sort-method') == null) {\n th.setAttribute('data-sort-method', 'thead')\n }\n }\n }\n new (tablesort__WEBPACK_IMPORTED_MODULE_0___default())(table)\n }\n};\n\nlet current_ad_number = null\n\nfunction expand_page_contents() {\n const page_contents = document.querySelector('div.page-contents'); \n if (page_contents === null) {\n return;\n }\n page_contents.classList.add('no-carousel');\n}\n\nfunction no_more_ads() {\n const carousel = document.querySelector('.carousel');\n if (carousel !== null) {\n carousel.remove();\n }\n expand_page_contents();\n}\n\nfunction loadAd() {\n const params = new URLSearchParams();\n if (current_ad_number !== null) {\n params.append('n', \"\"+current_ad_number);\n }\n fetch('/next-ad.json?' + params).then((res) => {\n return res.json()\n }).then((res) => {\n current_ad_number = res.current_ad_number\n const ad = res.ad\n const must_continue = res.continue\n const carousel = document.querySelector('.carousel');\n if (must_continue === 0\n || carousel === null\n || carousel.offsetWidth === 0) {\n no_more_ads();\n return;\n }\n carousel.innerHTML = \"\"\n const a = document.createElement('a')\n const image = document.createElement('img')\n const text_container = document.createElement('div')\n const text = document.createElement('h4')\n const promoted = document.createElement('p')\n\n promoted.classList.add('promoted-tag')\n promoted.innerText = \"Promocionado\"\n image.src = ad.img\n text.innerText = ad.text\n a.href = ad.href\n\n a.append(image)\n text_container.append(promoted)\n text_container.append(text)\n a.append(text_container)\n carousel.append(a);\n\n window.setTimeout(() => {\n loadAd()\n }, ad.seconds * 1000)\n }).catch(() => {\n window.setTimeout(() => {\n loadAd()\n }, 1000)\n });\n}\n\n\n//# sourceURL=webpack://BurguillosInfo/./js-src/index.js?");
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var tablesort__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tablesort */ \"./node_modules/tablesort/src/tablesort.js\");\n/* harmony import */ var tablesort__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(tablesort__WEBPACK_IMPORTED_MODULE_0__);\n\n\nwindow.Tablesort = __webpack_require__(/*! tablesort */ \"./node_modules/tablesort/src/tablesort.js\");\n__webpack_require__(/*! tablesort/src/sorts/tablesort.number */ \"./node_modules/tablesort/src/sorts/tablesort.number.js\");\n\nwindow.onload = () => {\n const menu_expand = document.querySelector('a.menu-expand');\n const mobile_foldable = document.querySelector('nav.mobile-foldable');\n const tables = document.querySelectorAll('table')\n\n loadAd()\n addEasterEggAnimation()\n\n if (menu_expand !== null && mobile_foldable !== null) {\n menu_expand.addEventListener('click', () => {\n mobile_foldable.classList.toggle('show');\n });\n }\n\n for (const table of tables) {\n const header = table.querySelector('tr');\n if (header !== null) {\n header.setAttribute('data-sort-method', 'none')\n for (const th of header.querySelectorAll('th')) {\n if (th.getAttribute('data-sort-method') == null) {\n th.setAttribute('data-sort-method', 'thead')\n }\n }\n }\n new (tablesort__WEBPACK_IMPORTED_MODULE_0___default())(table)\n }\n};\n\nfunction addEasterEggAnimation() {\n const logoContainer = document.querySelector('div.burguillos-logo-container')\n if (logoContainer === null) {\n return;\n }\n logoContainer.addEventListener('click', () => {\n logoContainer.classList.toggle('active')\n })\n}\n\nlet current_ad_number = null\n\nfunction expand_page_contents() {\n const page_contents = document.querySelector('div.page-contents'); \n if (page_contents === null) {\n return;\n }\n page_contents.classList.add('no-carousel');\n}\n\nfunction no_more_ads() {\n const carousel = document.querySelector('.carousel');\n if (carousel !== null) {\n carousel.remove();\n }\n expand_page_contents();\n}\n\nfunction loadAd() {\n const params = new URLSearchParams();\n if (current_ad_number !== null) {\n params.append('n', \"\"+current_ad_number);\n }\n fetch('/next-ad.json?' + params).then((res) => {\n return res.json()\n }).then((res) => {\n current_ad_number = res.current_ad_number\n const ad = res.ad\n const must_continue = res.continue\n const carousel = document.querySelector('.carousel');\n if (must_continue === 0\n || carousel === null\n || carousel.offsetWidth === 0) {\n no_more_ads();\n return;\n }\n carousel.innerHTML = \"\"\n const a = document.createElement('a')\n const image = document.createElement('img')\n const text_container = document.createElement('div')\n const text = document.createElement('h4')\n const promoted = document.createElement('p')\n\n promoted.classList.add('promoted-tag')\n promoted.innerText = \"Promocionado\"\n image.src = ad.img\n text.innerText = ad.text\n a.href = ad.href\n\n a.append(image)\n text_container.append(promoted)\n text_container.append(text)\n a.append(text_container)\n carousel.append(a);\n\n window.setTimeout(() => {\n loadAd()\n }, ad.seconds * 1000)\n }).catch(() => {\n window.setTimeout(() => {\n loadAd()\n }, 1000)\n });\n}\n\n\n//# sourceURL=webpack://BurguillosInfo/./js-src/index.js?");
/***/ }),