https://apillaraniconarelicaruin.colourwiki.org/index.php?action=history&feed=atom&title=MediaWiki%3ACommon.js MediaWiki:Common.js - Revision history 2026-05-31T17:30:25Z Revision history for this page on the wiki MediaWiki 1.45.3 https://apillaraniconarelicaruin.colourwiki.org/index.php?title=MediaWiki:Common.js&diff=19&oldid=prev Monolith at 09:42, 31 May 2026 2026-05-31T09:42:53Z <p></p> <table style="background-color: #fff; color: #202122;" data-mw="interface"> <col class="diff-marker" /> <col class="diff-content" /> <col class="diff-marker" /> <col class="diff-content" /> <tr class="diff-title" lang="en"> <td colspan="2" style="background-color: #fff; color: #202122; text-align: center;">← Older revision</td> <td colspan="2" style="background-color: #fff; color: #202122; text-align: center;">Revision as of 09:42, 31 May 2026</td> </tr><tr><td colspan="2" class="diff-lineno" id="mw-diff-left-l1">Line 1:</td> <td colspan="2" class="diff-lineno">Line 1:</td></tr> <tr><td class="diff-marker" data-marker="−"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div>$(function() {</div></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div>$<ins style="font-weight: bold; text-decoration: none;">(document).ready</ins>(function () {</div></td></tr> <tr><td class="diff-marker" data-marker="−"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div><del style="font-weight: bold; text-decoration: none;">    var knownNewMoon = new Date('2000-01-06').getTime();</del></div></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;">  /</ins>/ <ins style="font-weight: bold; text-decoration: none;">No external CSS needed — everything done via JS inline styles</ins></div></td></tr> <tr><td class="diff-marker" data-marker="−"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div><del style="font-weight: bold; text-decoration: none;">    var lunarCycle = 29.53058867 * 86400000;</del></div></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;">  </ins>var <ins style="font-weight: bold; text-decoration: none;">colors </ins>= ['<ins style="font-weight: bold; text-decoration: none;">#ff0000</ins>', '<ins style="font-weight: bold; text-decoration: none;">#ff8000</ins>', '<ins style="font-weight: bold; text-decoration: none;">#ffff00</ins>', '<ins style="font-weight: bold; text-decoration: none;">#00cc00</ins>', '<ins style="font-weight: bold; text-decoration: none;">#0099ff</ins>', '<ins style="font-weight: bold; text-decoration: none;">#8b00ff</ins>', '<ins style="font-weight: bold; text-decoration: none;">#ff00ff</ins>'];</div></td></tr> <tr><td class="diff-marker" data-marker="−"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div><del style="font-weight: bold; text-decoration: none;">    var phase = ((Date.now() - knownNewMoon) % lunarCycle) </del>/ <del style="font-weight: bold; text-decoration: none;">lunarCycle;</del></div></td><td colspan="2" class="diff-side-added"></td></tr> <tr><td class="diff-marker" data-marker="−"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div><del style="font-weight: bold; text-decoration: none;">    </del>var <del style="font-weight: bold; text-decoration: none;">moons </del>= ['<del style="font-weight: bold; text-decoration: none;">🌑','🌒</del>','<del style="font-weight: bold; text-decoration: none;">🌓</del>','<del style="font-weight: bold; text-decoration: none;">🌔</del>','<del style="font-weight: bold; text-decoration: none;">🌕</del>','<del style="font-weight: bold; text-decoration: none;">🌖</del>','<del style="font-weight: bold; text-decoration: none;">🌗</del>','<del style="font-weight: bold; text-decoration: none;">🌘</del>']<del style="font-weight: bold; text-decoration: none;">;</del></div></td><td colspan="2" class="diff-side-added"></td></tr> <tr><td class="diff-marker" data-marker="−"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div><del style="font-weight: bold; text-decoration: none;">    var labels = ['New Moon','Waxing Crescent','First Quarter','Waxing Gibbous',</del></div></td><td colspan="2" class="diff-side-added"></td></tr> <tr><td class="diff-marker" data-marker="−"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div><del style="font-weight: bold; text-decoration: none;">                  'Full Moon','Waning Gibbous','Last Quarter','Waning Crescent'];</del></div></td><td colspan="2" class="diff-side-added"></td></tr> <tr><td class="diff-marker" data-marker="−"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div><del style="font-weight: bold; text-decoration: none;">    var idx = Math.round(phase * 8) % 8</del>;</div></td><td colspan="2" class="diff-side-added"></td></tr> <tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><br></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><br></td></tr> <tr><td class="diff-marker" data-marker="−"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div>     var <del style="font-weight: bold; text-decoration: none;">div </del>= $('<del style="font-weight: bold; text-decoration: none;">&lt;div&gt;</del>').<del style="font-weight: bold; text-decoration: none;">css</del>({<del style="font-weight: bold; text-decoration: none;">padding:</del>'<del style="font-weight: bold; text-decoration: none;">8px</del>'<del style="font-weight: bold; text-decoration: none;">,textAlign:</del>'<del style="font-weight: bold; text-decoration: none;">center</del>'<del style="font-weight: bold; text-decoration: none;">,fontSize:</del>'<del style="font-weight: bold; text-decoration: none;">1.4em</del>'})</div></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;">  $('.rainbow-text').each(function () {</ins></div></td></tr> <tr><td class="diff-marker" data-marker="−"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div><del style="font-weight: bold; text-decoration: none;">        </del>.<del style="font-weight: bold; text-decoration: none;">html</del>(<del style="font-weight: bold; text-decoration: none;">moons[idx] + '&lt;br&gt;&lt;small&gt;' + labels[idx] + '&lt;/small&gt;'</del>);</div></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div>     var <ins style="font-weight: bold; text-decoration: none;">chars </ins>= $<ins style="font-weight: bold; text-decoration: none;">(this).text().split</ins>('')<ins style="font-weight: bold; text-decoration: none;">;</ins></div></td></tr> <tr><td class="diff-marker" data-marker="−"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div>     $(<del style="font-weight: bold; text-decoration: none;">'#mw-panel'</del>).<del style="font-weight: bold; text-decoration: none;">prepend</del>(<del style="font-weight: bold; text-decoration: none;">div</del>); <del style="font-weight: bold; text-decoration: none;"> // or </del>.<del style="font-weight: bold; text-decoration: none;">append</del>() <del style="font-weight: bold; text-decoration: none;">to put it at the bottom</del></div></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;">    var spans = chars</ins>.<ins style="font-weight: bold; text-decoration: none;">map(function </ins>(<ins style="font-weight: bold; text-decoration: none;">ch) </ins>{</div></td></tr> <tr><td colspan="2" class="diff-side-deleted"></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;">      var s = document.createElement(</ins>'<ins style="font-weight: bold; text-decoration: none;">span</ins>'<ins style="font-weight: bold; text-decoration: none;">);</ins></div></td></tr> <tr><td colspan="2" class="diff-side-deleted"></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;">      s.textContent = ch === </ins>' ' <ins style="font-weight: bold; text-decoration: none;">? </ins>'<ins style="font-weight: bold; text-decoration: none;">\u00a0</ins>' <ins style="font-weight: bold; text-decoration: none;">: ch;</ins></div></td></tr> <tr><td colspan="2" class="diff-side-deleted"></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;">      return s;</ins></div></td></tr> <tr><td colspan="2" class="diff-side-deleted"></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;">    </ins>})<ins style="font-weight: bold; text-decoration: none;">;</ins></div></td></tr> <tr><td colspan="2" class="diff-side-deleted"></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div> </div></td></tr> <tr><td colspan="2" class="diff-side-deleted"></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;">    $(this)</ins>.<ins style="font-weight: bold; text-decoration: none;">empty</ins>();</div></td></tr> <tr><td colspan="2" class="diff-side-deleted"></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div>     <ins style="font-weight: bold; text-decoration: none;">spans.forEach(function (s) { </ins>$(<ins style="font-weight: bold; text-decoration: none;">this).append(s</ins>)<ins style="font-weight: bold; text-decoration: none;">; }</ins>.<ins style="font-weight: bold; text-decoration: none;">bind</ins>(<ins style="font-weight: bold; text-decoration: none;">this)</ins>);</div></td></tr> <tr><td colspan="2" class="diff-side-deleted"></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div> </div></td></tr> <tr><td colspan="2" class="diff-side-deleted"></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;">    spans</ins>.<ins style="font-weight: bold; text-decoration: none;">forEach(function (span, i) {</ins></div></td></tr> <tr><td colspan="2" class="diff-side-deleted"></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;">      var phase = i;</ins></div></td></tr> <tr><td colspan="2" class="diff-side-deleted"></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;">      setInterval(function </ins>() <ins style="font-weight: bold; text-decoration: none;">{</ins></div></td></tr> <tr><td colspan="2" class="diff-side-deleted"></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;">        span.style.color = colors[phase % colors.length];</ins></div></td></tr> <tr><td colspan="2" class="diff-side-deleted"></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;">        phase++;</ins></div></td></tr> <tr><td colspan="2" class="diff-side-deleted"></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;">      }, 150);</ins></div></td></tr> <tr><td colspan="2" class="diff-side-deleted"></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;">    });</ins></div></td></tr> <tr><td colspan="2" class="diff-side-deleted"></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;">  });</ins></div></td></tr> <tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>});</div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>});</div></td></tr> </table> Monolith https://apillaraniconarelicaruin.colourwiki.org/index.php?title=MediaWiki:Common.js&diff=18&oldid=prev Monolith: Created page with "$(function() { var knownNewMoon = new Date('2000-01-06').getTime(); var lunarCycle = 29.53058867 * 86400000; var phase = ((Date.now() - knownNewMoon) % lunarCycle) / lunarCycle; var moons = ['🌑','🌒','🌓','🌔','🌕','🌖','🌗','🌘']; var labels = ['New Moon','Waxing Crescent','First Quarter','Waxing Gibbous', 'Full Moon','Waning Gibbous','Last Quarter','Waning Crescent']; var idx = Math.round(phase * 8) % 8; v..." 2026-05-31T09:35:55Z <p>Created page with &quot;$(function() { var knownNewMoon = new Date(&#039;2000-01-06&#039;).getTime(); var lunarCycle = 29.53058867 * 86400000; var phase = ((Date.now() - knownNewMoon) % lunarCycle) / lunarCycle; var moons = [&#039;🌑&#039;,&#039;🌒&#039;,&#039;🌓&#039;,&#039;🌔&#039;,&#039;🌕&#039;,&#039;🌖&#039;,&#039;🌗&#039;,&#039;🌘&#039;]; var labels = [&#039;New Moon&#039;,&#039;Waxing Crescent&#039;,&#039;First Quarter&#039;,&#039;Waxing Gibbous&#039;, &#039;Full Moon&#039;,&#039;Waning Gibbous&#039;,&#039;Last Quarter&#039;,&#039;Waning Crescent&#039;]; var idx = Math.round(phase * 8) % 8; v...&quot;</p> <p><b>New page</b></p><div>$(function() {<br /> var knownNewMoon = new Date(&#039;2000-01-06&#039;).getTime();<br /> var lunarCycle = 29.53058867 * 86400000;<br /> var phase = ((Date.now() - knownNewMoon) % lunarCycle) / lunarCycle;<br /> var moons = [&#039;🌑&#039;,&#039;🌒&#039;,&#039;🌓&#039;,&#039;🌔&#039;,&#039;🌕&#039;,&#039;🌖&#039;,&#039;🌗&#039;,&#039;🌘&#039;];<br /> var labels = [&#039;New Moon&#039;,&#039;Waxing Crescent&#039;,&#039;First Quarter&#039;,&#039;Waxing Gibbous&#039;,<br /> &#039;Full Moon&#039;,&#039;Waning Gibbous&#039;,&#039;Last Quarter&#039;,&#039;Waning Crescent&#039;];<br /> var idx = Math.round(phase * 8) % 8;<br /> <br /> var div = $(&#039;&lt;div&gt;&#039;).css({padding:&#039;8px&#039;,textAlign:&#039;center&#039;,fontSize:&#039;1.4em&#039;})<br /> .html(moons[idx] + &#039;&lt;br&gt;&lt;small&gt;&#039; + labels[idx] + &#039;&lt;/small&gt;&#039;);<br /> $(&#039;#mw-panel&#039;).prepend(div); // or .append() to put it at the bottom<br /> });</div> Monolith