From 0f77ac80038ea43cb5e2d4577d03e8ad171b49f3 Mon Sep 17 00:00:00 2001
From: "Patryk Rzucidlo (PTKDev)" <ptkdev@gmail.com>
Date: Mon, 4 May 2020 11:23:04 +0200
Subject: [PATCH] [Release] v2.5.0

---
 dist/lib/en/instagram-widget.js     | 25 ++++++++++++++++++++++---
 dist/lib/en/instagram-widget.min.js |  2 +-
 dist/lib/it/instagram-widget.js     | 25 ++++++++++++++++++++++---
 dist/lib/it/instagram-widget.min.js |  2 +-
 dist/lib/pl/instagram-widget.js     | 25 ++++++++++++++++++++++---
 dist/lib/pl/instagram-widget.min.js |  2 +-
 webcomponent/js/main.js             | 25 ++++++++++++++++++++++---
 7 files changed, 91 insertions(+), 15 deletions(-)

diff --git a/dist/lib/en/instagram-widget.js b/dist/lib/en/instagram-widget.js
index ab6cc73..a1ae24d 100644
--- a/dist/lib/en/instagram-widget.js
+++ b/dist/lib/en/instagram-widget.js
@@ -39,6 +39,19 @@ class InstagramWidget extends HTMLElement {
 		};
 
 		this.options = Object.create(this.options_default);
+
+		this.resize_event = function(event) {
+			this.resize(event);
+		}.bind(this);
+	}
+
+	/**
+	 * Append web component
+	 * =====================
+	 *
+	 */
+	connectedCallback() {
+		window.addEventListener("resize", this.resize_event);
 	}
 
 	/**
@@ -127,9 +140,6 @@ class InstagramWidget extends HTMLElement {
 		}).then(function(response) {
 			this.json = response;
 			this.build_html();
-			window.addEventListener("resize", function(event) {
-				this.resize(event);
-			}.bind(this));
 		}.bind(this));
 	}
 
@@ -156,6 +166,15 @@ class InstagramWidget extends HTMLElement {
 			  }
 		}
 	}
+
+	/**
+	 * Remove web component
+	 * =====================
+	 *
+	 */
+	disconnectedCallback() {
+		window.removeEventListener("resize", this.resize_event);
+	}
 }
 
 window.customElements.define("instagram-widget", InstagramWidget);
diff --git a/dist/lib/en/instagram-widget.min.js b/dist/lib/en/instagram-widget.min.js
index fe93044..d7d6d06 100644
--- a/dist/lib/en/instagram-widget.min.js
+++ b/dist/lib/en/instagram-widget.min.js
@@ -1,3 +1,3 @@
 // WebComponent: InstagramWidget 2.5.0 - Collection of WebComponents by Patryk Rzucidlo [@PTKDev] <support@ptkdev.io>
 // https://github.com/ptkdev-components/webcomponent-instagram-widget
-(function() { class InstagramWidget extends HTMLElement{constructor(){super();const t=document.createElement("template");t.innerHTML='<style id="instagram-widget-style">#instagram-widget *{margin:0;padding:0;line-height:0}#instagram-widget .instagram-widget-container{text-align:center;justify-content:center;font-weight:500}#instagram-widget .instagram-widget-photos li img{border-radius:5%;background-color:#f8f8ff;object-fit:cover;object-position:50% 50%;max-width:300px;max-height:300px;min-width:80px;min-height:80px;margin:2px}#instagram-widget .instagram-content ul{list-style-type:none;padding-inline-start:0;width:100%}#instagram-widget .instagram-widget-photos li{list-style-type:none;display:inline}</style><div id="instagram-widget" version="2.5.0">\n\t<div class="instagram-widget-container">\n\t\t<div class="instagram-widget-content">\n\t\t\t<ul class="instagram-widget-photos"></ul>\n\t\t</div>\n\t</div>\n</div>',this.attachShadow({mode:"open"}),this.shadowRoot.appendChild(t.content.cloneNode(!0)),this.json=null,this.options_default={username:"@ptkdev","items-limit":"9","image-width":"100%","image-height":"100%",grid:"responsive",cache:"enabled","border-spacing":"2px","border-corners":"5","force-square":"yes"},this.options=Object.create(this.options_default)}build_html(){let t=this.json.graphql.user.edge_owner_to_timeline_media.edges,e=[];for(let i=0;i<t.length;i++)e.push({url:`https://www.instagram.com/p/${t[i].node.shortcode}/`,thumbnail:t[i].node.thumbnail_src,display_url:void 0!==t[i].node.display_url?t[i].node.display_url:"",caption:t[i].node.edge_media_to_caption.edges[0]&&void 0!==t[i].node.edge_media_to_caption.edges[0].node.text?t[i].node.edge_media_to_caption.edges[0].node.text:""});let i="";for(let t=0;t<e.length&&t<this.options["items-limit"];t++)i+=`<li><a href="${e[t].url}" rel="nofollow external noopener noreferrer" target="_blank" title="${e[t].caption.substring(0,100).replace(/"/g,"")}"><img width="${this.options["image-width"]}" height="${this.options["image-height"]}" src="${e[t].display_url}" alt="${e[t].caption.substring(0,100).replace(/"/g,"")}" loading="lazy" /></a></li>`;if(this.shadowRoot.querySelector(".instagram-widget-photos").innerHTML=i,""!==this.options.grid&&null!==this.options.grid&&"responsive"!==this.options.grid){let t=this.options.grid.split("x"),e=100/parseInt(t[0]),i=this.shadowRoot.querySelectorAll(".instagram-widget-photos img");for(let s=0;s<i.length;s++)i[s].removeAttribute("width"),i[s].style.width=`calc(${e}% - (${this.options["border-spacing"]} * (${parseInt(t[0])} * 2)))`,i[s].style.maxWidth="none",i[s].style.maxHeight="none",i[s].style.borderRadius=this.options["border-corners"]+"%",i[s].style.margin=this.options["border-spacing"],"yes"===this.options["force-square"]&&(i[s].removeAttribute("height"),i[s].style.height=this.shadowRoot.querySelector(".instagram-widget-photos img").clientWidth+"px")}else{let t=this.shadowRoot.querySelectorAll(".instagram-widget-photos img");for(let e=0;e<t.length;e++)t[e].style.borderRadius=this.options["border-corners"]+"%",t[e].style.margin=this.options["border-spacing"],"yes"===this.options["force-square"]&&(t[e].removeAttribute("height"),t[e].style.maxHeight="none",t[e].style.height=this.shadowRoot.querySelector(".instagram-widget-photos img").clientWidth+"px")}}resize(){let t=this.shadowRoot.querySelectorAll(".instagram-widget-photos img");for(let e=0;e<t.length;e++)"yes"===this.options["force-square"]&&(t[e].style.height=this.shadowRoot.querySelector(".instagram-widget-photos img").clientWidth+"px")}api_fetch(){let t=`https://www.instagram.com/${this.options.username.replace("@","")}/?__a=1`;fetch(t,{cache:null===this.options.cache||"enabled"===this.options.cache?"force-cache":"default"}).then((function(t){if(200===t.status)return t.json()})).then(function(t){this.json=t,this.build_html(),window.addEventListener("resize",function(t){this.resize(t)}.bind(this))}.bind(this))}static get observedAttributes(){return["username","items-limit","grid","image-width","image-height","border-spacing","border-corners","force-square","cache"]}attributeChangedCallback(t,e,i){if(e!==i)switch(this.options[t]=null===i||""===i?this.options_default[t]:i,t){case"username":this.api_fetch();break;default:null!==this.json&&this.build_html()}}}window.customElements.define("instagram-widget",InstagramWidget); })();
\ No newline at end of file
+(function() { class InstagramWidget extends HTMLElement{constructor(){super();const t=document.createElement("template");t.innerHTML='<style id="instagram-widget-style">#instagram-widget *{margin:0;padding:0;line-height:0}#instagram-widget .instagram-widget-container{text-align:center;justify-content:center;font-weight:500}#instagram-widget .instagram-widget-photos li img{border-radius:5%;background-color:#f8f8ff;object-fit:cover;object-position:50% 50%;max-width:300px;max-height:300px;min-width:80px;min-height:80px;margin:2px}#instagram-widget .instagram-content ul{list-style-type:none;padding-inline-start:0;width:100%}#instagram-widget .instagram-widget-photos li{list-style-type:none;display:inline}</style><div id="instagram-widget" version="2.5.0">\n\t<div class="instagram-widget-container">\n\t\t<div class="instagram-widget-content">\n\t\t\t<ul class="instagram-widget-photos"></ul>\n\t\t</div>\n\t</div>\n</div>',this.attachShadow({mode:"open"}),this.shadowRoot.appendChild(t.content.cloneNode(!0)),this.json=null,this.options_default={username:"@ptkdev","items-limit":"9","image-width":"100%","image-height":"100%",grid:"responsive",cache:"enabled","border-spacing":"2px","border-corners":"5","force-square":"yes"},this.options=Object.create(this.options_default),this.resize_event=function(t){this.resize(t)}.bind(this)}connectedCallback(){window.addEventListener("resize",this.resize_event)}build_html(){let t=this.json.graphql.user.edge_owner_to_timeline_media.edges,e=[];for(let i=0;i<t.length;i++)e.push({url:`https://www.instagram.com/p/${t[i].node.shortcode}/`,thumbnail:t[i].node.thumbnail_src,display_url:void 0!==t[i].node.display_url?t[i].node.display_url:"",caption:t[i].node.edge_media_to_caption.edges[0]&&void 0!==t[i].node.edge_media_to_caption.edges[0].node.text?t[i].node.edge_media_to_caption.edges[0].node.text:""});let i="";for(let t=0;t<e.length&&t<this.options["items-limit"];t++)i+=`<li><a href="${e[t].url}" rel="nofollow external noopener noreferrer" target="_blank" title="${e[t].caption.substring(0,100).replace(/"/g,"")}"><img width="${this.options["image-width"]}" height="${this.options["image-height"]}" src="${e[t].display_url}" alt="${e[t].caption.substring(0,100).replace(/"/g,"")}" loading="lazy" /></a></li>`;if(this.shadowRoot.querySelector(".instagram-widget-photos").innerHTML=i,""!==this.options.grid&&null!==this.options.grid&&"responsive"!==this.options.grid){let t=this.options.grid.split("x"),e=100/parseInt(t[0]),i=this.shadowRoot.querySelectorAll(".instagram-widget-photos img");for(let s=0;s<i.length;s++)i[s].removeAttribute("width"),i[s].style.width=`calc(${e}% - (${this.options["border-spacing"]} * (${parseInt(t[0])} * 2)))`,i[s].style.maxWidth="none",i[s].style.maxHeight="none",i[s].style.borderRadius=this.options["border-corners"]+"%",i[s].style.margin=this.options["border-spacing"],"yes"===this.options["force-square"]&&(i[s].removeAttribute("height"),i[s].style.height=this.shadowRoot.querySelector(".instagram-widget-photos img").clientWidth+"px")}else{let t=this.shadowRoot.querySelectorAll(".instagram-widget-photos img");for(let e=0;e<t.length;e++)t[e].style.borderRadius=this.options["border-corners"]+"%",t[e].style.margin=this.options["border-spacing"],"yes"===this.options["force-square"]&&(t[e].removeAttribute("height"),t[e].style.maxHeight="none",t[e].style.height=this.shadowRoot.querySelector(".instagram-widget-photos img").clientWidth+"px")}}resize(){let t=this.shadowRoot.querySelectorAll(".instagram-widget-photos img");for(let e=0;e<t.length;e++)"yes"===this.options["force-square"]&&(t[e].style.height=this.shadowRoot.querySelector(".instagram-widget-photos img").clientWidth+"px")}api_fetch(){let t=`https://www.instagram.com/${this.options.username.replace("@","")}/?__a=1`;fetch(t,{cache:null===this.options.cache||"enabled"===this.options.cache?"force-cache":"default"}).then((function(t){if(200===t.status)return t.json()})).then(function(t){this.json=t,this.build_html()}.bind(this))}static get observedAttributes(){return["username","items-limit","grid","image-width","image-height","border-spacing","border-corners","force-square","cache"]}attributeChangedCallback(t,e,i){if(e!==i)switch(this.options[t]=null===i||""===i?this.options_default[t]:i,t){case"username":this.api_fetch();break;default:null!==this.json&&this.build_html()}}disconnectedCallback(){window.removeEventListener("resize",this.resize_event)}}window.customElements.define("instagram-widget",InstagramWidget); })();
\ No newline at end of file
diff --git a/dist/lib/it/instagram-widget.js b/dist/lib/it/instagram-widget.js
index ab6cc73..a1ae24d 100644
--- a/dist/lib/it/instagram-widget.js
+++ b/dist/lib/it/instagram-widget.js
@@ -39,6 +39,19 @@ class InstagramWidget extends HTMLElement {
 		};
 
 		this.options = Object.create(this.options_default);
