Skip to content

Commit 076f9db

Browse files
prateekjadhwaniprateekjadhwani
committed
First Iteration with Dynamic content
1 parent 169b07d commit 076f9db

File tree

7 files changed

+59
-17
lines changed

7 files changed

+59
-17
lines changed

‎app/content.json‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
[
2+
{
3+
"title": "53: Diving into Angular 2",
4+
"title2": "53: Diving into Angular 2"
5+
},
6+
{
7+
"title": "53: Diving into Angular 2",
8+
"title2": "53: Diving into Angular 2"
9+
}
10+
]

‎app/elements/elements.html‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,8 @@
1414
<link rel="import" href="../bower_components/iron-pages/iron-pages.html">
1515
<link rel="import" href="../bower_components/iron-selector/iron-selector.html">
1616
<link rel="import" href="../bower_components/iron-image/iron-image.html">
17+
<link rel="import" href="../bower_components/iron-ajax/iron-ajax.html">
18+
<link rel="import" href="../bower_components/iron-localstorage/iron-localstorage.html">
1719

1820
<!-- Paper elements -->
1921
<link rel="import" href="../bower_components/paper-drawer-panel/paper-drawer-panel.html">

‎app/elements/new-episode/new-episode.html‎

Lines changed: 27 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -18,28 +18,46 @@
1818
position: absolute;
1919
bottom: 0;
2020
}
21+
.episode-info {
22+
padding: 50px;
23+
}
2124
</style>
2225
<template>
23-
<h1>New Episode Page</h1>
24-
<p>New Episode Page</p>
25-
<p>New Episode Page</p>
26-
<p>New Episode Page</p>
27-
<p>New Episode Page</p>
28-
<p>New Episode Page</p>
26+
<iron-localstorage name="content" value="{{localstoragecontent}}" autoSaveDisabled="true"></iron-localstorage>
27+
<paper-material class="episode-info" elevation="0">
28+
<h1>{{content.title}}</h1>
29+
<p>New Episode Page</p>
30+
<p>New Episode Page</p>
31+
<p>New Episode Page</p>
32+
<p>New Episode Page</p>
33+
<p>New Episode Page</p>
34+
</paper-material>
2935
<div class="playerloc">
3036
<podcast-player
31-
src="http://traffic.libsyn.com/thewebplatform/episode-53_diving-into-angular-2.mp3"
37+
src="../../episode-53_diving-into-angular-2.mp3"
3238
name="Diving into Angular 2"
3339
coverart="http://assets.libsyn.com/content/9454132"
3440
episode="53"></podcast-player>
3541
</div>
36-
3742
</template>
3843
</dom-module>
3944
<script>
4045
( function() {
4146
Polymer({
42-
is: 'new-episode'
47+
is: 'new-episode',
48+
properties: {
49+
localstoragecontent: {
50+
type: Object,
51+
observer: '_updateContent'
52+
},
53+
content: {
54+
type: Object,
55+
value: []
56+
}
57+
},
58+
_updateContent: function () {
59+
this.content = this.localstoragecontent[0];
60+
}
4361
});
4462
})();
4563
</script>

‎app/elements/routing.html‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@
1212
<script>
1313
window.addEventListener('WebComponentsReady', function() {
1414

15-
// We use Page.js for routing. This is a Micro
15+
// We use Page.js for routing. This is a Micro
1616
// client-side router inspired by the Express router
1717
// More info: https://visionmedia.github.io/page.js/
1818
page('/', function () {
@@ -36,6 +36,5 @@
3636
page({
3737
hashbang: true
3838
});
39-
4039
});
4140
</script>

‎app/index.html‎

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -57,13 +57,17 @@
5757

5858
<body unresolved class="fullbleed layout vertical">
5959
<span id="browser-sync-binding"></span>
60-
<template is="dom-bind" id="app">
6160

61+
<template is="dom-bind" id="app">
6262
<paper-header-panel main mode="standard" class="tall">
63-
63+
<iron-ajax id="contentservice"
64+
auto
65+
url="content.json"
66+
handle-as="json"
67+
on-response="handleContentResponse"></iron-ajax>
6468
<!-- Main Toolbar -->
6569
<paper-toolbar id="mainToolbar" class="tall layout vertical">
66-
70+
6771
<span class="flex"></span>
6872

6973
<!-- Toolbar icons -->

‎app/scripts/app.js‎

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,9 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
1313
// Grab a reference to our auto-binding template
1414
// and give it some initial binding values
1515
// Learn more about auto-binding templates at http://goo.gl/Dx1u2g
16-
var app = document.querySelector('#app');
16+
var app = document.querySelector('#app'),
17+
content = [];
18+
1719

1820
app.displayInstalledToast = function() {
1921
document.querySelector('#caching-complete').show();
@@ -38,4 +40,9 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
3840
}
3941
};
4042

43+
// For Content service
44+
app.handleContentResponse = function(e, detail) {
45+
content = e.detail.response;
46+
localStorage.setItem("content", JSON.stringify(content));
47+
};
4148
})(document);

‎bower.json‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -24,10 +24,12 @@
2424
"neon-elements": "PolymerElements/neon-elements#1.0.0",
2525
"page": "visionmedia/page.js#~1.6.3",
2626
"universal-footer": "*",
27-
"podcast-player": "~1.0.1",
27+
"podcast-player": "~1.0.5",
2828
"iron-image": "PolymerElements/iron-image#~1.0.2",
2929
"paper-tabs": "PolymerElements/paper-tabs#~1.0.1",
30-
"paper-button": "PolymerElements/paper-button#~1.0.3"
30+
"paper-button": "PolymerElements/paper-button#~1.0.3",
31+
"iron-ajax": "PolymerElements/iron-ajax#~1.0.3",
32+
"iron-localstorage": "PolymerElements/iron-localstorage#~1.0.4"
3133
},
3234
"devDependencies": {
3335
"web-component-tester": "*",

0 commit comments

Comments
 (0)