From 375b62cd152c034067e45999c349574c668fe6bc Mon Sep 17 00:00:00 2001 From: amber Date: Mon, 27 Jul 2020 15:11:05 +0530 Subject: [PATCH] added video for teacher --- src/pages/Common/CoursesSideBar.vue | 2 +- src/pages/Dashboard/ChapterInfo.vue | 4 +- src/pages/Dashboard/CourseDetails.vue | 2 +- src/pages/Dashboard/LiveOnlineClass.vue | 178 +++++++++++++++++++------------- 4 files changed, 108 insertions(+), 78 deletions(-) diff --git a/src/pages/Common/CoursesSideBar.vue b/src/pages/Common/CoursesSideBar.vue index 5e5f3e6..8cfec5b 100644 --- a/src/pages/Common/CoursesSideBar.vue +++ b/src/pages/Common/CoursesSideBar.vue @@ -22,7 +22,7 @@ -
+
- + @@ -102,7 +102,7 @@ - + diff --git a/src/pages/Dashboard/CourseDetails.vue b/src/pages/Dashboard/CourseDetails.vue index 618e42f..3001c93 100644 --- a/src/pages/Dashboard/CourseDetails.vue +++ b/src/pages/Dashboard/CourseDetails.vue @@ -87,7 +87,7 @@ -
+
{{studentBtn}} Session hasnt started yet
- +
@@ -75,11 +75,11 @@ round class="open-dialog-button" dark - @click="createRoom($route.query.classId)" - >{{startLiveSession}} + @click="startChat()" + >Start Session
- +
@@ -106,7 +106,7 @@ import CoursesSideBar from "@/pages/Common/CoursesSideBar.vue"; export default { mixins: [AllApiCalls], components: { - CoursesSideBar + CoursesSideBar, }, data() { return { @@ -116,36 +116,36 @@ export default { // DATA TABLE search: "", pagination: { - rowsPerPage: 10 + rowsPerPage: 10, }, liveOnlineHeaders: [ { text: "Playback", value: "attachementUrl", sortable: false, - align: "center" + align: "center", }, { text: "Meeting", align: "center", sortable: false, - value: "" + value: "", }, { text: "Recording", value: "", sortable: false, - align: "center" + align: "center", }, { text: "Description Preview", value: "", sortable: false, - align: "center" + align: "center", }, { text: "Date", value: "", sortable: false, align: "center" }, { text: "Duration", value: "", sortable: false, align: "center" }, - { text: "Toolbar", value: "", sortable: false, align: "center" } + { text: "Toolbar", value: "", sortable: false, align: "center" }, ], liveOnlineItems: [], @@ -153,19 +153,41 @@ export default { liveLink: "", token: "", selectStudents: {}, - classRules: [v => !!v || " Class Name is required"], - sectionRules: [v => !!v || " Section Name is required"], + classRules: [(v) => !!v || " Class Name is required"], + sectionRules: [(v) => !!v || " Section Name is required"], addclass: [], addSection: [], loading: false, room: "", username: "", - roomPassword: "" + roomPassword: "", + counter: 0, }; }, methods: { + startChat() { + if (this.$store.state.role === "PARENT") { + let div = document.getElementById("jitsi-container"); + var parent = div.parentNode; + var clone = div.cloneNode(true); + clone.id = "jitsi-container"; + parent.replaceChild(clone, div); + // div.replaceWith(input.val('').clone(true)); + this.studentClasses(); + } + if (this.$store.state.role === "TEACHER") { + let div = document.getElementById("jitsi-container"); + var parent = div.parentNode; + var clone = div.cloneNode(true); + clone.id = "jitsi-container"; + parent.replaceChild(clone, div); + // div.replaceWith(input.val('').clone(true)); + this.createRoom(); + } + }, // JITSI CONTAINER startConference() { + console.log("yes session started"); var _this = this; try { const domain = "meet.intrack.in"; @@ -203,14 +225,14 @@ export default { "feedback", "stats", "shortcuts", - "tileview" - ] + "tileview", + ], }, configOverwrite: { - disableSimulcast: false + disableSimulcast: false, }, teacherName: "", - romm: "" + romm: "", }; this.api = new JitsiMeetExternalAPI(domain, options); @@ -240,20 +262,22 @@ export default { createRoom(classId) { this.showLoader = true; var classId = { - classId: classId + classId: classId, }; http() .post("/createLiveClasses", { classId: this.$route.query.classId, courseId: this.$route.query.courseId, - chapterId: this.$route.query.chapterId + chapterId: this.$route.query.chapterId, }) - .then(response => { + .then((response) => { // this.addSection = response.data.data; console.log("CREATE___ROOOM", response.data); - this.room = response.data.data.LiveClasses.roomName; + this.room = response.data.data.roomName; + // this.username = response.data.data.LiveClasses.teacherName; - this.roomPassword = response.data.data.LiveClasses.password; + this.roomPassword = response.data.data.password; + var this_ = this; if (this.username != "" || this.room != "") { if (window.JitsiMeetExternalAPI) { @@ -268,74 +292,80 @@ export default { this.startConference(); } else alert("Jitsi Meet API script not loaded"); } + console.log("bazinga"); this.showLoader = false; }) - .catch(err => { + .catch((err) => { this.showLoader = false; }); - } - }, - - mounted() { - this.token = this.$store.state.token; - }, - async created() { - /* getLiveClassesesList - To up date line under heading*/ - let response = await this.getLiveClassesesList({ - classId: this.$route.query.classId, - courseId: this.$route.query.courseId, - chapterId: this.$route.query.chapterId - }); - console.log("response getLiveClassesesList- ", response); + }, + async studentClasses() { + /* getLiveClassesesList - To up date line under heading*/ + let response = await this.getLiveClassesesList({ + classId: this.$route.query.classId, + courseId: this.$route.query.courseId, + chapterId: this.$route.query.chapterId, + }); + console.log("response getLiveClassesesList- ", response); - /* CHECK RESPONSE TO ASSIGN MESSAGE INSIDE BUTTON */ - if (response.data.data.length == 0) { - this.startLiveSession = "Start Session"; - this.studentBtn = ""; - } else { - this.liveLink = response.data.data[0].link; - this.room = response.data.data[0].roomName; - this.username = response.data.data[0].teacherId.name; - this.roomPassword = response.data.data[0].password; - // this.room = response.data.data[0].roomName; - var this_ = this; - console.log(this.room, this.roomPassword, this.username); + /* CHECK RESPONSE TO ASSIGN MESSAGE INSIDE BUTTON */ + if (response.data.data.length == 0) { + this.startLiveSession = "Start Session"; + this.studentBtn = ""; + } else { + this.liveLink = response.data.data[0].link; + this.room = response.data.data[0].roomName; + this.username = response.data.data[0].teacherId.name; + this.roomPassword = response.data.data[0].password; + // this.room = response.data.data[0].roomName; + var this_ = this; + console.log(this.room, this.roomPassword, this.username); - // // this.username = response.data.data.LiveClasses.teacherName; - // this.roomPassword = response.data.data[0].password; - // var this_ = this; - if (this.username != "" || this.room != "") { - if (window.JitsiMeetExternalAPI) { - // var person = prompt("Please enter your name:", "Rabie"); - if (this_.username != null || this_.username != "") { - this.username = this.username; + // // this.username = response.data.data.LiveClasses.teacherName; + // this.roomPassword = response.data.data[0].password; + // var this_ = this; + if (this.username != "" || this.room != "") { + if (window.JitsiMeetExternalAPI) { + // var person = prompt("Please enter your name:", "Rabie"); + if (this_.username != null || this_.username != "") { + this.username = this.username; + } + // var room = prompt("Please enter your room:", "Test Room"); + if (this_.room != null || this_.room != "") { + this.room = this.room; + } + this.startConference(); } - // var room = prompt("Please enter your room:", "Test Room"); - if (this_.room != null || this_.room != "") { - this.room = this.room; - } - // this.startConference(); } - } - if (response.data.data[0].sessionStatus == "ENDED") { - this.startLiveSession = "Start Session"; - this.studentBtn = ""; - } - if (response.data.data[0].sessionStatus == "STARTED") { - this.startLiveSession = "Join Session"; - this.studentBtn = "Join Session"; + if (response.data.data[0].sessionStatus == "ENDED") { + // this.startLiveSession = "Start Session"; + this.studentBtn = ""; + } + if (response.data.data[0].sessionStatus == "STARTED") { + // this.startLiveSession = "Join Session"; + this.studentBtn = "Join Session"; + } } + }, + }, + + mounted() { + this.token = this.$store.state.token; + }, + async created() { + if (this.$store.state.role === "PARENT") { + this.studentClasses(); } /* getStudentCourses - to get courseData - defined in GetApis.js*/ if (this.$store.state.role === "PARENT") { await this.getStudentCourses({ classId: localStorage.getItem("parentClassId"), - studentId: localStorage.getItem("parentStudentId") + studentId: localStorage.getItem("parentStudentId"), }); } - } + }, };