var lbr = (lengthbrsvg) ? lengthbrsvg : def_svg;
let's say def_svg is a valid image URL.
lengthbrsvg is dynamically set which is either image URL or empty.
Now lbr is valid image URL even if the lengthbrsvg is empty.
loadSVGFromURL function only accepts valid svg url. otherwise throws error. So the default image is passed when the lengthbrsvg is empty. We use loadSVGFromURL function inside another same function repeatedly to add svg to a canvas one by one. Due to the use of def_svg the number of request increases which is unnecessary. So, is there a way to not run that function if the image URL is empty which in turn dont request for def_svg image. in other words is there another way than using ternary operator.
fabric.loadSVGFromURL(lbr, function(obj_lengthbr) {
var lpatpath;
lpatpath = new fabric.PathGroup(obj_lengthbr, { left: 0, top: 0, width: 620, height: 641 });
lpatpath.setPatternFill({ source: lengthbrpattern, repeat: 'repeat', offsetX: 'left', offsetY: 'top' });
canva.add(lpatpath);
fabric.loadSVGFromURL((lengthbrbottom) ? lengthbrbottom : def_svg , function(obj_lengthbrbot) {
var BorPath;
//========
//========
fabric.loadSVGFromURL( , function(obj_lengthbrbot) {
//=====
//=====
});
});
});
From the above snippet, I don't want to run the loadSVGFromURL if the passing image URL is empty. how do I achieve that?
I'm using angular 6 to create a testimonial slider.
It looks great, but the problem is... I'm using RouterLink in my header, so everything loads at once. When you open the page with testimonial javascript for the first time it works, but then when you go onto another page and re-direct back it does not work.
Has anyone encountered a similar issue?
Is there a way to modify this function so it loads on page-view rather than page-load?
Thanks
JS Code:
function mfnSliderTestimonials(){
var pager = function( el, i ){
var img = $( el.$slides[i] ).find('.single-photo-img').html();
return '<a>'+ img +'</a>';
};
$('.testimonials_slider_ul').each(function(){
var slider = $(this);
slider.slick({
cssEase : 'ease-out',
dots : true,
infinite : true,
touchThreshold : 10,
speed : 300,
adaptiveHeight : true,
appendDots : slider.siblings( '.slider_pager' ),
customPaging : pager,
autoplay : window.mfn_sliders.testimonials ? true : false,
autoplaySpeed : window.mfn_sliders.testimonials ? window.mfn_sliders.testimonials : 5000,
slidesToShow : 1,
slidesToScroll : 1
});
});
}
EDIT: WORKS
All working fine now. Even when re-routing. In thecomponent I've declared the javascript function in such way:
declare function YOURFUNCTION(): any;
#component......
ngOninit
YOURFUNTION()
and obviously import * as $ from 'jquery'; was also necessary!
Thanks
I 'm trying to learn as an autodidact casperjs .
I have encountered a problem that I do not know how to fix. I'm trying to do the following:
By clicking on the search box , a pop-up appears. However, when I do it by casperjs the drop does not appear.
What I need is to enter in this field the value of a city and click on the drop-down that appears.
I think it should be a matter that does not release the necessary jquery events.
My code:
var casper = require('casper').create({
verbose: true,
logLevel: "debug",
waitTimeout: 10000,
viewportSize: {
width: 1024,
height: 760
}
});
/*
* PARAMETERS
*/
var listItems = [];
var location = casper.cli.args[0];
casper.start('http://www.vibbo.com/pisos-y-casas-barcelona-capital/', function() {
this.echo(this.getHTML('title'));
this.captureSelector('vibbo-1.png', 'html');
casper.click('#sb_location');
this.captureSelector('vibbo-2.png', 'html');
});
casper.waitUntilVisible('#ui-id-1', function() {
casper.sendKeys('#sb_location', 'Valencia');
this.wait(1000, function() {
this.captureSelector('vibbo-3.png', 'html');
});
this.echo(listItems);
});
casper.run();
I would appreciate help and I've tried everything I knew .
Thank you
I am not sure what you are expecting. What I would do, is to use jquery to mimic the behavior.
I have looked at the web site. When you enter the field and keys in barcelona, it calls a webservice :
http://suggest.vibbo.com/regionSuggest?callback=jQuery111106577302796537023_1474408404858&location=barcelona&_=1474408404866
So what I would do is the following :
1) collect the suggestions by calling the Web Service :
jQuery.getJSON("http://suggest.vibbo.com/regionSuggest?callback=jQuery111106577302796537023_1474408404858&location=mardid&_=1474408404866")
(Here with madri, take the first result :
{"label" : "Madridanos", "regionID":"49", "areaID": "", "municipalityID" : "49103"}
2) Fill the field with this value :
casper.evaluate(function(){
$('#sb_location').val('Madridanos')
}
3) Eventually hit the Buscar button :
$('button#sb_searchbutton').click();
Is it what you were looking for ?
I'm working on a website using jPlayer. The problem appeared when I tried to use it with my android phone, so I started recoding it. Now I'm trying to use the jPlayerAndroidFix class. I'm doing it just like in the example given in the source code in the tutorial, and still it's not working.
Here's the code:
function playSound(sound) {
if (playToggle) {
return;
}
var id = "#jplayer-play";
var media = {
mp3: sound
};
var options = {
swfPath: $('body').data('jplayer-swf'),
solution: 'flash,html',
wmode:"window",
supplied: 'mp3',
preload: 'metadata',
volume: 0.8,
muted: false,
errorAlerts: false,
warningAlerts: false,
customCssIds: true
};
var myAndroidFix = new jPlayerAndroidFix(id, media, options);
myAndroidFix.setMedia(media);
myAndroidFix.play();
}
Important thing to add - the audio is received dynamically, for example from a link:
http://granie.t-mobile.pl/sets/play/69986
and that's the "sound" variable.
What may cause the problem? What am I doing wrong?
The jPlayerAndroidFix class can be found in the source code of
http://jplayer.org/latest/demo-01-android/?theme=0
Right, this seems to be poorly documented or I can't see it in the documentation. I basically want no related videos (?rel=0) using the JavaScript API.
$players[$vidIdPlaceholderRef] = new YT.Player('player_' + $vidIdPlaceholderRef, {
height: '550',
width: '840',
videoId: $vidId
});
is what I have in place.
I have also tried:
$players[$vidIdPlaceholderRef] = new YT.Player('player_' + $vidIdPlaceholderRef, {
height: '550',
width: '840',
videoId: $vidId + '?rel=0',
rel : 0
});
with no luck. Does any one know of an option which can be added (tried rel : 0 with no luck )
"rel" is a player parameter, as specified here:
https://developers.google.com/youtube/player_parameters#rel
To add player parameters to iframe players, you need to specify the playerVars property of the second constructor argument (at the time of writing this is documented here, and on the IFrame API documentation page)
e.g.
new YT.Player('playerid', {
height: '550',
width: '840',
videoID: 'video_id',
playerVars: {rel: 0, showinfo: 0, ecver: 2}
});
The behavior of the rel player parameter has changed.
From documentation,
The behavior for the rel parameter is changing on or after September
25, 2018. The effect of the change is that you will not be able to
disable related videos. However, you will have the option of
specifying that the related videos shown in the player should be from
the same channel as the video that was just played
So, it's no longer possible to disable related videos. Instead playerVars: {rel:0} will change the behavior of the player and shows suggestion from specified channel.
You get related videos in two places: at the end of the video with the grid, and at the bottom of the video while paused. I've figured out a way to remove them at the end and make the ones at the bottom at least tolerable for most businesses.
1. Remove related videos at the end of a video
IFrame Player API: Events
To avoid showing related videos at the end of a video, I just stopped the video so it returned to showing the thumbnail and play button:
var player = new YT.Player('player', {
height: '390',
width: '640',
events: {
'onStateChange': function(event){
switch(event.data){
// Stop the video on ending so recommended videos don't pop up
case 0: // ended
player.stopVideo();
break;
case -1: // unstarted
case 1: // playing
case 2: // paused
case 3: // buffering
case 5: // video cued
default:
break;
}
}
}
});
You could also replace player.stopVideo(); with any other code you want to run.
2. Making related videos at the bottom of a video only show your videos
IFrame Player API: YouTube Embedded Players and Player Parameters
rel=0 no longer avoids showing any related videos; now, it will still show related videos, but at least they'll only be from your channel. This changed sometime around September 25, 2018 (documentation).
By setting playerVars in YT.Player, we can at least have related videos only show our channel's videos. The documentation isn't clear that you have to have playerVars set up as an object, but you can set it up like so:
var player = new YT.Player('player', {
...
playerVars:{
rel: 0
modestbranding: 1, // If you're trying to remove branding I figure this is helpful to mention as well; removes the YouTube logo from the bottom controls of the player
// color: 'white', // Can't have this and modestbranding active simultaneously (just a note in case you run into this)
},
...
});
2A. Potential way to remove related videos from bottom
I may look more into it if I have the time, but here's where an answer may lie:
We can easily access the iframe object but we can't do anything with it: IFrame Player API: Accessing and modifying DOM nodes. It appears that because we'd be editing an iframe from YouTube there are security concerns (regardless of what we'd actually be doing). Ideally I could just remove the "More videos" text with player.getIframe().contentWindow.document.querySelector('.ytp-pause-overlay.ytp-scroll-min').remove(), but when I run player.getIframe().contentWindow.document I get an error SecurityError: Permission denied to access property "document" on cross-origin object.
But playerVars also has an origin value that may let us access the iframe's object anyway:
var player = new YT.Player('player', {
...
playerVars:{
origin: 'https://mywebsite.com'
},
...
});
It's not working with localhost, but that may be a Chromium and Firefox thing. Perhaps this is a legitimate option on a live site; I'll update this post when/if I try that to let you know if I succeed.
The accepted solution was not working for me. What does work is:
1) Putting the iframe in html that includes the rel parameter
<iframe id="youtube-video" width="560" height="315"
src="https://www.youtube.com/embed/M7lc1UVf-VE?enablejsapi=1&rel=0&modestbranding=1"
frameborder="0" enablejsapi="1" allowfullscreen></iframe>
2) Using the javascript API to attach to that existing player
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
var player;
function onYouTubeIframeAPIReady() {
player = new YT.Player('youtube-video', {
events: {
'onReady': onPlayerReady,
'onStateChange': onPlayerStateChange
}
});
}
function onPlayerReady(event) {
console.log("ready");
}
function onPlayerStateChange(event) {
console.log("state changed");
}
demo fiddle: http://jsfiddle.net/bf7zQ/195/
If you're using SWFObject, you simply need to do something like this:
function loadVideo() {
var params = { allowScriptAccess: "always" }
, atts = { id: "myvideo" }
;
//NOTE THE END OF THE BELOW LINE vvvvvv
swfobject.embedSWF("https://www.youtube.com/v/[video id here]?enablejsapi=1&playerapiid=myvideo&version=3&rel=0"
, "videoplaceholderid"
, "768", "432", "8", null, null, params, atts);
}
Just add rel=0 to the end of your url.
No need to code through the API,now its easily can be done by
You tube embed button -> Show more -> tickout the option 'Show suggested videos when the video finishes'
Here is a Quick solution:
setInterval(function(){
if($('iframe').length > 0){
$('iframe').each(function(){
if($(this).hasClass('gotYou')){
//do nothing
}else{
var getMySrc = $(this).attr('src');
var newSrc = getMySrc.split('?');
console.log(newSrc);
var freshURL = newSrc[0]+'?rel=0&'+newSrc[1];
console.log(freshURL);
$(this).addClass('gotYou');
$(this).attr('src', freshURL );
}
});
}
}, 1);
What it does it, it looks for the iframe in your document. If it finds iframe, it grabs the src of the iframe, finds the ? mark and then replaces ? by ?rel=0& . Here the goal is to out rel=0
new YT.Player('playerid', {
height: '550',
width: '840',
videoID: 'video_id',
playerVars: {rel: 0},
});