Twitter with Maleo

twitter-logo

Can twitter run with Maleo? Yes, it can.

Lets try it. (If you have not installed maleo, you can read this guide)

  1. Create folder for twitter
    $ cd ~/src/ && mkdir twitter-maleo && cd twitter-maleo
  2. Create config.xml fill with this code from github,
  3. Create index.html with fill with this code from github,
  4. Testing run maleo from folder malio
    $ cd ~/src/maleo/build
    $ ./maleo ~/src/hello
  5. Or you can clone this repo from my github account
    $ git clone https://github.com/tuanpembual/twitter-maleo.git

Done!

Estu~

Advertisements

Instagram with Maleo

instagram

Do you have istagram account? Yes I do.

After testing run simple page with maleo, I want try run Instagram with maleo. It is like have a instagram desktop apps. (If you have not installed maleo, you can read this guide)

Lets do it.

  1. Create folder for instagram
    $ cd ~/src/ && mkdir instagram-maleo && cd instagram-maleo
  2. Create config.xml fill with this code from github,
  3. Create index.html with fill with this code from github,
  4. Testing run maleo from folder maleo
    $ cd ~/src/maleo/build
    $ ./maleo ~/src/hello
  5. You can clone this repo too from my friend github account
    $ git clone https://github.com/cho2/instagram-maleo.git

Done! Next sample is run twitter with maleo. Oh, I have one issue to this sample. I just want make this simple apps can be installed with zypper tool in openSUSE. So I need help to package this app to be rpm file and create to own repository. Something like maleo’ repository for openSUSE. Feel free to contact me if you have interest about this issue.

Estu~

Run Simple HTML5 Page with Maleo

Stavenn_Maleo
Foto by: By Stavenn (Own work) [CC BY-SA 3.0]
Retrived from here.

After maleo built and installed, lets run simple html5 page with Maleo. What we needs are two file. config.xml and index.html.

Lets do it:

  1. Create new folder for this app
     $ cd ~/src && mkdir hello && cd hello
  2. Create config.xml, fill this code
    $ vim config.xml
    <?xml version="1.0" encoding="UTF-8"?>
    <widget id="id.blankon.hello" version="1.0.0"
    xmlns="http://www.w3.org/ns/widgets"
    width="400"
    height="200">
    <name>Hello</name>
    <description>
    Hello
    </description>
    <content src="index.html"/>
    </widget>
  3. Create index.html with contain this code
    $ vim index.html
    <!DOCTYPE HTML>
    <html>
    <head><title>hello</title
    </head>
    <body>
    <center>
    <h2>Hello World! </h2><br/> <p>-maleo</p>
    </center>
    </body>
    </html>
  4. Test run it from maleo build folder.
    $ cd ~/src/maleo/build
    $ ./maleo ~/src/hello

Done!
Next step, run instagram and twitter with maleo.

 

Build and Install Maleo on openSUSE Leap 42.1

Stavenn_Maleo
Foto by: By Stavenn (Own work) [CC BY-SA 3.0]
Retrived from here.

After install seed, lets prepare to build maleo.

  1. Clone repo
    $ cd src
    $ git clone https://github.com/rockybars/maleo.git
  2. Install deps
    $ sudo zypper in vala cmake
  3. Lets build maleo
    $ cd maleo && mkdir build && cd build $ cmake ..
    $ make
    $ ./maleo –version
  4. Build extension webkit2
    $ cd maleo/src/extension
    $ make
  5. Copy maleo-server.so to build folder
    $ cp maleo-server.so ../build
    $ ls
    maleo maleo-server.so
  6. Testing maleo
    $ cd src/maleo/build
    $ ./maleo ../examples/hello

gif by dhiorahman
from: http://g.recordit.co/s97AmmE1PG.gif

Yups. Done! Next make simple app run with maleo

Estu~

Build and Install Seed on openSUSE Leap 42.1

gnome-logo

I need seed to build maleo for openSUSE. Here we go base on this gist:

  1. Install tools devel
    $ sudo zypper in -t pattern devel_basis
  2. Install deps for build seed
    $ sudo zypper in git gnome-common webkit2gtk3-devel libffi-devel-gcc5 gobject-introspection-devel gnome-js-common sqlite3-devel dbus-1-glib-devel mpfr-devel
  3. Clone repo seed with patch. The difference is in this line.
    $ cd ~ && mkdir src && cd src
    $ git clone https://github.com/rockybars/seed.git
  4. Start run autogen.sh
    $ cd seed
    $ ./autogen.sh
    $ make
    $ sudo make install
    $ sudo ldconfig –print | grep libseed

Done!! Lets do next step. Build maleo.

Estu~

Make Simple HTML Page from Vala

Lets start with simple scenario. Here is a sample code, which I try to combine JavaScript to call a function contained in a program written in Vala. or some people call it bindings.

We need 3 file. main.vala, index.html, binding file. I made this page still static.

main.vala

using Gtk;
using WebKit;
 
namespace WebKit {
    public extern static unowned JS.Context web_frame_get_global_context (WebFrame frame);
}
 
/**
 * Registers a JavaScript function to a WebView
 */
void register_js_function (WebView webview, string name, JS.Callback callback) {
    var frame = webview.get_main_frame ();
    unowned JS.Context ctx = web_frame_get_global_context (frame);
    unowned JS.Object global = ctx.get_global_object ();
    unowned JS.Object func = ctx.make_function_with_callback (null, callback);
    ctx.set_property (global, new JS.String (name), func);
}
 
 
JS.Value? say_hello_callback () {
    stdout.printf ("Apa kabar dunia!\n");
    return null;
}
 
void main (string[] args) {
    Gtk.init (ref args);
    var window = new Window ();
    window.destroy.connect (Gtk.main_quit);
    var webview = new WebView ();
    register_js_function (webview, "ucapkanHalo", say_hello_callback);
    webview.open ("file:///home/tuanpembual/Documents/Kerjaan/valasample/index.html");
    /* change index.html based on your path */
    window.add (webview);
    window.show_all ();
    Gtk.main ();
}

Continue reading “Make Simple HTML Page from Vala”

Weapon Preparation to Code in Vala

Before start coding vala, webkit and jscore. We should install some packages. I run BlankOn Linux, debain based in my macbook.

Lets prepare :

0. Install vala
$ sudo apt-get install valac

1. Install some liblaries
$ sudo apt-get install libglib2.0-dev libglib2.0-doc libgtk-3-dev
libwebkitgtk-dev libwebkitgtk-3.0-dev libjavascriptcoregtk-1.0-dev libjavascriptcoregtk-3.0-dev

2. Install text editor, I using sublime text 3 and add vala packages [0]

Lets code..

Ref:
[0] https://wiki.gnome.org/Projects/Vala/SublimeText2
[1] https://sublime.wbond.net/installation

Regard
Tuan Pembual