From afb9501e21e9adc02cba637afeb120b5e4dfcfdb Mon Sep 17 00:00:00 2001
From: William Mantly <wmantly@gmail.com>
Date: Wed, 17 Dec 2025 13:59:45 -0500
Subject: [PATCH 1/2] Fix for wildcard certs

---
 nodejs/conf/production.js             |   2 +-
 nodejs/controller/codeland.js         |   2 +-
 nodejs/lib/codeland.js                |  10 +-
 nodejs/public/lib/js/jq-repeat_new.js | 138 +++++++++++++++++++-------
 nodejs/views/runner.ejs               |   2 +-
 5 files changed, 107 insertions(+), 47 deletions(-)

diff --git a/nodejs/conf/production.js b/nodejs/conf/production.js
index 88dac39..7606a56 100644
--- a/nodejs/conf/production.js
+++ b/nodejs/conf/production.js
@@ -24,6 +24,6 @@ module.exports = {
 		runnerTemplate: 'crunner0',
 		memTarget: 15,
 		minAvailableRunners: 10,
-		domian: 'prod.718it.codeland.us',
+		domian: 'cl-worker-3.718it.codeland.us',
 	},
 };
diff --git a/nodejs/controller/codeland.js b/nodejs/controller/codeland.js
index 91e90b6..8df9cb1 100644
--- a/nodejs/controller/codeland.js
+++ b/nodejs/controller/codeland.js
@@ -42,7 +42,7 @@ const clworker = new CodelandController({ssh, ...conf.clworker});
       clworker.__log('memory', await clworker.ssh.memory())
     }catch{}
   }, 2000, clworker)
-  await clworker.deleteUntracedRunners();
+  await clworker.deleteUntrackedRunners();
   await clworker.runnerOven(10*1000);
 
   clworker.__log('df', (await clworker.ssh.df())['/'])
