it is now possible to change the embedElementType in nested embed ele…

…ments

MMM-EmbedURL.js

@@ -149,10 +149,10 @@ Module.register('MMM-EmbedURL', {
 		}
 	},
 
-	getEmbedElement: function(subConfig, additionalClasses, attributes){
+	getEmbedElement: function(subConfig, additionalClasses, attributes, embedElementType){
 		const self = this
 		if(subConfig != null){
-			embedElement = document.createElement(self.config["embedElementType"])
+			embedElement = document.createElement(embedElementType)
 			embedElement.setAttribute("src", subConfig)
 			if(attributes != null){
 				console.log(JSON.stringify(attributes))
@@ -173,7 +173,7 @@ Module.register('MMM-EmbedURL', {
 		}
 	},
 
-	getWrapperElement: function(subConfig, fallbackPositions, fallbackAttributes, depth=0){
+	getWrapperElement: function(subConfig, fallbackPositions, fallbackAttributes, fallbackEmbedElementType, depth=0){
 		if (subConfig != null){
 			const self = this
 
@@ -200,6 +200,11 @@ Module.register('MMM-EmbedURL', {
 				attributes = fallbackAttributes
 			}
 
+			let embedElementType = subConfig["embedElementType"] || null
+			if (embedElementType == null){
+				embedElementType = fallbackEmbedElementType
+			}
+
 			let wrapper = document.createElement(self.config["basicElementType"])
 			wrapper.classList.add("embededWrapper")
 			wrapper.classList.add("embededWrapper"+depth)
@@ -224,16 +229,16 @@ Module.register('MMM-EmbedURL', {
 						let curEmbed = embedConfig[idx]
 						let curEmbedElement = null
 						if (typeof curEmbed === "string"){
-							curEmbedElement = self.getEmbedElement(curEmbed, classes, attributes)
+							curEmbedElement = self.getEmbedElement(curEmbed, classes, attributes, embedElementType)
 						} else {
-							curEmbedElement = self.getWrapperElement(curEmbed || null, positions, attributes, depth+1)
+							curEmbedElement = self.getWrapperElement(curEmbed || null, positions, attributes, embedElementType, depth+1)
 						}
 						if(curEmbedElement != null){
 							embedElement.appendChild(curEmbedElement)
 						}
 					}
 				} else {
-					embedElement = self.getEmbedElement(embedConfig, classes, attributes)
+					embedElement = self.getEmbedElement(embedConfig, classes, attributes, embedElementType)
 				}
 			}
 
@@ -279,7 +284,7 @@ Module.register('MMM-EmbedURL', {
 	getDom: function () {
 		const self = this
 
-		let wrapper = self.getWrapperElement(self.config, self.config.positions, self.config.attributes, 0)
+		let wrapper = self.getWrapperElement(self.config, self.config.positions, self.config.attributes, self.config.embedElementType, 0)
 
 		if (wrapper == null){
 			wrapper = document.createElement(self.config["basicElementType"])

README.md

@@ -94,7 +94,7 @@ let config = {
 
 ## The embed array
 
-The module supports multiple ways to specify the websites you want to integrate. The embed array can contain either Strings or objects. The objects can contain the same options "positions", "attributes". "title", "fontIcon", "imgIcon", classes and "embed" as in the main configuration. It is possible to nest the embed objects this way.
+The module supports multiple ways to specify the websites you want to integrate. The embed array can contain either Strings or objects. The objects can contain the same options "positions", "attributes". "title", "fontIcon", "imgIcon", "classes", "embedElementType" and "embed" as in the main configuration. It is possible to nest the embed objects this way and configure different options for them.
 
 Additionally the "profile" option can be used to set a space separated String of profiles in which this elements should be displayed.
 
@@ -138,6 +138,7 @@ Lets look at a bigger example:
    {
     imgIcon: "./modules/MMM-EmbedURL/icons/tom.jpg",
     classes: "dummy3 myDummy",
+    embedElementType: "webview",
     embed: [
      "https://dummy:3000/humidity?orgId=2&from=1666840580521&to=1666862180521&panelId=4",
      "https://dummy:3000/humidity?orgId=2&from=1666840621970&to=1666862221970&panelId=2",
@@ -167,7 +168,7 @@ The following happens in this example:
 * The third object
   * Is visible at all profiles
   * Defines a image icon
-  * Adds two dummy elements
+  * Adds two dummy elements but not uses the default "iframe" element to embed but "webview" instead
   * All elements get the css classes "dummy3" and "myDummy" added
 
 If you think about the dummy URLs look a little bit like URLs of Grafana panels you are right. I use the module to show my Grafana charts. Examples of howto setup InfluxDB and Grafana are included in the [doc](doc) directory!