Coder Social home page Coder Social logo

Comments (9)

niubility000 avatar niubility000 commented on July 22, 2024

Also, in iphone, when I try to pause, it get stuck.

from vue-audio-visual.

staskobzar avatar staskobzar commented on July 22, 2024

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.

niubility000 avatar niubility000 commented on July 22, 2024

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.

staskobzar avatar staskobzar commented on July 22, 2024

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.

niubility000 avatar niubility000 commented on July 22, 2024

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.

staskobzar avatar staskobzar commented on July 22, 2024

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.

niubility000 avatar niubility000 commented on July 22, 2024

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.

staskobzar avatar staskobzar commented on July 22, 2024

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.

niubility000 avatar niubility000 commented on July 22, 2024

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)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo 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.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.