christofsteel/syng-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Compare commits

base: christofsteel:main
Branches Tags
christofsteel:main
christofsteel:touch-move
christofsteel:notification
christofsteel:better_error
christofsteel:waiting-room
..
compare: christofsteel:touch-move
Branches Tags
christofsteel:main
christofsteel:touch-move
christofsteel:notification
christofsteel:better_error
christofsteel:waiting-room

No commits in common. "main" and "touch-move" have entirely different histories.
main ... touch-move

9 changed files with 15 additions and 67 deletions
Show stats Expand all files Collapse all files

54
src/App.vue
View file

@ -94,11 +94,6 @@ function waitingRoomToQueue(uuid) {
state.socket.emit("waiting-room-to-queue", {"uuid": uuid})
}
function queueToWaitingRoom(uuid) {
console.log(uuid)
state.socket.emit("queue-to-waiting-room", {"uuid": uuid})
}
function append(entry) {
checked_append_with_name(entry, state.value.name)
}
@ -189,44 +184,15 @@ function skip(uuid) {
}
function registerSocketEvents() {
state.socket = io(state.value.server,
{
auth: {
type: "web",
room: state.value.room,
secret: state.value.secret,
}
}
)
state.socket = io(state.value.server)
state.socket.on("search-results", (results) => {
state.value.searching = false
state.value.search.searchResults = results.results
})
state.socket.on("disconnect", (reason) => {
console.warn("Disconnected from server")
state.value.joined = false
state.value.join_msg = "Disconnected from server, please check your connection and try again."
})
state.socket.on("connect", () => { joinRoom() })
state.socket.on("connect_error", (err) => {
console.warn("Connection error:", err.message);
state.value.joined = false;
state.value.join_msg = "<strong>No such room!</strong> <br/>" +
"Please use the correct room code your organizer provided you.<br/>" +
"To host your own syng powered karaoke events, please download and " +
"install <a href='https://github.com/christofsteel/syng' target='_blank'>Syng</a>"
})
state.socket.io.on("reconnect", () => { joinRoom() })
state.socket.io.on("reconnect_error", () => {
state.value.joined = false;
})
state.socket.on("admin", (is_admin) => {
console.log("Admin status: " + is_admin)
state.value.admin = is_admin
})
state.socket.on("state", (val) => {
state.value.queue=val.queue
@ -287,14 +253,7 @@ function registerSocketEvents() {
function joinRoom() {
console.log("Joining room " + state.value.room)
localStorage.name = state.value.name
localStorage.server = state.value.server
localStorage.room = state.value.room
localStorage.secret = state.value.secret
localStorage.uid = state.value.uid
state.value.joined = true
router.push({name: "room", params: {room: state.value.room}})
/* state.socket.emit("register-web", {"room": state.value.room}, (response) => {
state.socket.emit("register-web", {"room": state.value.room}, (response) => {
if(response === true) {
localStorage.name = state.value.name
localStorage.server = state.value.server
@ -313,9 +272,12 @@ function joinRoom() {
"Please use the correct room code your organizer provided you.<br/>" +
"To host your own syng powered karaoke events, please download and " +
"install <a href='https://github.com/christofsteel/syng' target='_blank'>Syng</a>"
state.socket.disconnect()
if(state.value.joined) {
state.socket.disconnect()
setTimeout(() => connect(), 2000)
}
}
}) */
})
}
</script>
@ -333,7 +295,6 @@ function joinRoom() {
@moveUp="moveUp"
@moveTo="moveTo"
@waitingRoomToQueue="waitingRoomToQueue"
@queueToWaitingRoom="queueToWaitingRoom"
/>
<DesktopLayout
v-show="!state.is_small"
@ -346,7 +307,6 @@ function joinRoom() {
@moveUp="moveUp"
@moveTo="moveTo"
@waitingRoomToQueue="waitingRoomToQueue"
@queueToWaitingRoom="queueToWaitingRoom"
/>
<WelcomeReveal
v-if="!state.joined"

3
src/components/DesktopLayout.vue
View file

@ -4,7 +4,7 @@ import QueueDesktop from './QueueDesktop.vue'
import RecentDesktop from './RecentDesktop.vue'
const props = defineProps(['state']);
const emit = defineEmits(['update:searchTerm', 'search', 'append', 'skip', 'skipCurrent', 'moveUp', 'waitingRoomToQueue', 'queueToWaitingRoom', 'moveTo'])
const emit = defineEmits(['update:searchTerm', 'search', 'append', 'skip', 'skipCurrent', 'moveUp', 'waitingRoomToQueue', 'moveTo'])
</script>
@ -21,7 +21,6 @@ const emit = defineEmits(['update:searchTerm', 'search', 'append', 'skip', 'skip
@moveTo="(data) => $emit('moveTo', data)"
@skipCurrent="$emit('skipCurrent')"
@waitingRoomToQueue="(uuid) => $emit('waitingRoomToQueue', uuid)"
@queueToWaitingRoom="(uuid) => $emit('queueToWaitingRoom', uuid)"
/>
<RecentDesktop :recent="state.recent" :admin="state.admin" />
</div>

8
src/components/Entry.vue
View file

@ -1,7 +1,7 @@
<script setup>
import { computed } from 'vue'
const props = defineProps(['admin', 'entry', 'current', 'firstStartedAt', 'offset', 'currentTime', 'waitingRoom'])
const emits = defineEmits(['skip', 'skipCurrent', 'moveUp', 'waitingRoomToQueue', 'queueToWaitingRoom', 'moveTo'])
const emits = defineEmits(['skip', 'skipCurrent', 'moveUp', 'waitingRoomToQueue', 'moveTo'])
function skip() {
if(props.current) {
@ -156,12 +156,6 @@ const dragleave = (e) => {
<button v-if="!waitingRoom" class="button alert fright" @click="skip">
<font-awesome-icon icon="fa-solid fa-times" />
</button>
<button
class="button success fright"
v-if="!waitingRoom && !current"
@click="$emit('queueToWaitingRoom', entry.uuid)" >
<font-awesome-icon icon="fa-solid fa-arrows-down-to-line" />
</button>
<button
class="button success fright"
v-if="waitingRoom"

2
src/components/Footer.vue
View file

@ -13,7 +13,7 @@ const emits = defineEmits(['update:name', 'logout', 'config'])
{{ name }}
</span>
<div class="button alert fright" @click="$emit('logout')">Log out</div>
<!-- <div v-if="admin" class="button alert fright" @click="$emit('config')">Config</div> -->
<div v-if="admin" class="button alert fright" @click="$emit('config')">Config</div>
</footer>
</template>
<style scoped>

3
src/components/MobileLayout.vue
View file

@ -5,7 +5,7 @@ import RecentTab from './RecentTab.vue'
import TabHeader from './TabHeader.vue'
const props = defineProps(['state']);
const emit = defineEmits(['update:searchTerm', 'search', 'append', 'skip', 'skipCurrent', 'moveUp', 'waitingRoomToQueue', 'queueToWaitingRoom', 'moveTo'])
const emit = defineEmits(['update:searchTerm', 'search', 'append', 'skip', 'skipCurrent', 'moveUp', 'waitingRoomToQueue', 'moveTo'])
</script>
@ -29,7 +29,6 @@ const emit = defineEmits(['update:searchTerm', 'search', 'append', 'skip', 'skip
@moveTo="(data) => $emit('moveTo', data)"
@skipCurrent="$emit('skipCurrent')"
@waitingRoomToQueue="(uuid) => $emit('waitingRoomToQueue', uuid)"
@queueToWaitingRoom="(uuid) => $emit('queueToWaitingRoom', uuid)"
/>
<RecentTab :recent="state.recent" :admin="state.admin" />
</div>

3
src/components/QueueDesktop.vue
View file

@ -2,7 +2,7 @@
import QueueInner from './QueueInner.vue'
const props = defineProps(['queue', 'waiting_room', 'admin', 'waiting_room_policy']);
const emits = defineEmits(['skip', 'skipCurrent', 'moveUp', 'waitingRoomToQueue', 'queueToWaitingRoom', 'moveTo'])
const emits = defineEmits(['skip', 'skipCurrent', 'moveUp', 'waitingRoomToQueue', 'moveTo'])
</script>
<template>
@ -18,7 +18,6 @@ const emits = defineEmits(['skip', 'skipCurrent', 'moveUp', 'waitingRoomToQueue'
@moveTo="(data) => $emit('moveTo', data)"
@skipCurrent="$emit('skipCurrent')"
@waitingRoomToQueue="(uuid) => $emit('waitingRoomToQueue', uuid)"
@queueToWaitingRoom="(uuid) => $emit('queueToWaitingRoom', uuid)"
/>
</div>
</template>

3
src/components/QueueInner.vue
View file

@ -3,7 +3,7 @@ import { onMounted, reactive } from 'vue'
import Entry from './Entry.vue'
const props = defineProps(['queue', 'waiting_room', 'admin', 'waiting_room_policy']);
const emits = defineEmits(['skip', 'skipCurrent', 'moveUp', 'waitingRoomToQueue', 'queueToWaitingRoom', 'moveTo'])
const emits = defineEmits(['skip', 'skipCurrent', 'moveUp', 'waitingRoomToQueue', 'moveTo'])
let currentTime = reactive({time: Date.now()})
@ -44,7 +44,6 @@ function offset(index) {
@skipCurrent="$emit('skipCurrent')"
@moveUp="(uuid) => $emit('moveUp', uuid)"
@moveTo="(data) => $emit('moveTo', data)"
@queueToWaitingRoom="(uuid) => $emit('queueToWaitingRoom', uuid)"
/>
</ul>
<div v-show="waiting_room_policy" class="header">Waiting room</div>

3
src/components/QueueTab.vue
View file

@ -2,7 +2,7 @@
import QueueInner from './QueueInner.vue'
const props = defineProps(['queue', 'waiting_room', 'admin', 'waiting_room_policy']);
const emits = defineEmits(['skip', 'skipCurrent', 'moveUp', 'waitingRoomToQueue', 'queueToWaitingRoom', 'moveTo'])
const emits = defineEmits(['skip', 'skipCurrent', 'moveUp', 'waitingRoomToQueue', 'moveTo'])
</script>
<template>
@ -16,7 +16,6 @@ const emits = defineEmits(['skip', 'skipCurrent', 'moveUp', 'waitingRoomToQueue'
@moveUp="(uuid) => $emit('moveUp', uuid)"
@skipCurrent="$emit('skipCurrent')"
@waitingRoomToQueue="(uuid) => $emit('waitingRoomToQueue', uuid)"
@queueToWaitingRoom="(uuid) => $emit('queueToWaitingRoom', uuid)"
@moveTo="(data) => $emit('moveTo', data)"
/>
</div>

3
src/main.js
View file

@ -6,7 +6,7 @@ import App from './App.vue'
import Main from './Main.vue'
import { library } from '@fortawesome/fontawesome-svg-core'
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
import { faMagnifyingGlass, faList, faChair, faArrowUp, faHistory, faPlus, faStepForward, faTimes, faArrowsUpToLine, faArrowsDownToLine } from '@fortawesome/free-solid-svg-icons'
import { faMagnifyingGlass, faList, faChair, faArrowUp, faHistory, faPlus, faStepForward, faTimes, faArrowsUpToLine } from '@fortawesome/free-solid-svg-icons'
import { faYoutube } from '@fortawesome/free-brands-svg-icons'
import 'foundation-sites/dist/css/foundation.min.css'
@ -21,7 +21,6 @@ library.add(faTimes)
library.add(faArrowUp)
library.add(faChair)
library.add(faArrowsUpToLine)
library.add(faArrowsDownToLine)
window.jQuery = jquery;
window.$ = jquery;