soundcloud in jquery mobile - jquery-mobile

i wish to use soundcloud in a jquery mobile page. I copy pasted the following:
<iframe width="100%" height="166" scrolling="no" frameborder="no" src="http://w.soundcloud.com/player/?url=http%3A%2F%2Fapi.soundcloud.com%2Ftracks%2F63422331&show_artwork=true"></iframe>
from http://soundcloud.com/amar-dj/
It works well in chrome browser but when i upload the jquery page on mobile, the track doesnt play.
Also I wish to customize the soundcloud widget to include the track, play button and the artist and track name that's it. No like or share button! For this i wrote the following:
<iframe width="100%" height="166" scrolling="no" frameborder="no" src="http://w.soundcloud.com/player/?url=http%3A%2F%2Fapi.soundcloud.com%2Ftracks%2F63422331&&show_artwork=false&show_comments=false&show_playcount=false&liking=false&sharing=false&buying=false;color=ff7700"></iframe>
All but the like button disappears. How do i hide the like button?

Thanks for spotting this problem, you should now be able to hide purchase link as well by supplying buying=false parameter (the problem is fixed and deployed).
As for the like button, please notice that in your example you have not placed an ampersand (&) between liking=false and color=ff7700. If you add it, you won't see like button.

Related

Ionic 2 Keyboard reopening after close

I'm facing a situation when I need to close the keyboard programmatically on iOS. For solving it I'm using this piece of code:
Keyboard.close();
It closes the keyboard but whenever I touch the screen, it reopens. Has someone else faced this situation? Thanks!
I also encounter this problem in ios 11 when using an iframe inside a Modal. If I use this.keyboard.close() to close the keyboard manually, it will reopen in each touch. I finally solve it by
https://forum.ionicframework.com/t/keyboard-reopens-after-close-repeatedly-on-ios/107347/2
In the page that embeds a iframe add the following
embed.ts
declare var cordova;
#ViewChild('ioshack') ioshack;
ionViewWillLeave() {
if(cordova.plugins.Keyboard.isVisible){
this.ioshack.setFocus();
}
}
embed.html
<ion-content>
<iframe [src]="url" width="100%" height="100%" frameborder="0" allowfullscreen>
</iframe>
<ion-input #ioshack type="text" value="" class="ioshack" style="height: 0px;"> </ion-input>
</ion-content>
Apparently Ionic 2 has some bugs when mixing iframes and Ionic 2 pages. In my case I was getting back from an iframe and I need the keyboard to close. The way I managed to solve this issue was by inserting a back button in the iframe, emitting an event from the iframe and attaching a listener to the Ionic 2 app which programmatically pops the last page from the stack. By using this method the keyboard gets automatically closed, you just need to trigger the event in order to go one page back. Hope this answer helps someone that has the same issue!

PDF inside iframe no back button when full screen

I'm developing an ionic app in iOS, I placed the pdf inside an iframe just by simply doing the following:
<iframe src="https://docs.google.com/gview?embedded=true&url=http://example.com/resources/myfile.pdf" mozallowfullscreen marginwidth="2" marginheight="2" width="90%" scrolling="auto"></iframe>
I didn't used cordovaInAppBrowser because I ran a lot of problem like after clicking the button the InAppBrowser doesn't open unless I don't minimize the app. So I just used iframe as the workaround. But the problem now is that, after the pdf being loaded, and the user clicks on the full screen of pdf, there's no back button. Is there a way I can remove the full screen button from the pdf or add a back button on full screen mode of pdf? I tried removing the mozallowfullscreen but doesn't work since it's for the iframe not for the pdf.
P.S.
I tried accessing the div inside the iframe that holds the button for full screen, but no good, it doesn't get the div, it's probably because I'm violating the Same Origin Policy.
Here's the code on how I tried to access the div:
$('#myframe').each(function(){
console.log($("div[role='toolbar']"));
});

Display iframe youtube video in Shadowbox/Fancybox in wordprsss

I have been looking and looking for a solution but can not find one to opening
<iframe width="560" height="315" src="http://www.youtube.com/embed/A6XUVjK9W4o" frameborder="0" allowfullscreen></iframe>
The reason for wanting to open in this format is the generated image link.
Thanks
instead of use embed code, i use only the embed link that wrap an image so when i click the image a shadowbox popup opens with the video inside

Embed Youtube video in iOS6 app opens video in Safari

With iOS6 the old embed code no longer works, it just opens the video in Safari
I tried to use the new embed code, but when I make this dynamic it opens the video in Safari.
When I add a static entry in the webview it works, but it's rather slow and a lot of dom elements are injected
An example for the new embed code;
<iframe type="text/html" width="640" height="385" src="http://www.youtube.com/embed/VIDEO_ID" frameborder="0"> </iframe>
I was thinking to use the HTML5 video tag and find out the url for the video, but this probably violates the Youtube TOS
Any suggestions?
The solution is to set OpenAllWhitelistURLsInWebView to YES in Phonegap settings

Facebook drop down menu goes behind embeded you tube video fan page

I am currently having some trouble displaying a you tube video on my custom fan page. I am using Static HTML I Frame Tab to embed this code. The problem is that the facebook notifications or search drop down menu continues to go behind y you tube video when using IE.
I have included param name="wmode" value="transparent" within the embeded you tube code but for whatever reason the fb drop down menu continues to go behind the video. The fan page is https://www.facebook.com/blaineostrander
Again, this issue only seems to be happening in IE
Thank you in advance
Into src in iframe put ?wmode=opaque
Ex :
<iframe width="420" height="315"
src="http://www.youtube.com/embed/pVllEZirODQ?wmode=opaque"
frameborder="0" allowfullscreen>
</iframe>
Works great for me

Resources