how to override flowplayer onError message - javascript

I have the following js. If the flv url doesn't exist the onError function is called which is great.
However currently it displays the alert and then proceeds to display an unfriendly error message. How can i override this message with something more user friendly.
$f(videoid, "/swf/flowplayer-3.1.5.swf", {
playlist: list1,
wmode: 'opaque',
plugins: {
gatracker: {
url: "/swf/flowplayer.analytics-3.1.5.swf",
trackingMode: "Bridge",
debug: false
}
},
onError: function(err) {
alert('Error Code: ' + err);
}
});

You should also be sure to set the player property showErrors to false. That way the ugly boxy error won't show up in the video player frame.

Not really sure what you had in mind but you could do something like this.
Place this where you want your error message to show
<div id="errorbox"></div>
Paste this in your CSS
#errorbox{
color: #D8000C;
border: 2px solid #D8000C;
background-color: #FFBABA;
}
And change the javascript to this
$f(videoid, "/swf/flowplayer-3.1.5.swf", {
playlist: list1,
wmode: 'opaque',
plugins: {
gatracker: {
url: "/swf/flowplayer.analytics-3.1.5.swf",
trackingMode: "Bridge",
debug: false
}
},
onError: function(err) {
$('#errorbox').text('Your error message.... '+ err).fadeIn('fast');
}
});
What this will do is make an error message show up where ever you pasted that HTML in a nice user friendly way. Hope this helps, but it's hard to know exactly what you mean.

Related

react-admin-import-csv customize success notification

In my react-admin application I am using react-admin-import-csv to import CSV files. When the import is with errors I do something like:
notify(`importError`, { type: 'error', messageArgs: { error: resultMessage }, multiLine: true })
throw new Error(errors);
This works fine and I get an error notification as expected.
But when the import is successful and I do something like:
notify(`importSuccess`, { type: 'success', messageArgs: { success: success }, multiLine: true, autoHideDuration:3000});
return;
The result is that my success notification is hidden right away by react-admin-import-csv default notification.
The only workaround that I found is throwing a "success error" instead of a simple return. It shows the success notification successfully but with an error in the console:
Is there a cleaner way to achieve this?
I do not recommand throwing a "success" error because when you do so you don't let react-admin-import-csv finish its work properly.
The best I could do is to internationalize the success message like the following:
en: {
csv: {
dialogImport: {
alertClose: "result.importSuccessLib",
title: "Importation of users",
},
dialogCommon: {
subtitle: "Importation of %{count} element(s) from %{fileName}",
}
}
}
Then I have:
en: {
result: {
importSuccessLib: 'File imported successfully'
}
}
I hope it can help someone.

WebRTC channelMessage not recieving first message

When sending a message using WebRTC sendDirectlyToAll, the message is never recieved the first time, but every time after that.
I've stripped the code down to a very simple state now, but it's still the same. Anyone got a clue about why this is happening?
Here is the code:
var webrtc = new SimpleWebRTC({
localVideoEl: 'localVideo',
remoteVideosEl: 'remoteVideos',
autoRequestMedia: false,
media: {
video: true,
audio: false
},
localVideo: {
autoplay: true,
mirror: true,
muted: true
}
});
$("#chat-send-button").on("click", function (e) {
sendMessage();
});
function sendMessage() {
console.log("sendMessage");
const chatMessage = $("#chat-message-input");
webrtc.sendDirectlyToAll(
"chat",
"info", {
"chatmessage": chatMessage.val()
}
)
chatMessage.val("");
}
webrtc.on("channelMessage", function (peer, channel, data) {
console.log(peer);
console.log(channel);
console.log("data", data);
$("#chat-message-container").text(data.payload.chatmessage);
});
You probably need for the WebRTC connection to be established before allowing the user to send a message - do you make use of the readyToCall event described in the documentation https://github.com/SimpleWebRTC/SimpleWebRTC#3-tell-it-to-join-a-room-when-ready
(a link to an editable runable code snippet might help)

Flowplayer: Cannot read property 'play' of undefined

