Created
September 30, 2019 18:01
-
-
Save seanmtracey/29221ef224f97f6ae1ed84f547f6122e to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| [{"id":"657d785c.a755d8","type":"http in","z":"d7f421c3.87cf2","name":"","url":"/cinelist","method":"get","upload":false,"swaggerDoc":"","x":250,"y":240,"wires":[["683f655.3cdba9c"]]},{"id":"c8db0462.894fd8","type":"http response","z":"d7f421c3.87cf2","name":"","statusCode":"","headers":{},"x":860,"y":180,"wires":[]},{"id":"66fc158.8d674ec","type":"template","z":"d7f421c3.87cf2","name":"HTML / CSS","field":"payload","fieldType":"msg","format":"handlebars","syntax":"mustache","template":"<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n\t<meta content=\"text/html; charset=utf-8\" http-equiv=\"Content-Type\">\n\t<title>CineList</title>\n\t<link rel=\"shortcut icon\" href=\"https://cinelist-public-dev.herokuapp.com/favicon.png\">\n\t<style>\n\n @charset \"UTF-8\";\n /* CSS Document */\n\n *{\n -webkit-tap-highlight-color: rgba(0,0,0,0);\n box-sizing: border-box;\n }\n\n .inactive, [data-is-loading=false], [data-visible=false]{\n display: none !important;\n }\n\n .working{\n position: fixed;\n top: 0;\n left: 0;\n display: -webkit-flex;\n display: flex;\n -webkit-align-items: center;\n align-items: center;\n -webkit-justify-content: center;\n justify-content: center;\n width: 100%;\n -webkit-flex-direction: column;\n flex-direction: column;\n text-align: center;\n height: 100%;\n z-index: 999;\n background: rgba(255,255,255,.9);\n }\n\n .working img{\n width: 50px;\n height: 50px;\n }\n\n .working .status{\n margin-top: 1em;\n font-weight: 600;\n }\n\n h1,h2,h3,h4,h5,h6{\n font-family: \"proxima-nova\", 'Proxima Nova', sans-serif;\n margin: 0;\n padding: 0;\n line-height: 1.5em;\n }\n\n html{\n height:100%;\n width:100%;\n background-color:white;\n background-position:center 0px;\n background-size:100%;\n font-size: 14px;\n }\n\n body{\n font-family: \"proxima-nova\", 'Proxima Nova', Arial, Helvetica, sans-serif;\n /*font-family: sans-serif;*/\n font-size: 15px;\n margin:0px;\n background-attachment: scroll;\n background-repeat: repeat-y;\n width:100%;\n height:100%;\n box-sizing:border-box;\n }\n\n #home{\n width: 100%;\n height: 100%;\n }\n\n #home #container{\n position: fixed;\n top: 15vh;\n padding: 1em;\n width: 100%;\n text-align: center;\n }\n\n #home #container img{\n width: 130px;\n margin-bottom: 0.5em;\n }\n\n #home #container h1{\n font-weight: 400;\n font-size: 15px;\n padding-left: 4px;\n }\n\n #search{\n display: -webkit-flex;\n display: flex;\n -webkit-align-items: center;\n align-items: center;\n -webkit-justify-content: space-between;\n justify-content: space-between;\n width: 100%;\n position: fixed;\n top: 0;\n transform: translateY(0);\n z-index: 1000;\n background: white;\n border-bottom: 1px solid white;\n transition: transform 0.2s ease-in;\n background: black;\n }\n\n #search[data-firstload=\"true\"]{\n transform: translateY(45vh);\n }\n\n form{\n padding: 1em;\n }\n\n form#search input[type=\"text\"]{\n font-weight: 400;\n font-size: 1em;\n padding: 0.5em 0.3em;\n border: 2px solid black;\n border-width: 0 0 1px 0;\n outline: none;\n width: 100%;\n background: black;\n color: white;\n }\n\n form#search input[type=\"text\"]:focus{\n background-image: url('https://cinelist-public-dev.herokuapp.com/assets/images/search.png');\n background-size: auto 20px;\n background-position: 100% 50%;\n background-repeat: no-repeat;\n }\n\n form#search input[type=\"submit\"]{\n position: absolute;\n right: 0;\n background: transparent;\n border: 0px solid transparent;\n width: 60px;\n height: 100%;\n outline: none;\n font-size: 0px;\n color: transparent;\n }\n\n #geolocation{\n color: #0279cd;\n font-weight: 600;\n text-decoration: none;\n margin-top: 0.5em;\n display: block;\n cursor: pointer;\n font-size: 10px;\n text-align: center;\n margin-right: 1em;\n }\n\n #geolocation img{\n height: 20px;\n }\n\n #timesContainer{\n padding-top: 65px;\n padding-bottom: 30%;\n }\n\n #timesContainer h2{\n font-size: 18px;\n display: -webkit-flex;\n display: flex;\n -webkit-align-items: center;\n align-items: center;\n padding: 0.5em;\n background: black;\n color: white;\n margin-bottom: 1em;\n }\n\n #timesContainer h2 span{\n font-size: 10px;\n margin-left: 1em;\n line-height: 1em;\n }\n\n #timesContainer .listing{\n padding: 0 1em;\n }\n\n #timesContainer .listing ol{\n padding: 0;\n margin: 0;\n display: -webkit-flex;\n display: flex;\n list-style-type: none;\n flex-wrap: wrap;\n -webkit-flex-wrap: wrap;\n padding-top: 0.8em;\n padding-bottom: 1em;\n }\n\n #timesContainer .listing ol li{\n display: block;\n width: 55px;\n margin-bottom: 0.5em;\n padding: 0.5em;\n text-align: center;\n }\n\n #timesContainer .listing ol li.missed{\n text-decoration: line-through;\n opacity: 0.5;\n }\n\n #timesContainer .listing ol li.nextTime{\n color: #0279cd;\n border-radius: 3px;\n font-weight: 600;\n border: 1px solid #0279cd;\n border-width: 1px 0;\n }\n\n .dayoffset{\n position: fixed;\n bottom: 0;\n left: 0;\n display: -webkit-flex;\n display: flex;\n width: 100%;\n overflow-x: scroll;\n padding: 0.8em;\n border-top: 1px solid black;\n -webkit-align-items: center;\n align-items: center;\n background: white;\n z-index: 1000;\n transition: transform 0.2s ease-out;\n -webkit-overflow-scrolling: touch;\n }\n\n .dayoffset a{\n display: block;\n color: #3a3a3a;\n margin-right: 1em;\n text-decoration: none;\n font-weight: 200;\n padding: 0.4em 0.7em;\n min-width: 100px;\n text-align: center;\n }\n\n .dayoffset a.activeDay{\n background: black;\n color: white;\n border-radius: 3px;\n font-weight: 600;\n }\n\n .dayoffset[data-active=\"false\"]{\n -webkit-transform: translateY(60px);\n transform: translateY(100%);\n }\n\n .spin{\n animation: spinAnimation 1.25s infinite;\n -moz-animation: spinAnimation 1.25s infinite;\n -webkit-animation: spinAnimation 1.25s infinite;\n -o-animation: spinAnimation 1.25s infinite;\n }\n\n @keyframes spinAnimation{\n 0% {transform: rotateZ(0deg);}\n 100% {transform: rotateZ(360deg);}\n }\n\n @-moz-keyframes spinAnimation{\n 0% {-moz-transform: rotateZ(0deg);}\n 100% {-moz-transform: rotateZ(360deg);}\n }\n \n @-webkit-keyframes spinAnimation{\n 0% {-webkit-transform: rotateZ(0deg);}\n 100% {-webkit-transform: rotateZ(360deg);}\n }\n \n @-o-keyframes spinAnimation{\n 0% {-o-transform: rotateZ(0deg);}\n 100% {-o-transform: rotateZ(360deg);}\n }\n\n @media all and (min-width: 768px){\n \n #timesContainer .cinema{\n display: -webkit-flex;\n display: flex;\n -webkit-flex-wrap: wrap;\n flex-wrap: wrap;\n }\n\n #timesContainer h2 {\n width: 100%;\n }\n\n #timesContainer .listing{\n width: 300px;\n }\n\n }\n </style>\n\n\t<script src=\"https://cdn.polyfill.io/v2/polyfill.min.js?features=default,fetch\"></script>\n\t<meta name=\"viewport\" content=\"initial-scale=1.0, user-scalable=no\" />\n\t<meta name=\"description\" content=\"Cinema websites are rubbish. CineList makes it easy to get local cinema showtimes across the UK.\">\n\n\t<meta property=\"og:title\" content=\"CineList\" />\n\t<meta property=\"og:description\" content=\"Cinema websites are rubbish. CineList makes it easy to get local cinema showtimes across the UK.\" />\n\t<meta property=\"og:url\" content=\"http://cinelist.co.uk/\" />\n\t<meta property=\"og:image\" content=\"http://cinelist.co.uk/icon/fb.png\" />\n\n\t<meta name=\"apple-mobile-web-app-capable\" content=\"yes\">\n\t<meta name=\"apple-mobile-web-app-status-bar-style\" content=\"default\">\n\t<link rel=\"apple-touch-icon-precomposed\" href=\"https://cinelist-public-dev.herokuapp.com/icon/default.png\" />\n\t<link rel=\"apple-touch-icon-precomposed\" sizes=\"72x72\" href=\"https://cinelist-public-dev.herokuapp.com/icon/72.png\" />\n\t<link rel=\"apple-touch-icon-precomposed\" sizes=\"114x114\" href=\"https://cinelist-public-dev.herokuapp.com/icon/114.png\" />\n\t<link rel=\"apple-touch-icon-precomposed\" sizes=\"144x144\" href=\"https://cinelist-public-dev.herokuapp.com/icon/144.png\" />\n\n\t<link rel=\"manifest\" href=\"/cinelist/manifest.json\">\n\t<meta name=\"theme-color\" content=\"#000000\" />\n\t<script>window.__cinelist = {};</script>\n</head>\n\t<body>\n\n\t\t<div id=\"home\">\n\t\t\t<div id=\"container\">\n\t\t\t\t<img src=\"https://cinelist-public-dev.herokuapp.com/assets/images/logo_small.png\" alt=\"The CineList logo\" />\n\t\t\t\t<h1>The fastest way to get UK cinema times<br/> on the web (probably)</h1>\n\t\t\t</div>\n\t\t\n\t\t</div>\n\n\t\t<form id=\"search\" data-firstload=\"true\">\n\t\t\t<a href=\"#\" id=\"geolocation\">\n\t\t\t\t<img src=\"https://cinelist-public-dev.herokuapp.com/assets/images/geo.png\" alt=\"Use Geolocation\"/>\n\t\t\t</a>\n\t\t\t<input type=\"text\" placeholder=\"Search by place name\" title=\"Enter location to search\"/>\n\t\t\t<input type=\"submit\" value=\"Submit\" />\n\t\t</form>\n\n\t\t<div id=\"timesContainer\"></div>\n\n\t\t<div class=\"dayoffset\" data-active=\"false\">\n\t\t\t<a href=\"#\" class=\"activeDay\" data-offset='0'>Today</a>\n\t\t\t<a href=\"#\" data-offset='1'>Tomorrow</a>\n\t\t\t<a href=\"#\" data-offset='2'>+2</a>\n\t\t\t<a href=\"#\" data-offset='3'>+3</a>\n\t\t\t<a href=\"#\" data-offset='4'>+4</a>\n\t\t\t<a href=\"#\" data-offset='5'>+5</a>\n\t\t\t<a href=\"#\" data-offset='6'>+6</a>\n\t\t</div>\n\n\t\t<div class=\"working\" data-visible=\"false\">\n\t\t\t<img src=\"https://cinelist-public-dev.herokuapp.com/assets/images/error.png\" id=\"error\" data-visible=\"false\" alt=\"Cross\"/>\n\t\t\t<img src=\"https://cinelist-public-dev.herokuapp.com/assets/images/loading.png\" id=\"loading\" data-visible=\"true\" class=\"spin\" alt=\"loading spinner\"/>\n\t\t\t<div class=\"status\">Well, hello there...</div>\n\n\t\t\t<script>\n\t\t\t\twindow.__cinelist.working = (function(){\n\t\t\t\t\t\n\t\t\t\t\tvar workingOverlay = document.querySelector('.working');\n\t\t\t\t\tvar spinnerImage = workingOverlay.querySelector('#loading');\n\t\t\t\t\tvar errorImage = workingOverlay.querySelector('#error');\t\t\t\t\t\n\t\t\t\t\tvar statusMessage = workingOverlay.querySelector('.status');\n\n\t\t\t\t\tfunction selectIcon(icon){\n\t\t\t\t\t\tif(icon === 'error'){\n\t\t\t\t\t\t\tspinnerImage.dataset.visible = \"false\";\n\t\t\t\t\t\t\terrorImage.dataset.visible = \"true\";\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tif(icon === 'working'){\n\t\t\t\t\t\t\tspinnerImage.dataset.visible = \"true\";\n\t\t\t\t\t\t\terrorImage.dataset.visible = \"false\";\n\t\t\t\t\t\t}\n\n\t\t\t\t\t}\n\t\t\t\t\t\n\t\t\t\t\tfunction showSpinner(){\n\t\t\t\t\t\tworkingOverlay.dataset.visible = \"true\";\n\t\t\t\t\t}\n\n\t\t\t\t\tfunction hideSpinner(){\n\t\t\t\t\t\tworkingOverlay.dataset.visible = \"false\";\n\t\t\t\t\t}\n\n\t\t\t\t\tfunction updateSpinnerMessage(message){\n\t\t\t\t\t\tstatusMessage.textContent = message;\n\t\t\t\t\t}\n\n\t\t\t\t\treturn {\n\t\t\t\t\t\ticon : selectIcon,\n\t\t\t\t\t\tshow : showSpinner,\n\t\t\t\t\t\thide : hideSpinner,\n\t\t\t\t\t\tupdate : updateSpinnerMessage,\n\t\t\t\t\t};\n\t\t\t\t}());\n\t\t\t</script>\n\t\t</div>\n\n\t\t<script>\n\t\t \n\t\t {{{payload.core}}}\n\t\t \n\t\t</script>\n\n\t\t<script>\n\t\t\tif(navigator.serviceWorker !== undefined) {\n\t\t\t\tnavigator.serviceWorker\n\t\t\t\t\t.register('/cinelist/service-worker.js')\n\t\t\t\t\t.then(function() { console.log(\"Service Worker Registered\"); })\n\t\t\t\t\t.catch(function(err){\n\t\t\t\t\t\tconsole.error(err);\n\t\t\t\t\t})\n\t\t\t\t;\n\t\t\t}\n\t\t</script>\n\n\t\t<script>\n\t\t\t(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){\n\t\t\t(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),\n\t\t\tm=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)\n\t\t\t})(window,document,'script','//www.google-analytics.com/analytics.js','ga');\n\n\t\t\tga('create', 'UA-61305342-1', 'auto');\n\t\t\tga('send', 'pageview');\n\n\t\t</script>\n\n\t\t<script src=\"https://use.typekit.net/imt5yec.js\"></script>\n\t\t<script>try{Typekit.load();}catch(e){}</script>\n\n\t</body>\n</html>\n","output":"str","x":640,"y":240,"wires":[["c8db0462.894fd8"]]},{"id":"733ffcc6.3b6a84","type":"http in","z":"d7f421c3.87cf2","name":"","url":"/cinelist/service-worker.js","method":"get","upload":false,"swaggerDoc":"","x":205,"y":120,"wires":[["a8e958c4.ee99b8"]]},{"id":"a8e958c4.ee99b8","type":"template","z":"d7f421c3.87cf2","name":"Service Worker","field":"payload","fieldType":"msg","format":"javascript","syntax":"mustache","template":"var CacheName = 'CineList';\n\nself.addEventListener('install', function(e) {\n console.log('Installed')\n});\n\nself.addEventListener('fetch', function(event) {\n event.respondWith(\n\tcaches.open(CacheName).then(function(cache) {\n\t return cache.match(event.request).then(function(cachedResponse) {\n\t\tvar fetchPromise = fetch(event.request).then(function(networkResponse) {\n\t\t cache.put(event.request, networkResponse.clone());\n\t\t return networkResponse;\n\t\t});\n\t\t\n\t\tconsole.log(cachedResponse);\n\t\t// If it's a request to the API\n\t\t// try to get it from the network\n\t\t// if that fails, send the cached version\n\t\t// if there is one. \t\n\t\tif(event.request.url.indexOf('api.cinelist.co.uk') > -1){\n\n\t\t\treturn fetchPromise\n\t\t\t\t.catch(function(err){\n\t\t\t\t\tif(cachedResponse !== undefined){\n\t\t\t\t\t\treturn cachedResponse;\n\t\t\t\t\t} else {\n\t\t\t\t\t\tthrow err;\n\t\t\t\t\t}\n\t\t\t\t})\n\t\t\t;\n\t\t}\n\n\t\treturn cachedResponse || fetchPromise;\n\n\t })\n\t})\n );\n});","output":"str","x":455,"y":120,"wires":[["31b5f63.1faec0a","70a720e7.ee4e"]]},{"id":"683f655.3cdba9c","type":"template","z":"d7f421c3.87cf2","name":"Core JS","field":"payload.core","fieldType":"msg","format":"handlebars","syntax":"mustache","template":"(function(){\n\n\t'use strict';\n\n\tvar APIRoot = \"https://api.cinelist.co.uk\";\n\n\tvar prevent = function(e){e.preventDefault();e.stopImmediatePropagation()};\n\n\tvar home = document.querySelector('#home');\n\tvar searchForm = document.querySelector('#search');\n\tvar geoTrigger = searchForm.querySelector('#geolocation');\n\tvar dayoffsetContainer = document.querySelector('.dayoffset');\n\tvar dayOffsetButtons = Array.from( dayoffsetContainer.querySelectorAll('*[data-offset]') );\n\tvar timesContainer = document.querySelector('#timesContainer');\n\n\tvar currentLocation = '';\n\tvar currentLocationIsPostcode = false;\n\n\tfunction getGeolocation(){\n\n\t\treturn new Promise(function( resolve, reject){\n\n\t\t\tif(navigator.geolocation){\n\t\t\t\tnavigator.geolocation.getCurrentPosition(\n\t\t\t\t\tfunction(position){\n\t\t\t\t\t\tresolve(position)\n\t\t\t\t\t},\n\t\t\t\t\tfunction(err){\n\t\t\t\t\t\treject(err);\n\t\t\t\t\t},\n\t\t\t\t\t{\n\t\t\t\t\t\tenableHighAccuracy: false,\n\t\t\t\t\t\ttimeout: 15000,\n\t\t\t\t\t\tmaximumAge: 0\n\t\t\t\t\t}\n\t\t\t\t);\n\t\t\t} else {\n\t\t\t\treject('Geolocation is not available in this browser');\n\t\t\t}\n\n\t\t});\n\n\t}\n\n\tfunction wasResponseGood(response){\n\n\t\treturn new Promise( function(resolve, reject){\n\n\t\t\tif(response.ok){\n\t\t\t\tresponse.json()\n\t\t\t\t\t.then(function(json){\n\t\t\t\t\t\tresolve(json);\n\t\t\t\t\t})\n\t\t\t\t\t.catch(function(err){\n\t\t\t\t\t\tconsole.log('An error occurred with request', err);\n\t\t\t\t\t\treject(err);\n\t\t\t\t\t})\n\t\t\t\t;\n\t\t\t} else {\n\t\t\t\treject(response);\n\t\t\t}\n\n\t\t});\n\n\t}\n\n\tfunction joinListOfCinemasWithListings(cinemas, times){\n\n\t\treturn cinemas.map(function(cinema){\n\n\t\t\t\tfor(var x = 0; x < times.length; x += 1){\n\t\t\t\t\tif(times[x] === null){\n\t\t\t\t\t\treturn null;\n\t\t\t\t\t}\n\t\t\t\t\tif(times[x].cinema === cinema.id){\n\t\t\t\t\t\tcinema.listings = times[x].listings;\n\t\t\t\t\t\ttimes.splice(x, 1);\n\t\t\t\t\t\treturn cinema;\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t})\n\t\t\t.filter(function(item){\n\t\t\t\treturn item !== null;\n\t\t\t})\n\t\t;\n\n\t}\n\n\tfunction resetDayOffsetButtons(){\n\t\tdayOffsetButtons.forEach(function(button){\n\t\t\tbutton.classList.remove('activeDay');\n\t\t});\n\t}\n\n\tfunction generateViewFromData(cinemasWithTimes, offset){\n\n\t\tvar timesDocumentFragment = document.createDocumentFragment();\n\n\t\tcinemasWithTimes.forEach(function(cinema){\n\n\t\t\tvar cinemaContainer = document.createElement('div');\n\t\t\tvar cinemaTitle = document.createElement('h2');\n\t\t\tvar cinemaDistance = document.createElement('span');\n\n\t\t\tcinemaContainer.classList.add('cinema');\n\n\t\t\tcinemaTitle.textContent = cinema.name;\n\t\t\tcinemaDistance.textContent = '(' + cinema.distance + ' miles)';\n\n\t\t\tcinemaTitle.appendChild(cinemaDistance);\n\n\t\t\tcinemaContainer.appendChild(cinemaTitle);\n\n\t\t\tcinema.listings.sort( function(a, b){\n\t\t\t\tif(a.title > b.title){\n\t\t\t\t\treturn 1\n\t\t\t\t} else {\n\t\t\t\t\treturn -1;\n\t\t\t\t}\n\t\t\t});\n\n\t\t\tvar d = new Date(),\n\t\t\t\tthisHour = d.getHours(),\n\t\t\t\tthisMinute = d.getMinutes();\n\n\t\t\tcinema.listings.forEach(function(listing){\n\n\t\t\t\tvar listingContainer = document.createElement('div');\n\t\t\t\tvar listingTitle = document.createElement('h3');\n\t\t\t\tvar listingTimesContainer = document.createElement('ol');\n\n\t\t\t\tlistingContainer.classList.add('listing');\n\t\t\t\tlistingTitle.textContent = listing.title;\n\n\t\t\t\tvar setNext = false;\n\n\t\t\t\tlisting.times.forEach(function(time){\n\n\t\t\t\t\tvar timeLi = document.createElement('li');\n\t\t\t\t\ttimeLi.textContent = time;\n\n\t\t\t\t\tif(offset === 0){\n\t\t\t\t\t\tvar theTime = time.split(\":\");\n\t\t\t\t\t\tvar canCatch = undefined;\n\n\t\t\t\t\t\tif(thisHour < parseInt(theTime[0])){\n\t\t\t\t\t\t\tcanCatch = true\n\t\t\t\t\t\t} else if(thisHour == parseInt(theTime[0]) && thisMinute < parseInt(theTime[1])){\n\t\t\t\t\t\t\tcanCatch = true;\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tcanCatch = false;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tif(!setNext && canCatch){\n\t\t\t\t\t\t\ttimeLi.setAttribute('class', 'nextTime')\n\t\t\t\t\t\t\tsetNext = true;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tif(!canCatch){\n\t\t\t\t\t\t\ttimeLi.setAttribute('class','missed');\n\t\t\t\t\t\t}\n\n\t\t\t\t\t} else {\n\n\t\t\t\t\t\tif(!setNext){\n\t\t\t\t\t\t\ttimeLi.setAttribute('class', 'nextTime')\n\t\t\t\t\t\t\tsetNext = true;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t}\n\n\n\t\t\t\t\tlistingTimesContainer.appendChild(timeLi);\n\n\t\t\t\t});\n\n\t\t\t\tlistingContainer.appendChild(listingTitle);\n\t\t\t\tlistingContainer.appendChild(listingTimesContainer);\n\t\t\t\tcinemaContainer.appendChild(listingContainer);\n\t\t\t});\n\n\t\t\ttimesDocumentFragment.appendChild(cinemaContainer);\n\n\t\t});\n\n\t\treturn timesDocumentFragment;\n\t}\n\n\tfunction searchForCinemasByGeolocation(latitude, longitude, offset){\n\n\t\tconsole.log(latitude, longitude);\n\t\treturn fetch(APIRoot + '/search/cinemas/coordinates/' + latitude + '/' + longitude)\n\t\t\t.then(function(response){\n\t\t\t\treturn wasResponseGood(response);\n\t\t\t})\n\t\t\t.catch(function(err){\n\t\t\t\tconsole.log('Could not fetch searchForCinemasByLocation', err);\n\t\t\t\tthrow err;\n\t\t\t})\n\t\t;\n\n\t}\n\n\tfunction searchForCinemasByLocation(location){\n\n\t\tconsole.log(location);\n\t\treturn fetch(APIRoot + '/search/cinemas/location/' + location)\n\t\t\t.then(function(response){\n\t\t\t\treturn wasResponseGood(response);\n\t\t\t})\n\t\t\t.catch(function(err){\n\t\t\t\tconsole.log('Could not fetch searchForCinemasByLocation', err);\n\t\t\t\tthrow err;\n\t\t\t})\n\t\t;\n\n\t}\n\n\tfunction searchForCinemasByPostcode(postcode){\n\n\t\tconsole.log(postcode);\n\t\treturn fetch(APIRoot + '/search/cinemas/postcode/' + postcode)\n\t\t\t.then(function(response){\n\t\t\t\treturn wasResponseGood(response);\n\t\t\t})\n\t\t\t.catch(function(err){\n\t\t\t\tconsole.log('Could not fetch searchForCinemasByPostcode', err);\n\t\t\t\tthrow err;\n\t\t\t})\n\t\t;\n\n\t}\n\n\tfunction getManyCinemaTimesById(listOfCinemaIDs, offset){\n\n\t\toffset = offset || 0;\n\n\t\treturn fetch(APIRoot + '/get/times/many/' + listOfCinemaIDs.join(',') + '?day=' + offset)\n\t\t\t.then(function(response){\n\t\t\t\treturn wasResponseGood(response);\n\t\t\t})\n\t\t\t.catch(function(err){\n\t\t\t\tconsole.log('Could not fetch searchForCinemasByLocation', err);\n\t\t\t\tthrow err;\n\t\t\t})\n\t\t;\n\t}\n\n\tfunction getCinemasAndTimesFromLocation(location, offset){\n\n\t\toffset = offset || 0;\n\n\t\twindow.__cinelist.working.icon('working');\n\t\twindow.__cinelist.working.update('Searching for ' + location + ' cinemas');\n\t\twindow.__cinelist.working.show();\n\n\t\treturn searchForCinemasByLocation(location)\n\t\t\t.then(function(cinemaData){\n\n\t\t\t\tconsole.log(cinemaData);\n\n\t\t\t\tvar cinemaIDs = cinemaData.cinemas.map(function(datum, idx){\n\t\t\t\t\t\tif(idx < 30){\n\t\t\t\t\t\t\treturn datum.id;\n\t\t\t\t\t\t} else if(datum.distance < 5){\n\t\t\t\t\t\t\treturn datum.id;\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\treturn undefined;\n\t\t\t\t\t\t}\n\t\t\t\t\t})\n\t\t\t\t;\n\n\t\t\t\twindow.__cinelist.working.update('Getting times for ' + location + ' cinemas');\n\n\t\t\t\treturn getManyCinemaTimesById(cinemaIDs, offset)\n\t\t\t\t\t.then(function(listingsData){\n\t\t\t\t\t\treturn joinListOfCinemasWithListings(cinemaData.cinemas, listingsData.results);\n\t\t\t\t\t})\n\t\t\t\t;\n\n\t\t\t})\n\t\t;\n\n\t}\n\n\tfunction getCinemasAndTimesFromGeolocation(latitude, longitude, offset){\n\n\t\treturn searchForCinemasByGeolocation(latitude, longitude, offset)\n\t\t\t.then(function(cinemaData){\n\n\t\t\t\tconsole.log(cinemaData);\n\t\t\t\tcurrentLocation = cinemaData.postcode;\n\t\t\t\tcurrentLocationIsPostcode = true;\n\n\t\t\t\tvar cinemaIDs = cinemaData.cinemas.map(function(datum){\n\t\t\t\t\treturn datum.id;\n\t\t\t\t});\n\n\t\t\t\twindow.__cinelist.working.update('Getting times for nearby cinemas');\n\n\t\t\t\treturn getManyCinemaTimesById(cinemaIDs, offset)\n\t\t\t\t\t.then(function(listingsData){\n\t\t\t\t\t\treturn joinListOfCinemasWithListings(cinemaData.cinemas, listingsData.results);\n\t\t\t\t\t})\n\t\t\t\t;\n\n\t\t\t})\n\t\t;\n\n\t}\n\n\tfunction getCinemasAndTimesFromPostcode(postcode, offset){\n\n\t\treturn searchForCinemasByPostcode(postcode, offset)\n\t\t\t.then(function(cinemaData){\n\n\t\t\t\tconsole.log(cinemaData);\n\t\t\t\tcurrentLocation = cinemaData.postcode;\n\t\t\t\tcurrentLocationIsPostcode = true;\n\n\t\t\t\tvar cinemaIDs = cinemaData.cinemas.map(function(datum){\n\t\t\t\t\treturn datum.id;\n\t\t\t\t});\n\n\t\t\t\twindow.__cinelist.working.update('Getting times for nearby cinemas');\n\n\t\t\t\treturn getManyCinemaTimesById(cinemaIDs, offset)\n\t\t\t\t\t.then(function(listingsData){\n\t\t\t\t\t\treturn joinListOfCinemasWithListings(cinemaData.cinemas, listingsData.results);\n\t\t\t\t\t})\n\t\t\t\t;\n\n\t\t\t})\n\t\t;\n\n\t}\n\n\tfunction locationSubmitted(location){\n\n\t\thome.dataset.visible = \"false\";\n\t\tsearchForm.dataset.firstload = \"false\";\n\t\t\n\t\tcurrentLocation = location;\n\t\tcurrentLocationIsPostcode = false;\n\n\t\tresetDayOffsetButtons();\n\t\tdayOffsetButtons[0].classList.add('activeDay');\n\t\tdayoffsetContainer.dataset.active = \"false\";\n\n\t\tgetCinemasAndTimesFromLocation(currentLocation, 0)\n\t\t\t.then(function(cinemasWithTimes){\n\t\t\t\tconsole.log(cinemasWithTimes);\n\t\t\t\ttimesContainer.innerHTML = \"\";\n\t\t\t\ttimesContainer.appendChild(generateViewFromData(cinemasWithTimes, 0));\n\t\t\t\twindow.__cinelist.working.hide();\n\t\t\t\tdayoffsetContainer.dataset.active = \"true\";\n\t\t\t})\n\t\t\t.catch(function(err){\n\n\t\t\t\twindow.__cinelist.working.icon('error');\n\t\t\t\twindow.__cinelist.working.update('Sorry - something went wrong getting your times');\n\n\t\t\t\tsetTimeout(function(){\n\t\t\t\t\twindow.__cinelist.working.hide();\n\t\t\t\t}, 4000);\n\n\t\t\t})\n\t\t;\n\n\t}\n\n\tfunction bindEvents(){\n\n\t\tsearchForm.addEventListener('submit', function(e){\n\t\t\tprevent(e);\n\n\t\t\tif(this[0].value === \"\"){\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tthis[0].blur();\n\t\t\tthis.dataset.firstload = \"false\";\n\n\t\t\twindow.history.pushState({}, 'CineList | ' + this[0].value, '?place=' + this[0].value);\n\n\t\t\tlocationSubmitted(this[0].value);\n\n\t\t}, false);\n\n\t\tgeoTrigger.addEventListener('click', function(e){\n\t\t\tprevent(e);\n\t\t\tconsole.log(e);\n\n\t\t\thome.dataset.visible = \"false\";\n\t\t\tsearchForm[0].value = \"\";\n\t\t\tsearchForm.dataset.firstload = \"false\";\n\n\t\t\tresetDayOffsetButtons();\n\t\t\tdayOffsetButtons[0].classList.add('activeDay');\n\n\t\t\twindow.__cinelist.working.icon('working');\n\t\t\twindow.__cinelist.working.update('Figuring out where you are...');\n\t\t\twindow.__cinelist.working.show();\n\t\t\tdayoffsetContainer.dataset.active = \"false\";\n\n\t\t\tdayoffsetContainer.dataset.active = \"false\";\n\n\t\t\tgetGeolocation()\n\t\t\t\t.then(function(data){\n\t\t\t\t\tconsole.log(data);\n\t\t\t\t\twindow.__cinelist.working.update('Working out which cinemas are near you...');\n\t\t\t\t\tgetCinemasAndTimesFromGeolocation(data.coords.latitude, data.coords.longitude, 0)\n\t\t\t\t\t\t.then(function(cinemasWithTimes){\n\t\t\t\t\t\t\tconsole.log(cinemasWithTimes);\n\t\t\t\t\t\t\ttimesContainer.innerHTML = \"\";\n\t\t\t\t\t\t\ttimesContainer.appendChild(generateViewFromData(cinemasWithTimes, 0));\n\t\t\t\t\t\t\twindow.__cinelist.working.hide();\n\t\t\t\t\t\t\tdayoffsetContainer.dataset.active = \"true\";\n\t\t\t\t\t\t})\n\t\t\t\t\t;\n\n\t\t\t\t})\n\t\t\t\t.catch(function(err){\n\t\t\t\t\tconsole.log(err);\n\t\t\t\t\twindow.__cinelist.working.update('Sorry - CineList couldn\\'t find your location');\n\n\t\t\t\t\tsetTimeout(function(){\n\t\t\t\t\t\twindow.__cinelist.working.hide();\n\t\t\t\t\t}, 4000);\n\n\t\t\t\t})\n\t\t\t;\n\n\t\t}, false);\n\n\t}\n\n\tbindEvents();\n\n\t(function(){\n\t\tvar days = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];\n\t\tvar today = new Date().getDay();\n\n\t\tdayOffsetButtons.forEach(function(offsetBtn){\n\n\t\t\tvar offset = parseInt(offsetBtn.dataset.offset);\n\t\t\tvar dayInt = offset + today;\n\n\t\t\tif(dayInt >= days.length){\n\t\t\t\tdayInt = dayInt - 7;\n\t\t\t}\n\n\t\t\tif(offset === 0){\n\t\t\t\toffsetBtn.textContent = 'Today';\n\t\t\t} else if(offset === 1){\n\t\t\t\toffsetBtn.textContent = 'Tomorrow';\n\t\t\t} else {\n\t\t\t\toffsetBtn.textContent = days[dayInt];\n\t\t\t}\n\n\t\t\toffsetBtn.addEventListener('click', function(e){\n\t\t\t\tprevent(e);\n\n\t\t\t\tresetDayOffsetButtons();\n\n\t\t\t\toffsetBtn.classList.add('activeDay');\n\n\t\t\t\tvar dateOffset = parseInt(this.dataset.offset);\n\t\t\t\tconsole.log(dateOffset);\n\n\t\t\t\tvar appropriateSearch = currentLocationIsPostcode ? getCinemasAndTimesFromPostcode : getCinemasAndTimesFromLocation;\n\t\t\t\t\n\t\t\t\twindow.__cinelist.working.icon('working');\n\t\t\t\twindow.__cinelist.working.update('Getting ' + days[dayInt] + ' times for local cinemas');\n\t\t\t\twindow.__cinelist.working.show();\n\n\t\t\t\tappropriateSearch(currentLocation, parseInt(this.dataset.offset))\n\t\t\t\t\t.then(function(cinemasWithTimes){\n\t\t\t\t\t\tconsole.log(cinemasWithTimes);\n\t\t\t\t\t\ttimesContainer.innerHTML = \"\";\n\t\t\t\t\t\ttimesContainer.appendChild(generateViewFromData(cinemasWithTimes, dateOffset));\n\t\t\t\t\t\twindow.__cinelist.working.hide();\n\t\t\t\t\t\tdayoffsetContainer.dataset.active = \"true\";\n\t\t\t\t\t})\n\t\t\t\t\t.catch(function(err){\n\n\t\t\t\t\t\twindow.__cinelist.working.icon('error');\n\t\t\t\t\t\twindow.__cinelist.working.update('Sorry - something went wrong getting your times');\n\n\t\t\t\t\t\tsetTimeout(function(){\n\t\t\t\t\t\t\twindow.__cinelist.working.hide();\n\t\t\t\t\t\t}, 4000);\n\n\t\t\t\t\t})\n\t\t\t\t;\n\n\t\t\t}, false);\n\n\t\t});\n\n\t})();\n\n\t(function(){\n\n\t\tvar queryString = window.location.search;\n\t\tvar queryParameters = {};\n\n\t\tqueryString.slice(1).split('&').forEach( function(keyPair){\n\t\t\tvar split = keyPair.split('=');\n\t\t\tqueryParameters[split[0]] = split[1];\n\t\t});\n\n\t\tconsole.log(queryParameters);\n\n\t\tif(queryParameters.place !== undefined){\n\t\t\tsearchForm[0].value = decodeURIComponent( queryParameters.place.replace('/', '') );\n\t\t\tlocationSubmitted(queryParameters.place);\n\t\t}\n\n\t})();\n\n\tconsole.log('Initialised');\n\n}());\n","output":"str","x":435,"y":240,"wires":[["66fc158.8d674ec"]]},{"id":"31b5f63.1faec0a","type":"function","z":"d7f421c3.87cf2","name":"Set Content Type","func":"\nmsg.headers = {\n \"Content-Type\" : \"application/javascript\"\n};\n\nreturn msg;","outputs":1,"noerr":0,"x":660,"y":120,"wires":[["c8db0462.894fd8"]]},{"id":"70a720e7.ee4e","type":"debug","z":"d7f421c3.87cf2","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"true","targetType":"full","x":620,"y":75,"wires":[]},{"id":"ecdc9d24.33dad","type":"http in","z":"d7f421c3.87cf2","name":"","url":"/cinelist/manifest.json","method":"get","upload":false,"swaggerDoc":"","x":215,"y":180,"wires":[["11121466.8cd66c"]]},{"id":"11121466.8cd66c","type":"template","z":"d7f421c3.87cf2","name":"Manifest","field":"payload","fieldType":"msg","format":"handlebars","syntax":"mustache","template":"{\n \"name\": \"CineList\",\n \"short_name\": \"CineList\",\n \"start_url\": \"/index.html?homescreen=1\",\n \"display\": \"standalone\",\n \"icons\": [{\n \"src\": \"/icon/144.png\",\n \"sizes\": \"144x144\",\n \"type\": \"image/png\"\n },\n {\n \"src\": \"/icon/400.png\",\n \"sizes\": \"400x400\",\n \"type\": \"image/png\"\n }],\n \"background_color\": \"#FFFFFF\",\n \"theme_color\": \"#000000\",\n \"description\" : \"Cinema websites are rubbish. CineList makes it easy to get local cinema showtimes across the UK.\"\n}","output":"str","x":435,"y":180,"wires":[["dc1c5799.761bd8"]]},{"id":"dc1c5799.761bd8","type":"function","z":"d7f421c3.87cf2","name":"Set Content Type","func":"\nmsg.headers = {\n \"Content-Type\" : \"application/json\"\n};\n\nreturn msg;","outputs":1,"noerr":0,"x":660,"y":180,"wires":[["c8db0462.894fd8"]]}] |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment