Good afternoon,
Thank you for your amazing work. I would like to start off with an apology
if I just missed the answer. I have spent the better part of two days
trying to get a setInterval(function() {}, 1000); to work in an element and
I get undefined is not a function. I have tried many different ways to set
this up, including stand alone functions. I have checked out the Google
community, stackTrace, and the web in general and have not found anything
yet. I do try to be exhaustive in my searching before bothering the dev's
with anything. My conclusion is either A) I'm missing something
elementary.. or B) using timers is something that should be in the pages
main JS file and not inside a polymer element or C) something my
retaliative noob butt is completely unaware of.. below is my code.. please
be gentle its ugly and i've been trying everything i can..
thanks again, i really appreciate this amazing thing you have given the
world..
<link rel="import"
href="bower_components/paper-progress/paper-progress.html">
<link rel="import" href="bower_components/paper-button/paper-button.html">
<polymer-element name="x-news" attribute="artTitle author word words
index">
<template>
<style>
:host {
position: absolute;
width: 100%;
height: 100%;
box-sizing: border-box;
}
#core_card {
position: absolute;
width: 450px;
height: 290px;
border-top-left-radius: 2px;
border-top-right-radius: 2px;
border-bottom-right-radius: 2px;
border-bottom-left-radius: 2px;
box-shadow: rgba(0, 0, 0, 0.0980392) 0px 2px 4px, rgba(0, 0, 0,
0.0980392) 0px 0px 3px;
left: 60px;
top: 30px;
background-color: rgb(255, 255, 255);
}
#newsWord {
margin: 30px 0px;
}
#newsControls {
bottom: 0px;
margin-bottom: 10px;
}
#articleProgress {
margin: 25px 0px;
}
</style>
<core-card id="core_card" layout vertical center>
<h1 id="newsTitle">{{ artTitle }}</h1>
<h5 id="newsAuthor">{{ author }}</h5>
<p id="newsWord">{{ word }}</p>
<div id="newsControls" layout vertical center>
<paper-progress value="5" ratio="5"
id="articleProgress"></paper-progress>
<div id="controlsContainer" layout horizontal center>
<paper-button label="{{ playStateLbl }}" id="btnPlay"
on-tap="{{togglePlay}}"></paper-button>
<paper-button label="Faster" id="btnFaster"
on-tap="{{faster}}"></paper-button>
<paper-button label="Slower" id="btnSlower"
on-tap="{{slower}}"></paper-button>
</div>
</div>
</core-card>
</template>
<script>
Polymer('x-news', {
playStateLbl: 'Play',
playState: false,
artTitle: 'Prez underage dog is pregnant',
author: 'wiggles mc wiggle',
word: 'better',
words: ['the', 'quick', 'brown', 'fox', 'jumped', 'over', 'the',
'lazy', 'dog'],
index: 0,
tmr : null,
ready: function () {
this.artTitle = 'Prez underage dog is pregnant';
this.author = 'wiggles mc wiggle';
this.word = 'better';
this.words = ['the', 'quick', 'brown', 'fox', 'jumped', 'over',
'the', 'lazy', 'dog'];
this.speed = 1000;
this.index = 0;
},
attributeChanged: function (attr, oVal, nVal) {},
togglePlay: function() {
this.playState = !this.playState;
this.playStateLbl = this.playState ? "Pause" : "Play";
if(this.playState) {
tmr = setInterval(function(word, words, index) {
this.word = this.words[this.index];
index++;
if(index === words.length) index = 0;
}, 1000);
} else {
this.clearInterval(this.tmr);
}
},
nextWord: function(word, words, index) {
console.log('nextWord()...');
this.word = this.words[this.index];
this.index++;
if(this.index === this.words.length) this.index = 0;
},
//setInterval: function(nextWord(this.word, this.words,
this.index), 1000),
faster: function() { this.speed += 20; console.log('speed.. ' +
this.speed); },
slower: function() { this.speed -= 20; console.log('speed.. ' +
this.speed); },
});
</script>
</polymer-element>
Follow Polymer on Google+: plus.google.com/107187849809354688692
---
You received this message because you are subscribed to the Google Groups
"Polymer" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To view this discussion on the web visit
https://groups.google.com/d/msgid/polymer-dev/CA%2B%3DLiB%3DdRtYe-XyAH57fhEDiNuRRx4PqRv8i3JPdNqiE2oTo%3DQ%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.