I am using this function to show few live webcams:
function loadWebcam_with_flowplayer($w_name, $w_url) {
$(".forecastdate").html($w_name);
$('#extern').one("load", function(){}).html('');
flowplayer('#extern', {
splash: true,
ratio: 9/16,
clip: {
live: true,
hlsjs: {
safari: true,
listeners: ["hlsError"],
bufferWhilePaused: false,
},
sources: [
// path to the HLS m3u8
{ type: "application/x-mpegurl", src: $w_url},
]
}
});
The problem is that when I call it with the first name and url it works, but from there on if I call again the function with another url, I always get a blank page and this console error message:
Uncaught TypeError: Cannot read property 'play' of undefined
at flowplayer.min.js:6
I think I should close the previous instance before launching another, or similar actions, but I am lost as this is the first time I use flowplayer.
Thanks for any hint.

Siesta Ext JS test not completing

I am testing an Ext JS frontend with Siesta.
Here is my login/logout test:
StartTest(function(t) {
t.diag("Login/Logout");
t.chain(
{ waitForCQ : '#loginPanel' },
function(next) {
t.cq1("#username").setValue();
t.cq1("#password").setValue();
next();
},
{ click: '>> #username' },
{ type: '******', target : '>> #username' },
{ type: '******', target : '>> #password' },
{ click: '>> #loginButton' },
{ waitForCQ: '#mainView' },
{ click: '>> #logoutButton' },
{ waitForCQ: 'messagebox #ok' },
function(next) {
t.waitForEvent(Ext.globalEvents, 'logoutComplete', function () {});
next();
},
{ click : '>> messagebox #ok' },
function() {
t.done();
}
);
});
The test inputs the username and password into the login panel, then clicks the login button. After the main view is loaded, it logs off.
For some reason, this test never finishes.
Every action in the chain is successful, but the test is still stuck running.
How can I fix this?
I am using siesta-3.0.2-lite with ExtJS 5.1.0.
1# First you can try to remove t.done() , it's not generally needed in the tests, unless you are really waiting for it. needDone in the harness settings has default value False.
2# You are using waitForEvent, this is usually done when you pass the callback there. So your function would look like this:
function(next) {
t.waitForEvent(Ext.globalEvents, 'logoutComplete', next);
},
But if you just want to know that the event was fired, you can use function firesOnce . Don't forget that you need to register checking the event before executing the actions which triggers it.
So your code could look like this:
function(next) {
t.firesOnce(Ext.globalEvents, 'logoutComplete','Logout completed!');
next();
},
{ click: '>> #logoutButton' },
{ waitForCQ: 'messagebox #ok' },
{ click : '>> messagebox #ok' },
But I have never used Ext.globalEvents to check the events, so I am not sure if it works.
Siesta developers on the forum suggested to solve this by setting overrideSetTimeout to false in your harness config.
Harness.configure({
...
overrideSetTimeout: false,
...
});
Siesta overrides the native "setTimeout" from the context of each test for asynchronous code tracking, but it seems to cause issues.
It worked for many users on the forum, tell me if it works for you, because it did not solve my issues.
Update:
The problem on my side turned out to be due to the logout itself, which uses window.location.reload(). This makes the browser act if there are two separate pages/applications.
Apparently, you need to set separateContext option in harness object to true. This option is available only in Standard (Commercial) package.

Flowplayer disable autoplay with OVA

I have a problem which is probably easy to solve but i has not yet found a solution. I try to initialize Flowplayer with the OVA (Ad management) plugin. If I set the parameter "autoPlay" = false on a clip the player won't autoplay on initialization. Just as I wan't it. However, if I have, let's say a pre-roll, managed by the OVA plugin it will play once you hit the Play button. But once the pre-roll has finished the main clip won't autoplay. The user has to hit "Play" again.
So the question is: How do I use Flowplayer with OVA and the player shouldn't autoplay until the user hits "Play" but once a pre-roll (or any other ad) has played it should continue to the next clip?
flowplayer( "elementID", "flowplayer.commercial-3.2.15.swf",
{
clip:
{
url: "video.mp4",
autoPlay: false
},
plugins:
{
ova:
{
url: "ova.swf",
ads:
{
schedule:
[
{
position: "pre-roll",
server:
{
type: "direct",
tag: "vast.url"
}
}
]
}
}
}
}
);
Maybe it's too late for a response, but for the ones visiting this post henceforth, the answer is to put autoPlay:false inside the "ova" object, instead of the "clip" one:
ova: {
url: "ova.swf",
autoPlay: false,
// ----- "general" options here -----
}

Categories