You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

132 lines
3.6 KiB

<template>
<div class="container">
<div class="row">
<div class="col-xs-4 col-md-4">
<div class="panel panel-default">
<div class="panel-heading">Queue</div>
<div class="panel-body tweet-queue">
<div v-for="(tweet, index) in queue" v-on:click="clickedTweet(index)" class="tweet">
<div class="mission">{{ tweet.mission }}</div>
<div class="profile">
<img :src="tweet.player_photo" :style="'border-color: #'+tweet.team_color">
<span>@{{ tweet.player_username }}</span>
</div>
<div class="text">{{ tweet.text }}</div>
</div>
</div>
</div>
</div>
<div class="col-xs-8 col-md-8">
<scorecard :show.sync="show" :tweet="tweet" v-on:dismiss="dismissTweet" v-on:complete="completedTweet"></scorecard>
</div>
</div>
</div>
</template>
<script>
module.exports = {
data () {
return {
queue: [],
tweet: {},
show: false
}
},
methods: {
loadQueue () {
$.get('/dashboard/queue', function(tweets){
for(var i in tweets.queue) {
this.queue.push(tweets.queue[i]);
}
// Listen for new items on the queue
Echo.channel('tweet-queue')
.listen('NewTweetEvent', (e) => {
if(this.findTweetInQueue(e.tweet_id) === false) {
this.queue.push(e);
// If the new tweet is one that timed out, dismiss it
if(this.show && this.tweet.tweet_id == e.tweet_id) {
this.tweet = {};
this.show = false;
}
}
})
.listen('TweetClaimedEvent', (e) => {
this.removeTweetFromQueue(e.tweet_id);
});
}.bind(this));
},
dashboardPing() {
setTimeout(function(){
$.get('/dashboard/ping', function(){
this.dashboardPing();
}.bind(this));
}.bind(this), 15000);
},
findTweetInQueue(tweet_id) {
var queueIndex = false;
for(var i in this.queue) {
if(parseInt(this.queue[i].tweet_id) == parseInt(tweet_id)) {
queueIndex = i;
}
}
return queueIndex;
},
removeTweetFromQueue(tweet_id) {
var queueIndex = this.findTweetInQueue(tweet_id);
if(queueIndex !== false) {
var removed = this.queue.splice(queueIndex, 1);
return removed[0];
}
},
clickedTweet(tweet_index) {
// If another tweet was already open, dismiss that first
if(this.show) {
this.dismissTweet();
}
var tweet_data = this.queue[tweet_index];
var tweet_id = tweet_data.tweet_id;
if(tweet_data) {
// Mark this as claimed
$.post('/dashboard/claim-tweet', {
tweet_id: tweet_id
}, function(response) {
});
this.removeTweetFromQueue(tweet_id);
// Load in the scorecard viewer
this.tweet = tweet_data;
this.show = true;
} else {
console.log("Tweet not found: "+tweet_id);
}
},
dismissTweet() {
this.queue.push(this.tweet);
// Mark as un-claimed
$.post('/dashboard/claim-tweet', {
tweet_id: this.tweet.tweet_id,
status: 'unclaimed'
}, function(response){
});
this.tweet = {};
this.show = false;
},
completedTweet() {
this.tweet = {};
this.show = false;
}
},
created() {
this.loadQueue();
this.dashboardPing();
}
}
</script>