Convert resource fix script to jQuery

karx1 · karx1 · commit 4017977ba6f2 · 2020-10-13T20:10:18.000-05:00
diff --git a/notes/static/js/resources.js b/notes/static/js/resources.js
@@ -3,7 +3,8 @@ https://github.com/The-Domecode/domecode-opensource/issues/3#issuecomment-685106
 for more info. */
 
 
-// polyfill "String.includes" function. required for bowsers without ES6 support, like Internet Explorer.
+// polyfill "String.includes" function. 
+// Required for bowsers without ES6 support, like Internet Explorer.
 if (!String.prototype.includes) {
     String.prototype.includes = function(search, start) {
         'use strict';
@@ -19,40 +20,21 @@ if (!String.prototype.includes) {
     };
 }
 
-var all = document.getElementsByTagName("*");
 
-var name;
-var elements = [];
-
-// loop through all elements on page to find all the iframes
-for (var i=0, max=all.length; i < max; i++) {
-    // get element name
-    var el = all[i];
-    var name = el.nodeName.toLowerCase();
-    if (name == "iframe") {
-        // if it's an iframe, push it to the list.
-        elements.push(el);
+// Gather all video frames
+var frames = $("iframe").map(function() {
+    if (this.src.includes("trinket")) {
+        // This is a trinket frame, skip
+        return;
+    } else {
+        // This is not a trinket frame, return this
+        return this;
     }
-}
+});
 
-// loop through all the iframes we found
-for (var i=0, max=elements.length; i < max; i++) {
-    // get the frame to work on
-    var frame = elements[i];
-    // Skip trinket python editor
-    if(frame.src.includes("trinket")) {
-        continue;
-    }
-    // Wrap the video inside the video-wrapper class
-    
-    // get the frame's current parent
-    var parent = frame.parentNode;
-    // create the wrapper div and set its class
-    var wrapper = document.createElement("div");
-    wrapper.className = "video-container"
+// Loop over each frame we got
+frames.each(function() {
+    // Create our wrapper div and wrap the frame
+    $("<div/>", {"class": "video-container"}).wrap($(this));
 
-    // set the wrapper as the parent's child instead of the frame
-    parent.replaceChild(wrapper, frame);
-    // set the frame as the child of the wrapper
-    wrapper.appendChild(frame);
-}
+});
