|
| 1 | +<!doctype html> |
| 2 | +<html ng-app="ESPiN"> |
| 3 | + <head> |
| 4 | + <meta charset="utf-8"> |
| 5 | + <title>ESPiN</title> |
| 6 | + <link href="css/style.css" rel="stylesheet"> |
| 7 | + <style> |
| 8 | + [ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak { |
| 9 | + display: none !important; |
| 10 | + } |
| 11 | + </style> |
| 12 | + <link href='http://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700' rel='stylesheet' type='text/css'> |
| 13 | + </head> |
| 14 | + <body> |
| 15 | + <header id="header" class="header" role="banner"> |
| 16 | + <div class="header__text"> |
| 17 | + <p>ESPN meets <a href="http://www.pinterest.com/">Pinterest.com</a></p> |
| 18 | + </div> |
| 19 | + </header> |
| 20 | + |
| 21 | + <!-- Setup + Pinterest SDK Snippet --> |
| 22 | + <script> |
| 23 | + var header = document.getElementById('header'); |
| 24 | + var angularApp = '<main class="main" role="main"><div ng-view class="flex"></div></main>'; |
| 25 | + |
| 26 | + function pLogin(header, angularApp) { |
| 27 | + PDK.login({scope : 'read_public, write_public, read_relationships, write_relationships'}, function(session) { |
| 28 | + if (session && Object.keys(session).length) { |
| 29 | + var img = document.getElementById('login'); |
| 30 | + var login = document.getElementById('plogin'); |
| 31 | + document.body.removeChild(img); |
| 32 | + document.body.removeChild(login); |
| 33 | + header.insertAdjacentHTML('afterend', angularApp); |
| 34 | + } |
| 35 | + }); |
| 36 | + } |
| 37 | + |
| 38 | + window.pAsyncInit = function() { |
| 39 | + PDK.init({ |
| 40 | + appId: "4792305714320118814", |
| 41 | + cookie: true |
| 42 | + }); |
| 43 | + |
| 44 | + var session = PDK.getSession(); |
| 45 | + var imgIndex = Math.floor(Math.random() * 5) + 1; |
| 46 | + var img = '<img id="login" src="images/' + imgIndex + '.jpg"/>'; |
| 47 | + var login = '<button id="plogin" onclick="pLogin()">Login with Pinterest</button>'; |
| 48 | + |
| 49 | + header.insertAdjacentHTML( |
| 50 | + 'afterend', |
| 51 | + !!session ? |
| 52 | + angularApp : |
| 53 | + img + login); |
| 54 | + }; |
| 55 | + |
| 56 | + (function(d, s, id){ |
| 57 | + var js, pjs = d.getElementsByTagName(s)[0]; |
| 58 | + if (d.getElementById(id)) {return;} |
| 59 | + js = d.createElement(s); js.id = id; |
| 60 | + js.src = "https://assets.pinterest.com/sdk/sdk.js"; |
| 61 | + pjs.parentNode.insertBefore(js, pjs); |
| 62 | + }(document, 'script', 'pinterest-jssdk')); |
| 63 | + </script> |
| 64 | + |
| 65 | + <!-- Vendor libraries --> |
| 66 | + <script src="lib/jquery-v1.11.1.js"></script> |
| 67 | + <script src="lib/angular-v1.2.22.js"></script> |
| 68 | + <script src="lib/angular-route-v1.2.22.js"></script> |
| 69 | + <script src="lib/angular-sanitize-v1.2.22.js"></script> |
| 70 | + <!-- Application Files --> |
| 71 | + <script src="js/app.js"></script> |
| 72 | + </body> |
| 73 | +</html> |
0 commit comments