+
+		this.resize_event = function(event) {
+			this.resize(event);
+		}.bind(this);
+	}
+
+	/**
+	 * Append web component
+	 * =====================
+	 *
+	 */
+	connectedCallback() {
+		window.addEventListener("resize", this.resize_event);
 	}
 
 	/**
@@ -127,9 +140,6 @@ class InstagramWidget extends HTMLElement {
 		}).then(function(response) {
 			this.json = response;
 			this.build_html();
-			window.addEventListener("resize", function(event) {
-				this.resize(event);
-			}.bind(this));
 		}.bind(this));
 	}
 
@@ -156,6 +166,15 @@ class InstagramWidget extends HTMLElement {
 			  }
 		}
 	}
+
+	/**
+	 * Remove web component
+	 * =====================
+	 *
+	 */
+	disconnectedCallback() {
+		window.removeEventListener("resize", this.resize_event);
+	}
 }
 
 window.customElements.define("instagram-widget", InstagramWidget);
diff --git a/dist/lib/it/instagram-widget.min.js b/dist/lib/it/instagram-widget.min.js
index fe93044..d7d6d06 100644
--- a/dist/lib/it/instagram-widget.min.js
+++ b/dist/lib/it/instagram-widget.min.js
@@ -1,3 +1,3 @@
 // WebComponent: InstagramWidget 2.5.0 - Collection of WebComponents by Patryk Rzucidlo [@PTKDev] <support@ptkdev.io>
 // https://github.com/ptkdev-components/webcomponent-instagram-widget
