From fcac5664a1682a9be1d6808a4a3978e4a9d8173c Mon Sep 17 00:00:00 2001 From: Philippe Barbosa Date: Wed, 23 Mar 2016 13:01:45 +0100 Subject: [PATCH] Added instagram feed --- app/festival/static/css/index.css | 42 +- app/festival/static/js/index.js | 20 + app/festival/static/js/plugins.js | 371 ++++++++++++++++++ app/festival/static/js/plugins/instafeed.js | 371 ++++++++++++++++++ .../static/scss/components/_headers.scss | 2 +- .../scss/components/_utilities-layout.scss | 10 +- .../static/scss/config/_variables.scss | 1 + app/templates/base.html | 1 + app/templates/includes/instafeed.html | 6 + 9 files changed, 801 insertions(+), 23 deletions(-) mode change 100644 => 100755 app/festival/static/js/plugins.js create mode 100755 app/festival/static/js/plugins/instafeed.js create mode 100644 app/templates/includes/instafeed.html diff --git a/app/festival/static/css/index.css b/app/festival/static/css/index.css index 5ec09920..c2c7068b 100755 --- a/app/festival/static/css/index.css +++ b/app/festival/static/css/index.css @@ -1595,7 +1595,7 @@ th { .nav__complementary { display: block; list-style: none; - text-align: right; + text-align: left; position: absolute; z-index: 200; top: 100%; @@ -2198,25 +2198,29 @@ th { .row-box [class*="box-item"] { display: block; float: left; - padding: 1rem; } -/* line 42, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_utilities-layout.scss */ +/* line 41, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_utilities-layout.scss */ +.row-box img { + display: block; +} + +/* line 46, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_utilities-layout.scss */ .box-item-50 { width: 100%; } -/* line 48, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_utilities-layout.scss */ +/* line 52, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_utilities-layout.scss */ .box-item-33 { width: 100%; } -/* line 54, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_utilities-layout.scss */ +/* line 58, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_utilities-layout.scss */ .box-item-25 { - width: 100%; + width: 33%; } -/* line 60, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_utilities-layout.scss */ +/* line 64, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_utilities-layout.scss */ .box-item-20 { width: 100%; } @@ -2224,14 +2228,14 @@ th { /** * Split for definition lists */ -/* line 76, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_utilities-layout.scss */ +/* line 80, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_utilities-layout.scss */ .split { text-align: right; list-style: none; margin-left: 0; } -/* line 82, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_utilities-layout.scss */ +/* line 86, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_utilities-layout.scss */ .split-title { text-align: left; float: left; @@ -2241,19 +2245,19 @@ th { /** * Split for any div */ -/* line 94, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_utilities-layout.scss */ +/* line 98, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_utilities-layout.scss */ .split-container { text-align: right; } -/* line 99, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_utilities-layout.scss */ +/* line 103, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_utilities-layout.scss */ .split-right { display: inline-block; *display: inline; *zoom: 1; } -/* line 105, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_utilities-layout.scss */ +/* line 109, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_utilities-layout.scss */ .split-left { text-align: left; float: left; @@ -2263,21 +2267,21 @@ th { /** * Split for any div */ -/* line 115, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_utilities-layout.scss */ +/* line 119, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_utilities-layout.scss */ .this-or-this { display: table; width: 100%; text-align: center; } -/* line 121, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_utilities-layout.scss */ +/* line 125, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_utilities-layout.scss */ .this-or-this__this, .this-or-this__or { display: table-cell; vertical-align: middle; } -/* line 127, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_utilities-layout.scss */ +/* line 131, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_utilities-layout.scss */ .this-or-this__this { width: 40%; } @@ -3130,16 +3134,16 @@ th { }/* line 104, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_footers.scss */ .nav__footer__item__link { padding: 1rem; - }/* line 42, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_utilities-layout.scss */ + }/* line 46, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_utilities-layout.scss */ .box-item-50 { width: 50%; - }/* line 48, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_utilities-layout.scss */ + }/* line 52, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_utilities-layout.scss */ .box-item-33 { width: 33.33333333%; - }/* line 54, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_utilities-layout.scss */ + }/* line 58, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_utilities-layout.scss */ .box-item-25 { width: 25%; - }/* line 60, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_utilities-layout.scss */ + }/* line 64, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_utilities-layout.scss */ .box-item-20 { width: 20%; }/* line 17, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/modules/artist-detail.scss */ diff --git a/app/festival/static/js/index.js b/app/festival/static/js/index.js index bb6dc851..451898e2 100644 --- a/app/festival/static/js/index.js +++ b/app/festival/static/js/index.js @@ -88,4 +88,24 @@ $(function() { onBeforePrevSlide: function (el) {} }); + /** + * Instafeed + * @author Philippe Barbosa + */ + + var t = new Instafeed({ + get: "user", + userId: 2985811, + accessToken: "2985811.467ede5.2d850141659d4a5fab04f28187e580cd", + resolution: "standard_resolution", + sortBy: "most-recent", + limit: 12, + template: '
{{caption}}
', + error: function() { + $(".instagram-panel").remove() + } + }); + + $("#instafeed").length && t.run(); + }); \ No newline at end of file diff --git a/app/festival/static/js/plugins.js b/app/festival/static/js/plugins.js old mode 100644 new mode 100755 index 0942fdee..c6ac99b2 --- a/app/festival/static/js/plugins.js +++ b/app/festival/static/js/plugins.js @@ -1,3 +1,374 @@ +// Generated by CoffeeScript 1.9.3 +(function() { + var Instafeed; + + Instafeed = (function() { + function Instafeed(params, context) { + var option, value; + this.options = { + target: 'instafeed', + get: 'popular', + resolution: 'thumbnail', + sortBy: 'none', + links: true, + mock: false, + useHttp: false + }; + if (typeof params === 'object') { + for (option in params) { + value = params[option]; + this.options[option] = value; + } + } + this.context = context != null ? context : this; + this.unique = this._genKey(); + } + + Instafeed.prototype.hasNext = function() { + return typeof this.context.nextUrl === 'string' && this.context.nextUrl.length > 0; + }; + + Instafeed.prototype.next = function() { + if (!this.hasNext()) { + return false; + } + return this.run(this.context.nextUrl); + }; + + Instafeed.prototype.run = function(url) { + var header, instanceName, script; + if (typeof this.options.clientId !== 'string') { + if (typeof this.options.accessToken !== 'string') { + throw new Error("Missing clientId or accessToken."); + } + } + if (typeof this.options.accessToken !== 'string') { + if (typeof this.options.clientId !== 'string') { + throw new Error("Missing clientId or accessToken."); + } + } + if ((this.options.before != null) && typeof this.options.before === 'function') { + this.options.before.call(this); + } + if (typeof document !== "undefined" && document !== null) { + script = document.createElement('script'); + script.id = 'instafeed-fetcher'; + script.src = url || this._buildUrl(); + header = document.getElementsByTagName('head'); + header[0].appendChild(script); + instanceName = "instafeedCache" + this.unique; + window[instanceName] = new Instafeed(this.options, this); + window[instanceName].unique = this.unique; + } + return true; + }; + + Instafeed.prototype.parse = function(response) { + var anchor, childNodeCount, childNodeIndex, childNodesArr, e, eMsg, fragment, header, htmlString, httpProtocol, i, image, imageObj, imageString, imageUrl, images, img, imgHeight, imgOrient, imgUrl, imgWidth, instanceName, j, k, len, len1, len2, node, parsedLimit, reverse, sortSettings, targetEl, tmpEl; + if (typeof response !== 'object') { + if ((this.options.error != null) && typeof this.options.error === 'function') { + this.options.error.call(this, 'Invalid JSON data'); + return false; + } else { + throw new Error('Invalid JSON response'); + } + } + if (response.meta.code !== 200) { + if ((this.options.error != null) && typeof this.options.error === 'function') { + this.options.error.call(this, response.meta.error_message); + return false; + } else { + throw new Error("Error from Instagram: " + response.meta.error_message); + } + } + if (response.data.length === 0) { + if ((this.options.error != null) && typeof this.options.error === 'function') { + this.options.error.call(this, 'No images were returned from Instagram'); + return false; + } else { + throw new Error('No images were returned from Instagram'); + } + } + if ((this.options.success != null) && typeof this.options.success === 'function') { + this.options.success.call(this, response); + } + this.context.nextUrl = ''; + if (response.pagination != null) { + this.context.nextUrl = response.pagination.next_url; + } + if (this.options.sortBy !== 'none') { + if (this.options.sortBy === 'random') { + sortSettings = ['', 'random']; + } else { + sortSettings = this.options.sortBy.split('-'); + } + reverse = sortSettings[0] === 'least' ? true : false; + switch (sortSettings[1]) { + case 'random': + response.data.sort(function() { + return 0.5 - Math.random(); + }); + break; + case 'recent': + response.data = this._sortBy(response.data, 'created_time', reverse); + break; + case 'liked': + response.data = this._sortBy(response.data, 'likes.count', reverse); + break; + case 'commented': + response.data = this._sortBy(response.data, 'comments.count', reverse); + break; + default: + throw new Error("Invalid option for sortBy: '" + this.options.sortBy + "'."); + } + } + if ((typeof document !== "undefined" && document !== null) && this.options.mock === false) { + images = response.data; + parsedLimit = parseInt(this.options.limit, 10); + if ((this.options.limit != null) && images.length > parsedLimit) { + images = images.slice(0, parsedLimit); + } + fragment = document.createDocumentFragment(); + if ((this.options.filter != null) && typeof this.options.filter === 'function') { + images = this._filter(images, this.options.filter); + } + if ((this.options.template != null) && typeof this.options.template === 'string') { + htmlString = ''; + imageString = ''; + imgUrl = ''; + tmpEl = document.createElement('div'); + for (i = 0, len = images.length; i < len; i++) { + image = images[i]; + imageObj = image.images[this.options.resolution]; + if (typeof imageObj !== 'object') { + eMsg = "No image found for resolution: " + this.options.resolution + "."; + throw new Error(eMsg); + } + imgWidth = imageObj.width; + imgHeight = imageObj.height; + imgOrient = "square"; + if (imgWidth > imgHeight) { + imgOrient = "landscape"; + } + if (imgWidth < imgHeight) { + imgOrient = "portrait"; + } + imageUrl = imageObj.url; + httpProtocol = window.location.protocol.indexOf("http") >= 0; + if (httpProtocol && !this.options.useHttp) { + imageUrl = imageUrl.replace(/https?:\/\//, '//'); + } + imageString = this._makeTemplate(this.options.template, { + model: image, + id: image.id, + link: image.link, + type: image.type, + image: imageUrl, + width: imgWidth, + height: imgHeight, + orientation: imgOrient, + caption: this._getObjectProperty(image, 'caption.text'), + likes: image.likes.count, + comments: image.comments.count, + location: this._getObjectProperty(image, 'location.name') + }); + htmlString += imageString; + } + tmpEl.innerHTML = htmlString; + childNodesArr = []; + childNodeIndex = 0; + childNodeCount = tmpEl.childNodes.length; + while (childNodeIndex < childNodeCount) { + childNodesArr.push(tmpEl.childNodes[childNodeIndex]); + childNodeIndex += 1; + } + for (j = 0, len1 = childNodesArr.length; j < len1; j++) { + node = childNodesArr[j]; + fragment.appendChild(node); + } + } else { + for (k = 0, len2 = images.length; k < len2; k++) { + image = images[k]; + img = document.createElement('img'); + imageObj = image.images[this.options.resolution]; + if (typeof imageObj !== 'object') { + eMsg = "No image found for resolution: " + this.options.resolution + "."; + throw new Error(eMsg); + } + imageUrl = imageObj.url; + httpProtocol = window.location.protocol.indexOf("http") >= 0; + if (httpProtocol && !this.options.useHttp) { + imageUrl = imageUrl.replace(/https?:\/\//, '//'); + } + img.src = imageUrl; + if (this.options.links === true) { + anchor = document.createElement('a'); + anchor.href = image.link; + anchor.appendChild(img); + fragment.appendChild(anchor); + } else { + fragment.appendChild(img); + } + } + } + targetEl = this.options.target; + if (typeof targetEl === 'string') { + targetEl = document.getElementById(targetEl); + } + if (targetEl == null) { + eMsg = "No element with id=\"" + this.options.target + "\" on page."; + throw new Error(eMsg); + } + targetEl.appendChild(fragment); + header = document.getElementsByTagName('head')[0]; + header.removeChild(document.getElementById('instafeed-fetcher')); + instanceName = "instafeedCache" + this.unique; + window[instanceName] = void 0; + try { + delete window[instanceName]; + } catch (_error) { + e = _error; + } + } + if ((this.options.after != null) && typeof this.options.after === 'function') { + this.options.after.call(this); + } + return true; + }; + + Instafeed.prototype._buildUrl = function() { + var base, endpoint, final; + base = "https://api.instagram.com/v1"; + switch (this.options.get) { + case "popular": + endpoint = "media/popular"; + break; + case "tagged": + if (!this.options.tagName) { + throw new Error("No tag name specified. Use the 'tagName' option."); + } + endpoint = "tags/" + this.options.tagName + "/media/recent"; + break; + case "location": + if (!this.options.locationId) { + throw new Error("No location specified. Use the 'locationId' option."); + } + endpoint = "locations/" + this.options.locationId + "/media/recent"; + break; + case "user": + if (!this.options.userId) { + throw new Error("No user specified. Use the 'userId' option."); + } + endpoint = "users/" + this.options.userId + "/media/recent"; + break; + default: + throw new Error("Invalid option for get: '" + this.options.get + "'."); + } + final = base + "/" + endpoint; + if (this.options.accessToken != null) { + final += "?access_token=" + this.options.accessToken; + } else { + final += "?client_id=" + this.options.clientId; + } + if (this.options.limit != null) { + final += "&count=" + this.options.limit; + } + final += "&callback=instafeedCache" + this.unique + ".parse"; + return final; + }; + + Instafeed.prototype._genKey = function() { + var S4; + S4 = function() { + return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1); + }; + return "" + (S4()) + (S4()) + (S4()) + (S4()); + }; + + Instafeed.prototype._makeTemplate = function(template, data) { + var output, pattern, ref, varName, varValue; + pattern = /(?:\{{2})([\w\[\]\.]+)(?:\}{2})/; + output = template; + while (pattern.test(output)) { + varName = output.match(pattern)[1]; + varValue = (ref = this._getObjectProperty(data, varName)) != null ? ref : ''; + output = output.replace(pattern, function() { + return "" + varValue; + }); + } + return output; + }; + + Instafeed.prototype._getObjectProperty = function(object, property) { + var piece, pieces; + property = property.replace(/\[(\w+)\]/g, '.$1'); + pieces = property.split('.'); + while (pieces.length) { + piece = pieces.shift(); + if ((object != null) && piece in object) { + object = object[piece]; + } else { + return null; + } + } + return object; + }; + + Instafeed.prototype._sortBy = function(data, property, reverse) { + var sorter; + sorter = function(a, b) { + var valueA, valueB; + valueA = this._getObjectProperty(a, property); + valueB = this._getObjectProperty(b, property); + if (reverse) { + if (valueA > valueB) { + return 1; + } else { + return -1; + } + } + if (valueA < valueB) { + return 1; + } else { + return -1; + } + }; + data.sort(sorter.bind(this)); + return data; + }; + + Instafeed.prototype._filter = function(images, filter) { + var filteredImages, fn, i, image, len; + filteredImages = []; + fn = function(image) { + if (filter(image)) { + return filteredImages.push(image); + } + }; + for (i = 0, len = images.length; i < len; i++) { + image = images[i]; + fn(image); + } + return filteredImages; + }; + + return Instafeed; + + })(); + + (function(root, factory) { + if (typeof define === 'function' && define.amd) { + return define([], factory); + } else if (typeof module === 'object' && module.exports) { + return module.exports = factory(); + } else { + return root.Instafeed = factory(); + } + })(this, function() { + return Instafeed; + }); + +}).call(this); /*! lightslider - v1.1.5 - 2015-10-31 * https://github.com/sachinchoolur/lightslider * Copyright (c) 2015 Sachin N; Licensed MIT */ diff --git a/app/festival/static/js/plugins/instafeed.js b/app/festival/static/js/plugins/instafeed.js new file mode 100755 index 00000000..13a34516 --- /dev/null +++ b/app/festival/static/js/plugins/instafeed.js @@ -0,0 +1,371 @@ +// Generated by CoffeeScript 1.9.3 +(function() { + var Instafeed; + + Instafeed = (function() { + function Instafeed(params, context) { + var option, value; + this.options = { + target: 'instafeed', + get: 'popular', + resolution: 'thumbnail', + sortBy: 'none', + links: true, + mock: false, + useHttp: false + }; + if (typeof params === 'object') { + for (option in params) { + value = params[option]; + this.options[option] = value; + } + } + this.context = context != null ? context : this; + this.unique = this._genKey(); + } + + Instafeed.prototype.hasNext = function() { + return typeof this.context.nextUrl === 'string' && this.context.nextUrl.length > 0; + }; + + Instafeed.prototype.next = function() { + if (!this.hasNext()) { + return false; + } + return this.run(this.context.nextUrl); + }; + + Instafeed.prototype.run = function(url) { + var header, instanceName, script; + if (typeof this.options.clientId !== 'string') { + if (typeof this.options.accessToken !== 'string') { + throw new Error("Missing clientId or accessToken."); + } + } + if (typeof this.options.accessToken !== 'string') { + if (typeof this.options.clientId !== 'string') { + throw new Error("Missing clientId or accessToken."); + } + } + if ((this.options.before != null) && typeof this.options.before === 'function') { + this.options.before.call(this); + } + if (typeof document !== "undefined" && document !== null) { + script = document.createElement('script'); + script.id = 'instafeed-fetcher'; + script.src = url || this._buildUrl(); + header = document.getElementsByTagName('head'); + header[0].appendChild(script); + instanceName = "instafeedCache" + this.unique; + window[instanceName] = new Instafeed(this.options, this); + window[instanceName].unique = this.unique; + } + return true; + }; + + Instafeed.prototype.parse = function(response) { + var anchor, childNodeCount, childNodeIndex, childNodesArr, e, eMsg, fragment, header, htmlString, httpProtocol, i, image, imageObj, imageString, imageUrl, images, img, imgHeight, imgOrient, imgUrl, imgWidth, instanceName, j, k, len, len1, len2, node, parsedLimit, reverse, sortSettings, targetEl, tmpEl; + if (typeof response !== 'object') { + if ((this.options.error != null) && typeof this.options.error === 'function') { + this.options.error.call(this, 'Invalid JSON data'); + return false; + } else { + throw new Error('Invalid JSON response'); + } + } + if (response.meta.code !== 200) { + if ((this.options.error != null) && typeof this.options.error === 'function') { + this.options.error.call(this, response.meta.error_message); + return false; + } else { + throw new Error("Error from Instagram: " + response.meta.error_message); + } + } + if (response.data.length === 0) { + if ((this.options.error != null) && typeof this.options.error === 'function') { + this.options.error.call(this, 'No images were returned from Instagram'); + return false; + } else { + throw new Error('No images were returned from Instagram'); + } + } + if ((this.options.success != null) && typeof this.options.success === 'function') { + this.options.success.call(this, response); + } + this.context.nextUrl = ''; + if (response.pagination != null) { + this.context.nextUrl = response.pagination.next_url; + } + if (this.options.sortBy !== 'none') { + if (this.options.sortBy === 'random') { + sortSettings = ['', 'random']; + } else { + sortSettings = this.options.sortBy.split('-'); + } + reverse = sortSettings[0] === 'least' ? true : false; + switch (sortSettings[1]) { + case 'random': + response.data.sort(function() { + return 0.5 - Math.random(); + }); + break; + case 'recent': + response.data = this._sortBy(response.data, 'created_time', reverse); + break; + case 'liked': + response.data = this._sortBy(response.data, 'likes.count', reverse); + break; + case 'commented': + response.data = this._sortBy(response.data, 'comments.count', reverse); + break; + default: + throw new Error("Invalid option for sortBy: '" + this.options.sortBy + "'."); + } + } + if ((typeof document !== "undefined" && document !== null) && this.options.mock === false) { + images = response.data; + parsedLimit = parseInt(this.options.limit, 10); + if ((this.options.limit != null) && images.length > parsedLimit) { + images = images.slice(0, parsedLimit); + } + fragment = document.createDocumentFragment(); + if ((this.options.filter != null) && typeof this.options.filter === 'function') { + images = this._filter(images, this.options.filter); + } + if ((this.options.template != null) && typeof this.options.template === 'string') { + htmlString = ''; + imageString = ''; + imgUrl = ''; + tmpEl = document.createElement('div'); + for (i = 0, len = images.length; i < len; i++) { + image = images[i]; + imageObj = image.images[this.options.resolution]; + if (typeof imageObj !== 'object') { + eMsg = "No image found for resolution: " + this.options.resolution + "."; + throw new Error(eMsg); + } + imgWidth = imageObj.width; + imgHeight = imageObj.height; + imgOrient = "square"; + if (imgWidth > imgHeight) { + imgOrient = "landscape"; + } + if (imgWidth < imgHeight) { + imgOrient = "portrait"; + } + imageUrl = imageObj.url; + httpProtocol = window.location.protocol.indexOf("http") >= 0; + if (httpProtocol && !this.options.useHttp) { + imageUrl = imageUrl.replace(/https?:\/\//, '//'); + } + imageString = this._makeTemplate(this.options.template, { + model: image, + id: image.id, + link: image.link, + type: image.type, + image: imageUrl, + width: imgWidth, + height: imgHeight, + orientation: imgOrient, + caption: this._getObjectProperty(image, 'caption.text'), + likes: image.likes.count, + comments: image.comments.count, + location: this._getObjectProperty(image, 'location.name') + }); + htmlString += imageString; + } + tmpEl.innerHTML = htmlString; + childNodesArr = []; + childNodeIndex = 0; + childNodeCount = tmpEl.childNodes.length; + while (childNodeIndex < childNodeCount) { + childNodesArr.push(tmpEl.childNodes[childNodeIndex]); + childNodeIndex += 1; + } + for (j = 0, len1 = childNodesArr.length; j < len1; j++) { + node = childNodesArr[j]; + fragment.appendChild(node); + } + } else { + for (k = 0, len2 = images.length; k < len2; k++) { + image = images[k]; + img = document.createElement('img'); + imageObj = image.images[this.options.resolution]; + if (typeof imageObj !== 'object') { + eMsg = "No image found for resolution: " + this.options.resolution + "."; + throw new Error(eMsg); + } + imageUrl = imageObj.url; + httpProtocol = window.location.protocol.indexOf("http") >= 0; + if (httpProtocol && !this.options.useHttp) { + imageUrl = imageUrl.replace(/https?:\/\//, '//'); + } + img.src = imageUrl; + if (this.options.links === true) { + anchor = document.createElement('a'); + anchor.href = image.link; + anchor.appendChild(img); + fragment.appendChild(anchor); + } else { + fragment.appendChild(img); + } + } + } + targetEl = this.options.target; + if (typeof targetEl === 'string') { + targetEl = document.getElementById(targetEl); + } + if (targetEl == null) { + eMsg = "No element with id=\"" + this.options.target + "\" on page."; + throw new Error(eMsg); + } + targetEl.appendChild(fragment); + header = document.getElementsByTagName('head')[0]; + header.removeChild(document.getElementById('instafeed-fetcher')); + instanceName = "instafeedCache" + this.unique; + window[instanceName] = void 0; + try { + delete window[instanceName]; + } catch (_error) { + e = _error; + } + } + if ((this.options.after != null) && typeof this.options.after === 'function') { + this.options.after.call(this); + } + return true; + }; + + Instafeed.prototype._buildUrl = function() { + var base, endpoint, final; + base = "https://api.instagram.com/v1"; + switch (this.options.get) { + case "popular": + endpoint = "media/popular"; + break; + case "tagged": + if (!this.options.tagName) { + throw new Error("No tag name specified. Use the 'tagName' option."); + } + endpoint = "tags/" + this.options.tagName + "/media/recent"; + break; + case "location": + if (!this.options.locationId) { + throw new Error("No location specified. Use the 'locationId' option."); + } + endpoint = "locations/" + this.options.locationId + "/media/recent"; + break; + case "user": + if (!this.options.userId) { + throw new Error("No user specified. Use the 'userId' option."); + } + endpoint = "users/" + this.options.userId + "/media/recent"; + break; + default: + throw new Error("Invalid option for get: '" + this.options.get + "'."); + } + final = base + "/" + endpoint; + if (this.options.accessToken != null) { + final += "?access_token=" + this.options.accessToken; + } else { + final += "?client_id=" + this.options.clientId; + } + if (this.options.limit != null) { + final += "&count=" + this.options.limit; + } + final += "&callback=instafeedCache" + this.unique + ".parse"; + return final; + }; + + Instafeed.prototype._genKey = function() { + var S4; + S4 = function() { + return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1); + }; + return "" + (S4()) + (S4()) + (S4()) + (S4()); + }; + + Instafeed.prototype._makeTemplate = function(template, data) { + var output, pattern, ref, varName, varValue; + pattern = /(?:\{{2})([\w\[\]\.]+)(?:\}{2})/; + output = template; + while (pattern.test(output)) { + varName = output.match(pattern)[1]; + varValue = (ref = this._getObjectProperty(data, varName)) != null ? ref : ''; + output = output.replace(pattern, function() { + return "" + varValue; + }); + } + return output; + }; + + Instafeed.prototype._getObjectProperty = function(object, property) { + var piece, pieces; + property = property.replace(/\[(\w+)\]/g, '.$1'); + pieces = property.split('.'); + while (pieces.length) { + piece = pieces.shift(); + if ((object != null) && piece in object) { + object = object[piece]; + } else { + return null; + } + } + return object; + }; + + Instafeed.prototype._sortBy = function(data, property, reverse) { + var sorter; + sorter = function(a, b) { + var valueA, valueB; + valueA = this._getObjectProperty(a, property); + valueB = this._getObjectProperty(b, property); + if (reverse) { + if (valueA > valueB) { + return 1; + } else { + return -1; + } + } + if (valueA < valueB) { + return 1; + } else { + return -1; + } + }; + data.sort(sorter.bind(this)); + return data; + }; + + Instafeed.prototype._filter = function(images, filter) { + var filteredImages, fn, i, image, len; + filteredImages = []; + fn = function(image) { + if (filter(image)) { + return filteredImages.push(image); + } + }; + for (i = 0, len = images.length; i < len; i++) { + image = images[i]; + fn(image); + } + return filteredImages; + }; + + return Instafeed; + + })(); + + (function(root, factory) { + if (typeof define === 'function' && define.amd) { + return define([], factory); + } else if (typeof module === 'object' && module.exports) { + return module.exports = factory(); + } else { + return root.Instafeed = factory(); + } + })(this, function() { + return Instafeed; + }); + +}).call(this); \ No newline at end of file diff --git a/app/festival/static/scss/components/_headers.scss b/app/festival/static/scss/components/_headers.scss index b42ae59d..7b0f7f6f 100755 --- a/app/festival/static/scss/components/_headers.scss +++ b/app/festival/static/scss/components/_headers.scss @@ -179,7 +179,7 @@ .nav__complementary { display: block; list-style: none; - text-align: right; + text-align: left; position: absolute; z-index: $zi_2; top: 100%; diff --git a/app/festival/static/scss/components/_utilities-layout.scss b/app/festival/static/scss/components/_utilities-layout.scss index 85c2b076..e16b6650 100755 --- a/app/festival/static/scss/components/_utilities-layout.scss +++ b/app/festival/static/scss/components/_utilities-layout.scss @@ -35,7 +35,11 @@ [class*="box-item"] { display: block; float: left; - padding: 1rem; + // padding: 1rem; + } + + img { + display: block; } } @@ -52,9 +56,9 @@ } } .box-item-25 { - width: 100%; + width: 33%; @media (min-width : $tablet) { - width : 25%; + width: 25%; } } .box-item-20 { diff --git a/app/festival/static/scss/config/_variables.scss b/app/festival/static/scss/config/_variables.scss index 4cc443f8..d51eb7ab 100755 --- a/app/festival/static/scss/config/_variables.scss +++ b/app/festival/static/scss/config/_variables.scss @@ -10,6 +10,7 @@ ---------------------------------- */ // $manifeste16 : #e8ca88; +// $manifeste16 : #007985; $manifeste16 : #d2ba88; $manifeste16_darker : darken($manifeste16, 10); diff --git a/app/templates/base.html b/app/templates/base.html index fb71185a..0206355d 100644 --- a/app/templates/base.html +++ b/app/templates/base.html @@ -164,6 +164,7 @@ {% include "includes/calendar.html" %} + {% include "includes/instafeed.html" %} diff --git a/app/templates/includes/instafeed.html b/app/templates/includes/instafeed.html new file mode 100644 index 00000000..0175a939 --- /dev/null +++ b/app/templates/includes/instafeed.html @@ -0,0 +1,6 @@ +{% load i18n %} + +
+ +
+
\ No newline at end of file -- 2.39.5