mirror of
https://github.com/advplyr/audiobookshelf.git
synced 2025-12-16 00:39:40 +00:00
Player track chapter tickmarks, highlight current chapter, progress filters, links in stream container
This commit is contained in:
parent
9e668bbf35
commit
c821ef424f
17 changed files with 109 additions and 33 deletions
|
|
@ -1,5 +1,14 @@
|
|||
<template>
|
||||
<button class="btn outline-none rounded-md shadow-md relative border border-gray-600" :disabled="disabled || loading" :type="type" :class="classList" @click="click">
|
||||
<nuxt-link v-if="to" :to="to" class="btn outline-none rounded-md shadow-md relative border border-gray-600" :disabled="disabled || loading" :class="classList">
|
||||
<slot />
|
||||
<div v-if="loading" class="text-white absolute top-0 left-0 w-full h-full flex items-center justify-center text-opacity-100">
|
||||
<!-- <span class="material-icons animate-spin">refresh</span> -->
|
||||
<svg class="animate-spin" style="width: 24px; height: 24px" viewBox="0 0 24 24">
|
||||
<path fill="currentColor" d="M12,4V2A10,10 0 0,0 2,12H4A8,8 0 0,1 12,4Z" />
|
||||
</svg>
|
||||
</div>
|
||||
</nuxt-link>
|
||||
<button v-else class="btn outline-none rounded-md shadow-md relative border border-gray-600" :disabled="disabled || loading" :type="type" :class="classList" @click="click">
|
||||
<slot />
|
||||
<div v-if="loading" class="text-white absolute top-0 left-0 w-full h-full flex items-center justify-center text-opacity-100">
|
||||
<!-- <span class="material-icons animate-spin">refresh</span> -->
|
||||
|
|
@ -13,6 +22,7 @@
|
|||
<script>
|
||||
export default {
|
||||
props: {
|
||||
to: String,
|
||||
color: {
|
||||
type: String,
|
||||
default: 'primary'
|
||||
|
|
|
|||
|
|
@ -113,7 +113,6 @@ export default {
|
|||
this.currentSearch = null
|
||||
},
|
||||
clickedOption(e, item) {
|
||||
var newValue = this.input === item ? null : item
|
||||
this.textInput = null
|
||||
this.currentSearch = null
|
||||
this.input = this.textInput ? this.textInput.trim() : null
|
||||
|
|
|
|||
|
|
@ -180,7 +180,7 @@ export default {
|
|||
submitForm() {
|
||||
if (!this.textInput) return
|
||||
|
||||
var cleaned = this.textInput.toLowerCase().trim()
|
||||
var cleaned = this.textInput.trim()
|
||||
var matchesItem = this.items.find((i) => {
|
||||
return i === cleaned
|
||||
})
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div ref="box" class="tooltip-box" @mouseover="mouseover" @mouseleave="mouseleave">
|
||||
<div ref="box" @mouseover="mouseover" @mouseleave="mouseleave">
|
||||
<slot />
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -51,8 +51,9 @@ export default {
|
|||
createTooltip() {
|
||||
if (!this.$refs.box) return
|
||||
var tooltip = document.createElement('div')
|
||||
tooltip.className = 'absolute px-2 bg-black bg-opacity-90 py-1 text-white pointer-events-none text-xs rounded shadow-lg'
|
||||
tooltip.className = 'absolute px-2 py-1 text-white pointer-events-none text-xs rounded shadow-lg max-w-xs'
|
||||
tooltip.style.zIndex = 100
|
||||
tooltip.style.backgroundColor = 'rgba(0,0,0,0.75)'
|
||||
tooltip.innerHTML = this.text
|
||||
|
||||
this.setTooltipPosition(tooltip)
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue