Commit 31dd8f4e authored by Gautam Chitnis's avatar Gautam Chitnis

Fix(2/2) (playlist): Playlist 'play' function fixed

This commit fixes the issue of the playlist module where selected item from playlist would not play in main interface.

Gautam C.
parent 3f0336c3
......@@ -56,11 +56,12 @@
<h1 style="color: black; padding-left: 5%;">Playlist</h1>
</div>
<div id="playlist" style="background-color: white;">
<ol type="1">
<li v-for="item in this.$parent.playlistItems">
<button v-on:click="this.$parent.play(item.src, item.id)" class="playlistItem">{{ item.title }}</button>
</li>
</ol>
<ol type="1">
<li v-for="item in this.$parent.playlistItems">
<!--<button v-on:click="tempFunc(item.src, item.id)" class="playlistItem">{{ item.title }}</button>-->
<button v-on:click="play(item.src, item.id)" class="playlistItem">{{ item.title }}</button>
</li>
</ol>
</div>
<div class="playlistNavMobile" id="mobilePlaylistNavButton">
Playlist
......
......@@ -36,4 +36,10 @@ export function setVideo(videoSrc, type, id)
}],
poster: "assets/vlc.png"
});
}
export function playItem(src, id)
{
setVideo(src,'video/mp4', id);
player[0].play();
}
\ No newline at end of file
import { bus } from '../../services/bus.service.js';
import { sendCommand } from '../../services/command.service.js';
import { player, playItem } from '../player/plyr.methods.js';
let playlistData;
Vue.component('playlist', {
template: '#playlist-template',
......@@ -9,6 +12,7 @@ Vue.component('playlist', {
},
removeItem: function(id) {
this.$parent.playlistItems.splice({ id: id });
sendCommand(1);
},
openPlaylist: function() {
document.getElementById("playlistNav").style.width = "60%";
......@@ -19,12 +23,22 @@ Vue.component('playlist', {
document.getElementById("mobilePlaylistNavButton").style.width = "10%";
},
populatePlaylist: function(jData) {
for (var i = 0; i < jData[0].children[0].children.length; i++) {
this.addItem(jData[0].children[0].children[i].id, jData[0].children[0].children[i].name, jData[0].children[0].children[i].src);
if(jData)
{
playlistData = jData;
}
if(playlistData)
{
for (var i = 0; i < playlistData[0].children[0].children.length; i++) {
this.addItem(playlistData[0].children[0].children[i].id, playlistData[0].children[0].children[i].name, playlistData[0].children[0].children[i].src);
}
}
},
refreshPlaylist: function() {
sendCommand(1);
},
play: function (src, id) {
playItem(src,id);
}
},
created: function() {
......@@ -53,7 +67,7 @@ Vue.component('playlist', {
});
$(document).click(function(e) {
var container = $("#playlistNav");
let container = $("#playlistNav");
if($(window).width() <= 480 && !container.is(e.target) && container.has(e.target).length === 0 && container.css("width") != "0px"){
bus.$emit('closePlaylist');
......
import { plyrInit, player } from '../components/player/plyr.methods.js';
import { plyrInit } from '../components/player/plyr.methods.js';
import { notifyBus } from './bus.service.js';
export let app;
......@@ -26,20 +26,25 @@ $(function() { // Handler for .ready() called.
$('#mobilePlaylistNavButton').on('click',function (e){
notifyBus("openPlaylist");
});
$('#plItem').on('click',function (e){
//notifyBus("");
//console.log(item.src, item.id);
console.log(e);
});
});
export function vueInit()
function vueInit()
{
app = new Vue({
el: '#app',
data: {
playlistItems: []
},
methods: {
play: function (msg, id) {
setVideo(msg,'video/mp4', id);
player[0].play();
}
}
});
}
function tempFunc(a,b)
{
console.log("in tempFunc");
console.log(a,b);
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment