diff --git a/templates/article.html b/templates/article.html index a36e513c..fa180c4a 100644 --- a/templates/article.html +++ b/templates/article.html @@ -34,80 +34,83 @@ // This function grabs from instagram the data about images and returns HTML to show it in photoswipe var mypics = [] var request = new XMLHttpRequest(); + var data = ""; console.log(pic) request.open('GET', `https://www.instagram.com/p/${pic}/?__a=1`, true); request.onload = function() { if (this.status >= 200 && this.status < 400) { // Success! - var data = JSON.parse(this.response); + data = JSON.parse(this.response); + checkData(data); } else { // We reached our target server, but it returned an error - var data = undefined; + data = undefined; } } - console.log(data) - request.onerror = function() { // There was a connection error of some sort }; request.send(); - if (data){ - data.graphql.shortcode_media.forEach(function(key,val){ - if (key == '__typename'){ - var items = []; - if (val == 'GraphSidecar'){ - data.graphql.shortcode_media.edge_sidecar_to_children.edges.forEach(function( key, val ) { + function checkData(data) { + console.log(data); + if (data){ + data.graphql.shortcode_media.forEach(function(key,val){ + if (key == '__typename'){ + var items = []; + if (val == 'GraphSidecar'){ + data.graphql.shortcode_media.edge_sidecar_to_children.edges.forEach(function( key, val ) { + var mynewitem = {}; + mynewitem.image = val.node.display_url; + mynewitem.title = ""; + mynewitem.height = val.node.dimensions.height; + mynewitem.width = val.node.dimensions.width; + // mynewitem.description = "A detailed description for picture"; + // mynewitem.thumb = mynewitem.image; + mynewitem.big = val.node.display_url; + // mynewitem.layer = "" + "https://www.instagram.com/p/" + pic + "/"; + // mynewitem.link = "https://www.instagram.com/p/" + pic + "/"; + mynewitem.html = "
"; + mypics.push(mynewitem); + }); + } + if (val == 'GraphImage'){ var mynewitem = {}; - mynewitem.image = val.node.display_url; - mynewitem.title = ""; - mynewitem.height = val.node.dimensions.height; - mynewitem.width = val.node.dimensions.width; + mynewitem.image = data.graphql.shortcode_media.display_url; + mynewitem.title = "" + "https://www.instagram.com/p/" + pic + "/"; + mynewitem.height = data.graphql.shortcode_media.dimensions.height; + mynewitem.width = data.graphql.shortcode_media.dimensions.width; // mynewitem.description = "A detailed description for picture"; // mynewitem.thumb = mynewitem.image; - mynewitem.big = val.node.display_url; + mynewitem.big = mynewitem.image; // mynewitem.layer = "" + "https://www.instagram.com/p/" + pic + "/"; // mynewitem.link = "https://www.instagram.com/p/" + pic + "/"; - mynewitem.html = "
"; mypics.push(mynewitem); - }); - } - if (val == 'GraphImage'){ - var mynewitem = {}; - mynewitem.image = data.graphql.shortcode_media.display_url; - mynewitem.title = "" + "https://www.instagram.com/p/" + pic + "/"; - mynewitem.height = data.graphql.shortcode_media.dimensions.height; - mynewitem.width = data.graphql.shortcode_media.dimensions.width; - // mynewitem.description = "A detailed description for picture"; - // mynewitem.thumb = mynewitem.image; - mynewitem.big = mynewitem.image; - // mynewitem.layer = "" + "https://www.instagram.com/p/" + pic + "/"; - // mynewitem.link = "https://www.instagram.com/p/" + pic + "/"; - mypics.push(mynewitem); + } } - } - }) - } + }) + } - var myhtml = ""; - mypics.forEach(function(item){ - myhtml = myhtml + mypics[item].html; - }); - if (myhtml) { - myhtml = '
' + myhtml + '
'; - } + var myhtml = ""; + mypics.forEach(function(item){ + myhtml = myhtml + mypics[item].html; + }); + if (myhtml) { + myhtml = '
' + myhtml + '
'; + } - // Set innerHTML after we have got the result + // Set innerHTML after we have got the result - document.querySelectorAll('#photoswipe-instagram').forEach(function(divisor){ - mygalleryid = divisor.getAttribute('data-gallery-id'); - if (mygalleryid === pic) { - divisor.innerHTML = myhtml; - } - }); - } + document.querySelectorAll('#photoswipe-instagram').forEach(function(divisor){ + mygalleryid = divisor.getAttribute('data-gallery-id'); + if (mygalleryid === pic) { + divisor.innerHTML = myhtml; + } + }); + } + } function updategalleries(){ document.querySelectorAll('#photoswipe-instagram').forEach(function(divisor){