(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 abnormalLogo = document.querySelector("#logo"); const abnormalLogoStylesheet = document.querySelector("#logo-stylesheet"); const footerAbnormal = document.querySelector("#footer-fourth"); 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"); const backToTop = document.querySelector("#back-to-top"); /*change prefix from "./" for test page inside the issue's folder to "./issue-number/" for root index file */ const issueNumber = 168; const prefix = "./168/"; const articles = { "Letter XII": [ { "title": "Letter XII", "sub-title": "The Hanged Man", "author": "", "description": [ "Truly, truly, I say to you,
unless one is born anew,
he cannot see the kingdom of God…" ], "imgUrl": `${prefix}meditations-tarot-xii-main.png`, "link": ``, "poem": false, "mainImg": true, }, ], "Mistery Drama": [ { "title": "HeyZeus - a Modern Mistery Drama", "sub-title": "Act 3 - Scene 1 - Prospect Park Redux", "author": "Frank Thomas Smith", "description": [ "Setting: FIRST MAN enters, passes in front of THOMAS.", "THOMAS: Excuse me. Did you see a black man wearing jeans and a blue t-shirt here in the park?", "FIRST MAN: [Stops, peers closely at THOMAS] No, and I hope to God I don’t. [Exit]", "THOMAS: [To the audience] See what I mean? The inhabitants of Brooklyn are seldom ambiguous.", "[ICE AGENT enters]", "THOMAS: Did you see a black man wearing jeans and a blue t-shirt here in the park?", "ICE AGENT: Sure, plenty of them. So what?", "THOMAS: [Stands] You did? Where?", "ICE AGENT: Are you kidding me? This park is full of black guys in t-shirts." ], "imgUrl": `${prefix}heyzeus-act-3-scene-1-main.png`, "link": `${prefix}heyzeus-act-3-scene-1.html`, "poem": false, "mainImg": false, }, { "title": "HeyZeus - a Modern Mistery Drama", "sub-title": "Act 3 - Scene 2 - A Special Love", "author": "Frank Thomas Smith", "description": [ "THOMAS: [To the audience] That’s it. Do you see the problem? I can’t expect even you, whose humble patience is prayed, to suspend disbelief – no, not even you can I expect to believe my story. You heard Bishop Casey: it’s not convincing. What would I think if someone told me what I’ve told you? I’d be skeptical. I might even laugh. There are no witnesses. A kingdom for a witness. The disbelief of others has planted the seeds of doubt in my own mind – very fertile soil. I suppose that man is born to doubt. Without doubt, after all, there’d be no belief. Doubt and faith belong together like a couple in love, or a pair of ducks in the lake. If only it were otherwise.", "I come here every once in a while in the hope that he’ll appear again – but he hasn’t, yet. And the world seems more screwed up than ever. I came today because, well, I guess it was a dream. In it I received a message from a pigeon that I should go to the park, so I did. [Sits on bench.] You know that actually there was a witness, sort of: Magdalena. Wasn’t she great? Although she didn’t witness the walking on the lake part. But you know, in the meanwhile I’ve been studying something called Anthroposophy, which is a teaching by an Austrian guy named Rudolf Steiner. Problem is he died a hundred years ago, so all there is are books he wrote and the many lectures he gave. He was an initiate, a “Christian Rosicrucian” one. No time to go into what that means now. I’m not sure I know myself anyway. He claimed that the Christ Jesus only came once...physically that is. That the second coming means something else than physical. It means He may come to anyone or everyone, individually, spiritually. Everyone who wants him, that is, I guess.", "So where does that leave HeyZeus? Aye, there’s the rub. Was he or wasn’t he the One? We’ll probably never know, because he’s dead. After he was shot dead by that cop, they said he was an illegal immigrant terrorist and scraped him off the ground and dumped him somewhere." ], "imgUrl": `${prefix}heyzeus-act-3-scene-2-main.png`, "link": `${prefix}heyzeus-act-3-scene-2.html`, "poem": false, "mainImg": false, }, ], "From the Archive": [ { "title": "To Hunt a Nazi", "sub-title": "by Roberto Fox, as told to", "author": "Frank Thomas Smith", "description": [ "There are moments in the present, but also in the past and I hope in the future, when I have the urge to pull Eliot out from my book case and read Four Quartets. The moments are usually when I’m bogged down with a story or a poem and think that a solution simply isn’t possible. Somehow Quartets – only that, not other poems by Eliot or any other poet – inspires me, or at least gives me hope that anything is possible.", "I was meditating on these three lines when the phone rang. I was sitting at my desk with my back to my picture-window overlooking the Buenos Aires municipal golf course in Palermo Park. I can’t face the park while working because its beauty distracts me. Anyway it was foggy, a common occurrence on autumn mornings, though the sun usually burns the fog away by mid-morning. I picked up the phone and swiveled around towards the park: “Hola”", "“Mr. Roberto Fox, please?” a woman’s voice asked in English.", ], "imgUrl": "https://southerncrossreview.org/147/kutschmann.jpg", "link": "https://southerncrossreview.org/147/hunt-a-nazi.html", "poem": false, "mainImg": false, }, { "title": "Evermore", "sub-title": "", "author": "Frank Thomas Smith", "description": [ "I went to the school that Sunday afternoon because there was a Board meeting that evening and we'd need some papers from the office. The secretary was ill though; nothing serious, but she wouldn't be able to attend the meeting, so I, living close, went to the school to get the necessary papers. There were no classes on Sunday, no children running about and calling out, so everything was unnaturally still. But I better start at the beginning to show you why I am in this remote place and what I have to do with the school.", "I'm a journalist, which usually means frustrated writer, and certainly does in my case. I was born and raised in Buenos Aires, Argentina by my Anglo-Argentine parents. My great-grandparents were Anglos - great-grandfather British, great-grandmother American - and their descendents intermarried within the Anglo community, sent their kids to bilingual schools and spoke English at home. In a country like Argentina knowing English fluently is a great advantage because foreign companies, be they American, British or Japanese, need bilingual people. So when I finished university I got a job right off with PanAm (since defunct) as a ticket agent at the airport, despite having studied literature and philosophy. Actually it was fun and was a great opportunity to meet lovely, \"free-thinking\" girls - at that time still a rarity in Argentina - especially flight attendants.", ], "imgUrl": "https://southerncrossreview.org/45/comech.jpg", "link": "https://southerncrossreview.org/45/evermore.html", "poem": false, "mainImg": false, }, { "title": "Love in the Life of Spies", "sub-title": "Foreword", "author": "Frank Thomas Smith", "description": [ "Cerrado read the sign hanging slightly askew inside the upper glass part of Die Glocke’s door. What the hell, Jacks thought, it’s lunch time, how can they be closed. Something’s wrong. He peered through the glass and saw the old waiter sitting alone at a table reading the Freie Presse, a fascist German-language daily. He knocked on the window. The waiter looked up, startled and stared wide-eyed at the door. When he recognized Marvin Jacks he put down the paper, smiled, stood up heavily and opened the door after unlocking it.", "“You called for a reservation,” he said in German, “nicht wahr?”", "Jacks nodded. “Why is the restaurant closed? Has something happened?”", "“Yes, I’m afraid so.” He pulled out a chair from the table he had been sitting at. “Please sit down, Herr Jacks, I have a mensaje for you from Frau Marie,” he said in “Belgrano-Deutsch”, a mixture of German and Spanish used by long time German residents. Jacks remained standing while the waiter hurried into the kitchen and returned immediately clutching a piece of notebook paper. He smiled. “They let her write it when she said it was instructions for picking up her daughter at school. They told me to translate it. They are really stupid, because if it was for me, which she said it was, why would she have to write it out. Anyway, here it is.” Jacks read it. Herr Jacks, Bitte, holen Sie meine Tochter von der Schule ab, um ein-uhr: Rudolf-Steiner-Schule, Warnes 1331. She signed it: Marie Clement" ], "imgUrl": "https://southerncrossreview.org/150/love-spies.jpg", "link": "https://southerncrossreview.org/150/love-life-spies-forward.html", "poem": false, "mainImg": false, }, { "title": "Prologue in Heaven", "sub-title": "from FAUST", "author": "J.W. von Goethe", "description": [ "It was a time when I'd decided that my German was respectable enough to tackle Goethe's Faust. I bought a bilingual edition at a bookstore on Hamburger Allee in Frankfurt and dived in. I found it to be surprisingly easy to understand – direct language, deep ideas salted with sly humor. But the English translation was disappointing, not only because of all the thees and thous – so British, ya know old boy – but also because it lacked the sting of true grit. So I decided to take a crack at it myself. I didn't get very far, just the Prologue in Heaven, but it at least showed me that I could have translated the whole damn thing if I had the time. After all, it took Goethe almost his whole life to write it and it would have taken me twice as long to translate both volumes with all the rhythms and rhymes.", "Frank Thomas Smith", "The Lord, the Heavenly Hosts, later Mephistopheles.
The Archangels step forward.", "RAPHAEL", "The sun resounds as once of old
In loving spheres of motley song,
Predestined is its journey bold,
Ripening as it flows along.
Its sight the angels new strength gives,
Though none can fathom how it's done;
The inconceivable still lives
In glory as when the days were one." ], "imgUrl": "https://southerncrossreview.org/129/faust-mephisto.jpg", "link": "https://southerncrossreview.org/129/faust-fts-trans.html", "poem": false, "mainImg": false, }, ], "Fiction": [ { "title": "The Pope and I", "sub-title": "Second Visit", "author": "Frank Thomas Smith", "description": [ "Those who read my report about the Pope’s visit to Villa de las Rosas and our subsequent short but meaningful conversation, will surely remember it and perhaps be almost as surprised as I was to learn that he contacted me again and – believe it or not – came again to my humble abode in Argentina … well, maybe not all that humble, but certainly more so than Bob’s (Pope Leo’s) Vatican digs.", "It was like this. That same Archbishop as last time drove up to my home office in Villa de la Rosas last Thursday driven by his chauffeur-priest, who beeped his horn rather impolitely. I looked out the window and thought: OMG, not again! But it was indeed again. I opened the door and invited the Archbishop in. He hadn’t changed. I had the impression that he was shocked that His Holiness had demeaned his holy office enough to converse with a mere unfrocked (no, not defrocked) mortal.", "“Pope Leo wants to know if you are now willing to visit him in Rome,” he said, after again refusing my invitation to have a seat.", "“I haven’t gotten any younger,” I replied.", "“So no?”", "“So no.”", "He mumbled into his phone, then handed it to me." ], "imgUrl": `${prefix}the-pope-and-i-second-visit-main.png`, "link": `${prefix}the-pope-and-i-second-visit.html`, "poem": false, "mainImg": false, }, { "title": "The J. R. Baseball Murders", "sub-title": "Chapter 2", "author": "Frank Thomas Smith", "description": [ "First things first usually means most convenient things first. In this case the letter, mailed in Brooklyn. If such a high degree of confidentiality were not required in this case, I would have turned that part over to one of the new guys and gone to Boston or Charleston right away. Two of the guys I hired after the Agnes Rhinelander case were retired cops, one a homicide detective and the other had been in missing persons. They were competent but I didn’t know them well enough yet to trust them. The third was a colored kid, Jim McKey, also an ex-cop, but not a retired one. He quit because of the bureaucracy and corruption. At least that’s what he told me. He was studying at night for a law degree, which meant he wouldn’t be with me long. I knew, though, that in this case I might need him sooner or later because of the race element.", "Then there was my secretary, Charlene. But more about her later. My office was in the Borough Hall section of Brooklyn practical reasons. In Manhattan I couldn’t get within ten subway stops of City Hall at an affordable rent. Of course I lost out on the high paying Fifth Avenue divorce investigations and the Wall Street stuff, but I didn’t like that chickenshit anyway. Now that I could afford it, I saw no reason for moving. Clients from Manhattan came to me. There were plenty of lawyers around Borough Hall, where the law courts also were, and lawyers provide a good chunk of any private dick’s income. They don’t like to move off their fat asses, so you have to be near them. And in Brooklyn I was practically the only independent private investigator around. If you knew what you were doing the mafia wanted you to work for them, and if you wanted to stay healthy, wealthy and alive, you did. I told them to fuck off. Not that I’m some kind of dumb-cluck hero. I just had a few higher up mafia friends I grew up with, went to mass and confession with, and they protected me for friendship’s sake. They’re like that, you know. Very loyal to the family, and I was a family friend, which is almost the same thing. Only once was I involved in an investigation that could have been embarrassing to one of them. We discussed it in O’Shaunessy’s bar on Atlantic Avenue. Practically crying in his beer, he advised me to lay off or our friendship would end, and so would I. So I laid off and returned the client’s retainer. Anyway, all I could have told her by then was that his husband was dead but she’d never prove it because the body didn’t exist, so she’d have to wait the statutory seven years until he was declared legally dead in order to collect the life insurance.", ], "imgUrl": `${prefix}fts-jr-baseball-murders-main.png`, "link": `${prefix}fts-jr-baseball-murders.html`, "poem": false, "mainImg": false, }, ], "Christian Hermeticism": [ { "title": "Meditation on the Eleventh Major Arcanum of the Tarot", "sub-title": "LA FORCE", "author": "", "description": [ "Dear Unknown Friend,", "In the preceding Letter the transformation of fallen animality into holy animality was discussed, where the latter is spontaneous obedience to God, without the hindrance of reflection, doubt or motives of interest. Such obedience is basically an instinct. This is why holy animality is represented in the Hermetic tradition, in the vision of Ezekiel, in the Apocalypse of St. John, and in Christian iconography, by four holy animals, whose synthesis—the sphinx—is divine instinctivity, or the kingdom of God in and through the unconscious. For God reigns—i.e. he is worshiped, obeyed and loved—not only through explicit theologies and philosophies, or through explicit prayer, meditation and cult-acts, but also in general through the “hunger and thirst for righteousness”, for truth, and for beauty, and likewise through each act of generosity and every expression of respect, admiration and adoration…Yes, the world is full of implicit religion, and the inspired saints and poets, who say that the birds “praise God” when they sing, are in no way mistaken. Because it is their tiny life itself which sings the “great life” and makes heard, through its countless variations, the same news which is as old as the world and new as the day: “Life lives and vibrates in me.” What homage to the source of life is expressed by these small streams of life: the birds which sing!", ], "imgUrl": `${prefix}meditations-tarot-xi-main.jpg`, "link": `${prefix}meditations-tarot-xi.html`, "poem": false, "mainImg": false, }, ], "Memoir": [ { "title": "Exile’s End - A Memoir", "sub-title": "Chapter 11", "author": "Frank Thomas Smith", "description": [ "I couldn't avoid feeling like a kind of traitor when we said goodbye to our Argentinian friends. We, after all, were escaping to a kind of Swiss paradise compared to the hell that Argentina had become. Bibi, our eldest, suffered most. She was a horse lover and had her own horse in a club. This was something only possible for us in a place like Argentina. Only the rich could afford that in Switzerland.", "The most practical option would have been for me to go alone to find somewhere to live, but I didn't want to leave them alone in a place where the police were literally afraid to leave their comisarias. So, we all left together in a long flight. It was much longer than expected because Montevideo, the first stop, was fogged in. We circled around a while and finally returned to Buenos Aires. When the crew received word that Montevideo was open for landing, we took off again. It was like a sign that I wasn't finished with Argentina and that I would be returning.", ], "imgUrl": `${prefix}exiles-end-11-main.png`, "link": `${prefix}exiles-end-11.html`, "poem": false, "mainImg": false, }, ], "Anthroposophy": [ { "title": "Manifestations of Karma", "sub-title": "", "author": "Rudolf Steiner", "description": [ "17 May 1910, Hamburg", "Before we come to the question of human karma, a number of preliminary considerations are necessary. Yesterday we gave a kind of description of the conception of karma, and today we shall have to say something about karma and the animal kingdom.", "What might be called external evidence of the reality of karmic law will be found in the course of these lectures in places where there will be occasion specially to point out this external evidence. On these occasions also we can acquire the ability to speak about the foundations of the idea of karma to those outside who may raise questions about one thing or another, or who may question the whole idea of karma. But for all this a few preliminary observations are necessary.", "What is more natural than to ask how animal life and animal fate are related to what we call the course of human karma? In this we shall find included what are, to mankind, the most important and profound questions of destiny.", ], "imgUrl": `${prefix}steiner-karma-2-main.png`, "link": `${prefix}steiner-karma-2.html`, "poem": false, "mainImg": false, }, ], "Current Events": [ { "title": "We’re Racing Down the Highway to a Mad Max World", "sub-title": "But There’s a Degrowth Exit Up Ahead", "author": "Stan Cox", "description": [ "Let me start by putting things bluntly: Don’t bother to tell Donald Trump, but with his distinct help, we’re doing nothing less than cooking ourselves. Thanks to the continued use of fossil fuels in a staggering fashion and the growth of greenhouse gas emissions, almost half of the world’s population now suffers through 30 additional days of extreme heat annually. Heatwaves roll in thicker and faster every year.", "On average, according to the medical journal The Lancet, 84% of the extremely hot days we’ve faced over the past five years would not have occurred without human-induced climate change that the American president seems intent on making so much worse. Heat-related deaths are already 63% more frequent than in the 1990s. That Lancet article also reported that heat- and drought-related hunger, as well as deaths from wildfire smoke and industrial air pollution, are breaking records globally almost yearly.", "Climate Impacts Tracker dubbed 2025 “The Year of Climate Disasters,” noting, “Flash floods tearing up a Himalayan village in India, hurricanes and wildfires ravaging the U.S., heatwaves and wildfires scorching Europe, record-breaking heat in Iceland and Greenland, torrential rains and floods roaring through Southeast Asia — 2025 marked yet another year of human tragedies, driven by extreme weather events.”" ], "imgUrl": `${prefix}cox-degrowth-main.png`, "link": `${prefix}cox-degrowth.html`, "poem": false, "mainImg": false, }, { "title": "Trump Goes Rogue as Robocop", "sub-title": "MAGA Outgrows Isolationism", "author": "John Feffer", "description": [ "A mere 15 years ago, during an epoch that now seems as distant as the Paleozoic era, an American president attempted to use military power to prevent a dictator from slaughtering his own citizens. Barack Obama billed the action in Libya as a humanitarian intervention, citing the new U.N. doctrine of “responsibility to protect” (R2P). The president hoped to avert a massacre by Libyan dictator Muammar Qaddafi rather than, as usual, coming in afterwards to count the dead and try to bring the malefactors to justice.", "Obama intervened like a global police officer, following the letter of the (international) law. Eager to be seen as a “good cop,” the president even promised to “lead from behind.” It’s impossible to know if the U.S.-led action did indeed prevent massive war crimes. However, the disastrous aftermath of that Libyan campaign — the summary execution of Qaddafi and a civil war that would kill tens of thousands — was yet more evidence that Washington’s attempts to police the world are quixotic at best.", ], "imgUrl": `${prefix}feffer-robocop-main.png`, "link": `${prefix}feffer-robocop.html`, "poem": false, "mainImg": false, }, { "title": "America’s Date With Destiny", "sub-title": "An Appointment in Samarra", "author": "Alfred McCoy", "description": [ "Some tales can cross cultures, continents, and even centuries to arrive in our own era with their timeless truths pretty much intact. That’s particularly so for the immortal story of “an appointment in Samarra.” It first appeared in the fifth century in the Babylonian Talmud, that ancient repository of Jewish rabbinical wisdom. Then it crossed over into Islamic literature for reiterations in a thirteenth-century Persian version and a fifteenth-century Egyptian text, before popping up on the London stage in Act III of William Somerset Maugham’s 1933 play Sheppy.", "In Maugham’s retelling, the tale is rich in irony. Once long ago, he wrote, there was a merchant in Baghdad who sent his servant to shop in the market. But the servant soon returned home in a panic and told his master about a woman in the crowd there who stared at him angrily. “It was Death that jostled me,” the servant announced, pleading with his master for a horse to flee to the town of Samarra. There, said the servant, “Death will not find me.”", "Riding hard and spurring the horse’s flanks, the servant raced across the desert and made it to Samarra by nightfall. That evening, the master himself went to the market and spotted the woman, demanding to know why she had threatened his servant. “That was not a threatening gesture,” said Death. “It was only a start of surprise. I was astonished to see him in Baghdad, for I had an appointment with him tonight in Samarra.”" ], "imgUrl": `${prefix}samarra-iraq.jpg`, "link": `${prefix}mccoy-appointment-in-samarra.html`, "poem": false, "mainImg": false, }, ], }; const articlesKeys = Object.keys(articles); // Uncheck all other hidden checkboxes when one is checked // colapses nav-menu dropdowns when a new one is expanded function createNavMenu(navMenuElement) { function createSingleLink(title, id) { const div = document.createElement("div"); const p = document.createElement("p"); p.className = "nav-menu-links"; p.innerText = title; p.dataset.title = id; div.appendChild(p); navMenuElement.appendChild(div); } function createLettersLink() { const div = document.createElement("div"); const p = document.createElement("p"); const a = document.createElement("a"); a.href = `${prefix}letters${issueNumber}.html`; a.style.color = "inherit"; a.style.textDecoration = "none"; p.className = "nav-menu-links"; a.innerText = "Letters to the Editor"; p.dataset.title = "letters"; p.appendChild(a); div.appendChild(p); navMenuElement.appendChild(div); } function createOldIssuesLink() { const div = document.createElement("div"); const p = document.createElement("p"); const a = document.createElement("a"); a.href = `https://southerncrossreview.org/old-issues.html`; a.style.color = "inherit"; a.style.textDecoration = "none"; p.className = "nav-menu-links"; a.innerText = "Old Issues"; p.dataset.title = "old-issues-nav"; p.appendChild(a); div.appendChild(p); navMenuElement.appendChild(div); } function createReincarnationLink() { const div = document.createElement("div"); const p = document.createElement("p"); const a = document.createElement("a"); a.href = `https://southerncrossreview.org/reincarnation_blues/reincarnation-blues-intro.html`; a.style.color = "inherit"; a.style.textDecoration = "none"; p.className = "nav-menu-links"; a.innerText = "Reincarnation Blues"; p.dataset.title = "reincarnation-nav"; p.appendChild(a); div.appendChild(p); navMenuElement.appendChild(div); } function createMenuLinks() { articlesKeys.forEach((category) => { // create dropdown menu if there is more than one article in category if (articles[category].length === 1) { if (!articles[category][0]["title"]) return; const div = document.createElement("div"); const p = document.createElement("p"); const title = articles[category][0]["title"] .toLowerCase() .replace(/[^a-zA-Z0-9]/g, ""); p.className = "nav-menu-links"; p.innerText = category; p.dataset.title = title; 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"); const title = article["title"] .replace(/[^a-zA-Z0-9]/g, "") .toLowerCase(); li.className = "nav-menu-links"; li.id = article["title"]; li.innerText = `${article.title} - ${article.author}`; li.dataset.title = title; list.appendChild(li); }); navMenuElement.appendChild(content); } }); //createSingleLink("Letters to the Editor", "pic-nav-menu"); createLettersLink(); createOldIssuesLink(); createReincarnationLink(); createSingleLink("Subscribe", "subscribe"); } createMenuLinks(); //event listeners const navmenuLinkArray = Array.from( navMenuElement.querySelectorAll(".nav-menu-links"), ); const scrollToTarget = (target) => { const headerOffset = 120; const elementPositon = target.getBoundingClientRect().top; const offsetPosition = elementPositon + window.pageYOffset - headerOffset; window.scrollTo({ top: offsetPosition, behavior: "smooth", }); }; navmenuLinkArray.forEach((link) => { if (link.dataset.title === "letters") return; link.addEventListener("click", () => { let article = document.querySelector(`#${link.dataset.title}`); scrollToTarget(article); if (menuBar.dataset.opened === "true") { menuBar.dataset.opened = "false"; } }); }); const navChekboxes = Array.from( document.querySelectorAll(".nav-hidden-inputs"), ); navChekboxes.forEach((input) => { input.addEventListener("change", () => { navChekboxes.forEach((element) => { if (element === input) return; element.checked = false; }); }); }); } function checkAndReduce() { const title = mainPage.querySelector("h2"); if (title.innerText.length > 20) { title.style.fontSize = "2.5em"; } } function appendPicNavMenu() { const picNavDiv = document .querySelector("[data-pic-nav]") .content.cloneNode(true); const nav = picNavDiv.querySelector("nav"); nav.id = "pic-nav-menu"; const subscribeDiv = document .querySelector("[data-subscribe-div]") .content.cloneNode(true); const subscribe = subscribeDiv.querySelector("div"); subscribe.id = "subscribe"; const firstChild = document.querySelector("#main-div").lastElementChild; const navDiv = document.createElement("div"); navDiv.appendChild(picNavDiv); navDiv.appendChild(subscribe); firstChild.insertAdjacentElement("afterend", navDiv); } function createArticlePeek(object) { const keys = Object.keys(object); keys.forEach((key) => { if (keys.indexOf(key) !== 0) { const categoryTitle = document.createElement("h1"); categoryTitle.innerText = key; categoryTitle.className = "category-title"; mainPage.appendChild(categoryTitle); } object[key].forEach((article) => { const articleDiv = document .querySelector("[data-article-template]") .content.cloneNode(true); const articleInnerDiv = articleDiv.querySelector("article"); const div1 = articleDiv.querySelector("div"); div1.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 linkContainer = articleDiv.querySelector("[data-link-container]"); const link = articleDiv.querySelector("[data-article-link]"); articleInnerDiv.id = article["title"] .toLowerCase() .replace(/[^a-zA-Z0-9]/g, ""); titleElement.innerHTML = article["title"]; author.innerHTML = article["author"]; if (article["sub-title"] && article["sub-title"].length !== 0) { subTitle.innerText = article["sub-title"]; } img.src = article["imgUrl"]; linkContainer.style.display = "flex"; linkContainer.style.width = "100%"; linkContainer.style.justifyContent = "center"; link.href = article["link"]; link.style.fontSize = "130%"; link.style.fontWeight = "500"; // Special Atributes for "Featured Art" if (article["mainImg"]) { // doubleFeaturedArt({ // div1, // div2, // titleElement, // subTitle, // articleInnerDiv, // img, // description, // }); titleElement.style.marginBottom = "1em"; link.style.display = "none"; img.style.maxWidth = "40%"; img.style.minWidth = "30%"; img.style.maxHeight = "100%"; img.style.marginLeft = "auto"; img.style.marginRight = "auto"; img.style.marginBottom = "1em"; img.style.float = "none"; img.insertAdjacentElement("afterend", author); description.style.width = "80%"; description.style.marginLeft = "auto"; description.style.marginRight = "auto"; } // if its a poem, make the div and link float (so the text doesn't go under the img) if (article["poem"]) { description.style.float = "left"; link.style.clear = "left"; link.style.float = "right"; } let i = 1; const className = article["title"] .replace(/[^a-zA-Z0-9]/g, "") .toLowerCase(); description.id = `${className}-paragraphs-div`; link.id = `${className}-main-link`; 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(); }); }); appendPicNavMenu(); } function mobilePortrait() { if (previousStylesheet.dataset.stylesheet == "mobile") return pageName.innerHTML = "Menu"; //create elements in mobile-navbar 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); //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(); mainPage.offsetTop; 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 === "dark") { stylesheet.href = `${prefix}css/dark.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"); }); //back to top button backToTop.addEventListener("click", () => { window.scrollTo({ top: 0, behavior: "smooth", }); }); // Sticky navbar const stickyFunc = () => { const limit = mainPage.offsetTop; const navCol = document.querySelector("#sticky-div "); if (window.pageYOffset + 50 >= limit) { navCol.classList.add("fixed-nav-col"); backToTop.classList.remove("back-to-top-hide"); } else { navCol.classList.remove("fixed-nav-col"); backToTop.classList.add("back-to-top-hide"); } }; //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); createArticlePeek(articles); window.onscroll = () => { stickyFunc(); }; })();