Topic: Ohara YouTube Embed

[lurkalot]

You need to click the video now!

Thanks.  Trouble is (on my site) they aren't clickable, at least not for me in Chrome IE11 or firefox.  They work if I go directly on youtube though,

[420Connect.co.uk]

You need to click the video now!

Thanks.  Trouble is (on my site) they aren't clickable, at least not for me in Chrome IE11 or firefox.  They work if I go directly on youtube though,

Just tested it for myself and yeah, you only seem to be grabbing the picture/placeholder and lacking any actual video features for me too - strange!?

[Suki]

Could you please expand further on how to use the new added $context['ohara_disable'] to have the mod disabled in SP

Using the second part of the how to, you linked to before doesn't seem to have the effect anymore with the new version 




edit;


It seems using http:// doesn't display but starting www. does?

It depends on the portal you are using, all $context['ohara_disable'] does is end up the function before the links gets parsed, it depends on whatever portal you are using to set $context['ohara_disable'] to true, this mod alone cannot "known" if you are using a portal or a shoutbox.

Keep in mind that $context['ohara_disable'] only works for the autoembed feature, normal videos posted using the youtube tags will not be affected by this.

I cannot understand your second question, display what exactly?

Ah yet another thing to fix, thanks for the report.

No problem.  I have another one now though,

Has youtube changed something?  for some reason all my youtube vids no longer play.  Shows the image, but no play button etc. Here's an example,  http://guitaristguild.com/index.php?topic=727.0  pretty sure they were all working yesterday.

Using Ohara YouTube Embed 1.2.1

The mod absolutely needs this css file to work:  http://guitaristguild.com/Themes/GrayStyle/css/oharaEmbed.css  your site doesn't have it.

Get the mod, unzip it, get the css file and just upload that file to that path.

[lurkalot]

The mod absolutely needs this css file to work:  http://guitaristguild.com/Themes/GrayStyle/css/oharaEmbed.css  your site doesn't have it.

Get the mod, unzip it, get the css file and just upload that file to that path.

Thanks, not sure why it was missing, I checked the other themes on install.  Anyway, uploaded and now have a play button, but still doesn't do anything.  Does this mean I have something else missing?

[Suki]

The mod absolutely needs this css file to work:  http://guitaristguild.com/Themes/GrayStyle/css/oharaEmbed.css  your site doesn't have it.

Get the mod, unzip it, get the css file and just upload that file to that path.

Thanks, not sure why it was missing, I checked the other themes on install.  Anyway, uploaded and now have a play button, but still doesn't do anything.  Does this mean I have something else missing?

Yep, there is another issue, for some reason jquery is complaining about this bit:

