The s_content removed from the template.js and now i use scontent attribute instead of the previous version. It is more clear.

The "load" jquery is replaced for javascript (vanilla version) in the sight.js (inside a new function called load()).

callhandler.py

@@ -8,7 +8,7 @@ class CallHandler(QObject):
         self.sight = sight
         
     @pyqtSlot(str)
-    def test(self, t):
+    def console(self, t):
         print(t)
         
     @pyqtSlot(str, result=str)

place/js/sight.js

@@ -176,33 +176,33 @@ function setTitle(title) {
 	$("#stitle").text(title);
 }
 
+/***
+ load function
+ url = the content which will be embedded
+ element = where the content will be embedded
+ ***/
+function load(url, element)
+{
+    fetch(url).then(res => {
+		return res.text();
+    }).then((html) => {
+		element.innerHTML = html;
+	});
+}
+
 $(document).ready(function(){
-	// LOAD the contents into the Sight
+	const scontent = document.querySelectorAll('[scontent]');
-	if (typeof s_contents !== 'undefined') {
-		for ( const [id_name,content_folder] of Object.entries( s_contents ) ) {
-			$("#"+id_name).load("content/"+content_folder+"/content.html");
-			/*$("#"+id_name).load("content/"+content_folder+"/content.html", function() {
-				document.querySelectorAll('#screate').forEach(link => {
-					link.addEventListener("click", (e) => {
-						e.preventDefault();
-						window.sight.create(e.target.dataset.id, e.target.dataset.type, function(sight_id) {
 
+	scontent.forEach((element) => {
+	  	//$("[scontent="+element.getAttribute("scontent")+"]").load("content/"+element.getAttribute("scontent")+"/content.html");
+		load("content/"+element.getAttribute("scontent")+"/content.html", document.querySelector("[scontent="+element.getAttribute("scontent")+"]"))
 	});
-					});
-				});
-			});*/
-			
-		}
-	}
-	
-	
-	
 
 	// INIT the Sight from init_sight variable
 	if (typeof init_sight !== 'undefined') {
 		
 		for ( const [key,value] of Object.entries( init_sight ) ) {
-			window.sight.test(key + " - " + value)
+			window.sight.console(key + " - " + value)
 			switch(key) {
 				case 'width': 
 					window.sight.setWidth(value)
@@ -217,10 +217,10 @@ $(document).ready(function(){
 	/*window.sight.getDefaultTemplate(function(default_template) {
 		$('a[href]:not([href^="http://"]), a[href]:not([href^="https://"]), a[href]:not([href^="#"])').each(function(){
 			if(!$(this).hasClass( "nav-link" )) {
-				window.sight.test($(this).attr("href") + " je1");
+				window.sight.console($(this).attr("href") + " je1");
 				var newUrl = './templates/'+default_template+'/'+$(this).attr("href");
 				$(this).attr("href", newUrl);
-				window.sight.test(newUrl + " je2");
+				window.sight.console(newUrl + " je2");
 			}
 		}); 
 	});*/

place/templates/base/main.html

@@ -30,9 +30,9 @@
 				<div id="sminimize"></div> 
 			</div>
 			<div id="content">
-				<div id="main_content"></div>
+				<div scontent="main"></div>
 				MAIN
-				<div id="main_text"></div>
+				<div scontent="main_text"></div>
 			</div>
 			<div id="sresize"></div>
 		</main>

place/templates/base/template.js

@@ -4,10 +4,3 @@ var s_template={
     'URL' : '/template/base',
 	'created': '2023'
 }
-
-// first element: "key" is the ID where the content html will be embedded
-// second element: "value" is the folder name of that content folder where the content.html file's contents will be embedded
-var s_contents={
-	'main_content':"main",
-	'main_text':"main_text",
-}