Comments (9)
Also, in iphone, when I try to pause, it get stuck.
from vue-audio-visual.
this is not enough information to identify and reproduce the problem. Which plugin? What code? Both problems are on iphone?
Vue 2 is not maintained anymore but problem what you describe is a core audio playback functionality and should be working as any other playback.
Unfortunatelly, I do not have iphone to try or reproduce it.
I can try to fix it if you provide more infromation or, even the best, some console errors or exceptions
from vue-audio-visual.
this is not enough information to identify and reproduce the problem. Which plugin? What code? Both problems are on iphone? Vue 2 is not maintained anymore but problem what you describe is a core audio playback functionality and should be working as any other playback. Unfortunatelly, I do not have iphone to try or reproduce it. I can try to fix it if you provide more infromation or, even the best, some console errors or exceptions
Thank you very much for your instant reply.
Just try this:
filebrowser.zip
Unzip it (It's a windows version filebrower I modified), and put some mp3 files in the same folder with filebrowser.exe, and double click filebrowser.exe, visit it at 127.0.0.1:8080 in your browser with admin:admin. and click a mp3 file to play. And pause and replay. you can reproduce the problem.
I just changed the preview.vue:
<div class="preview">
<transition
appear
:enter-active-class="animateIn"
:leave-active-class="animateOut"
:appear-active-class="animateIn"
>
<ExtendedImage v-if="req.type == 'image'" class="switchAnimation" :key="raw" :src="raw"></ExtendedImage>
<av-bars
class="switchAnimation"
:key="raw"
v-else-if="req.type == 'audio'"
caps-color="#FFF"
:bar-color="['#f00', '#ff0', '#0f0']"
canv-fill-color="#000"
:caps-height="4"
:audio-src="raw"
:canv-width= "400"
:cav-height="200"
:symmetric="false"
:fft-size="8192"
:brick-height="80"
></av-bars>
<video class="switchAnimation"
:key="raw"
...
in main.js:
import AudioVisual from "vue-audio-visual";
Vue.use(AudioVisual)
in package.json:
"vue-audio-visual": "^2.5.1",
I think this is the last verion for vue2.
from vue-audio-visual.
Sorry, I am not going to run any exe file and, besides, I am not using Windows.
It seems you are using too many wrappers and problem can be from anywhere.
Code inside <av-bars/>
seems to be quite usual but not clear what is inside "raw" variable.
May be you can check some kind of console in your app and check for errors or warning that can help?
As I said, the playback is just a usual <audio>
element and the plugin can not slow it down as it just reads audio data and use to draw the graphics.
from vue-audio-visual.
Or, just try this demo website with test:test
http://deleted/
The problem maybe not only from me. I found a comment mentioned this problem too: https://www.bilibili.com/video/BV1ML4y1t7MY/?spm_id_from=333.337.search-card.all.click&vd_source=ef1034ecaf582b017611a29def006413
from vue-audio-visual.
yes, I see now. It does going slower after pause/play on your website (using chrome).
However, seems to be working fine in firefox.
I tried your file (nice music btw) with plugin vue3 demo and it has no problem playing after the pause.
Will try to see with vue2 version and try to figure out.
BTW, did you try it with https certificate secure connection? It may have difference in chrome
from vue-audio-visual.
yes, I see now. It does going slower after pause/play on your website (using chrome). However, seems to be working fine in firefox.
I tried your file (nice music btw) with plugin vue3 demo and it has no problem playing after the pause. Will try to see with vue2 version and try to figure out.
BTW, did you try it with https certificate secure connection? It may have difference in chrome
Thank you for your patient test. I didn't try it with https. My tplink router's ddns service maybe don't support it.
from vue-audio-visual.
well, I could not find a source of the problem yet but it seems it is the case for <av-bars/>
plugin even with a basic settings in older v2 version of the plugin. So, it is not your code.
Also, it probably appeared recently as it was working before. Maybe some updates in webkit.
It works ok in new v3 version of the plugin.
I would recommend to update to vue3 and the latest version of the plugin.
I undestand that it is not easy to do for some applications. I will try to do more checks.
from vue-audio-visual.
well, I could not find a source of the problem yet but it seems it is the case for
<av-bars/>
plugin even with a basic settings in older v2 version of the plugin. So, it is not your code.Also, it probably appeared recently as it was working before. Maybe some updates in webkit.
It works ok in new v3 version of the plugin.
I would recommend to update to vue3 and the latest version of the plugin.
I undestand that it is not easy to do for some applications. I will try to do more checks.
Just take your time. and don't worried. The filebrowser project is moving to Vue3 slowly.
from vue-audio-visual.
Related Issues (20)
- AVBars bar coloring depending on bars x axis position
- AVWave wrong slider positioning on short audio HOT 7
- AVWave playtime fixed position HOT 2
- waveform overwrites another when 2 wavforms are on screen. HOT 9
- [Vue warn]: Missing ref owner context. ref cannot be used on hoisted vnodes. A vnode with ref must be created inside the render function. HOT 1
- How to set width of av-line width to 100%? HOT 2
- Hide controls? HOT 2
- Events playing, paused , how to emit them? HOT 2
- Extraneous non-props attributes (ref-link) HOT 1
- When AVWaveform's src uses ref variables, the waveform cannot be displayed normally HOT 5
- Help me!!! Why can firefox display normally but chrome cannot? HOT 6
- Failed to decode audio array buffer: DOMException: Failed to execute 'decodeAudioData' on 'BaseAudioContext': Unable to decode audio data HOT 2
- CDN ? HOT 1
- How do I use audio recorded by MediaRecorder?
- Option for change slider layout from right to left HOT 4
- The slider cannot be clicked after changing source.
- The wave color is not the same that I set HOT 1
- [Vue warn]: Invalid VNode type: Symbol(v-fgt) (symbol) HOT 5
- Tailwindcss support for colors HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from vue-audio-visual.