(function () { 'use strict'; const stylesheet = document.querySelector("#stylesheet"); const toggleStylesheetLightButton = document.querySelector("#light"); const toggleStylesheetDarkButton = document.querySelector("#dark"); const navMenu = document.querySelector("#nav-menu"); navMenu.offsetTop; const mainPage = document.querySelector("#main-div"); const topBar = document.querySelector("#top-bar"); const lightDarkWarning = document.querySelector("#light-dark-warning"); const subscribeDiv = document.querySelector("#subscribe"); subscribeDiv.offsetTop; const abnormalLogo = document.querySelector("#logo"); const abnormalLogoStylesheet = document.querySelector("#logo-stylesheet"); const footerAbnormal = document.querySelector("#footer-fourth"); document.querySelector("#mobile-subscribe"); const introScreen = document.querySelector("[data-intro-screen]"); const stylesheetSelector = document.createElement("div"); const previousStylesheet = document.createElement("div"); const menuButton = document.querySelector("#menu-button-open-close"); const navMobile = document.querySelector("#mobile-nav-menu"); const menuBar = document.querySelector("#mobile-menu-bar"); const pageName = document.querySelector("#page-name"); /*change prefix from "./" for test page inside the issue's folder to "./issues-number/" for root index file */ const prefix = "./"; const articles = { "Title Page": [ { "title": "Siesta", "sub-title": "", "author": "Doris Lee", "description": [ 'Doris Lee (1904 – 1983) was one of the most recognized artists in the United States during the 1930s and 40s and a leading figure in the Woodstock Artist’s Colony. In response to the rise of Abstract Expressionism in the decades after World War II, Lee deftly absorbed these innovations into a continuation of her own visual style.', ], "imgUrl": `${prefix}doris-lee-siesta.jpg`, "link": `javascript:void(0)`, }, ], "Current Events": [ { "title": "The Donald Also Rises", "sub-title": "The Far Right Continues to Build Its International", "author": "John Feffer", "description": [ "What alt-right guru Steve Bannon failed to create, German taxpayers have just stepped in to revive: a Nationalist International. Thanks to the German government, the far right is about to get its own well-heeled global think tank, complete with the sort of political academy that was so dear to Bannon’s plan for world domination.", "Germany’s gift to the far right is the Desiderius Erasmus Foundation, the public-policy arm of the country’s most prominent extremist party, the Alternative für Deutschland (AfD). Erasmus, a Dutch humanist of the Renaissance best known for his ironic essay “In Praise of Folly,” would have been appalled at such a grotesque misappropriation of his name. The AfD, after all, has built its political base on a series of follies diametrically opposed to humanism, from its initial anti-immigration screeds to its current overtures to the anti-vaccination crowd.", "Strangely enough, the AfD underperformed in the recent German elections, its parliamentary delegation losing 11 seats. Still, by capturing a little more than 10% of the vote, the party made it into parliament a second consecutive time. As a result, it qualifies for what all other major parties also receive: government support of its foundation. Unless legal efforts to block this largesse succeed, the Erasmus foundation will soon enjoy the equivalent of tens of millions of taxpayer dollars a year.", ], "imgUrl": `${prefix}nazis.jpg`, "link": `${prefix}feffer-the-donald.html`, }, { "title": "What Will We Remember of 2022", "sub-title": "Nation (Un)Building and Planet (Un)Building, American-Style", "author": "Tom Engelhardt", "description": [ "Let me start 2022 by heading back -- way, way back -- for a moment.", "It's easy to forget just how long this world has been a dangerous place for human beings. I thought about this recently when I stumbled upon a little memoir my Aunt Hilda scrawled, decades ago, in a small notebook. In it, she commented in passing: \"I was graduated during that horrible flu epidemic of 1919 and got it.\" Badly enough, it turned out, to mess up her entry into high school. She says little more about it.", "Still, I was shocked. In all the years when my father and his sister were alive and, from time to time, talked about the past, never had they (or my mother, for that matter) mentioned the disastrous “Spanish Flu” pandemic of 1918-1920. I hadn’t the slightest idea that anyone in my family had been affected by it. In fact, until I read John Barry’s 2005 book, The Great Influenza, I hadn’t even known that a pandemic devastated America (and the rest of the world) early in the last century — in a fashion remarkably similar to, but even worse than, Covid-19 (at least so far) before essentially being tossed out of history and the memory books of most families.", ], "imgUrl": `${prefix}america-decline.jpg`, "link": `${prefix}engelhardt-2022.html`, }, ], "Anthroposophy": [ { "title": "Christmas at a Time of Grievous Destiny", "sub-title": "Anthroposophy and Gnosis", "author": "Rudolf Steiner", "description": [ "The yearly celebration of the physical birth of the Being Who entered earth-evolution in order to give that evolution its meaning, has for many people become a matter of habit. But if, in agreement with the task of our spiritual-scientific movement, we are not content with celebrating a festival of mere custom — as is so general nowadays — it will be opportune at this grave time to turn our minds to many things that are connected with the physical birth of the Christ Jesus.", "We have often pictured how in the Christ Jesus, so far as human comprehension goes, two beings merge as it were into one: the Christ Being and the human Jesus Being. In the evolution of Christianity there has been much conflict, much conflict of dogma, about the meaning of the union of Christ with Jesus, in the being whose physical birth is celebrated at the Christmas Festival. We ourselves, of course, recognise in the Christ a cosmic, super-earthly being, who descended from spiritual worlds in order, through His birth in a physical man, to impart meaning to earth-evolution. And in Jesus we recognise the one who, as man, was predestined after thirty years of preparation, to unite the Christ being with himself, to receive the Christ being into himself.", "Not only has there been much strife, much conflict of dogma, about the nature of the union of Christ with Jesus, but the relationship of Christ to Jesus contains a hint of significant secrets of the earthly evolution of mankind. If, in the endeavour to understand something of the union of Christ with Jesus, we follow events up to the present day and reflect upon what has still to take place in the evolution of humanity before this relationship can be rightly understood, then we touch upon one of the deepest secrets of human knowledge and human life.", ], "imgUrl": `${prefix}stable-1.jpg`, "link": `${prefix}steiner-christmas-gnosis.html` }, { "title": "The Apocalypse of John", "sub-title": "Anthroposophy and Gnosis", "author": "Rudolf Steiner", "description": [ "In the autumn of this present year Nuremberg can celebrate an important centenary, for it was in 1808 that this city received one of the greatest German spirits within her walls. He was one of those spirits of whom we hear little today and whose works are understood still less; but he will signify very much for man's intellectual life in the future once he is understood. He is doubtless difficult to understated and it may be some time before people grasp him again. In the autumn of 1808 Hegel became Director of the Royal Grammar School in Nuremberg.", "Hegel made a statement that we may perhaps take as foundation for what we are going to study. He said: The most profound thought is connected with the figure of Christ, with the outer historical figure. And it is the greatness of the Christian religion that every level of consciousness can understand the historical external figure, while at the same time it is a challenge to the most earnest labours of the mind. The Christian religion is comprehensible at every stage of culture and yet at the same time it challenges the deepest wisdom. — These are the words of Hegel, the German philosopher.", "That the Christian faith, the message of the Gospel, can be understood at every level of consciousness has been taught for a period to be reckoned in millennia. To show that it is a summons to the deepest thought, to a penetration into humanity's whole fund of wisdom, will be one of the tasks of Spiritual Science, if this is understood in its true sense and inmost impulse and made the guide of human life. What we are to consider today will be misunderstood if it is thought that Anthroposophy or Spiritual Science is in any way a new religion or desires to establish a new religious faith in place of an old one. One might say, not to be misunderstood, if Spiritual Science is grasped aright, it will be clear that though it is a sure and firm supporter of religious life, in itself it is no religion, nor will it ever contradict any religion as such. It is another matter, however, for it to be the instrument to explain the profoundest truths and the most earnest and vital secrets of religions and show how they may be understood.", ], "imgUrl": `${prefix}apocalypse-1.jpeg`, "link": `${prefix}steiner-apocal-eng.html` }, { "title": "El Apocalipsis de San Juan", "sub-title": "", "author": "Rudolf Steiner", "description": [ "Nuremberg puede celebrar, en el otoño del presente año, un importante centenario, ya que fue en 1808 que esta ciudad acogió a uno de los más grandes espíritus alemanes. Era uno de esos espíritus de los que hoy poco se oye y cuyas obras son aún menos entendidas; pero él ha de significar mucho para la vida intelectual del hombre en el futuro una vez que se lo entienda. Sin duda, es difícil de interpretar y quizás tome tiempo para que la gente lo vuelva a comprender. En el otoño de 1808, Hegel asumió como Director del Gymnasium Real de Nuremberg.", "Hegel manifestó algo que quizás podamos tomar como base para lo que vamos a estudiar. Dijo: El pensamiento más profundo está conectado con la figura de Cristo, con la figura histórica externa. La grandeza de la religión cristiana reside en que todos los niveles de conciencia pueden comprender la figura histórica externa, pero, al mismo tiempo, ella desafía a un serio esfuerzo intelectual y a penetrar hasta lo más profundo. La religión cristiana es comprensible en todos los niveles culturales y, sin embargo, es al mismo tiempo un desafío a la sabiduría más profunda. — Estas son las palabras de Hegel, el filósofo alemán.", "Que la fe cristiana, el mensaje del Evangelio, se puede entender a todo nivel de conciencia es algo que se ha enseñado durante un periodo que puede ser calculado en milenios. Demostrar que se trata de un llamado a pensar profundamente, a penetrar en la reserva total de sabiduría de la humanidad, habrá de ser una de las tareas de la Ciencia Espiritual, si es que se la entiende en su verdadero sentido y su más íntimo impulso, y se la convierte en guía para la vida humana. Lo que hemos de considerar hoy será mal interpretado si se piensa que la Antroposofía o Ciencia Espiritual es de algún modo una nueva religión o que se propone establecer una nueva fe religiosa en lugar de la antigua. Para no ser malinterpretado, se podría decir que, si la Ciencia Espiritual se entiende correctamente, resultará claro que, aunque cierta y firmemente apoya la vida religiosa, no es en sí misma ninguna religión, ni ha de contradecir jamás a ninguna religión como tal. Otra cosa es, en cambio, que sea el instrumento para explicar las verdades más profundas y los secretos más serios y vitales de las religiones, y mostrar cómo se los puede entender.", ], "imgUrl": `${prefix}apocalypse-1.jpeg`, "link": `${prefix}steiner-apocal-esp.html` }, ], "Poetry": [ { "title": "Breathe", "sub-title": "", "author": "Becky Hemley", "description": [ "She sat at the back and they said she was shy,
She led from the front and they hated her pride,
They asked her advice and then questioned her guidance,
They branded her loud, then were shocked by her silence,", "When she shared no ambition they said it was sad,
So she told them her dreams and they said she was mad,
They told her they'd listen, then covered their ears,
And gave her a hug while they laughed at her fears,", "And she listened to all of it thinking she should,
Be the girl they told her to be best as she could,
But one day she asked what was best for herself,
Instead of trying to please everyone else,", ], "imgUrl": `${prefix}forest.jpg`, "link": `${prefix}hemsley-breathe.html`, }, { "title": "The Return of the Magi", "sub-title": "", "author": "Frank Thomas Smith", "description": [ "This town is one we've seen before:
These crooked lanes, that stable door,
Although it must have been a dream,
For never were we here before.", "And that quick dog, scared and lean,
Crossing the square scarcely seen
And the dark-haired girl leaning out
The hostel window familiar seem.", ], "imgUrl": `${prefix}three-kings.jpg`, "link": `${prefix}three-kings.html`, }, ], }; const articlesKeys = Object.keys(articles); const navChekboxes = Array.from(document.querySelectorAll("#nav-menu input")); // Uncheck all other hidden checkboxes when one is checked // colapses nav-menu dropdowns when a new one is expanded function createNavMenu(navMenuElement) { navChekboxes.forEach(input => { input.addEventListener("change", () => { navChekboxes.forEach(element => { if (element === input) return element.checked = false; }); }); }); function createMenuLinks() { articlesKeys.forEach(category => { if (articles[category].length === 1) { const div = document.createElement("div"); const p = document.createElement("p"); p.className = "nav-menu-links"; p.id = articles[category][0]["title"]; p.innerText = category; p.dataset.category = category; div.appendChild(p); navMenuElement.appendChild(div); } else if (articles[category].length > 1) { const content = document .querySelector("[data-dropdown-template]") .content.cloneNode(true); const hiddenInput = content.querySelector("[data-hidden-input]"); const label = content.querySelector("[data-label]"); const title = content.querySelector("[data-title]"); const list = content.querySelector("[data-list]"); hiddenInput.id = `${category}-input`; label.htmlFor = hiddenInput.id; title.innerHTML = `${category} ▼`; articles[category].forEach(article => { const li = document.createElement("li"); li.className = "nav-menu-links"; li.id = article["title"]; li.innerText = `${article.title} - ${article.author}`; li.dataset.category = category; list.appendChild(li); }); navMenuElement.appendChild(content); } }); } createMenuLinks(); //event listeners const navmenuLinkArray = Array.from( navMenuElement.querySelectorAll(".nav-menu-links") ); navmenuLinkArray.forEach(link => { link.addEventListener("click", () => { createArticlePeek(link.dataset.category, link.id); if (menuBar.dataset.opened === "true") { menuBar.dataset.opened = "false"; } }); }); } function checkAndReduce() { const title = mainPage.querySelector("h2"); if (title.innerText.length > 20) { title.style.fontSize = "2.5em"; } } function createArticlePeek(category, title) { mainPage.innerHTML = ""; articlesKeys.forEach(group => { if (group !== category) return articles[group].forEach(article => { if (article["title"] !== title) return const articleDiv = document .querySelector("[data-article-template]") .content.cloneNode(true); const titleElement = articleDiv.querySelector("h2"); const author = articleDiv.querySelector("h1"); const subTitle = articleDiv.querySelector("h3"); const description = articleDiv.querySelector("[data-article-description]"); const img = articleDiv.querySelector("[data-article-img]"); const link = articleDiv.querySelector("[data-article-link]"); titleElement.innerText = title; author.innerText = article["author"]; if (article["sub-title"] && article["sub-title"].length !== 0) { subTitle.innerText = article["sub-title"]; } img.src = article["imgUrl"]; link.href = article["link"]; let i = 1; const className = article["title"].replace(/[^a-zA-Z0-9]/g, '').toLowerCase(); article["description"].forEach(descriptionParagraph => { const paragraph = document.createElement("p"); paragraph.innerHTML = descriptionParagraph; paragraph.className = `${className}-paragraph-${i}`; description.appendChild(paragraph); i++; }); mainPage.appendChild(articleDiv); checkAndReduce(); }); }); } function mobilePortrait() { if (previousStylesheet.dataset.stylesheet == "mobile") return pageName.innerHTML = "Menu"; //create elements in mobile-navbar const mobileSubscribe = document.querySelector("#mobile-subscribe"); const mobileSubscribeContent = subscribeDiv.cloneNode(true); createNavMenu(navMobile); //get modify input and label "for" in mobile nav const navMobileInputs = Array.from(navMobile.querySelectorAll("input")); const navMobileLabels = Array.from(navMobile.querySelectorAll("label")); navMobileInputs.forEach(input => { input.id += "-mobile"; }); navMobileLabels.forEach(label => { label.htmlFor += "-mobile"; }); //append elements topBar.appendChild(navMobile); mobileSubscribe.appendChild(mobileSubscribeContent); //create observer functions let observerMobileMenu = new MutationObserver(mutations => { mutations.forEach(mutation => { if (mutation.type == "attributes") { if (menuBar.dataset.opened == "true") { navMobile.classList.add("open"); menuButton.classList.add("close"); } else { navMobile.classList.remove("open"); menuButton.classList.remove("close"); } } }); }); //create menu open button - three lines for (let i = 0; i < 3; i++) { const menuButtonLine = document.createElement("div"); menuButtonLine.className = "menu-button-line"; menuButton.appendChild(menuButtonLine); } //give new class to desktop menu navMobile.className = "nav-menu menu-mobile desktop-hide"; //observe for changes observerMobileMenu.observe(menuBar, { attributes: true, }); //menu button listener menuButton.addEventListener("click", () => { if (menuBar.dataset.opened === "false") { menuBar.dataset.opened = "true"; } else { menuBar.dataset.opened = "false"; } }); previousStylesheet.dataset.stylesheet = "mobile"; // musicLinks.innerHTML = "Words and Music" } //scroll to top on refresh window.onbeforeunload = function () { window.scrollTo(0, 0); }; //create elements for data-attributes // function to set data atributes acording to screen width function setStylesheetDataAttr() { if (screen.width <= 650) { if (stylesheetSelector.dataset.stylesheet == "mobile") return stylesheetSelector.dataset.stylesheet = "mobile"; } else if (screen.width >= 651 && screen.width < 1200) { if (stylesheetSelector.dataset.stylesheet == "medium") return stylesheetSelector.dataset.stylesheet = "medium"; } else { if (stylesheetSelector.dataset.stylesheet == "desktop") return stylesheetSelector.dataset.stylesheet = "desktop"; } } //execute on rezise window.addEventListener("resize", () => { setStylesheetDataAttr(); }); //ovserve changes on data-attributes and execute functions let observerStylesheetAttr = new MutationObserver(mutations => { mutations.forEach(mutation => { if (mutation.type == "attributes") { if (stylesheetSelector.dataset.stylesheet === "mobile") { mobilePortrait(); } } }); }); observerStylesheetAttr.observe(stylesheetSelector, { attributes: true, }); //onload functions window.addEventListener("load", () => { setStylesheetDataAttr(); introScreen.classList.add("fade-out"); setTimeout(() => { introScreen.style.display = "none"; document.querySelector("html").style.overflowY = "visible"; lightDarkWarning.classList.remove("desktop-hide", "mobile-hide"); }, 1000); //local storage - if exists change theme if (!localStorage.getItem("style")) return lightDarkWarning.style.display = "none"; const lightOrDark = localStorage.getItem("style"); if (lightOrDark === "light") { stylesheet.href = `${prefix}css/light.css`; } if (screen.width <= 650) { mobilePortrait(); } }); //remove light-and-dark warning onclick lightDarkWarning.addEventListener("click", () => { lightDarkWarning.style.display = "none"; }); // Toggle Stylesheets toggleStylesheetLightButton.addEventListener("click", () => { stylesheet.href = `${prefix}css/light.css`; localStorage.setItem("style", "light"); }); toggleStylesheetDarkButton.addEventListener("click", () => { stylesheet.href = `${prefix}css/dark.css`; localStorage.setItem("style", "dark"); }); //observer function, scroll-in abnormal logo when footer is 50% visible let notFirstTime = 0; const observer = new IntersectionObserver( entries => { if (entries[0].isIntersecting === true) { if (notFirstTime > 0) return abnormalLogoStylesheet.href = `${prefix}css/logo2.css`; abnormalLogo.classList.add("logo-animation"); notFirstTime++; } }, { threshold: [0.5] } ); observer.observe(footerAbnormal); createNavMenu(navMenu); //create title page with the first property of "articleObject.js" and it's title createArticlePeek( Object.keys(articles)[0], articles[Object.keys(articles)[0]][0].title ); //-------------------------------- // Change navbar position to fixed on scroll // function navMenuPositionFixed() { // if (window.pageYOffset + 55 >= navDivTop) { // navMenu.classList.add("fixed") // } else { // navMenu.classList.remove("fixed") // } // } // window.onscroll = () => { // navMenuPositionFixed() // } //------------------- }());