I am using JS to hide and show a flash video object at various stages in a flow. The function works perfectly in all browsers including Safari 5.1 on OSX 10.6, but does not work on Safari 5.1.3, 5.1.4 and 5.1.5 on OSX 10.7. It repositions on the page but remains visible.
You can see the issue here.
Any help really appreciated!
Embed code:
var swfVersionStr="10.2.0";
var xiSwfUrlStr="/video/expressInstall.swf";
var flashvars={
sToken:"#{#stream_name}",
sSWFPath: "/video/Recorder.swf",
sConfigPath: "#{current_recorder_config_file}"
};
var params={
bgcolor:"#FFFFFF",
allowfullscreen:"true",
allownetworking:"all",
allowscriptaccess:"always",
base:".",
devicefont:"false",
menu:"false",
play:"true",
quality:"high",
salign:"tl",
scale:"showall",
seamlesstabbing:"false",
swliveconnect:"true",
wmode:"window"
};
var attributes={
id:"Recorder",
name:"Recorder"
};
swfobject.embedSWF("/video/Recorder.swf", "flashContent", "384", "318", swfVersionStr, xiSwfUrlStr, flashvars, params, attributes);
JS for Hide and Show:
function hideVideo() {$('.step_video, #flashContent').css({visibility:'hidden', height:1})}
function showVideo() {$('.step_video, #flashContent').css({visibility:'visible', height:'auto'})}
Already had this bug before you shouldn't hide it, it's a bug with flash.
My workaround was :
position: absolute;
left: -5000px;
Related
I am working on a React Native app that displays HTML content using the react-native-render-html library. This HTML data is coming from content formatted in WordPress. The same content is also being displayed in the web app made with ReactJS. I am also using this iframe plugin, as recommended by the render-html library, to display the iframes in my HTML.
I have the following problem with rendering Twitch video embeds.
The Twitch embeds are in this format:
<iframe src="https://clips.twitch.tv/embed?clip=ShortHelpfulSquirrelCmonBruh-hWj49qxBfx-VKseO&autoplay=false&parent=my.parent.domain" width="640px" height="360px" frameborder="0" scrolling="no" allowfullscreen="true"></iframe>
Please note that these are not live streams, but clips. The ReactJS website displays these embeds correctly with the thumbnail:
With the same embed code, however, my React Native app displays the embed without the thumbnail but with just a black background (although it shows the title and controls):
Once I play and pause the video, the background does not remain black, however:
Here is the rendererProp that I am passing to the library for iframes:
iframe: {
scalesPageToFit: true,
webViewProps: {
scrollEnabled: false,
mediaPlaybackRequiresUserAction: true,
javaScriptEnabled: true,
domStorageEnabled: true,
userAgent: Platform.select({
ios: "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_6) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.1.2 Safari/605.1.15",
android: "Chrome/56.0.0.0 Mobile android",
}),
},
}
I am passing the IframeRenderer and iframeModel as imported directly from #native-html/iframe-plugin (linked at the beginning) into the renderers and customHTMLElementModels props of the <RenderHtml/> component. Also I am using the WebView from react-native-webview lib.
My team and I cannot figure out why the thumbnail is not appearing in the react-native-webview, but works fine in the website. If anyone has any experience rendering Twitch video iframe embeds on react-native-webview, please take a look. Any help will be appreciated.
I'm using IBM Worklight 6.2
I'm using window.open to load some external pages for OAuth and I configure event listeners for the opened window.
var authWindow = window.open(authUrl, '_blank', 'location=yes');
authWindow.addEventListener('loaderror', function(e) {
console.log(">> load error. event: " + JSON.stringify(e));
});
also for "load" and "loadstart" events.
This works in Android and iOS but when I preview the app in the "Mobile Browser Simulator" the eventListeners are not executed.
I have also tested creating a "desktopbrowser" application.
Any idea?
Loaderror, loadstart, and loadstop are specific to Cordova and not supported in the Mobile Browser Simulator. It would be best to test these on emulator or device. Please see: http://cordova.apache.org/docs/en/3.0.0/cordova_inappbrowser_inappbrowser.md.html#addEventListener
I am currently working on a project in titanium .I wish to open url in default browser of BB10
simulator instead of webview used in the app on click event .I am using the following code
var win =Ti.UI.createWindow({
title:'Test'
});
var webview=Ti.UI.createWebView({
url:"http://demo.php.otssolutions.com/videoapp-uat/home"
});
win.add(webview);
webview.addEventListener('click',function(e){
var url=e.url;
Ti.API.info(url);
Titanium.Platform.openURL("http://demo.php.otssolutions.com/videoapp-uat/home");
});
win.open();
Thanks in advance for any help
My camera code was working fine in WL 5.0.6 and the mobile browser simulator would correctly display the image. Now I moved to WL 6.0 andI get the following error when using the preview in the Mobile Browser Simulator and using the Cordova camera simulation to get a fake picture.
I am using Chrome for the preview.
Not allowed to load local resource: file:///C:/Users/Administrator/cordova/internal/sim/camera/camera1_m.jpg wljq.js:2374
The code is similar to this
navigator.camera.getPicture(onSuccess, onFail, { quality: 50,
destinationType: Camera.DestinationType.FILE_URI });
Note that if I use the DATA_URL, it seems OK with the mobile browser simulator. Just the FILE_URI doesn't seem to be working with the mobile browser simulator.
The Worklight 6.0 Mobile Browser Simulator supports Cordova 2.6 APIs. For navigator.camera.getPicture the following destination types can be used in WL 6.0:
Camera.DestinationType = {
DATA_URL : 0, // Return image as base64 encoded string
FILE_URI : 1, // Return image file URI
NATIVE_URI : 2 // Return image native URI (eg. assets-library:// on iOS or content:// on Android)
};
Example:
navigator.camera.getPicture(
function(data) {
document.getElementById('camera_status').innerHTML = "Success: picture located at " + data;
var img = document.getElementById('camera_image');
img.style.display = "none";
},
function(e) {
console.log("Error getting picture: " + e);
document.getElementById('camera_status').innerHTML = "Error getting picture.";
},
{ quality: 50, destinationType: navigator.camera.DestinationType.FILE_URI, sourceType: navigator.camera.PictureSourceType.SAVEDPHOTOALBUM, encodingType: fileType});
Try clearing your browser cache and then be sure to accept the applet permission dialogue on Mobile Browser Simulator startup. Also make sure that your file permissions will allow transfer from the C:/Users//cordova/internal/sim/camera/ folder as that is where the applet stores the camera sim image content.
Cordova 2.6 Camera API reference:
http://docs.phonegap.com/en/2.6.0/cordova_camera_camera.md.html
Funny, that there is already a troubleshooting document for your problem.
http://www-01.ibm.com/support/docview.wss?uid=swg21614861
It looks like DATA_URL didnt work in WLv5, while (if you are right) FILE_URI is not working since WLv6.
I have tested the HTML5 video player, it can make HTML5 video fullscreen on Android Chrome browser but not Dolphin browser.
Is someone know what is the way to make HTML5 video fullscreen on Dolphin browser?
Thanks
Tested that jplayer can make HTML5 video in fullscreen, ever in Android 4.x default browser and Dolphin browser, the config should refer to below code:
$("#jquery_jplayer_1").jPlayer({
ready: function () {
$(this).jPlayer("setMedia", {
m4v: "demo.m4v"
});
},
swfPath: "js",
supplied: "webmv, ogv, m4v",
fullScreen: true
});