diff --git a/nodejs/lib/codeland.js b/nodejs/lib/codeland.js
index e2d6cbf..5fc2342 100644
--- a/nodejs/lib/codeland.js
+++ b/nodejs/lib/codeland.js
@@ -110,8 +110,6 @@ class CodeLandWorker{
 		instances.
 	*/
 	async init(){
-
-
 		this.runnerTemplate = await LXC.get({
 			name: this.runnerTemplate,
 			execInstance: this.ssh
@@ -129,7 +127,6 @@ class CodeLandWorker{
 			environment: conf.environment,
 		}), 1000)
 		
-
 		return this;
 	}
 
@@ -168,12 +165,13 @@ class CodeLandWorker{
 	}
 
 	/*
-		getCurrentCopies and deleteUntracedRunners clean up zombie runners from
+		getCurrentCopies and deleteUntrackedRunners clean up zombie runners from
 		old instances of Codeland
 	*/
 	async getCurrentCopies(){
 		let containers = await this.runnerTemplate.list();
 		let runners = {};
+
 		for(let container of containers){
 			if(container.name.startsWith(this.runnerPrefix ) ){
 				if(container.name === this.runnerTemplate) continue;
@@ -187,7 +185,7 @@ class CodeLandWorker{
 		return runners;
 	}
 
-	async deleteUntracedRunners(){
+	async deleteUntrackedRunners(){
 		for(let [name, runner] of Object.entries(await this.getCurrentCopies())){
 			if(!this.__runners[name]){
 				(async ()=>{
@@ -455,7 +453,7 @@ if (require.main === module){(async function(){try{
 
 	// await clworker.ssh.exec('bash ~/clean_crunners.sh');
 
-	// await clworker.deleteUntracedRunners();
+	// await clworker.deleteUntrackedRunners();
 	await clworker.runnerOven();
 	
 	console.log('mem info:', await clworker.memory())
diff --git a/nodejs/public/lib/js/jq-repeat_new.js b/nodejs/public/lib/js/jq-repeat_new.js
index 97f5871..9a4f32d 100644
--- a/nodejs/public/lib/js/jq-repeat_new.js
+++ b/nodejs/public/lib/js/jq-repeat_new.js
@@ -10,7 +10,7 @@ MIT license
 		$.scope = {};
 	}
 	
-	var make = function(element){
+	var make = function(element, template){
 		var result = [];
 
 		result.splice = function(inputValue, ...args){
@@ -82,7 +82,7 @@ MIT license
 					//figure out new elements index
 					var key = I + index;
 					// apply values to template
-					var render = Mustache.render(this.__jqTemplate, toAdd[I]);
+					var render = Mustache.render(this.__jqTemplate, this.__buildData(i, toAdd[I]));
 					
 					//set call name and index keys to DOM element
 					var $render = $( render ).addClass( 'jq-repeat-'+ this.__jqRepeatId ).attr( 'jq-repeat-index', key );
@@ -216,10 +216,8 @@ MIT license
 				return [];
 			}
 			this[index] = $.extend( true, this[index], data );
- 			
- 			console.log('this', this[index])
 
-			var $render = $(Mustache.render(this.__jqTemplate, this[index]));
+			var $render = $(Mustache.render(this.__jqTemplate, this.__buildData(index, this[index])));
 			$render.attr('jq-repeat-index', index);
 
 			this.__update(this[index].__jq_$el, $render, this[index], this);
@@ -230,6 +228,8 @@ MIT license
 			return this[this.indexOf(key, value)];
 		}
 
+		// User definable helper methods
+
 		result.__put = function($el, item, list){
 			$el.show();
 		};
@@ -243,37 +243,72 @@ MIT license
 			$el.show();
 		};
 
-		result.__setPut = function(fn) {
-			Object.defineProperty(this, '__put', {
-				value: fn,
-				writable: true,
-				enumerable: false,
-				configurable: true
-			});
-		};
+		result.__parseData = function(data){
+			return data;
+		}
 
-		result.__setTake = function(fn) {
-			Object.defineProperty(this, '__take', {
-				value: fn,
-				writable: true,
-				enumerable: false,
-				configurable: true
-			});
+		// internal helper methods
+
+		result.__buildData = function(index, data){
+
+			return {
+				...this.__parseData(data),
+				nestedTemplates: this.__parseNestedTemplates(index, data),
+				_parent: this.__jqParent ? $.scope[this.__jqParent][this.__jqParentIndex] : undefined,
+			};
 		};
 
-		result.__setUpdate = function(fn) {
-			Object.defineProperty(this, '__update', {
-				value: fn,
-				writable: true,
+		result.__parseNestedTemplates = function(index, data){
+			let templates = []
+			let tempData = {
+				...data,
+				_parent: data,
+			};
+
+			for(let idx in this.nestedTemplates){
+				let $el = $(`${this.nestedTemplates[idx]}`);
+
+				$el.attr('jq-repeat', Mustache.render($el.attr('jq-repeat'), tempData));
+				$el.attr('jq-repeat-index', Mustache.render($el.attr('jq-repeat-index'), tempData));
+				$el.attr('jq-repeat-parent', this.__jqRepeatId);
+				$el.attr('jq-repeat-parent-index', index);
+				templates[idx] = $el[0].outerHTML;
+			}
+
+			return templates;
+		}
+
+		for(let prop of ['put', 'take', 'update', 'parseData']){
+			Object.defineProperty(result, prop, {
 				enumerable: false,
-				configurable: true
+				get(){
+					return this[`__${prop}`]
+				},
+				set(value) {
+					this[`__${prop}`] = value;
+				},
 			});
-		};
+		}
 
-		var $this = $( element ); 
+		var $this = $(element); 
+		result.nestedTemplates = [];
 		result.__jqRepeatId = $this.attr( 'jq-repeat' );
 		$this.removeAttr('jq-repeat');
 		result.__index = $this.attr('jq-repeat-index');
+
+		if($this.attr('jq-repeat-parent')){
+			result.__jqParent = $this.attr('jq-repeat-parent');
+			result.__jqParentIndex = $this.attr('jq-repeat-parent-index');
+		}
+
+
+		$this.find('[jq-repeat]').each((idx, el)=>{
+			let templateIdx = result.nestedTemplates.length;
+			let template = `${el.outerHTML}`;
+			result.nestedTemplates.push(template);
+			$(el).replaceWith(`{{{ nestedTemplates.${templateIdx} }}}`);
+		});
+
 		result.__jqTemplate = $this[0].outerHTML;
 		$this.replaceWith( '<script type="x-tmpl-mustache" id="jq-repeat-holder-' + result.__jqRepeatId + '"><\/script>' );
 		result.$this = $('#jq-repeat-holder-' + result.__jqRepeatId);
@@ -293,20 +328,47 @@ MIT license
 	};
 
 	$( document ).ready( function(){
-		$( '[jq-repeat]' ).each(function(key, value){
-			make(value);
+
+		// Create an instance of MutationObserver and pass the callback function
+		const observer = new MutationObserver(function(mutationsList) {
+			mutationsList.forEach(mutation => {
+				if (mutation.type === 'childList') {
+					const addedNodes = mutation.addedNodes;
+					addedNodes.forEach(node => {
+						if (node.nodeType === Node.ELEMENT_NODE) {
+							const $el = $(node);
+							if ($el.is('[jq-repeat]')) {
+								make(node);
+							} else {
+								const toMake = [];
+								$el.find('[jq-repeat]').each((key, el) => {
+									if ($(el).parent().closest('[jq-repeat]').length) return;
+									toMake.push(el);
+								});
+
+								toMake.forEach(el => {
+									make(el);
+								});
+							}
+						}
+					});
+				}
+			});
 		});
 
-		$(document).on('DOMNodeInserted', function(e) {
-			if ( $(e.target).is('[jq-repeat]') ){
-				make( e.target );
-			}else{
-				var t = $(e.target).find('[jq-repeat]');
-				t.each(function(key, value){
-					make(value);
-				});
-			}
+		// Start observing the document
+		observer.observe(document.body, { childList: true, subtree: true });
+
+		let toMake = [];
+
+		$( '[jq-repeat]' ).each(function(key, value){
+			if($(value).parent().closest('[jq-repeat]').length) return;
+			toMake.push(value);
 		});
+
+		for(let el of toMake){
+			make(el);
+		}
 	} );
 
 })(jQuery, Mustache);
diff --git a/nodejs/views/runner.ejs b/nodejs/views/runner.ejs
index c3f9b53..ee87a60 100644
--- a/nodejs/views/runner.ejs
+++ b/nodejs/views/runner.ejs
@@ -212,7 +212,7 @@ function startTtyTerminal($element){
 
 		termTTY = new CLTerminalWs(
 			$element.get(0),
-			`wss://7681.${data.domain}/ws`,
+			`wss://7681_${data.domain}/ws`,
 			function(){
 				// Clear aurrent actions message
 				app.util.actionMessage(``, $element);

From e7b3a41dcf95c3fef2f06b06d0b27f058e767670 Mon Sep 17 00:00:00 2001
From: William Mantly <wmantly@gmail.com>
Date: Wed, 17 Dec 2025 14:06:15 -0500
Subject: [PATCH 2/2] New version of jq-repeat

---
 nodejs/public/lib/js/jq-repeat_new.js | 1082 +++++++++++++++++++------
 1 file changed, 845 insertions(+), 237 deletions(-)

diff --git a/nodejs/public/lib/js/jq-repeat_new.js b/nodejs/public/lib/js/jq-repeat_new.js
index 9a4f32d..25c41f2 100644
--- a/nodejs/public/lib/js/jq-repeat_new.js
+++ b/nodejs/public/lib/js/jq-repeat_new.js
@@ -4,351 +4,957 @@ https://github.com/wmantly/jq-repeat
 MIT license
 */
 
-(function($, Mustache){
-'use strict';
-	if (!$.scope) {
-		$.scope = {};
+class CallbackQueue {
+	constructor(callbacks) {
+		this.__callbacks = [];
+
+		for (let callback of Array.isArray(callbacks) ? callbacks : [callbacks]) {
+			this.push(callback);
+		}
+	}
+
+	push(callback) {
+		if (callback instanceof Function) {
+			this.__callbacks.push(callback);
+		}
+	}
+
+	call() {
+		let args = arguments;
+		this.__callbacks.forEach(callback => {
+			callback(...args);
+		});
+	}
+}
+
+// Encapsulate the library within an IIFE to prevent global scope pollution
+(function($, Mustache) {
+	'use strict';
+
+	const throttleMap = {};
+
+	function throttleCheck(key) {
+	    if (throttleMap[key] && throttleMap[key].args !== null) {
+	        // Call the callback with the stored arguments
+	        throttleMap[key].callBack(...throttleMap[key].args);
+	        throttleMap[key].args = null;
+	        
+	        // Schedule next check
+	        setTimeout(throttleCheck, throttleMap[key].minDelay, key);
+	    } else {
+	        // Clean up when no more pending calls
+	        delete throttleMap[key];
+	    }
 	}
-	
-	var make = function(element, template){
-		var result = [];
 
-		result.splice = function(inputValue, ...args){
-			//splice does all the heavy lifting by interacting with the DOM elements.
+	function throttle(key, minDelay, callBack, ...args) {
+	    if (throttleMap[key]) {
+	        // Update arguments for pending call
+	        throttleMap[key].args = args;
+	    } else {
+	        // First call - execute immediately and set up throttling
+	        throttleMap[key] = {
+	            args: null,
+	            minDelay,
+	            callBack,
+	        };
+
+	        // Execute immediately
+	        callBack(...args);
+	        
+	        // Schedule throttle check
+	        setTimeout(throttleCheck, minDelay, key);
+	    }
+	}
 
-			var toProto = [...args]
+	// Internal scope object for managing repeat lists
+	const _scope = {};
 
-			var index;
-			//if a string is submitted as the index, try to match it to index number
-			if(typeof arguments[0] === 'string'){
-				index = this.indexOf( arguments[0] );//set where to start
-				if (index === -1) {
-					return [];
+	Object.defineProperty(_scope, 'onNew', {
+		value: new CallbackQueue(),
+		writable: true,
+		enumerable: false,
+		configurable: true
+	});
+
+	$.scope = new Proxy(_scope, {
+		get(obj, prop) {
+			if (!obj[prop]) {
+				obj[prop] = [];
+			}
+			return Reflect.get(...arguments);
+		},
+		set(obj, prop, value) {
+			return Reflect.set(...arguments);
+		},
+	});
+
+	// --- Helper function to clean up nested jq-repeat elements ---
+	function cleanupNestedRepeats($element) {
+		if (!$element || !$element.length) return;
+		
+		// Find all nested jq-repeat elements within this element
+		const $nestedRepeats = $element.find('[jq-repeat-scope]');
+		
+		$nestedRepeats.each(function() {
+			const $nested = $(this);
+			const nestedScopeId = $nested.attr('jq-repeat-scope');
+			
+			if (nestedScopeId && $.scope[nestedScopeId]) {
+				// Clean up the nested scope instance
+				const nestedInstance = $.scope[nestedScopeId];
+				
+				// Call take on all items to clean up their DOM elements
+				for (let i = 0; i < nestedInstance.length; i++) {
+					if (nestedInstance[i] && nestedInstance[i].__jq_$el) {
+						nestedInstance.__take(nestedInstance[i].__jq_$el, nestedInstance[i], nestedInstance);
+					}
 				}
-			}else{
-				index = arguments[0]; //set where to start
+				
+				// Clear the array
+				nestedInstance.length = 0;
+				
+				// Remove from global scope
+				delete $.scope[nestedScopeId];
+			}
+		});
+	}
+
+	// --- ES6 Class for jq-repeat lists ---
+	class RepeatList extends Array {
+		// This is the fix: tells built-in Array methods (like slice, map, filter)
+		// to return plain Array instances instead of RepeatList instances.
+		static get [Symbol.species]() {
+			return Array;
+		}
+
+		constructor(element, scopeId, options, parentData, parentId, parentIndex, templateHTML, nestedTemplates) {
+			super();
+
+			this.__jqRepeatId = scopeId;
+			this.options = options;
+
+			// Store the actual indexKey property name for quick access
+			if (options && options.indexKey !== undefined) {
+				this.__jqIndexKey = options.indexKey;
+			}
+
+			// Store sorting options
+			if (options && options.orderBy !== undefined) {
+				this.__jqOrderBy = options.orderBy;
+				this.__jqOrderReverse = options.orderReverse === 'true';
+			} else {
+				this.__jqOrderBy = null;
+				this.__jqOrderReverse = false;
 			}
 
-			toProto.unshift(index)
+			this._parentData = parentData;
+			this.__jqParent = parentId;
+			this.__jqParentIndex = parentIndex;
+			this.__jqTemplate = templateHTML;
+			this.nestedTemplates = nestedTemplates;
+
+			this.$this = $(`<script type="x-tmpl-mustache" id="jq-repeat-holder-${this.__jqRepeatId}"><\/script>`);
+			$(element).replaceWith(this.$this);
+
+			let tokenArray = Mustache.parse(this.__jqTemplate);
+
+			this.templateKeys = [];
 
-			var howMany = arguments[1]; //sets the amount of fields to remove
-			var args = Array.prototype.slice.call( arguments ); // coverts arguments into array 
-			var toAdd = args.slice(2); // only keeps fields to add to array
+			for(let token of tokenArray){
+				if(['name', '#', '^'].includes(token[0])){
+					this.templateKeys.push(token[1]);
+				}
+			}
 
-			// if the starting point is higher then the total index count, start at the end
-			if( index > this.length ) {
-				index = this.length;
+			this.templateKeysObj = this.__parseTemplateKeys(tokenArray)
+
+			this.parseKeys = {};
+
+			for (let prop of ['put', 'take', 'putUpdate', 'parseData']) {
+				Object.defineProperty(this, prop, {
+					enumerable: false,
+					get() {
+						return this[`__${prop}`];
+					},
+					set(value) {
+						if (typeof value === 'function') {
+							this[`__${prop}`] = value;
+						} else {
+							console.warn(`jq-repeat: Attempted to set '${prop}' to a non-function value for scope '${this.__jqRepeatId}'.`);
+						}
+					},
+				});
 			}
-			// if the starting point is negative, start form the end of the array, minus the start point
-			if( index < 0 ) {
-				index = this.length - Math.abs( index );
+		}
+
+/*		__parseTemplateKeys(parsed, obj){
+			for(let token of parsed){
+				if(['name', '^'].includes(token[0])){
+					obj[token[1].split('.')[0].split('[')[0]] = null;
+				}
+				if(token[0] === '#'){
+					obj[token[1]] = {};
+					this.__parseTemplateKeys(token[4], obj[token[1]])
+				}
+				if(token[0] === '&'){
+					obj[token[1].split('.')[0].split('[')[0]] = null;
+				}
 			}
+		}*/
+
+	__parseTemplateKeys(tokenArray){
+		const keyMap = {};
+
+		tokenArray.forEach(token => {
+		const type = token[0];
+		const key = token[1];
+
+		// We only care about tokens that represent a variable, section, or partial
+		if (['name', '#', '^', '>', '&'].includes(type)) {
+		  // Handle dot notation and array-like keys
+		  const keyParts = key.split('.');
+		  let currentMap = keyMap;
+
+		  keyParts.forEach((part, index) => {
+		    // Check for array notation like `user[0]` and treat it as a plain key
+		    const cleanPart = part.split('[')[0];
+
+		    if (index === keyParts.length - 1) {
+		      // This is the last part of the key path
+		      if (type === '#' || type === '^') {
+		        // For sections, make a recursive call to get nested keys
+		        currentMap[cleanPart] = this.__parseTemplateKeys(token[4]);
+		      } else {
+		        // For simple variables or partials, just set the value to null
+		        currentMap[cleanPart] = null;
+		      }
+		    } else {
+		      // This is an intermediate part of the key path
+		      // If the part doesn't exist or isn't an object, create a new object
+		      if (!currentMap[cleanPart] || typeof currentMap[cleanPart] !== 'object') {
+		        currentMap[cleanPart] = {};
+		      }
+		      // Move to the next level of the object
+		      currentMap = currentMap[cleanPart];
+		    }
+		  });
+		}
+		});
+
+		return keyMap;
+	}
 
-			// if there are things to add, figure out the how many new indexes we need
-			if( !howMany && howMany !== 0 ) {
-				howMany = this.length - index;
+
+		/**
+		 * Compares two items based on the __jqOrderBy key and __jqOrderReverse flag.
+		 */
+		__compareItems(itemA, itemB) {
+			if (!this.__jqOrderBy) {
+				return 0;
 			}
-			//not sure why i put this here... but it does matter!
-			if( howMany > this.length - index ) {
-				howMany = this.length - index;
+
+			if (itemB === undefined || itemB === null) {
+			    return 0;
 			}
 
-			//figure out how many positions we need to shift the current elements
-			var shift = toAdd.length - howMany;
+			const valA = itemA[this.__jqOrderBy];
+			const valB = itemB[this.__jqOrderBy];
+
+			// Handle undefined/null values
+			if (valA === undefined || valA === null) return (valB === undefined || valB === null) ? 0 : (this.__jqOrderReverse ? -1 : 1);
+			if (valB === undefined || valB === null) return (this.__jqOrderReverse ? 1 : -1);
 
-			// figure out how big the new array will be
-			// var newLength = this.length + shift;
+			let comparison = 0;
 
-			//removes fields from array based on howMany needs to be removed
-			for( var i = index; i < +index+howMany; i++ ) {
-				this.__take(this[index].__jq_$el, this[index], this);
-				// this.__take.apply( $( '.jq-repeat-'+ this.__jqRepeatId +'[jq-repeat-index="'+ ( i + index ) +'"]' ) );
+			// Numeric comparison
+			if (typeof valA === 'number' && typeof valB === 'number') {
+				comparison = valA - valB;
+			}
+			// String comparison (case-insensitive)
+			else if (typeof valA === 'string' && typeof valB === 'string') {
+				comparison = valA.localeCompare(valB, undefined, { sensitivity: 'base' });
+			}
+			// Date comparison
+			else if (valA instanceof Date && valB instanceof Date) {
+				comparison = valA.getTime() - valB.getTime();
+			} else {
+				// Fallback to string comparison
+				comparison = String(valA).localeCompare(String(valB), undefined, { sensitivity: 'base' });
 			}
 
-			//re-factor element index's
-			for(var i = 0; i < this.length; i++){
-				if(  i >= index){
+			return this.__jqOrderReverse ? -comparison : comparison;
+		}
 
-					this[i].__jq_$el.attr( 'jq-repeat-index', i+shift );
+		/**
+		 * Finds the correct insertion index for a new item to maintain sorted order.
+		 */
+		__findInsertionIndex(newItem) {
+		    if (!this.__jqOrderBy) {
+		        return this.length;
+		    }
+
+		    for (let i = 0; i < this.length; i++) {
+		        if (this[i] === undefined || this[i] === null) {
+		            console.warn(`jq-repeat: Encountered an undefined or null item at index ${i} during sorting in scope ${this.__jqRepeatId}. Skipping comparison.`);
+		            continue;
+		        }
+		        if (this.__compareItems(newItem, this[i]) < 0) {
+		            return i;
+		        }
+		    }
+		    return this.length;
+		}
+
+		splice(inputValue, ...args) {
+			let index;
+
+			// Determine the starting index for splice
+			if (typeof inputValue === "string" && this.__jqIndexKey) {
+				index = this.indexOf(inputValue);
+				if (index === -1) {
+					let numericInput = Number(inputValue);
+					if (!isNaN(numericInput) && numericInput >= 0 && numericInput < this.length) {
+						index = numericInput;
+					} else {
+						if (args[0] === 0 && args.length > 1) {
+							index = Math.max(0, numericInput);
+						} else {
+							return [];
+						}
+					}
+				}
+			} else {
+				index = typeof inputValue === 'number' ? inputValue : this.indexOf(inputValue);
+			}
+
+			if (index === -1 && (args[0] > 0 || args.length === 1)) {
+				return [];
+			}
+
+			let howMany = args[0] ?? (this.length - index);
+			let toAdd = args.slice(1);
+
+			// Normalize index and howMany
+			if (index > this.length) index = this.length;
+			if (index < 0) index = Math.max(0, this.length + index);
+			howMany = Math.min(howMany, this.length - index);
+
+			let removedItems = this.slice(index, index + howMany);
+
+			// --- DOM REMOVAL with nested cleanup ---
+			for (let i = 0; i < removedItems.length; i++) {
+				let item = removedItems[i];
+				if (item && item.__jq_$el) {
+					// Clean up nested repeats before removing the element
+					cleanupNestedRepeats(item.__jq_$el);
+					this.__take(item.__jq_$el, item, this);
 				}
 			}
 
-			//if there are fields to add to the array, add them
-			if( toAdd.length > 0 ){
-
-				//$.each( toAdd, function( key, value ){
-				for(var I = 0; I < toAdd.length; I++){
-					
-					//figure out new elements index
-					var key = I + index;
-					// apply values to template
-					var render = Mustache.render(this.__jqTemplate, this.__buildData(i, toAdd[I]));
-					
-					//set call name and index keys to DOM element
-					var $render = $( render ).addClass( 'jq-repeat-'+ this.__jqRepeatId ).attr( 'jq-repeat-index', key );
-
-					//if add new elements in proper stop, or after the place holder.
-					if( key === 0 ){
-						this.$this.after( $render );
-					}else{
-						$( '.jq-repeat-'+ this.__jqRepeatId +'[jq-repeat-index="' + ( key -1 ) + '"]' ).after( $render );
+			// Perform native Array.splice
+			const nativeSpliceResult = super.splice(index, howMany, ...toAdd);
+
+			// --- DOM ADDITION / RE-INSERTION ---
+			if (toAdd.length > 0) {
+				let previousElement = null;
+				if (index > 0 && this[index - 1] && this[index - 1].__jq_$el) {
+					previousElement = this[index - 1].__jq_$el;
+				} else {
+					previousElement = this.$this;
+				}
+
+				for (let i = 0; i < toAdd.length; i++) {
+					let newItemData = toAdd[i];
+					let renderData = this.__buildData(index + i, newItemData);
+					let $render = $(Mustache.render(this.__jqTemplate, renderData))
+						.addClass("jq-repeat-" + this.__jqRepeatId)
+						.attr("jq-repeat-scope", this.__jqRepeatId);
+
+					if (this.__jqIndexKey && newItemData.hasOwnProperty(this.__jqIndexKey)) {
+						$render.attr("jq-repeat-index", newItemData[this.__jqIndexKey]);
+					} else {
+						$render.attr("jq-repeat-index", index + i);
 					}
 
-					Object.defineProperty( toAdd[I], "__jq_$el", {
+					if (previousElement && previousElement.length) {
+						previousElement.after($render);
+					} else {
+						this.$this.after($render);
+					}
+					previousElement = $render;
+
+					Object.defineProperty(newItemData, "__jq_$el", {
 						value: $render,
 						writable: true,
 						enumerable: false,
-						configurable: true
-					} );
-					
-					//animate element
-					this.__put($render, toAdd[I], this);
+						configurable: true,
+					});
+
+					this.__put($render, newItemData, this);
 				}
 			}
-			
-			//set and return new array
-			return Array.prototype.splice.apply(this, toProto);
-		};
 
-		result.push = function(){
-			//add one or more objects to the array
+			// --- RE-INDEXING REMAINING ELEMENTS ---
+			for (let i = index; i < this.length; i++) {
+				if (this[i] && this[i].__jq_$el) {
+					if (this.__jqIndexKey && this[i].hasOwnProperty(this.__jqIndexKey)) {
+						this[i].__jq_$el.attr("jq-repeat-index", this[i][this.__jqIndexKey]);
+					} else {
+						this[i].__jq_$el.attr("jq-repeat-index", i);
+					}
+					this[i].__jq_$el.attr("jq-repeat-scope", this.__jqRepeatId);
+				}
+			}
 
-			//set the index value, if none is set make it zero
-			var index = this.length || 0;
-			
-			//loop each passed object and pass it to slice
-			for (var i = 0 ; i < arguments.length; ++i) {
-				this.splice( ( index + i ), 0, arguments[i] );
+			return nativeSpliceResult;
+		}
+
+		push(...args) {
+			if (!this.__jqOrderBy) {
+				const index = this.length || 0;
+				return this.splice(index, 0, ...args);
 			}
 
-			//return new array length
+			for (let i = 0; i < args.length; ++i) {
+				const newItem = args[i];
+				const insertionIndex = this.__findInsertionIndex(newItem);
+				this.splice(insertionIndex, 0, newItem);
+			}
 			return this.length;
-		};
+		}
 
-		result.pop = function(){
-			//remove and return array element
+		pop() {
+			return this.splice(-1, 1)[0];
+		}
 
-			return this.splice( -1, 1 )[0];
-		};
+		reverse() {
+			if (!this.__jqOrderBy) {
+				let elementsToReverse = [];
+				for (let i = 0; i < this.length; i++) {
+					if (this[i] && this[i].__jq_$el) {
+						elementsToReverse.push(this[i].__jq_$el.detach());
+					}
+				}
 
-		result.reverse = function() {
-			let hold = [];
-			for(let item of this){
-				hold.push(item.__jq_$el.html())
-			}
+				elementsToReverse.reverse();
 
-			for(let idx in hold.reverse()){
-				this[idx].__jq_$el.html(hold[idx]);
-			}
+				let lastElement = this.$this;
+				for (let i = 0; i < elementsToReverse.length; i++) {
+					lastElement.after(elementsToReverse[i]);
+					lastElement = elementsToReverse[i];
+				}
 
-			Array.prototype.reverse.apply( this );
+				super.reverse();
 
-			return this;
-		};
+				for (let i = 0; i < this.length; i++) {
+					if (this[i] && this[i].__jq_$el) {
+						if (!this.__jqIndexKey) {
+							this[i].__jq_$el.attr("jq-repeat-index", i);
+						}
+					}
+				}
+			} else {
+				console.warn(`jq-repeat: Calling 'reverse()' on a list with 'jr-order-by' defined. This operation might not yield the expected stable sorted order.`);
 
-		result.remove = function(key, value){
-			let index = this.indexOf(key, value)
-			if(index === -1) return;
-			this.splice(index, 1)
+				let detachedElements = [];
+				for (let i = 0; i < this.length; i++) {
+					if (this[i] && this[i].__jq_$el) {
+						detachedElements.push(this[i].__jq_$el.detach());
+					}
+				}
+
+				super.reverse();
+
+				let previousElement = this.$this;
+				for (let i = 0; i < this.length; i++) {
+					const item = this[i];
+					if (item && item.__jq_$el) {
+						const renderData = this.__buildData(i, item);
+						const $render = $(Mustache.render(this.__jqTemplate, renderData))
+							.addClass("jq-repeat-" + this.__jqRepeatId)
+							.attr("jq-repeat-scope", this.__jqRepeatId);
+
+						if (this.__jqIndexKey && item.hasOwnProperty(this.__jqIndexKey)) {
+							$render.attr("jq-repeat-index", item[this.__jqIndexKey]);
+						} else {
+							$render.attr("jq-repeat-index", i);
+						}
+
+						previousElement.after($render);
+						Object.defineProperty(item, "__jq_$el", {
+							value: $render,
+							writable: true,
+							enumerable: false,
+							configurable: true,
+						});
+						previousElement = $render;
+					}
+				}
+			}
+			return this;
 		}
 
-		result.shift = function() {
-			return this.splice( 0, 1 )[0];
-		};
+		remove(keyOrValue, value) {
+			let index;
+			if (arguments.length === 1) {
+				index = this.indexOf(keyOrValue);
+			} else {
+				index = this.indexOf(keyOrValue, value);
+			}
 
-		result.unshift = function(data){
-			return this.splice(0,0, data)
+			if (index === -1) return;
+			this.splice(index, 1);
 		}
 
-		result.loop = function(){
-			var temp = this[0];
-			this.splice( 0,1 );
-			this.push( temp );
+		empty() {
+			return this.splice(0, this.length);
+		}
 
-			return temp;
-		};
+		shift() {
+			return this.splice(0, 1)[0];
+		}
 
-		result.loopUp = function(){
-			var temp = this[this.length-1];
-			this.splice( -1, 1 );
-			this.splice( 0, 0, temp );
-			return temp;
-		};
+		unshift(...args) {
+			if (!this.__jqOrderBy) {
+				return this.splice(0, 0, ...args);
+			}
 
-		result.indexOf =  function( key, value ){
-			if(typeof key === 'number') return key;
-			
-			if( typeof value !== 'string' ){
-				value = arguments[0];
-				key = this.__index;
+			for (let i = args.length - 1; i >= 0; --i) {
+				const newItem = args[i];
+				const insertionIndex = this.__findInsertionIndex(newItem);
+				this.splice(insertionIndex, 0, newItem);
 			}
-			for ( var index = 0; index < this.length; ++index ) {
-				if( this[index][key] === value ){
+			return this.length;
+		}
 
-					return index;
+		/**
+		 * Finds the index of an item in the list.
+		 */
+		indexOf(keyOrValue, valueToMatch) {
+			if (typeof keyOrValue === 'number') {
+				if (keyOrValue >= 0 && keyOrValue < this.length) {
+					return keyOrValue;
 				}
+				return -1;
 			}
-			return -1;
-		};
 
-		result.update = function(key, value, data){
-			//set variables using sting for index
+			let searchKey;
+			let searchValue;
+
+			if (arguments.length === 2) {
+				searchKey = keyOrValue;
+				searchValue = valueToMatch;
+			} else if (arguments.length === 1) {
+				if (typeof keyOrValue === 'object' && keyOrValue !== null) {
+					for (let i = 0; i < this.length; ++i) {
+						if (this[i] === keyOrValue) {
+							return i;
+						}
+					}
+					return -1;
+				} else {
+					searchKey = this.__jqIndexKey;
+					searchValue = keyOrValue;
+
+					if (!searchKey) {
+						console.warn(`jq-repeat: Cannot use indexOf with a single value argument without a 'jq-index-key' specified for scope '${this.__jqRepeatId}'.`);
+						return -1;
+					}
+				}
+			} else {
+				console.error("jq-repeat: Invalid arguments for indexOf method.", arguments);
+				return -1;
+			}
 
-			// If update is called with no index/key, assume its the 0
-			if(typeof key === 'object'){
-				if(this[0]){
-					return this.update(0, key);
+			for (let i = 0; i < this.length; ++i) {
+				if (this[i] && this[i].hasOwnProperty(searchKey) && this[i][searchKey] === searchValue) {
+					return i;
 				}
-				return this.splice(0, 1, key);
 			}
+			return -1;
+		}
+
+		// Fixed update method
+		update(keyOrIndex, valueOrData, dataToUpdate) {
+		    let index;
+		    let data;
+
+		    if (typeof keyOrIndex === 'object' && valueOrData === undefined && dataToUpdate === undefined) {
+		        if (this.length > 0) {
+		            index = 0;
+		            data = keyOrIndex;
+		        } else {
+		            console.warn(`jq-repeat: Calling update(data) on an empty list '${this.__jqRepeatId}'. Item will be pushed instead.`);
+		            return this.push(keyOrIndex);
+		        }
+		    } else if (typeof keyOrIndex === 'number' && typeof valueOrData === 'object') {
+		        index = keyOrIndex;
+		        data = valueOrData;
+		    } else if (typeof keyOrIndex === 'string' && typeof valueOrData === 'string' && typeof dataToUpdate === 'object') {
+		        index = this.indexOf(keyOrIndex, valueOrData);
+		        data = dataToUpdate;
+		    } else if (typeof keyOrIndex === 'string' && typeof valueOrData === 'object' && dataToUpdate === undefined) {
+		        index = this.indexOf(keyOrIndex);
+		        data = valueOrData;
+		    } else {
+		        console.error("jq-repeat: Invalid arguments for update method.", arguments);
+		        return null;
+		    }
+
+		    if (index === -1 || index >= this.length) {
+		        console.warn(`jq-repeat: Update target not found at index ${index} or by key/value. No update performed for scope '${this.__jqRepeatId}'.`);
+		        return null;
+		    }
+
+		    if (!this[index]) {
+		        console.warn(`jq-repeat: Item at calculated index ${index} is null or undefined for scope '${this.__jqRepeatId}'. Cannot update.`);
+		        return null;
+		    }
+
+		    const throttleKey = this.__jqRepeatId + '_' + index;
+		    const boundUpdateDom = this.__updateDom.bind(this);
+		    
+		    return throttle(throttleKey, 50, boundUpdateDom, index, data);
+		}
+
+		__updateDom(index, data){
+			let originalItemData = null;
+			let originalDOMEl = null;
+
+            if (!this[index].__jq_$el) {
+                console.warn(`jq-repeat: Item at index ${index} exists, but its DOM element reference (__jq_$el) is null or missing for scope '${this.__jqRepeatId}'.`);
+                return null;
+            }
+
+			originalItemData = $.extend(true, {}, this[index]);
+			originalDOMEl = this[index].__jq_$el;
+
+			// Clean up nested repeats before updating
+			cleanupNestedRepeats(originalDOMEl);
 
-			if(typeof value !== 'string'){
-				data = arguments[1];
-				if(typeof key !== 'number'){
-					value = arguments[0];
-					key = this.__index;
+			// Merge new data into the existing item
+			this[index] = $.extend(true, this[index], data);
+
+			// Check if sorting position has changed
+			if (this.__jqOrderBy) {
+				// Simplified check for position change
+				if (this.__compareItems(originalItemData, this[index]) !== 0) {
+					const itemToMove = this[index];
+
+					// Remove from DOM and array
+					if (originalDOMEl && originalDOMEl.length) {
+						this.__take(originalDOMEl, itemToMove, this);
+					}
+					super.splice(index, 1);
+
+					// Find new insertion point and insert
+					const newInsertionIndex = this.__findInsertionIndex(itemToMove);
+					super.splice(newInsertionIndex, 0, itemToMove);
+
+					// Render at new position
+					const renderData = this.__buildData(newInsertionIndex, itemToMove);
+					const $render = $(Mustache.render(this.__jqTemplate, renderData))
+						.addClass("jq-repeat-" + this.__jqRepeatId)
+						.attr("jq-repeat-scope", this.__jqRepeatId);
+
+					if (this.__jqIndexKey && itemToMove.hasOwnProperty(this.__jqIndexKey)) {
+						$render.attr('jq-repeat-index', itemToMove[this.__jqIndexKey]);
+					} else {
+						$render.attr('jq-repeat-index', newInsertionIndex);
+					}
+
+					let previousElement = null;
+					if (newInsertionIndex > 0 && this[newInsertionIndex - 1] && this[newInsertionIndex - 1].__jq_$el) {
+						previousElement = this[newInsertionIndex - 1].__jq_$el;
+					} else {
+						previousElement = this.$this;
+					}
+
+					if (previousElement && previousElement.length) {
+						previousElement.after($render);
+					} else {
+						this.$this.after($render);
+					}
+
+					Object.defineProperty(itemToMove, "__jq_$el", {
+						value: $render,
+						writable: true,
+						enumerable: false,
+						configurable: true,
+					});
+
+					this.__put($render, itemToMove, this);
+
+					// Re-index elements
+					for (let i = 0; i < this.length; i++) {
+						if (this[i] && this[i].__jq_$el && !this.__jqIndexKey) {
+							this[i].__jq_$el.attr("jq-repeat-index", i);
+						}
+					}
+
+					return $render;
 				}
 			}
 
-			var index = this.indexOf( key, value );
+			// Standard update (no position change)
+			const renderData = this.__buildData(index, this[index]);
+			const $render = $(Mustache.render(this.__jqTemplate, renderData));
 
-			if(index === -1) {
-				return [];
+			$render.attr('jq-repeat-scope', this.__jqRepeatId);
+			if (this.__jqIndexKey && this[index].hasOwnProperty(this.__jqIndexKey)) {
+				$render.attr('jq-repeat-index', this[index][this.__jqIndexKey]);
+			} else {
+				$render.attr('jq-repeat-index', index);
 			}
-			this[index] = $.extend( true, this[index], data );
+			$render.addClass(`jq-repeat-${this.__jqRepeatId}`);
 
-			var $render = $(Mustache.render(this.__jqTemplate, this.__buildData(index, this[index])));
-			$render.attr('jq-repeat-index', index);
+			this.__putUpdate(originalDOMEl, $render, this[index], this);
 
-			this.__update(this[index].__jq_$el, $render, this[index], this);
 			this[index].__jq_$el = $render;
-		};
-		
-		result.getByKey = function(key, value){
+			return $render;
+		}
+
+		getByKey(key, value) {
 			return this[this.indexOf(key, value)];
 		}
 
-		// User definable helper methods
+		// --- User-definable Helper Methods ---
 
-		result.__put = function($el, item, list){
+		__put($el, item, list) {
 			$el.show();
-		};
+		}
 
-		result.__take = function($el, item, list){
-			$el.remove();
-		};
+		__take($el, item, list) {
+			if ($el && $el.length) {
+				$el.remove();
+			}
+			if (item) {
+				item.__jq_$el = null;
+			}
+		}
 
-		result.__update = function($el, $render, item, list){
+		__putUpdate($el, $render, item, list) {
+			$render.show();
 			$el.replaceWith($render);
-			$el.show();
-		};
-
-		result.__parseData = function(data){
-			return data;
 		}
 
-		// internal helper methods
+		__parseData(data) {
+			let parsedData = { ...data };
+			for (let key of Object.keys(parsedData)) {
+				if (this.parseKeys[key]) {
+					parsedData[key] = this.parseKeys[key](parsedData[key], key, parsedData);
+				}
+			}
+			return parsedData;
+		}
 
-		result.__buildData = function(index, data){
+		// --- Internal Helper Methods ---
 
+		__buildData(index, data) {
+			const actualParentIndex = this.__jqParentIndex;
 			return {
 				...this.__parseData(data),
 				nestedTemplates: this.__parseNestedTemplates(index, data),
-				_parent: this.__jqParent ? $.scope[this.__jqParent][this.__jqParentIndex] : undefined,
+				_parent: this._parentData,
+				_index: index,
+				_list: this,
+				_actualParentIndex: actualParentIndex,
 			};
-		};
+		}
 
-		result.__parseNestedTemplates = function(index, data){
-			let templates = []
+		__parseNestedTemplates(index, data) {
+			let templates = [];
 			let tempData = {
 				...data,
 				_parent: data,
 			};
 
-			for(let idx in this.nestedTemplates){
+			for (let idx in this.nestedTemplates) {
 				let $el = $(`${this.nestedTemplates[idx]}`);
 
-				$el.attr('jq-repeat', Mustache.render($el.attr('jq-repeat'), tempData));
-				$el.attr('jq-repeat-index', Mustache.render($el.attr('jq-repeat-index'), tempData));
 				$el.attr('jq-repeat-parent', this.__jqRepeatId);
-				$el.attr('jq-repeat-parent-index', index);
+				$el.attr('jq-repeat-parent-index', this.__jqParentIndex);
 				templates[idx] = $el[0].outerHTML;
 			}
-
 			return templates;
 		}
+	}
 
-		for(let prop of ['put', 'take', 'update', 'parseData']){
-			Object.defineProperty(result, prop, {
-				enumerable: false,
-				get(){
-					return this[`__${prop}`]
-				},
-				set(value) {
-					this[`__${prop}`] = value;
-				},
-			});
+	var make = function(element) {
+		const $this = $(element);
+
+		const scopeId = $this.attr('jq-repeat');
+		if (!scopeId) {
+			console.error("jq-repeat: Element missing 'jq-repeat' attribute:", element);
+			return;
 		}
 
-		var $this = $(element); 
-		result.nestedTemplates = [];
-		result.__jqRepeatId = $this.attr( 'jq-repeat' );
-		$this.removeAttr('jq-repeat');
-		result.__index = $this.attr('jq-repeat-index');
+		const options = {};
+		$.each($this[0].attributes, function() {
+			if (this.name.startsWith("jq-") || this.name.startsWith("jr-")) {
+				const optionName = this.name.replace(/^(jq-|jr-)/, '').replace(/-([a-z])/g, (g) => g[1].toUpperCase());
+				options[optionName] = this.value;
+			}
+		});
 
-		if($this.attr('jq-repeat-parent')){
-			result.__jqParent = $this.attr('jq-repeat-parent');
-			result.__jqParentIndex = $this.attr('jq-repeat-parent-index');
+		// const parent = $this.scopeGet();
+		let parentData = null;
+		let parentId = null;
+		let parentIndex = null;
+		if ($this.attr('jq-repeat-parent')) {
+			parentId = $this.attr('jq-repeat-parent');
+			const parentElement = $this.parent().closest(`[jq-repeat-scope="${parentId}"]`);
+			if (parentElement.length) {
+				parentIndex = parentElement.attr('jq-repeat-index');
+				if ($.scope[parentId] && $.scope[parentId].__jqIndexKey && $.scope[parentId].getByKey($.scope[parentId].__jqIndexKey, parentIndex)) {
+					parentData = $.scope[parentId].getByKey($.scope[parentId].__jqIndexKey, parentIndex);
+				} else if ($.scope[parentId] && !$.scope[parentId].__jqIndexKey && !isNaN(Number(parentIndex))) {
+					parentData = $.scope[parentId][Number(parentIndex)];
+				}
+				else {
+					console.warn(`jq-repeat: Parent scope '${parentId}' or item with index/ID '${parentIndex}' not found for nested element.`);
+				}
+			} else {
+				console.warn(`jq-repeat: Could not find parent element for scope '${parentId}'.`);
+			}
 		}
 
 
-		$this.find('[jq-repeat]').each((idx, el)=>{
-			let templateIdx = result.nestedTemplates.length;
+		const nestedTemplates = [];
+		$this.find('[jq-repeat]').each((idx, el) => {
+			let templateIdx = nestedTemplates.length;
 			let template = `${el.outerHTML}`;
-			result.nestedTemplates.push(template);
-			$(el).replaceWith(`{{{ nestedTemplates.${templateIdx} }}}`);
+			nestedTemplates.push(template);
+			// el.setAttribute('jq-parent-nestedTemplate-index', templateIdx)
+			 $(el).replaceWith(`{{{ nestedTemplates.${templateIdx} }}}`);
 		});
 
-		result.__jqTemplate = $this[0].outerHTML;
-		$this.replaceWith( '<script type="x-tmpl-mustache" id="jq-repeat-holder-' + result.__jqRepeatId + '"><\/script>' );
-		result.$this = $('#jq-repeat-holder-' + result.__jqRepeatId);
+		$this.removeAttr('jq-repeat');
 
-		Mustache.parse(result.__jqTemplate);   // optional, speeds up future uses
+		const templateHTML = $this[0].outerHTML;
+
+		const repeatListInstance = new RepeatList(
+			element,
+			scopeId,
+			options,
+			parentData,
+			parentId,
+			parentIndex,
+			templateHTML,
+			nestedTemplates
+		);
+
+		const tempPreExistingData = _scope[scopeId] || [];
+		_scope[scopeId] = repeatListInstance;
+
+		// Process pre-existing data
+		for (const prop of Object.keys(tempPreExistingData)) {
+			if (Number.isInteger(Number(prop)) && Number(prop) >= 0) {
+				repeatListInstance.push(tempPreExistingData[prop]);
+			} else {
+				if (typeof repeatListInstance[prop] === 'undefined' || repeatListInstance[prop] === null) {
+					repeatListInstance[prop] = tempPreExistingData[prop];
+				}
+			}
+		}
+	};
 
-		for(let key in result){
-			Object.defineProperty(result, key, {
-				value: result[key],
-				writable: true,
-				enumerable: false,
-				configurable: true
-			});
+	// --- jQuery Plugin Methods ---
+
+	$.fn.scopeGetEl = function() {
+		return this.closest('[jq-repeat-scope]');
+	};
+
+	$.fn.scopeGet = function() {
+		let $el = this.scopeGetEl();
+		if ($el && $el.attr('jq-repeat-scope')) {
+			return $.scope[$el.attr('jq-repeat-scope')];
 		}
+		return undefined;
+	};
 
-		$.scope[result.__jqRepeatId] = result;
+			$.fn.scopeItem = function() {
+		let $el = this.scopeGetEl();
+		if ($el) {
+			const scopeId = $el.attr('jq-repeat-scope');
+			const indexOrId = $el.attr('jq-repeat-index');
+			const scopeInstance = $.scope[scopeId];
+
+			if (scopeInstance) {
+				if (scopeInstance.__jqIndexKey) {
+					return scopeInstance.getByKey(scopeInstance.__jqIndexKey, indexOrId);
+				} else {
+					return scopeInstance[Number(indexOrId)];
+				}
+			}
+		}
+		return undefined;
 	};
 
-	$( document ).ready( function(){
+	$.fn.scopeItemUpdate = function(data) {
+		let $el = this.scopeGetEl();
+		if ($el) {
+			const scopeId = $el.attr('jq-repeat-scope');
+			const indexOrId = $el.attr('jq-repeat-index');
+			const scopeInstance = $.scope[scopeId];
+
+			if (scopeInstance) {
+				if (scopeInstance.__jqIndexKey) {
+					scopeInstance.update(scopeInstance.__jqIndexKey, indexOrId, data);
+				} else {
+					scopeInstance.update(Number(indexOrId), data);
+				}
+			}
+		}
+	};
 
-		// Create an instance of MutationObserver and pass the callback function
+	$.fn.scopeItemRemove = function() {
+		let $el = this.scopeGetEl();
+		if ($el) {
+			const scopeId = $el.attr('jq-repeat-scope');
+			const indexOrId = $el.attr('jq-repeat-index');
+			const scopeInstance = $.scope[scopeId];
+
+			if (scopeInstance) {
+				if (scopeInstance.__jqIndexKey) {
+					scopeInstance.remove(indexOrId);
+				} else {
+					scopeInstance.remove(Number(indexOrId));
+				}
+			}
+		}
+	};
+
+	// --- Document Ready and MutationObserver for Auto-Initialization ---
+
+	$(document).ready(function() {
 		const observer = new MutationObserver(function(mutationsList) {
 			mutationsList.forEach(mutation => {
 				if (mutation.type === 'childList') {
 					const addedNodes = mutation.addedNodes;
 					addedNodes.forEach(node => {
 						if (node.nodeType === Node.ELEMENT_NODE) {
-							const $el = $(node);
-							if ($el.is('[jq-repeat]')) {
-								make(node);
+							// Check if the added node itself is a jq-repeat
+							if (node.hasAttribute("jq-repeat")) {
+								const scopeId = $(node).attr('jq-repeat');
+								make($(node));
+								if (scopeId && $.scope[scopeId]) {
+									_scope.onNew.call($.scope[scopeId]);
+								}
+								return;
 							} else {
-								const toMake = [];
-								$el.find('[jq-repeat]').each((key, el) => {
-									if ($(el).parent().closest('[jq-repeat]').length) return;
-									toMake.push(el);
-								});
-
-								toMake.forEach(el => {
-									make(el);
-								});
+								// Check if any of its descendants are jq-repeat
+								const foundRepeats = node.querySelectorAll("[jq-repeat]");
+								if (foundRepeats.length > 0) {
+									foundRepeats.forEach(foundNode => {
+										const scopeId = $(foundNode).attr('jq-repeat');
+										make($(foundNode));
+										if (scopeId && $.scope[scopeId]) {
+											_scope.onNew.call($.scope[scopeId]);
+										}
+									});
+								}
 							}
 						}
 					});
@@ -356,19 +962,21 @@ MIT license
 			});
 		});
 
-		// Start observing the document
-		observer.observe(document.body, { childList: true, subtree: true });
-
-		let toMake = [];
-
-		$( '[jq-repeat]' ).each(function(key, value){
-			if($(value).parent().closest('[jq-repeat]').length) return;
-			toMake.push(value);
+		observer.observe(document.body, {
+			childList: true,
+			subtree: true
 		});
 
-		for(let el of toMake){
-			make(el);
-		}
-	} );
+		// Initialize any jq-repeat elements already present in the DOM on load
+		$('[jq-repeat]').each(function(key, value) {
+			if ($(value).closest('body').length !== 0) {
+				const scopeId = $(value).attr('jq-repeat');
+				make($(value));
+				if (scopeId && $.scope[scopeId]) {
+					_scope.onNew.call($.scope[scopeId]);
+				}
+			}
+		});
+	});
 
 })(jQuery, Mustache);