YouTube videos are too large on mobile devices

[a_5mith]

Nodebb isn't a CMS. There was a standard youtube plugin. I made my own that lazy loaded the videos to save the massive page loading times on video heavy websites. People downloaded. Once I've worked out the regex and it works reliably. What people do with it is their choice.

[exodo]

just tried it last version on persona and got this

@baris

[a_5mith]

Aware of the issue. Will sort it this evening.

[a_5mith]

Ok, Updated to 0.4.6.

@exodo You will need to clear your cache, seems some old CSS is still loading, the updated version displays the red play button as it does on a proper youtube embed etc. So if you still see the black one, cache will be your enemy.

If the videos appear slightly smaller on Desktop, try restarting your forum. I've gone with a slightly different method of calculating width and height. It now uses vh and vw. If your browser is older than IE9, Chrome31 or Firefox 38, you'll get the small box anyway.

Please let this be the end of these issues.

[exodo]

@a_5mith said:

Ok, Updated to 0.4.6.

@exodo You will need to clear your cache, seems some old CSS is still loading, the updated version displays the red play button as it does on a proper youtube embed etc. So if you still see the black one, cache will be your enemy.

If the videos appear slightly smaller on Desktop, try restarting your forum. I've gone with a slightly different method of calculating width and height. It now uses vh and vw. If your browser is older than IE9, Chrome31 or Firefox 38, you'll get the small box anyway.

Please let this be the end of these issues.

will test it tonight , waiting for npm update lol

[exodo]

@a_5mith said:

Ok, Updated to 0.4.6.

@exodo You will need to clear your cache, seems some old CSS is still loading, the updated version displays the red play button as it does on a proper youtube embed etc. So if you still see the black one, cache will be your enemy.

If the videos appear slightly smaller on Desktop, try restarting your forum. I've gone with a slightly different method of calculating width and height. It now uses vh and vw. If your browser is older than IE9, Chrome31 or Firefox 38, you'll get the small box anyway.

Please let this be the end of these issues.

not sure if plugin has official post os i write it here

tested plugin on clean 0.7 and clean 0.8, 3 browsers and mobile, cache cleared etc
still getting broken youtube previews
mac and iOS

something like this

console error on load

then a hundred errors of this
Blocked a frame with origin "https://www.youtube.com" from accessing a frame with origin "http://". The frame requesting access has a protocol of "https", the frame being accessed has a protocol of "http". Protocols must match.

[a_5mith]

The protocol in the plugin uses // rather than a fixed protocol. Does your forum use https:// or http://?

[a_5mith]

0.4.7, add this to your custom CSS

.content iframe {
    max-width: 100% !important;
}

Caveat: Videos don't show the title until clicked, this is because v2 api has been nuked, I'm creating a separate branch to utilise Youtube API v3.

Will be the next major version.

[a_5mith]

@simonq, chats broken, but use the code above in your custom CSS for now.

[ngsankar]

I am trying to add the above code in customer css, getting warning...as below and youtube side is not responsive in mobile, any pointer /help ? .

[a_5mith]

Using important isn't a big issue.

[ngsankar]

Bu this still not solving "YouTube videos are too large on mobile devices" the original problem in this thread. Other than this CSS (and ignore the important warning) , should o do anything else to solve the original problem ?