• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Javascript in linux desktop (ICOS ver.)
 

Javascript in linux desktop (ICOS ver.)

on

  • 2,601 views

 

Statistics

Views

Total Views
2,601
Views on SlideShare
2,308
Embed Views
293

Actions

Likes
0
Downloads
32
Comments
0

8 Embeds 293

http://yurinfore.blogspot.com 206
http://yurinfore.blogspot.tw 57
http://yurenju.info 13
http://translate.googleusercontent.com 6
http://yurinfore.blogspot.de 5
http://feeds.feedburner.com 4
http://webcache.googleusercontent.com 1
http://yurinfore.blogspot.hk 1
More...

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Javascript in linux desktop (ICOS ver.) Javascript in linux desktop (ICOS ver.) Presentation Transcript

    • Javascript in Linux Desktop Yuren Ju <yurenju@gmail.com>
    • Yuren Ju ● Use Linux: 9 years ● For Desktop: 7­8 years Red Hat Debian Gentoo Debian Arch Linux Ubuntu Debian
    • Yuren Ju ● Blog: Yuren's Info Area ● Email: yurenju@gmail.com ● 社群 ● Hacking Thursday, KaLUG ● 工作: ASUSTek
    • Javascript always use in Web Applications.
    • Javascript always use in Web Applications.
    • Javascript in Linux Desktop ● Web Application/Platform ● Desktop Platform ● Desktop Application
    • Internet Application Platform
    • Performance
    • Opportunity! Javascript for Web Application Desktop Application
    • Javascript in desktop ? ● ● Integration Layout/Style
    • Web Desktop Application Platform
    • Web Application Layout Style Programming HTML +CSS CSS JS Server side
    • Platform/Browser Layout engine Javascript engine Layout Style Programming HTML +CSS CSS JS
    • Platform/Browser (2) Firefox Chrome Layout engine Gecko Webkit Javascript engine SpiderMonkey V8
    • To Desktop Application
    • Desktop ­ Platform ● XULRunner (Mozilla platform) ● GNOME Javascript runtime ● GJS/Seed
    • XULRunner Programming in Web Browser!
    • Mozilla applications
    • XULRunner Gecko layout engine SpiderMonkey Layout Style Programming XUL CSS JS DOM Demo: http://www.hevanet.com/acorbin/xul/top.xul 
    • XUL?  又一個新標記語言? Try...
    • Mozilla Platform ­ integration Mozilla Application XPCOM/NPAPI C++/Javascript System
    • Mozilla Platform ­ integration D­BUS VTE notify Glade GTK
    • But!
    • Tomorrow!
    • Javascript in GNOME ● Seed ● based on WebKit's JavaScriptCore ● GJS ● based on Mozilla's Spidermonkey engine
    • XULRunner Gecko layout engine SpiderMonkey Layout Style Programming XUL CSS JS
    • Javascript in GNOME GObject introspection Seed/GJS Programming System library Layout Style JS
    • Javascript in GNOME Javascript application GObject Javascript desktop runtime introspection System library Seed/GJS C API: GTK, Gstreamer, Clutter, Glib, etc. Javascript engine JavascriptCore/SpiderMonkey
    • GObject Introspection usage  ● const Gtk = imports.gi.Gtk; ● var window = new Gtk.Window ();
    • GObject Introspection
    • Language for GNOME new! <JS>
    • Traditional arch. Python/Perl/Ruby/Java..., etc. GTK Clutter VTE notify GStreamer Native C API
    • GObject Introspection JS Java Python Perl Ruby PHP? GI GTK Clutter VTE notify GStreamer Native C API
    • Metadata using annotations in the comments
    • GObject Introspection
    • Annotations g­ir­scanner Gir xml file g­ir­compiler typelib 40 B2 02 00 10 B2........
    • GObject Introspection foo.c foo.h Library source, with type annotations Foo.gir XML file libfoo.so Foo.typelib Binary file libffi.so libgirepository.so Specific language bindings
    • C API: gtk_button_set_label ● java: button.setLabel("foo") ● javascript/python/vala: button.set_label("foo") ● perl: $button­>set_label("foo") ● scheme: (send button (set­label "foo"))
    • GObject Introspection JS Java Python Perl Ruby PHP? GI GTK Clutter VTE notify GStreamer Native C API
    • Seed/GJS D­BUS VTE notify Glade GTK $ aptitude search gir
    • Javascript  已經準備好了!
    • Hello world
    • Hello world (2)
    • Demo ­ js­gallery
    • Applications based on Seed ● Seed ● Swell­foop ● lightsoff
    • Seed/GJS cons ● Your javascript just like another scripting  language (e.g. python)
    • Web developer: ☹
    • if...
    • Web developer:  ☺
    • Seedkit ● Define your UI in web­standards, use your  GObjects ● inspired by WebOS SDK and Mozilla JetPack ● http://live.gnome.org/SeedKit 
    • Seedkit Demo
    • Use library ● dbus ● libnotify ● wnck Source: Html ­ http://gist.github.com/578919  Js ­ http://gist.github.com/578922 
    • Cons ● Highly dependency  ● Hard to Communicate with main statement ● Poor documentation
    • gnome­shell ● Use javascript to control your desktop file:///usr/share/gnome­shell/js/ui 
    • Making extension – just like Firefox! gnome­shell ­­create­extension
    • Demo – gnome­shell extension
    • Javascript in Linux Desktop ● Apps based on javascript ● Powerful extension system with js ● Simple coding ● http://live.gnome.org/JavaScript 
    • END Thank you!
    • But I have..., why GI? ● Python­gtk ● e.g. nautilus ● Ruby­gnome2 ● No python, ruby, java  binding... ● java­gnome
    • Layout/Theme ● GTK – gtk­theme­engine ● Gnome­shell (shell toolkit) – libcroco (CSS) ● MX toolkit – CSS
    • GJS vs seed ● EMCAScript support ● GJS support javascript 1.8.1 extensions ● Seed support javascript 1.5 ● for each, let, etc. ● [item * 2 for each (item in list)]
    • Return values ● GJS ● print (texture.get_base_size()); ● Seed ● var height = {}, width = {}; ● texture.get_base_size (width, height); ● print (“width: ” + width.value + “, height: “ +  height.value)
    • Clutter fine tune ● GJS ● No Actor.animate function ● Seed ● workaround for Actor.animate ● But seed­2.28/2.30 use different event mapping
    • Signal ● GJS ● actor.connect ("signal­name", callback) ● Seed ● actor.signal["signal­name"].connect (callback) ● actor.signal.destroy.connect (callback)
    • Presentation License CC Attribution 3.0 Unported http://creativecommons.org/licenses/by/3.0/
    • Images License Creative Commons (Attribution­Share Alike 3.0 Unported) http://www.iconfinder.com/search/?q=iconset:sketchy  http://www.iconfinder.com/search/?q=iconset:49handdrawing