Expo av-player seamless gapless loop crossfade - javascript

Based on my experience and research, the out-of-the-box AV players for both Android and iOS do not fully support gapless/seamless looping. There is always a noticable gap when setting the isLooping=true on any of them. I have only been able to get this to seamlessly work on Android using the SoundPool, but that is only for small sound files, not large mp3's.
Currently, i wrote a solution that "semi-works" for iOS, but the weird thing is that it does not work on Android. I would guess they should at least be consistent?
Also, I'm interested if anyone could help solve this age-old problem of looping sounds in the most effective way possible where the user does not notice a gap. This cross fader idea is out of the box and maybe someone can help improve on it. I also opened a discussion on the expo forum and will update here if anything comes from there.
Here is the repo: https://github.com/happyruss/expo-fader-loop
Any suggestions on solving the issue would be awesome. It's also a fun simple project for someone trying out react-native/expo

Related

Ignore accessibility settings for Cordova app

The answer that is posted everywhere is to use this with the associated plugin:
if (window.MobileAccessibility) {
window.MobileAccessibility.usePreferredTextZoom(false);
}
But that doesn't work. The plugin isn't maintained and it has zero effect on the app display in Android 10. I really need to figure out how to ignore the screen zoom setting of the device and display the app normally. Any help would be greatly appreciated.
P.S. please don't leave a comment just to say that this isn't a good idea. I respect your opinion, but I am asking for a solution to my problem, not your thoughts on the problem.

Any possible method to detect click on cross-domain iframe on mobile?

been a few weeks trying different ways to detect a cross-domain iframe click on mobile without success.
I have tried all that has come through, all plugins, all forum tips, and yet i can't get a way to do it.
I coded whatever way i through will work and i got no positive results.
Some plugins are working on newest phones like s6/7 (maybe for other older phones too?) using blur events but i need a reliable solution that will work with most to date phones.
Maybe there is a workaround with touchstart function for mobile..
I lost my chances into believing that there's a way to do it so today i am asking here maybe someone figured it out.
Thank you.
Ps this is a demo of a plugin called iframetracker.
Can someone tell me if it works on old mobiles? http://cdn.rawgit.com/vincepare/iframeTracker-jquery/master/demo/index.html
The answer in short is No.
Regarding your plugin, on the github, it states very clearly:
About mobile devices
This plugin doesn't work on mobile devices such as smartphones and tablets, because this hardware uses a touchscreen instead of a mouse as click input. This design makes the boundary monitoring trick useless
This is why you won't find a solution for your issue.
There is no known work around for your particular problem with touch screen devices.

transparent canvas video Safari issues

I'd like to build a website with a small start animation which should support transparency.
I found this small tutorial that is working great: http://www.sciencelifeny.com/transparency/transparency.html
It is based on a video that shows both the RGB channel and the alpha channel. In the JS application, the video data is read, merged and rendered to a canvas element.
I implemented this solution and it works in Chrome and FF, but not in Safari.
Here is my implementation: https://github.com/niels-garve/canvas-video
Can someone please have a look and help me with this? That would be so great! I am at a loss and need help.
I tried a few things:
I thought that creating the HTML structure by using document.createElement expressions would crash Safari, but it doesn't seem like that.
Also the 2D context is working well. I tried to render a simple square on canvas, which was working out well in Safari. It seems it doesn't like the video data?
I will try to document my code on GitHub this weekend, but I really followed the instructions in the above tutorial.
I would be so glad if someone helped me out with this. Thank you so much in advance!
Cheers
Niels
I deployed my solution on the development environment I'm working with, where the animation is running well on Safari. So I guess there's something wrong with my local websever configurations.
Cheers
Niels

Hitting major dip in performance on mobile devices serving website, even when served locally

Alright, I'm at the end of my tether with this one. I've hosted the site at: http://loudcolor.com/brands/yolancris.html if anybody's willing to lend a hand.
The website is very heavy on image content, and has extensive use of some js/jquery plugins to bolster the user experience, which of course ain't worth a damn thing if you can't even scroll the site!
I don't seem to have any issues on desktop versions of the site. Webkit and firefox seem to be working pretty consistently. Though, whenever I load the site up on a touch device (iPhone/iPad) whether via ghosting (wifi and Adobe Edge inspect) or over a server the performance lag is huge, the thing won't even scroll. I appreciate that the site is heavy on image size - but I'm using lazy loading extensively to shave a lot of that off. With the exception of the home page, no page exceeds an initial load of ~300k.
Any help is greatly appreciated. I've been banging my head against a wall till the early hours now. If you guys need any further resources or details just let me know. Thanks.
Kyle
Just in case anyone else runs across a similar issue. The problems were the following:
• I had a container set to
overflow: auto;
• Which combined with a:
$(window).resize();
on a touch and scroll event ended up being a recipe for disaster - or in this case, really buggy scrolling on a touch device.
Hope this helps somebody. Happy coding ;)

dragging object from html page using (using javascript) into a flash container?

I am doing some pre-production on a project that requires drawing on a 3d canvas, which I think flash is the best way to go. But there is a chance down the line that this client might want the site to show up on the ipad, iphone or other mobile devices that don't support flash.
So I was playing with the idea of doing everything in html and javascript except for the actual drawing/3D area. Almost like using flash as the element. I think html5 is too premature to start using this, but might be beneficial down the line. Chances are I will just go the entire flash route, but I thought it would be interesting to try.
Anyway, my question is pretty top level. 1) how hard would it be to drag an object from an html page using javascript, and dropping it into the flashplayer. And then manipulating it from there.
Are there any examples out there that have tried to do this?
Communication between Flash and an HTML page requires the use of ExternalInterface. That's a good place to start. These guys seem to have figured out some of the details.
As far as the iPad and iPhone are concerned, Flash just ain't gonna happen.
However, I don't think it's fair to say HTML5 is "too premature". Lots of people are doing lots of cool things with the canvas element. You could too. :)

Categories

Resources