-(function() { class InstagramWidget extends HTMLElement{constructor(){super();const t=document.createElement("template");t.innerHTML='<style id="instagram-widget-style">#instagram-widget *{margin:0;padding:0;line-height:0}#instagram-widget .instagram-widget-container{text-align:center;justify-content:center;font-weight:500}#instagram-widget .instagram-widget-photos li img{border-radius:5%;background-color:#f8f8ff;object-fit:cover;object-position:50% 50%;max-width:300px;max-height:300px;min-width:80px;min-height:80px;margin:2px}#instagram-widget .instagram-content ul{list-style-type:none;padding-inline-start:0;width:100%}#instagram-widget .instagram-widget-photos li{list-style-type:none;display:inline}</style><div id="instagram-widget" version="2.5.0">\n\t<div class="instagram-widget-container">\n\t\t<div class="instagram-widget-content">\n\t\t\t<ul class="instagram-widget-photos"></ul>\n\t\t</div>\n\t</div>\n</div>',this.attachShadow({mode:"open"}),this.shadowRoot.appendChild(t.content.cloneNode(!0)),this.json=null,this.options_default={username:"@ptkdev","items-limit":"9","image-width":"100%","image-height":"100%",grid:"responsive",cache:"enabled","border-spacing":"2px","border-corners":"5","force-square":"yes"},this.options=Object.create(this.options_default)}build_html(){let t=this.json.graphql.user.edge_owner_to_timeline_media.edges,e=[];for(let i=0;i<t.length;i++)e.push({url:`https://www.instagram.com/p/${t[i].node.shortcode}/`,thumbnail:t[i].node.thumbnail_src,display_url:void 0!==t[i].node.display_url?t[i].node.display_url:"",caption:t[i].node.edge_media_to_caption.edges[0]&&void 0!==t[i].node.edge_media_to_caption.edges[0].node.text?t[i].node.edge_media_to_caption.edges[0].node.text:""});let i="";for(let t=0;t<e.length&&t<this.options["items-limit"];t++)i+=`<li><a href="${e[t].url}" rel="nofollow external noopener noreferrer" target="_blank" title="${e[t].caption.substring(0,100).replace(/"/g,"")}"><img width="${this.options["image-width"]}" height="${this.options["image-height"]}" src="${e[t].display_url}" alt="${e[t].caption.substring(0,100).replace(/"/g,"")}" loading="lazy" /></a></li>`;if(this.shadowRoot.querySelector(".instagram-widget-photos").innerHTML=i,""!==this.options.grid&&null!==this.options.grid&&"responsive"!==this.options.grid){let t=this.options.grid.split("x"),e=100/parseInt(t[0]),i=this.shadowRoot.querySelectorAll(".instagram-widget-photos img");for(let s=0;s<i.length;s++)i[s].removeAttribute("width"),i[s].style.width=`calc(${e}% - (${this.options["border-spacing"]} * (${parseInt(t[0])} * 2)))`,i[s].style.maxWidth="none",i[s].style.maxHeight="none",i[s].style.borderRadius=this.options["border-corners"]+"%",i[s].style.margin=this.options["border-spacing"],"yes"===this.options["force-square"]&&(i[s].removeAttribute("height"),i[s].style.height=this.shadowRoot.querySelector(".instagram-widget-photos img").clientWidth+"px")}else{let t=this.shadowRoot.querySelectorAll(".instagram-widget-photos img");for(let e=0;e<t.length;e++)t[e].style.borderRadius=this.options["border-corners"]+"%",t[e].style.margin=this.options["border-spacing"],"yes"===this.options["force-square"]&&(t[e].removeAttribute("height"),t[e].style.maxHeight="none",t[e].style.height=this.shadowRoot.querySelector(".instagram-widget-photos img").clientWidth+"px")}}resize(){let t=this.shadowRoot.querySelectorAll(".instagram-widget-photos img");for(let e=0;e<t.length;e++)"yes"===this.options["force-square"]&&(t[e].style.height=this.shadowRoot.querySelector(".instagram-widget-photos img").clientWidth+"px")}api_fetch(){let t=`https://www.instagram.com/${this.options.username.replace("@","")}/?__a=1`;fetch(t,{cache:null===this.options.cache||"enabled"===this.options.cache?"force-cache":"default"}).then((function(t){if(200===t.status)return t.json()})).then(function(t){this.json=t,this.build_html(),window.addEventListener("resize",function(t){this.resize(t)}.bind(this))}.bind(this))}static get observedAttributes(){return["username","items-limit","grid","image-width","image-height","border-spacing","border-corners","force-square","cache"]}attributeChangedCallback(t,e,i){if(e!==i)switch(this.options[t]=null===i||""===i?this.options_default[t]:i,t){case"username":this.api_fetch();break;default:null!==this.json&&this.build_html()}}}window.customElements.define("instagram-widget",InstagramWidget); })();
\ No newline at end of file
+(function() { class InstagramWidget extends HTMLElement{constructor(){super();const t=document.createElement("template");t.innerHTML='<style id="instagram-widget-style">#instagram-widget *{margin:0;padding:0;line-height:0}#instagram-widget .instagram-widget-container{text-align:center;justify-content:center;font-weight:500}#instagram-widget .instagram-widget-photos li img{border-radius:5%;background-color:#f8f8ff;object-fit:cover;object-position:50% 50%;max-width:300px;max-height:300px;min-width:80px;min-height:80px;margin:2px}#instagram-widget .instagram-content ul{list-style-type:none;padding-inline-start:0;width:100%}#instagram-widget .instagram-widget-photos li{list-style-type:none;display:inline}</style><div id="instagram-widget" version="2.5.0">\n\t<div class="instagram-widget-container">\n\t\t<div class="instagram-widget-content">\n\t\t\t<ul class="instagram-widget-photos"></ul>\n\t\t</div>\n\t</div>\n</div>',this.attachShadow({mode:"open"}),this.shadowRoot.appendChild(t.content.cloneNode(!0)),this.json=null,this.options_default={username:"@ptkdev","items-limit":"9","image-width":"100%","image-height":"100%",grid:"responsive",cache:"enabled","border-spacing":"2px","border-corners":"5","force-square":"yes"},this.options=Object.create(this.options_default),this.resize_event=function(t){this.resize(t)}.bind(this)}connectedCallback(){window.addEventListener("resize",this.resize_event)}build_html(){let t=this.json.graphql.user.edge_owner_to_timeline_media.edges,e=[];for(let i=0;i<t.length;i++)e.push({url:`https://www.instagram.com/p/${t[i].node.shortcode}/`,thumbnail:t[i].node.thumbnail_src,display_url:void 0!==t[i].node.display_url?t[i].node.display_url:"",caption:t[i].node.edge_media_to_caption.edges[0]&&void 0!==t[i].node.edge_media_to_caption.edges[0].node.text?t[i].node.edge_media_to_caption.edges[0].node.text:""});let i="";for(let t=0;t<e.length&&t<this.options["items-limit"];t++)i+=`<li><a href="${e[t].url}" rel="nofollow external noopener noreferrer" target="_blank" title="${e[t].caption.substring(0,100).replace(/"/g,"")}"><img width="${this.options["image-width"]}" height="${this.options["image-height"]}" src="${e[t].display_url}" alt="${e[t].caption.substring(0,100).replace(/"/g,"")}" loading="lazy" /></a></li>`;if(this.shadowRoot.querySelector(".instagram-widget-photos").innerHTML=i,""!==this.options.grid&&null!==this.options.grid&&"responsive"!==this.options.grid){let t=this.options.grid.split("x"),e=100/parseInt(t[0]),i=this.shadowRoot.querySelectorAll(".instagram-widget-photos img");for(let s=0;s<i.length;s++)i[s].removeAttribute("width"),i[s].style.width=`calc(${e}% - (${this.options["border-spacing"]} * (${parseInt(t[0])} * 2)))`,i[s].style.maxWidth="none",i[s].style.maxHeight="none",i[s].style.borderRadius=this.options["border-corners"]+"%",i[s].style.margin=this.options["border-spacing"],"yes"===this.options["force-square"]&&(i[s].removeAttribute("height"),i[s].style.height=this.shadowRoot.querySelector(".instagram-widget-photos img").clientWidth+"px")}else{let t=this.shadowRoot.querySelectorAll(".instagram-widget-photos img");for(let e=0;e<t.length;e++)t[e].style.borderRadius=this.options["border-corners"]+"%",t[e].style.margin=this.options["border-spacing"],"yes"===this.options["force-square"]&&(t[e].removeAttribute("height"),t[e].style.maxHeight="none",t[e].style.height=this.shadowRoot.querySelector(".instagram-widget-photos img").clientWidth+"px")}}resize(){let t=this.shadowRoot.querySelectorAll(".instagram-widget-photos img");for(let e=0;e<t.length;e++)"yes"===this.options["force-square"]&&(t[e].style.height=this.shadowRoot.querySelector(".instagram-widget-photos img").clientWidth+"px")}api_fetch(){let t=`https://www.instagram.com/${this.options.username.replace("@","")}/?__a=1`;fetch(t,{cache:null===this.options.cache||"enabled"===this.options.cache?"force-cache":"default"}).then((function(t){if(200===t.status)return t.json()})).then(function(t){this.json=t,this.build_html()}.bind(this))}static get observedAttributes(){return["username","items-limit","grid","image-width","image-height","border-spacing","border-corners","force-square","cache"]}attributeChangedCallback(t,e,i){if(e!==i)switch(this.options[t]=null===i||""===i?this.options_default[t]:i,t){case"username":this.api_fetch();break;default:null!==this.json&&this.build_html()}}disconnectedCallback(){window.removeEventListener("resize",this.resize_event)}}window.customElements.define("instagram-widget",InstagramWidget); })();
\ No newline at end of file
diff --git a/dist/lib/pl/instagram-widget.js b/dist/lib/pl/instagram-widget.js
index ab6cc73..a1ae24d 100644
--- a/dist/lib/pl/instagram-widget.js
+++ b/dist/lib/pl/instagram-widget.js
@@ -39,6 +39,19 @@ class InstagramWidget extends HTMLElement {
 		};
 
 		this.options = Object.create(this.options_default);
