utils.js 4.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123
  1. (function (x) {
  2. var o = x.prototype;
  3. o.after || (o.after = function () { var e, m = arguments, l = m.length, i = 0, t = this, p = t.parentNode, n = Node, s = String, d = document; if (p !== null) { while (i < l) { ((e = m[i]) instanceof n) ? (((t = t.nextSibling) !== null) ? p.insertBefore(e, t) : p.appendChild(e)) : p.appendChild(d.createTextNode(s(e))); ++i; } } });
  4. }(Element));
  5. // from: https://github.com/jserz/js_piece/blob/master/DOM/ChildNode/before()/before().md
  6. (function (arr) {
  7. arr.forEach(function (item) {
  8. if (item.hasOwnProperty('before')) {
  9. return;
  10. }
  11. Object.defineProperty(item, 'before', {
  12. configurable: true,
  13. enumerable: true,
  14. writable: true,
  15. value: function before() {
  16. var argArr = Array.prototype.slice.call(arguments),
  17. docFrag = document.createDocumentFragment();
  18. argArr.forEach(function (argItem) {
  19. var isNode = argItem instanceof Node;
  20. docFrag.appendChild(isNode ? argItem : document.createTextNode(String(argItem)));
  21. });
  22. this.parentNode.insertBefore(docFrag, this);
  23. }
  24. });
  25. });
  26. })([Element.prototype, CharacterData.prototype, DocumentType.prototype])
  27. window.shuffleArray = function (array) {
  28. for (let i = array.length - 1; i > 0; i--) {
  29. const j = Math.floor(Math.random() * (i + 1));
  30. [array[i], array[j]] = [array[j], array[i]];
  31. }
  32. return array;
  33. };
  34. let PROGRESS_BAR_INTERVAL = null;
  35. window.addEventListener("load", function () {
  36. document.getElementById("pageLoadingProgress").style.display = "none";
  37. if (PROGRESS_BAR_INTERVAL) {
  38. clearInterval(PROGRESS_BAR_INTERVAL);
  39. PROGRESS_BAR_INTERVAL = null;
  40. }
  41. });
  42. PROGRESS_BAR_INTERVAL = setInterval(function () {
  43. const bar = document.getElementById("pageLoadingProgress");
  44. if (!bar) return;
  45. bar.value += 1;
  46. if (bar.value >= bar.max) bar.value = 0;
  47. }, 20);
  48. window.addEventListener("DOMContentLoaded", function () {
  49. document.querySelectorAll("[toggle]").forEach(el=>{
  50. const toggleId=el.getAttribute("toggle");
  51. if(!toggleId)return;
  52. const parent=document.querySelector("#"+toggleId);
  53. if(!parent)return;
  54. el.addEventListener("click",()=>{
  55. parent.querySelectorAll(".expandable").forEach(el2=>{
  56. if(el2.classList.contains("expandedOnPortrait"))
  57. el2.classList.remove("expandedOnPortrait");
  58. else el2.classList.add("expandedOnPortrait");
  59. });
  60. parent.querySelectorAll(".toggleable").forEach(el2=>{
  61. let toggled=el2.classList.contains("toggledOn");
  62. let toggledPortrait=el2.classList.contains("toggledOnPortrait");
  63. let notToggledPortrait=el2.classList.contains("toggledOffPortrait");
  64. toggled=toggled||toggledPortrait;
  65. const portrait=notToggledPortrait||toggledPortrait;
  66. console.log("Toggle ",toggled?"on":"off'")
  67. if(toggled){
  68. // el.removeAttribute("toggled",false);
  69. el2.classList.add(portrait?"toggledOffPortrait":"toggledOff");
  70. el2.classList.remove("toggledOn");
  71. el2.classList.remove("toggledOnPortrait");
  72. }else{
  73. // el.setAttribute("toggled",true);
  74. el2.classList.remove("toggledOff");
  75. el2.classList.remove("toggledOffPortrait");
  76. el2.classList.add(portrait?"toggledOnPortrait":"toggledOn");
  77. }
  78. });
  79. });
  80. })
  81. document.getElementById("pageLoadingProgress").style.display = "none";
  82. if (PROGRESS_BAR_INTERVAL) {
  83. clearInterval(PROGRESS_BAR_INTERVAL);
  84. PROGRESS_BAR_INTERVAL = null;
  85. }
  86. });
  87. function lazyLoad(parent){
  88. parent.querySelectorAll('[lazy]').forEach(el=>{
  89. console.log("Lazy load",el);
  90. const attributeKeys=el.getAttributeNames();
  91. attributeKeys.forEach(akey=>{
  92. if(akey.startsWith("lazy-")){
  93. console.log("Load attribute "+akey);
  94. const realkey=akey.substring(5);
  95. const value=el.getAttribute(akey);
  96. el.setAttribute(realkey,value);
  97. console.log("Set",realkey,"=",value);
  98. }else{
  99. console.log("Skip attribute",akey,"not lazy");
  100. }
  101. })
  102. });
  103. }