31/03/2011Ich 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...
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
3/01/2011 Ich bin vor einiger Zeit von FireFox auf Safari gewechselt. Wenn ich mir aber nun die JavaScript-Performance der 4er Beta
ansehe werde ich doch langsam wieder etwas schwach. Das ganze Ding macht wirklich den Eindruck einer schnellen Mac-Anwendung. Jetzt müssen Sie nur noch die AppleScript-Unterstützung etwas voran bringen und ich habe meinen neuen Standard-Browser =) Ok, die Webkit-Animationen dürften mir etwas fehlen, aber da wir sich bestimmt etwas finden, was mich darüber hinweg tröstet.
6/11/2010 Bei meiner Arbeit nutze ich oft AppleScript in Verbindung mit JavaScript. Viele meiner täglichen Aufgaben müssen über Webseiten abgewickelt werden und wenn es z.B. darum geht ein Web-Formular mit Daten aus Excel oder einem anderen Programm zu füttern oder Daten aus Webseiten zu extrahieren, dann kann so eine AppleScript-JavaScript-Lösung einem schon wirklich einiges an Zeit ersparen. Bisher war hierfür eigentlich nur Safari geeignet, da nur Safari das Ausführen längere JavaScripts via AppleScript unterstützte.
tell application "Safari"
tell document 1
do JavaScript "document.links.length"
end tell
end tell
Aber jetzt hat auch Google Chrome eine Schnittstelle für AppleScript erhalten und kann (wenn auch noch etwas rudimentär) JavaScript-Befehle über AppleScript ausführen.
tell application "Google Chrome"
tell window 1
tell tab 1
execute javascript "document.links.length"
end tell
end tell
end tell
Das Problem was dabei aber noch besteht: Der Aufruf führt das angegeben JavaScript zwar aus, gibt aber an AppleScript nichts aus. Stattdessen erscheint nach dem Ausführen des obigen Codes nur
missing value in der Ausgabe. Zur Zeit behelfe ich mir noch damit den Rückgabewert in den Titel des Dokuments zu schreiben und diesen dann via AppleScript auszulesen:
tell application "Google Chrome"
tell window 1
tell tab 1
execute javascript "document.title = document.links.length + 1"
delay 1
get title
end tell
end tell
end tell
Etwas unschön zumal ein delay mit rein muss, da der Titel sich nicht unmittelbar aktualisiert, aber zumindest schon mal ein Anfang, wenn Chrome der auserwählte Web-Browser sein sollte.
Kleiner Nachtrag... statt tab 1 kann man auch active tab nutzen 31/05/2010 Ich wollte für eine kleine Web-Anwendung die ich gerade schreibe einen Effekt nutzen, den ich auf der Seite von
The Wonderfactory gesehen habe. Dort kann man auf der Seite die Schlagzeilen durchblättern, was vermutlich mit der selben Technik umgesetzt wurde, die die auch für die HTML-5 Ausgabe der Sports-Illustrated genutzt haben. Ich bin nicht so ein Freund von aufgeblähten JavaScript-Bibliotheken (zu aufgebläht für meine Seite) und diesen setTimeout-Pfusch den man nutzt, um etwas Bewegung in eine Seite zu bringen. Deshalb und weil die Seite die ich gerade schreibe wohl hauptsächlich von Webkit-Browsern angesteuert werden dürfte, habe ich mir so eine Wisch-Effekt-Box mit dem ein bissle JavaScript und etwas mehr CSS zusammengebaut. Unterm Strich können diese
Webkit-Transition-Effekte einiges an JavaScript-Code überflüssig machen und die Seite läuft damit auch problemlos auf dem iPhone =) Und die Animation soll angeblich auch von der Hardware beschleunigt werden.
Link zur Demo Seite 5/05/2010 Kann recht praktisch sein, wenn man sich mal alle JavaScript-Dateien zu einer Website anzeigen lassen möchte...
tell application "Safari"
tell document 1
--set mybaseURL to do JavaScript "document.URL.slice(0, document.URL.lastIndexOf('/')+1)"
set jslinks to do JavaScript "var jssrcarray = new Array()
for (var i=0;i<document.getElementsByTagName('script').length;i++)
{
jssrcarray.push(document.getElementsByTagName('script')[i].src)
}
jssrcarray
"
repeat with jslink in jslinks
open location jslink
end repeat
end tell
end tell
4/05/2010 Früher waren es die Pop-Up-Fenster heute sind es nervig Overlays, die die Sicht auf eine Website versperren. Entweder schaltet man stumpf JavaScript aus oder klickt die Overlays weg, was dann den Aufruf von anderen Overlays oder Popups zur Folge hat. Ein kleine Hilf stellt diese JavaScipt-Code dar, den der alle diese Overlay-Dinger schlichtweg ausblendet. (Quick&Dirty).
tell application "Safari"
tell document 1
do JavaScript "for (var i=0;i<document.getElementsByTagName('*').length;i++)
{
if ((document.getElementsByTagName('*')[i].style.position == 'absolute')||(document.getElementsByTagName('*')[i].style.position == 'fixed'))
document.getElementsByTagName('*')[i].style.display = 'none'
}"
end tell
end tell
Macnews hat da eine etwas abgeänderte Form, das Overlay wird dort über eine Stylesheet definiert, deshalb nun computed style und schon funktioniert es wieder =)
tell application "Safari"
tell document 1
do JavaScript "for (var i=0;i<document.getElementsByTagName('*').length;i++)
{
if ((document.defaultView.getComputedStyle(document.getElementsByTagName('*')[i],null).position == 'absolute')||(document.defaultView.getComputedStyle(document.getElementsByTagName('*')[i],null).position == 'fixed'))
document.getElementsByTagName('*')[i].style.display = 'none'
}"
end tell
end tell
13/04/2010 Ich hatte da mal ein sehr schönes JavaScript als Bookmark, welches mit einen Download-Link der mp4 in die Seite einbaute, nur leider funktionierte das nicht mehr. Ein ungleich kürzes Skript habe ich
hier gefunden und mit daraus dann das hier gebaut:
Code zum markieren einmal anklicken
javascript:swfHTM%20=%20document.getElementById('movie_player').getAttribute('flashvars');%20w%20=%20swfHTM.split('&');%20for%20(i%20=%200;%20i%20<=%20w.length%20-%201;%20i++)%20{%20if%20(w[i].split('=')[0]%20==%20't')%20{%20t%20=%20w[i].split('=')[1];%20}%20if%20(w[i].split('=')[0]%20==%20'video_id')%20{%20videoid%20=%20w[i].split('=')[1];%20}%20}%20bla%20=%20document.createElement('a');%20bla.setAttribute('href','http://youtube.com/get_video?video_id='%20+%20videoid%20+%20'&t='%20+%20t%20+%20'='%20+%20'&fmt=18');%20bla.innerHTML%20=%20'DOWNLOAD';%20document.getElementById('masthead-nav').appendChild(bla);
Einfach kopieren, als Bookmark abspeichern und schon hat man einen DownloadButton für You-Tube-Videos =)
13/03/2010Ich poste ja den AppleScript-Quellcode hier immer in so einem Div-Elementen, das ab einer gewissen Größe einen Scroll-Balken bekommen.
Zudem wählt ein Klick auf den besagten Container den kompletten Inhalt aus und weil ich copy&paste eh schon so oft mache, gibt es dazu noch einen Link "Code im Script-Editor öffnen".
display dialog "Hallo, ich bin ein Dialog voller Sonderzeichen!\"§$%&/()=?
und Umlaute: ÖÄÜöää
Hm, fällt mir sonst noch etwas ein... ∂†ΩƒΩ©¨ªºø{|Ω®[€¢€‚∂®çƒ©√∫ª~º∆øπ@•∞œ@"
Um diesen Link geht es nun, den baue ich mir nämlich via JavaScript und da die Routine, die ich dazu geschrieben hatte, etwas buggy war, jetzt aber nach einer kleinen Anpassung anscheinend endlich auch mit allen Sonderzeichen und Umlauten zu funktionieren scheint, hier der Code dazu:
function buildAppleScriptLink() { var txt = ''; if (window.getSelection) { txt = window.getSelection(); } else if (document.getSelection) { txt = document.getSelection(); } else if (document.selection) { txt = document.selection.createRange().text; } else return; window.open(("applescript://com.apple.scripteditor?action=new&script=" + (new String(txt)).replace(/\"/g,'%22').replace(/\n/g,'%0D'))).close(); window.getSelection().removeAllRanges(); }Das Ding wird nach eine anderen Routine aufgerufen (
selectThis(this)), die den Inhalt des "Code-Divs" auswählt. Der Text, also nicht der HTML-Quellcode (innerHTML) wird dann zu einem AppleScript-Link umformatiert (Anführungszeichen und Zeilenumbrüche werden ersetzt gegen URL-Konforme Escape-Sequenzen) und dieser Link wird via JavaScript dann auch gleich in einem
neuen Fenster aufgerufen, was dann zumindest auf einem Mac, den AppleScript-Editor öffnet. Meine Tests unter 10.6.2 und Safari (4.0.5) waren bisher allesamt erfolgreich. Sollte jemand noch eine Idee zu einer Verbesserung des Codes haben, bitte in die Comments. Ich denke das sollte aber alles Funktionieren, sofern die Seite vom Encoding auf UTF-8 steht.
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 22/02/2010 Mal sehen, was sich sonst noch dazu finden wird =)
html_paint1