+
+		this.resize_event = function(event) {
+			this.resize(event);
+		}.bind(this);
+	}
+
+	/**
+	 * Append web component
+	 * =====================
+	 *
+	 */
+	connectedCallback() {
+		window.addEventListener("resize", this.resize_event);
 	}
 
 	/**
@@ -127,9 +140,6 @@ class InstagramWidget extends HTMLElement {
 		}).then(function(response) {
 			this.json = response;
 			this.build_html();
-			window.addEventListener("resize", function(event) {
-				this.resize(event);
-			}.bind(this));
 		}.bind(this));
 	}
 
@@ -156,6 +166,15 @@ class InstagramWidget extends HTMLElement {
 			  }
 		}
 	}
+
+	/**
+	 * Remove web component
+	 * =====================
+	 *
+	 */
+	disconnectedCallback() {
+		window.removeEventListener("resize", this.resize_event);
+	}
 }
 
 window.customElements.define("instagram-widget", InstagramWidget);
diff --git a/dist/lib/pl/instagram-widget.min.js b/dist/lib/pl/instagram-widget.min.js
index fe93044..d7d6d06 100644
--- a/dist/lib/pl/instagram-widget.min.js
+++ b/dist/lib/pl/instagram-widget.min.js
@@ -1,3 +1,3 @@
 // WebComponent: InstagramWidget 2.5.0 - Collection of WebComponents by Patryk Rzucidlo [@PTKDev] <support@ptkdev.io>
 // https://github.com/ptkdev-components/webcomponent-instagram-widget
