Catching jPlayer full screen event - jplayer

I'm trying to catch jPlayer full screen event using the following code:
mainPlayer.bind($.jPlayer.event.resize, function(event) {
alert("size changed");
});
But the event isn't fired neither when I press full screen button nor when I press ESC to exit full screen mode.

Check your mainPlayer variable and make sure it references the jQuery jPlayer object. For troubleshooting, try:
$('#yourJPlayerID').bind($.jPlayer.event.resize, function(event) {
alert("size changed");
});

Related

How to debug chrome extension at such part of code?

The code below is the JavaScript file works with popup.html from a small project.
I use it for chrome extension development learning.
The first part of this code piece is getting two variable from chrome storage, let's call it part1.
The second part is a button-click event function,Let's call it part2.
The button is on popup page and called "spend".
In part2, I can set a breakpoint2 on chrome debugger DevTools,when I click the button on popup page, it will stop at breakpoint2.
But when I place a Breakpoint1 at part1,the code will not stop at that line, even I add one more line "debugger;", the program will not stop there.
So my problem is how to make the debugger stop at places like breakpoint1?
The source code for the extension:https://drive.google.com/file/d/1odxJy9pGnovzox2yXH-6MDO03_T7QIDE/view?usp=sharing
//popup.js
$(function(){
chrome.storage.sync.get(['total','limit'],function(budget){
//Breakpoint1
$('#total').text(budget.total);
$('#limit').text(budget.limit);
});
$('#spendAmount').click(function(){
//Breakpoint2
chrome.storage.sync.get(['total', 'limit'],function(budget){
var newTotal = 0;
if (budget.total){
newTotal += parseInt(budget.total);
}
var amount = $('#amount').val();
if (amount){
newTotal += parseInt(amount);
}
chrome.storage.sync.set({'total': newTotal}, function(){
bla();
bla();
}
});
$('#total').text(newTotal);
$('#amount').val('');
});
});
});
Any assistance is highly appreciated,Thanks in advance.

How to tell if a window failed to close in Electron?

Is there a way in Electron to tell if a window was not successfully closed?
win.once("closed", () => {
// send message to the page running in the renderer process that the window was closed
});
win.close();
Assuming that I'm not cancelling the close in the close or beforeunload handler, can the window still fail to close, or can I be sure that a message will always be sent to the guest page?
I just came to this issue as well, what I did is simply wait for a few hundred milliseconds, if the callback is called, then most likely, this window has failed to close:
win.on('close', () => setTimeout(() => console.log('failed to close'), 300))
Have a look at this property in the doc:
win.closed
A Boolean that is set to true after the child window gets closed.
And this other bit too:
win.destroy()
Force closing the window, the unload and beforeunload
event won’t be emitted for the web page, and close event will also not
be emitted for this window, but it guarantees the closed event will be
emitted.
With that, you should have all the info you need to create a function that insure you that the window closes:
function forceClose(window) {
// try close first
window.close()
// force with destroy
if(!window.closed) {
window.destroy()
}
//just logging out the event
window.on('closed', (e) => {
console.log(e)
})
}
// in your code, instead of calling win.close()
forceClose(win)

Leaving fullscreen mode movie, it breaks navigation bar

I don't find solution to this problem.
I have tabgroup, on button click I open new window with movie. If I click fullscreen mode button, when I exit from this mode my navigation bar is broken (look attachment).
I have checked all my code but I don't understand what is the problem.
I think that I have this problem from sdk 5.0.0, before it worked fine.
On kitchen sink app works fine, but I'm not able to replicate it on my app.
function Video(_args) {
var self = Ti.UI.createWindow();
var activeMovie = Titanium.Media.createVideoPlayer({
url: _args.url,
backgroundColor:'#111',
mediaControlStyle:Titanium.Media.VIDEO_CONTROL_DEFAULT,
scalingMode:Titanium.Media.VIDEO_SCALING_ASPECT_FIT
});
self.add(activeMovie);
activeMovie.play();
self.addEventListener('close', function() {
LOG.info("Window closed");
activeMovie.stop();
});
return self;
};
module.exports = Video;
Open movie window
var Video = require('common/Video');
var winVideo = Video({url: videourl});
self.containingTab.open(winVideo);
before fullscreen mode
after fullscreen mode
Best regards
It's a known bug. Check the jira ticket here

Chrome extension delay condition

I have created a chrome extension which does something after its button is clicked.
However I dont want it be abused so I need the its code to be executed after some time.
How can I surround this code with a timeout in order to achieve this?
Thank you for reading me!
chrome.tabs.getSelected(null,function(tab) {
var Mp=tab.url.substring(0,23);
if(Mp=='https://www.example.com')
{
onWindowLoad();
chrome.extension.onMessage.addListener(function(request, sender) {
if (request.action == "getSource")
{
...Working here
}
});
}
else
{
message.innerHTML='<span style="color: #f00">This is not a valid page</span>';
}
});
function onWindowLoad()
{
var message = document.querySelector('#message');
chrome.tabs.executeScript(null, {file: "getPagesSource.js"});
}
I had to make a compromise so just after the getSelected I added the following line:
chrome.browserAction.disable(tab.Id);
It disables the action button thus it cant be clicked while the script sends the data to the server, as with this extension I grab the tab url in order to store it in my database.
After the ajax response and adding the following
if(xhr.readyState==4)
{
message.innerHTML=xhr.responseText;
chrome.browserAction.enable(tab.Id); /////<---THAT LINE
}
the button gets ready again to be clicked.
I couldnt find the way to add a specific delay in seconds, this way seems stupid but its working, as the response's delay from my server is enough for switching the 2 states of the action button.
With this, however another problem came up, which Ill write in different question.

Make jPlayer stay at end of track

As demonstrated in the standard jPlayer demo, when the track ends, the player resets time to zero. Is there any way to make it stay at the end of the track?
Use the ended() event in conjunction with the playHead method to keep the play head at the end when it ends.
Modifying the example, here's what I got:
$(document).ready(function() {
$("#jquery_jplayer_1").jPlayer({
ready: function(event) {
$(this).jPlayer("setMedia", {
mp3: "http://www.jplayer.org/audio/mp3/TSP-01-Cro_magnon_man.mp3",
oga: "http://www.jplayer.org/audio/ogg/TSP-01-Cro_magnon_man.ogg"
});
},
swfPath: "http://www.jplayer.org/2.1.0/js",
supplied: "mp3, oga",
ended : function(){
console.log("ended");
$(this).jPlayer("playHead",100);
}
});
});
​
JSFiddle: http://jsfiddle.net/wjsKa/2/
Reference: http://jplayer.org/latest/developer-guide/
jPlayer is opensource, so you can tweak code as you desire. I suggest getting jquery.jplayer sources and removing lines 973 and 974 from jquery.jplayer.js. Then you just save your own copy and compress it if you desire to do so.
Or you can play around with _updateInterface method so it doesn't move seek bar when called from "ended" event handler.
Sorry for incomplete answer, can't test it right now.

Resources