<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 in queue" v-on:click="clickedTweet" class="tweet" :data-tweet-id="tweet.tweet_id">
|
|
<div class="mission" :data-mission-id="tweet.mission_id">{{ 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"></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);
|
|
}
|
|
})
|
|
.listen('TweetClaimedEvent', (e) => {
|
|
this.removeTweetFromQueue(e.tweet_id);
|
|
});
|
|
|
|
}.bind(this));
|
|
},
|
|
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) {
|
|
console.log("Removing item at index "+queueIndex);
|
|
var removed = this.queue.splice(queueIndex, 1);
|
|
return removed[0];
|
|
}
|
|
},
|
|
clickedTweet(event) {
|
|
var tweet_id;
|
|
if($(event.target).data('tweet-id')) {
|
|
tweet_id = $(event.target).data('tweet-id')
|
|
} else {
|
|
tweet_id = $(event.target).parents(".tweet").data('tweet-id');
|
|
}
|
|
|
|
var tweet_data = this.removeTweetFromQueue(tweet_id);
|
|
|
|
if(tweet_data) {
|
|
console.log(tweet_data);
|
|
|
|
// Mark this as claimed
|
|
$.post('/dashboard/claim-tweet', {
|
|
tweet_id: tweet_id
|
|
}, function(response) {
|
|
});
|
|
|
|
// Load in the scorecard viewer
|
|
this.tweet = tweet_data;
|
|
this.show = true;
|
|
|
|
} else {
|
|
console.log("Tweet not found: "+tweet_id);
|
|
}
|
|
},
|
|
dismissTweet() {
|
|
console.log('caught event')
|
|
|
|
// Mark as un-claimed
|
|
$.post('/dashboard/claim-tweet', {
|
|
tweet_id: this.tweet.tweet_id,
|
|
status: 'unclaimed'
|
|
}, function(response){
|
|
});
|
|
|
|
this.tweet = {};
|
|
this.show = false;
|
|
}
|
|
},
|
|
created() {
|
|
this.loadQueue();
|
|
}
|
|
}
|
|
</script>
|