-(function() { class InstagramWidget extends HTMLElement{constructor(){super();const t=document.createElement("template");t.innerHTML='<style id="instagram-widget-style">#instagram-widget *{margin:0;padding:0;line-height:0}#instagram-widget .instagram-widget-container{text-align:center;justify-content:center;font-weight:500}#instagram-widget .instagram-widget-photos li img{border-radius:5%;background-color:#f8f8ff;object-fit:cover;object-position:50% 50%;max-width:300px;max-height:300px;min-width:80px;min-height:80px;margin:2px}#instagram-widget .instagram-content ul{list-style-type:none;padding-inline-start:0;width:100%}#instagram-widget .instagram-widget-photos li{list-style-type:none;display:inline}</style><div id="instagram-widget" version="2.5.0">\n\t<div class="instagram-widget-container">\n\t\t<div class="instagram-widget-content">\n\t\t\t<ul class="instagram-widget-photos"></ul>\n\t\t</div>\n\t</div>\n</div>',this.attachShadow({mode:"open"}),this.shadowRoot.appendChild(t.content.cloneNode(!0)),this.json=null,this.options_default={username:"@ptkdev","items-limit":"9","image-width":"100%","image-height":"100%",grid:"responsive",cache:"enabled","border-spacing":"2px","border-corners":"5","force-square":"yes"},this.options=Object.create(this.options_default)}build_html(){let t=this.json.graphql.user.edge_owner_to_timeline_media.edges,e=[];for(let i=0;i<t.length;i++)e.push({url:`https://www.instagram.com/p/${t[i].node.shortcode}/`,thumbnail:t[i].node.thumbnail_src,display_url:void 0!==t[i].node.display_url?t[i].node.display_url:"",caption:t[i].node.edge_media_to_caption.edges[0]&&void 0!==t[i].node.edge_media_to_caption.edges[0].node.text?t[i].node.edge_media_to_caption.edges[0].node.text:""});let i="";for(let t=0;t<e.length&&t<this.options["items-limit"];t++)i+=`<li><a href="${e[t].url}" rel="nofollow external noopener noreferrer" target="_blank" title="${e[t].caption.substring(0,100).replace(/"/g,"")}"><img width="${this.options["image-width"]}" height="${this.options["image-height"]}" src="${e[t].display_url}" alt="${e[t].caption.substring(0,100).replace(/"/g,"")}" loading="lazy" /></a></li>`;if(this.shadowRoot.querySelector(".instagram-widget-photos").innerHTML=i,""!==this.options.grid&&null!==this.options.grid&&"responsive"!==this.options.grid){let t=this.options.grid.split("x"),e=100/parseInt(t[0]),i=this.shadowRoot.querySelectorAll(".instagram-widget-photos img");for(let s=0;s<i.length;s++)i[s].removeAttribute("width"),i[s].style.width=`calc(${e}% - (${this.options["border-spacing"]} * (${parseInt(t[0])} * 2)))`,i[s].style.maxWidth="none",i[s].style.maxHeight="none",i[s].style.borderRadius=this.options["border-corners"]+"%",i[s].style.margin=this.options["border-spacing"],"yes"===this.options["force-square"]&&(i[s].removeAttribute("height"),i[s].style.height=this.shadowRoot.querySelector(".instagram-widget-photos img").clientWidth+"px")}else{let t=this.shadowRoot.querySelectorAll(".instagram-widget-photos img");for(let e=0;e<t.length;e++)t[e].style.borderRadius=this.options["border-corners"]+"%",t[e].style.margin=this.options["border-spacing"],"yes"===this.options["force-square"]&&(t[e].removeAttribute("height"),t[e].style.maxHeight="none",t[e].style.height=this.shadowRoot.querySelector(".instagram-widget-photos img").clientWidth+"px")}}resize(){let t=this.shadowRoot.querySelectorAll(".instagram-widget-photos img");for(let e=0;e<t.length;e++)"yes"===this.options["force-square"]&&(t[e].style.height=this.shadowRoot.querySelector(".instagram-widget-photos img").clientWidth+"px")}api_fetch(){let t=`https://www.instagram.com/${this.options.username.replace("@","")}/?__a=1`;fetch(t,{cache:null===this.options.cache||"enabled"===this.options.cache?"force-cache":"default"}).then((function(t){if(200===t.status)return t.json()})).then(function(t){this.json=t,this.build_html(),window.addEventListener("resize",function(t){this.resize(t)}.bind(this))}.bind(this))}static get observedAttributes(){return["username","items-limit","grid","image-width","image-height","border-spacing","border-corners","force-square","cache"]}attributeChangedCallback(t,e,i){if(e!==i)switch(this.options[t]=null===i||""===i?this.options_default[t]:i,t){case"username":this.api_fetch();break;default:null!==this.json&&this.build_html()}}}window.customElements.define("instagram-widget",InstagramWidget); })();
\ No newline at end of file
+(function() { class InstagramWidget extends HTMLElement{constructor(){super();const t=document.createElement("template");t.innerHTML='<style id="instagram-widget-style">#instagram-widget *{margin:0;padding:0;line-height:0}#instagram-widget .instagram-widget-container{text-align:center;justify-content:center;font-weight:500}#instagram-widget .instagram-widget-photos li img{border-radius:5%;background-color:#f8f8ff;object-fit:cover;object-position:50% 50%;max-width:300px;max-height:300px;min-width:80px;min-height:80px;margin:2px}#instagram-widget .instagram-content ul{list-style-type:none;padding-inline-start:0;width:100%}#instagram-widget .instagram-widget-photos li{list-style-type:none;display:inline}</style><div id="instagram-widget" version="2.5.0">\n\t<div class="instagram-widget-container">\n\t\t<div class="instagram-widget-content">\n\t\t\t<ul class="instagram-widget-photos"></ul>\n\t\t</div>\n\t</div>\n</div>',this.attachShadow({mode:"open"}),this.shadowRoot.appendChild(t.content.cloneNode(!0)),this.json=null,this.options_default={username:"@ptkdev","items-limit":"9","image-width":"100%","image-height":"100%",grid:"responsive",cache:"enabled","border-spacing":"2px","border-corners":"5","force-square":"yes"},this.options=Object.create(this.options_default),this.resize_event=function(t){this.resize(t)}.bind(this)}connectedCallback(){window.addEventListener("resize",this.resize_event)}build_html(){let t=this.json.graphql.user.edge_owner_to_timeline_media.edges,e=[];for(let i=0;i<t.length;i++)e.push({url:`https://www.instagram.com/p/${t[i].node.shortcode}/`,thumbnail:t[i].node.thumbnail_src,display_url:void 0!==t[i].node.display_url?t[i].node.display_url:"",caption:t[i].node.edge_media_to_caption.edges[0]&&void 0!==t[i].node.edge_media_to_caption.edges[0].node.text?t[i].node.edge_media_to_caption.edges[0].node.text:""});let i="";for(let t=0;t<e.length&&t<this.options["items-limit"];t++)i+=`<li><a href="${e[t].url}" rel="nofollow external noopener noreferrer" target="_blank" title="${e[t].caption.substring(0,100).replace(/"/g,"")}"><img width="${this.options["image-width"]}" height="${this.options["image-height"]}" src="${e[t].display_url}" alt="${e[t].caption.substring(0,100).replace(/"/g,"")}" loading="lazy" /></a></li>`;if(this.shadowRoot.querySelector(".instagram-widget-photos").innerHTML=i,""!==this.options.grid&&null!==this.options.grid&&"responsive"!==this.options.grid){let t=this.options.grid.split("x"),e=100/parseInt(t[0]),i=this.shadowRoot.querySelectorAll(".instagram-widget-photos img");for(let s=0;s<i.length;s++)i[s].removeAttribute("width"),i[s].style.width=`calc(${e}% - (${this.options["border-spacing"]} * (${parseInt(t[0])} * 2)))`,i[s].style.maxWidth="none",i[s].style.maxHeight="none",i[s].style.borderRadius=this.options["border-corners"]+"%",i[s].style.margin=this.options["border-spacing"],"yes"===this.options["force-square"]&&(i[s].removeAttribute("height"),i[s].style.height=this.shadowRoot.querySelector(".instagram-widget-photos img").clientWidth+"px")}else{let t=this.shadowRoot.querySelectorAll(".instagram-widget-photos img");for(let e=0;e<t.length;e++)t[e].style.borderRadius=this.options["border-corners"]+"%",t[e].style.margin=this.options["border-spacing"],"yes"===this.options["force-square"]&&(t[e].removeAttribute("height"),t[e].style.maxHeight="none",t[e].style.height=this.shadowRoot.querySelector(".instagram-widget-photos img").clientWidth+"px")}}resize(){let t=this.shadowRoot.querySelectorAll(".instagram-widget-photos img");for(let e=0;e<t.length;e++)"yes"===this.options["force-square"]&&(t[e].style.height=this.shadowRoot.querySelector(".instagram-widget-photos img").clientWidth+"px")}api_fetch(){let t=`https://www.instagram.com/${this.options.username.replace("@","")}/?__a=1`;fetch(t,{cache:null===this.options.cache||"enabled"===this.options.cache?"force-cache":"default"}).then((function(t){if(200===t.status)return t.json()})).then(function(t){this.json=t,this.build_html()}.bind(this))}static get observedAttributes(){return["username","items-limit","grid","image-width","image-height","border-spacing","border-corners","force-square","cache"]}attributeChangedCallback(t,e,i){if(e!==i)switch(this.options[t]=null===i||""===i?this.options_default[t]:i,t){case"username":this.api_fetch();break;default:null!==this.json&&this.build_html()}}disconnectedCallback(){window.removeEventListener("resize",this.resize_event)}}window.customElements.define("instagram-widget",InstagramWidget); })();
\ No newline at end of file
diff --git a/webcomponent/js/main.js b/webcomponent/js/main.js
index 30a0827..b579acd 100644
--- a/webcomponent/js/main.js
+++ b/webcomponent/js/main.js
@@ -31,6 +31,19 @@ class InstagramWidget extends HTMLElement {
 		};
 
 		this.options = Object.create(this.options_default);
+
+		this.resize_event = function(event) {
+			this.resize(event);
+		}.bind(this);
+	}
+
+	/**
+	 * Append web component
+	 * =====================
+	 *
+	 */
+	connectedCallback() {
+		window.addEventListener("resize", this.resize_event);
 	}
 
 	/**
@@ -119,9 +132,6 @@ class InstagramWidget extends HTMLElement {
 		}).then(function(response) {
 			this.json = response;
 			this.build_html();
-			window.addEventListener("resize", function(event) {
-				this.resize(event);
-			}.bind(this));
 		}.bind(this));
 	}
 
@@ -148,6 +158,15 @@ class InstagramWidget extends HTMLElement {
 			  }
 		}
 	}
+
+	/**
+	 * Remove web component
+	 * =====================
+	 *
+	 */
+	disconnectedCallback() {
+		window.removeEventListener("resize", this.resize_event);
+	}
 }
 
 window.customElements.define("instagram-widget", InstagramWidget);