JavaScript: PrettyPhoto Video für iOS anpassen

31/03/2011

Ich habe für einige Seiten PrettyPhoto in Verbindung mit dem Flowplayer genutzt, um Videos einzubinden. Da die Filme als mp4 vorliegen und die Seiten auch für das iPad&Co nutzbar sein sollen, waren hier einige Anpassungen an PrettyPhoto selbst notwendig. Zunächst sollten die Videos auch ohne aktiviertes JavaScript abspielbar sein, hierzu wurde ein PHP-Seite erstellt, die zwischen iOS und anderen Geräten unterscheiden kann und die mp4 Dateien entsprechen einbindet (FlashObject oder HTML5-Video-Tag für iOS). Die Links zu die dieser Seite (player.php?url=/media/meinfilm.mp4) wurde entsprechend eingefügt.Ist nun JavaScript aktiv werden diese Links (rel="prettyphoto") entsprechend umgebaut. Alle nicht-iOS Geräte zeigen in einer PrettyPhoto-Box den Inhalt der Player.php (in einem iFrame) an, hierzu wird zumindest iframe=true an den Link angehängt. iOS Geräte gehen etwas weiter und ersetzen zunächst den Link zur Player.php gegen den direkten Link zur mp4-Datei. Nun kommt eine kleine eigene Anpassung in der PrettyPhoto.js zum Tragen, nämlich else if (itemSrc.match(/\b.mov\b/i)|| ((navigator.userAgent.indexOf('iPad')>-1 || navigator.userAgent.indexOf('iPhone')>-1 || navigator.userAgent.indexOf('iPod')>-1) && (itemSrc.indexOf('.mp4') != -1))) { return 'quicktime'; Auf diesem Weg wird unter iOS das Video direkt in ein Overlay eingebunden (als Quicktime Object).Diese Anpassung war notwendig, da das Video in dem sonst genutztem iFrame nicht 100%ig zentriert wurde...

Fazit: Es scheint eine recht solide Weise zu sein, Videos einzubinden. Vielleicht sollte man eine zentrale Stelle definieren, auf die JavaScript und PHP zugreifen, die die Bedingungen für iOS definiert. Am schönsten wäre es, wenn die PHP, sowie JavaScript-Lösung das Video über einen HTML-5-Video-Tag einbinden würden, neben iOS gibt es schließlich ja auch noch Android und WebOS... to be continued
No Comments

Batch Upload für Sonorasaurus

5/07/2010
Ich habe mir ja vor kurzem ein iPad zugelegt (Nelson sein Name) und war auf der Suche nach einer Player-Software, mit der ich zur Not halbwegs komfortabel Musik machen kann. Dabei bin ich auf Sonorasaurus gestoßen. Neben der File-Sync Lösung, die über USB funktioniert, ist bisher nur ein einfacher Webserver vorhanden, über den sich jeden Datei einzeln hochladen lässt. Da ich aber unbedingt über das Netzwerk schnell den ein oder anderen Song nachladen können möchte, habe ich mir hierfür.... RICHTIG, ein kleine AppleScript geschrieben. Es nutzt curl um im batch Dateien auf das iPad zu laden (aktiviert Sonorasaurus-Webserver vorrausgesetzt). Die IP des iPads stellt man über den Dateinamen (Prefs-Datei habe ich mir mal gespart) ein. Ein einfaches Droplet, Mp3-Dateien drauf-ziehen, warten, auf dem iPad abspielen =)DOWNLOAD
Upload to Sonorasaurus v.1.0
28.7 kB (150 hits)
Code zum markieren einmal anklicken Code im Skript-Editor öffnen

--04.07.2010 hubionmac.com

--Tested with Mac OS 10.6.4 

--Sonorasaurus File Upload Droplet

on open these

tell application "Finder"

set myname to name of (path to me)

end tell

set AppleScript's text item delimiters to "Upload mp3s to "

set ipad_ip to text item 2 of myname

set AppleScript's text item delimiters to ".app"

set ipad_ip to text item 1 of ipad_ip

set AppleScript's text item delimiters to ""

set server_address to "http://" & ipad_ip & ":8888"

repeat with this in these

set this_x to POSIX path of (this as alias)

set this_file to do shell script "basename " & quoted form of this_x

if this_file ends with ".mp3" then

set this_dir to do shell script "dirname " & quoted form of this_x

do shell script "cd " & quoted form of this_dir & ";curl -F \"file=@" & this_file & "\" -F \"button=Upload\" " & server_address

end if

end repeat

display dialog "finished" giving up after 4

end open

No Comments

;-)

26/04/2010
1 Comment