$(document).on("click","#"+this.id,function(a)  which is the click event that loads the actual video and plays it.

I suppose I will have to change it to a more friendly ID, will check this further today and get a fix for this alone with the other ones already reported.

[lurkalot]

The mod absolutely needs this css file to work:  http://guitaristguild.com/Themes/GrayStyle/css/oharaEmbed.css  your site doesn't have it.

Get the mod, unzip it, get the css file and just upload that file to that path.

Thanks, not sure why it was missing, I checked the other themes on install.  Anyway, uploaded and now have a play button, but still doesn't do anything.  Does this mean I have something else missing?

Yep, there is another issue, for some reason jquery is complaining about this bit:

$(document).on("click","#"+this.id,function(a)  which is the click event that loads the actual video and plays it.

I suppose I will have to change it to a more friendly ID, will check this further today and get a fix for this alone with the other ones already reported.

Thank you.

[420Connect.co.uk]

Could you please expand further on how to use the new added $context['ohara_disable'] to have the mod disabled in SP

Using the second part of the how to, you linked to before doesn't seem to have the effect anymore with the new version 




edit;


It seems using http:// doesn't display but starting www. does?

It depends on the portal you are using, all $context['ohara_disable'] does is end up the function before the links gets parsed, it depends on whatever portal you are using to set $context['ohara_disable'] to true, this mod alone cannot "known" if you are using a portal or a shoutbox.

Keep in mind that $context['ohara_disable'] only works for the autoembed feature, normal videos posted using the youtube tags will not be affected by this.

I cannot understand your second question, display what exactly?

[/quote]

Sorry, I believe this is where someone before me found it hard to explain the situation..

I'll try my best

when you use a http://www.youtube.... link on a simple portal shoutbox and hit enter, .. the shoutbox refreshes as if you had posted but no post is actually posted/displayed/"shouted" but it does work (turns the YT link into [link] and doesn't wrap tags around with youtube links starting with www.

Taking a random shot, I'd guess it's a regex thing but I could be miles off 

Hopefully that makes sense! 

[Suki]

Sorry, I believe this is where someone before me found it hard to explain the situation..

I'll try my best

when you use a http://www.youtube.... link on a simple portal shoutbox and hit enter, .. the shoutbox refreshes as if you had posted but no post is actually posted/displayed/"shouted" but it does work (turns the YT link into [link] and doesn't wrap tags around with youtube links starting with www.

Taking a random shot, I'd guess it's a regex thing but I could be miles off 

Hopefully that makes sense! 

Sorry I still cannot understand what you mean. 
so, the mod works with www but not when using http://www  ?  is that what you are trying to say?

Can you post some screenshots of your problem?

[Suki]

@lurkalot Can you please do the following changes and test if that solves your issues?

On your Sources/OharaYTEmbed.php file

find this:

Code: [Select]

$result = '<div class="youtube" id="'. $videoID .'" style="width: '. (empty($modSettings['OYTE_video_width']) ? '420' : $modSettings['OYTE_video_width']) .'px; height: '. (empty($modSettings['OYTE_video_height']) ? '315' : $modSettings['OYTE_video_height']) .'px;"></div>';
and replace with this:

$result = '<div class="youtube" id="oh_'. $videoID .'" style="width: '. (empty($modSettings['OYTE_video_width']) ? '420' : $modSettings['OYTE_video_width']) .'px; height: '. (empty($modSettings['OYTE_video_height']) ? '315' : $modSettings['OYTE_video_height']) .'px;"></div>';

Now replace the entire Themes/default/scripts/ohyoutube.js  file with this:

Code: [Select]

/*
 Copyright (c) 2015 Jessica González
 @license http://www.mozilla.org/MPL/MPL-1.1.html
*/

function oh_main(){$(".youtube").each(function(){videoID=this.id.replace("oh_","");imgsrc=oh_getImage(videoID);imgHeight=$(this).height();imgWidth=$(this).width();"undefined"!==typeof imgsrc&&$(this).css({"background-image":"url("+imgsrc+")","background-size":"cover"});$(this).append($("<div/>",{"class":"youtube_play"}));$("#oh_"+videoID).on("click",function(){var a="https://www.youtube.com/embed/"+videoID+"?autoplay=1&autohide=1";$(this).data("params")&&(a+="&"+$(this).data("params"));a=$("<iframe/>",
{frameborder:"0",src:a,width:imgWidth,height:imgHeight});$(this).replaceWith(a)})})}function oh_getImage(a){var b="",c,d,e=["maxresdefault","sddefault","mqdefault","hqdefault","default"];c=0;for(d=e.length;c<d&&(b="http://i.ytimg.com/vi/"+a+"/"+e[c]+".jpg",0==b.width);++c);return b}function oh_getUrl(a){var b=window.location.search.substring(1);if(-1<b.indexOf(a))return!0;for(var b=b.split(";"),c=0;c<b.length;c++)if(b[c].split("=")[0]==a)return!0}oh_main();
if(oh_getUrl("post"))$("input[name=preview]").on("click",function(){setTimeout(function(){oh_main()},3E3)});

[lurkalot]

@lurkalot Can you please do the following changes and test if that solves your issues?

On your Sources/OharaYTEmbed.php file

find this:

Code: [Select]

$result = '<div class="youtube" id="'. $videoID .'" style="width: '. (empty($modSettings['OYTE_video_width']) ? '420' : $modSettings['OYTE_video_width']) .'px; height: '. (empty($modSettings['OYTE_video_height']) ? '315' : $modSettings['OYTE_video_height']) .'px;"></div>';
and replace with this:

$result = '<div class="youtube" id="oh_'. $videoID .'" style="width: '. (empty($modSettings['OYTE_video_width']) ? '420' : $modSettings['OYTE_video_width']) .'px; height: '. (empty($modSettings['OYTE_video_height']) ? '315' : $modSettings['OYTE_video_height']) .'px;"></div>';

Now replace the entire Themes/default/scripts/ohyoutube.js  file with this:

Code: [Select]

/*
 Copyright (c) 2015 Jessica González
 @license http://www.mozilla.org/MPL/MPL-1.1.html
*/

function oh_main(){$(".youtube").each(function(){videoID=this.id.replace("oh_","");imgsrc=oh_getImage(videoID);imgHeight=$(this).height();imgWidth=$(this).width();"undefined"!==typeof imgsrc&&$(this).css({"background-image":"url("+imgsrc+")","background-size":"cover"});$(this).append($("<div/>",{"class":"youtube_play"}));$("#oh_"+videoID).on("click",function(){var a="https://www.youtube.com/embed/"+videoID+"?autoplay=1&autohide=1";$(this).data("params")&&(a+="&"+$(this).data("params"));a=$("<iframe/>",
{frameborder:"0",src:a,width:imgWidth,height:imgHeight});$(this).replaceWith(a)})})}function oh_getImage(a){var b="",c,d,e=["maxresdefault","sddefault","mqdefault","hqdefault","default"];c=0;for(d=e.length;c<d&&(b="http://i.ytimg.com/vi/"+a+"/"+e[c]+".jpg",0==b.width);++c);return b}function oh_getUrl(a){var b=window.location.search.substring(1);if(-1<b.indexOf(a))return!0;for(var b=b.split(";"),c=0;c<b.length;c++)if(b[c].split("=")[0]==a)return!0}oh_main();
if(oh_getUrl("post"))$("input[name=preview]").on("click",function(){setTimeout(function(){oh_main()},3E3)});

Suki, thanks, done the edits, but all I'm getting is a black box where the video should be, and although it looks clickable it doesn't do anything.

[420Connect.co.uk]

Sorry, I believe this is where someone before me found it hard to explain the situation..

I'll try my best

when you use a http://www.youtube.... link on a simple portal shoutbox and hit enter, .. the shoutbox refreshes as if you had posted but no post is actually posted/displayed/"shouted" but it does work (turns the YT link into [link] and doesn't wrap tags around with youtube links starting with www.

Taking a random shot, I'd guess it's a regex thing but I could be miles off 

Hopefully that makes sense! 

Sorry I still cannot understand what you mean. 
so, the mod works with www but not when using http://www  ?  is that what you are trying to say?

Can you post some screenshots of your problem?

Correct.

using an address beginning with http://www doesn't work.

(I've actually since reverted to the old version of Ohara YT Embed since it seemed to do everything I needed (with the changes for SP shoutbox applied))

[Suki]

@lurkalot Can you please do the following changes and test if that solves your issues?

On your Sources/OharaYTEmbed.php file

find this:

Code: [Select]

$result = '<div class="youtube" id="'. $videoID .'" style="width: '. (empty($modSettings['OYTE_video_width']) ? '420' : $modSettings['OYTE_video_width']) .'px; height: '. (empty($modSettings['OYTE_video_height']) ? '315' : $modSettings['OYTE_video_height']) .'px;"></div>';
and replace with this:

$result = '<div class="youtube" id="oh_'. $videoID .'" style="width: '. (empty($modSettings['OYTE_video_width']) ? '420' : $modSettings['OYTE_video_width']) .'px; height: '. (empty($modSettings['OYTE_video_height']) ? '315' : $modSettings['OYTE_video_height']) .'px;"></div>';

Now replace the entire Themes/default/scripts/ohyoutube.js  file with this:

Code: [Select]

/*
 Copyright (c) 2015 Jessica González
 @license http://www.mozilla.org/MPL/MPL-1.1.html
*/

function oh_main(){$(".youtube").each(function(){videoID=this.id.replace("oh_","");imgsrc=oh_getImage(videoID);imgHeight=$(this).height();imgWidth=$(this).width();"undefined"!==typeof imgsrc&&$(this).css({"background-image":"url("+imgsrc+")","background-size":"cover"});$(this).append($("<div/>",{"class":"youtube_play"}));$("#oh_"+videoID).on("click",function(){var a="https://www.youtube.com/embed/"+videoID+"?autoplay=1&autohide=1";$(this).data("params")&&(a+="&"+$(this).data("params"));a=$("<iframe/>",
{frameborder:"0",src:a,width:imgWidth,height:imgHeight});$(this).replaceWith(a)})})}function oh_getImage(a){var b="",c,d,e=["maxresdefault","sddefault","mqdefault","hqdefault","default"];c=0;for(d=e.length;c<d&&(b="http://i.ytimg.com/vi/"+a+"/"+e[c]+".jpg",0==b.width);++c);return b}function oh_getUrl(a){var b=window.location.search.substring(1);if(-1<b.indexOf(a))return!0;for(var b=b.split(";"),c=0;c<b.length;c++)if(b[c].split("=")[0]==a)return!0}oh_main();
if(oh_getUrl("post"))$("input[name=preview]").on("click",function(){setTimeout(function(){oh_main()},3E3)});

Suki, thanks, done the edits, but all I'm getting is a black box where the video should be, and although it looks clickable it doesn't do anything.

Something is preventing the ohyoutube.js file from executing, can be a jquery conflict or other js error somewhere.  Does it happens with all embedded videos?

Can you disable the sharethis mod and see if that helps?

[Suki]

Sorry, I believe this is where someone before me found it hard to explain the situation..

I'll try my best

when you use a http://www.youtube.... link on a simple portal shoutbox and hit enter, .. the shoutbox refreshes as if you had posted but no post is actually posted/displayed/"shouted" but it does work (turns the YT link into [link] and doesn't wrap tags around with youtube links starting with www.

Taking a random shot, I'd guess it's a regex thing but I could be miles off 

Hopefully that makes sense! 

Sorry I still cannot understand what you mean. 
so, the mod works with www but not when using http://www  ?  is that what you are trying to say?

Can you post some screenshots of your problem?

Correct.

using an address beginning with http://www doesn't work.

(I've actually since reverted to the old version of Ohara YT Embed since it seemed to do everything I needed (with the changes for SP shoutbox applied))

Does it happen on normal messages too?

[420Connect.co.uk]

Sorry, I can't reproduce it anymore as I've reverted to the older version etc.

(Glad I even have a functional site at after todays events, So I probably won't try updating for a while but that's another story lol!)

If you've a test site; simple portal (with shoutbox) and Ohara .. You should be able to reproduce it if you'd like to have a look..

[lurkalot]

Something is preventing the ohyoutube.js file from executing, can be a jquery conflict or other js error somewhere.  Does it happens with all embedded videos?

Can you disable the sharethis mod and see if that helps?

Tried that but still not working, so I'm going to rebuild my guitarist guild site, and see which mod is causing the problem at the same time.

[Suki]

Sorry, I can't reproduce it anymore as I've reverted to the older version etc.

(Glad I even have a functional site at after todays events, So I probably won't try updating for a while but that's another story lol!)

If you've a test site; simple portal (with shoutbox) and Ohara .. You should be able to reproduce it if you'd like to have a look..

Just tested this  with a random youtube video:

with http : https://www.youtube.com/watch?v=otCpCn0l4Wo  shows the link word
without http:  www.youtube.com/watch?v=otCpCn0l4Wo   shows the link word too
without https:  http://www.youtube.com/watch?v=otCpCn0l4Wo  also shows the link word

So I really don't know whats the issue here.

[420Connect.co.uk]

Is this after editing any code further or just with the 2 mods installed?


That seems to be as it should?!

Perhaps I was trying to apply the 'fix' to an already 'fixed' version.. :S

[Suki]

Installed both mods did the edit on Subs-Portal.php, set up a shoutbox and pasted the different links, thats all I did.

[420Connect.co.uk]

Installed both mods did the edit on Subs-Portal.php, set up a shoutbox and pasted the different links, thats all I did.

I see!
Like I said, I'm more than happy with how I have it set up for now but thank you for looking into this!

[Suki]

Its not just for you, I take the time to investigate whatever bug it was reported, I also cannot reproduce this:

I seem to be getting an error in the log each time I click the new topic button, or reply button.  Using the latest version Ohara YouTube Embed 1.2.1  And the tooltip is missing from the vimeo bbc button.

Code: [Select]

http://guitaristguild.com/index.php?action=post;board=29.0
8: Undefined index: OYTE_vimeo_desc
File: /home1/camcra24/xxxxxx_xxx/Sources/OharaYTEmbed.php
Line: 107

That text string is present in version 1.2.1 and function OYTE_bbc_add_button(&$buttons)  does load the mod's language file.

That was probable a leftover from previous versions or somehow the language files wasn't copied when the mod was installed.

What I did solve was the missing thumbnail, now the mod checks more images and not just the sddefault one. While this isn't 100% effective, it does show a lot more thumbnails, a demo can be found at my site:

http://missallsunday.com/index.php?topic=21.msg4264

Which also demonstrates the speed improvements of this new version when posting several videos per page.

Also added a few js functions to help mod authors to re-run the main youtube function for newly added DOM elements (message previews, posting via ajax, chats, etc), I myself will use this for Breeze.