2012年12月26日水曜日

Titanium SDK 3.0からのTitanium CLIを使ってみる

titanium_cliTitanium SDK 3.0のReleaseに新しいcommand-line interface(CLI)が含まれていたので使ってみた。

Titanium SDK 3.0.0に関してはOfficial Siteを参考に。

環境: Titanium SDK 3.0.0, node.js v0.8.16, titanium@3.0.22

 

今までも可能だったけど、いくつか設定が必要だった。詳しくは前の記事を参考に。

3.0.0からのTitanium CLIを使うとProjectの作成、BuildまでをCommand-lineで完結できるようになる(Titanium Studioを起動する必要がない)。

参考にしたSite.

 

まずは準備。

node.jsのInstallが必要らしい。私はAlloyを試したときにInstall済みなのでそちらの記事を参考に。

node.jsがIntasllされている環境だと、自動でInstallされるみたい。

 

使い方。

Project Folderに移動して下記Commandを実行
$ cd Documents/Titanium\ Studio\ Workspace/hoge
$ titanium build -p ios --log-level trace

Optionの意味は
$ titanium build -h
が一番詳しい。

 

 

< Related Posts >

2012年12月10日月曜日

XHProf + XHGuiをInstallしてPHPの実行結果を監視、解析する

php_profilerXHProfが便利と教えてもらったのでInstallしてみたときの覚書。

環境: CentOS 5.8, PHP 5.3.19, XHProf 0.9.2 (beta), nginx 1.2.5, mysql 5.5.28, Graphviz 2.12

参考にしたのは下記Site

 


Install XHProf

PECL(ピクル)に対応しているので、Install自体は簡単。
# pecl install xhprof-0.9.2

設定Fileを作成
# vi /etc/php.d/xhprof.ini

extension=xhprof.so

# /etc/rc.d/init.d/php-fpm restart

 


Install XHGui

preinheimer/xhprof@GitHubからDownloadする。mysql serverはInstallしてある前提。

どこかに配置してconfigを設定
# cd /opt/xhprof/xhprof_lib/
# cp config.sample.php config.php
# vi config.php

$_xhprof['dbtype'] = 'mysql'; // Only relevant for PDO
$_xhprof['dbhost'] = 'localhost';
$_xhprof['dbuser'] = 'root';
$_xhprof['dbpass'] = 'password'; // ※変更
$_xhprof['dbname'] = 'xhprof';
$_xhprof['dbadapter'] = 'Mysql'; // ※変更
$_xhprof['servername'] = 'myserver'; // ※変更
$_xhprof['namespace'] = 'myapp'; // ※変更
$_xhprof['url'] = 'http://url/to/xhprof/xhprof_html'; // ※変更

$controlIPs = false; //Disables access controlls completely.
//$controlIPs = array();
//$controlIPs[] = "127.0.0.1";   // localhost, you'll want to add your own ip here
//$controlIPs[] = "::1";         // localhost IP v6

MySQLに「xhprof」というDatabaseを作る。

xhprof_lib\utils\Db\Mysql.php内のCreate table文を実行。

xhprof_htmlを公開する。

# vi /etc/nginx/conf.d/hoge.conf

server {
    listen       80;
    server_name  xhprof.hoge.com;

    root    /opt/xhprof/xhprof_html/;
    index   index.php index.html index.htm;
    charset utf-8;

    location = /robots.txt  { access_log off; log_not_found off; }
    location = /favicon.ico { access_log off; log_not_found off; }

    location ~* \.php$ {
        expires off;
        include        fastcgi_params;
        fastcgi_pass  127.0.0.1:9000;
        fastcgi_index index.php;
        fastcgi_param  SCRIPT_FILENAME  $document_root$fastcgi_script_name;
    }

    location ~ /\. {
        deny  all;
        access_log off;
        log_not_found off;
    }
}

解析したいSiteにheader.phpとfooter.phpを自動で追加するような設定をする。下記Siteを参考に。

# vi /etc/nginx/conf.d/wordpress.conf

server {

    ・・・

    location ~* \.php$ {
        expires off;
        include        fastcgi_params;
        fastcgi_pass  127.0.0.1:9000;
        fastcgi_index index.php;
        fastcgi_param  SCRIPT_FILENAME  $document_root$fastcgi_script_name;
        fastcgi_param  PHP_VALUE   "auto_prepend_file=/opt/xhprof/external/header.php \n auto_append_file=/opt/xhprof/external/footer.php"; // この行を追加
    }

}

再起動
# /etc/rc.d/init.d/nginx restart
# /etc/rc.d/init.d/php-fpm restart

これで解析したいSiteのURLに「_profile=1」を付けてアクセスすると、以降は自動で解析し続ける。(Cookieに保存しているから)

停止するときは「_profile=0」を付けてアクセスする。

例えば

http://wordpress.hoge.com/?_profile=1

に接続すれば解析が始まる。

 


Callgraphを使えるようにGraphvizもInstall

Installはyum経由で
# yum install graphviz graphviz-gd

config.phpを編集
# xhprof_lib/config.php

$_xhprof['dot_binary']  = '/usr/bin/dot';
$_xhprof['dot_tempdir'] = '/tmp';
$_xhprof['dot_errfile'] = '/tmp/xh_dot.err';

こんな感じに表示される。

 

callgraph.php

どの処理が遅いか見つけるのに役に立ちそう。

 

< Related Posts >

2012年12月4日火曜日

[Titanium Mobile] WebView内のScrollを無効(Disable)にする

titanium_webview_scroll-rockWebViewを画面の中に組み込んでクリックは有効にしたいけど、スクロールは無効するTips。

環境: Titanium SDK 2.1.4

「scrollable」は効かなかった。「disableBounce」だけではダメ。「touchEnabled」はClickも無効になってしまう。

Official Forumではhtml内に

document.ontouchmove = function(event){ event.preventDefault(); }

を記述する方法があるけど、親の画面のスクロールまで無効にしてしまう。

そこで、辿り着いたのがhtmlのCSSに

html, body {overflow:hidden;}

を記述する。これで大丈夫そう。

Sample Code

var html = [];
html.push('<!DOCTYPE html>');
html.push('<html>');
html.push('<head>');
html.push('<style>');
html.push(' html, body {overflow:hidden;}');
html.push('</style>');
html.push('</head>');
html.push('<body>');
html.push(content);
html.push('</body>');
html.push('</html>');

var view = Titanium.UI.createWebView({
    html: html.join(''),
    disableBounce: true,
    width: Titanium.UI.FILL,
    height: Titanium.UI.SIZE
});

 

WebViewのheightをコンテンツのサイズに合わせるのは前の記事を参照。

 

< Related Posts >

2012年12月3日月曜日

[Titanium Mobile] WebView内のLinkをClickしたときにSafariで開く

titanium_webview_safariWebView内のリンクをクリックしたときに遷移せず、イベントだけアプリに通知して、ブラウザを起動する方法。

環境: Titanium SDK 2.1.4

下記のようにHTML内にイベント通知用のJavaScriptを埋め込む。

//
// HTMLを生成
//
var html = [];
html.push('<!DOCTYPE html>');
html.push('<html>');
html.push('<head>');
// window.onload用のJavaScriptを追加
html.push(getOnloadJavaScript());
html.push('</head>');

// Add body content
html.push('<body>');
html.push(content);
html.push('</body>');
html.push('</html>');

webview = Titanium.UI.createWebView({
    html: html.join('')
});

//
// window.onloadで実行するJavaScriptを文字列で返す
//
var getOnloadJavaScript = function() {
    // 全てのaタグのonclickイベントにフックする
    var linkClick = function() {
        var links = document.getElementsByTagName('a');
        for (var i=0; i<links.length; i++) {
            links[i].onclick = function(e) {
                var params = {};
                var elem = e.srcElement;
                if (elem) {
                    params.href = elem.getAttribute('href') || '';
                    params.className = elem.getAttribute('class') || '';
                    params.id = elem.getAttribute('id') || '';
                    params.title = elem.getAttribute('title') || '';
                }
                // Fire application event.
                Titanium.App.fireEvent("app_webview_open_link", params);
                return false;
            };
        }
    };

    var script = [];
    script.push('<script>');
    script.push('window.onload = ' + linkClick.toString());
    script.push('</script>');
    return script.join('');
};

 

あとはアプリ側でEventを受け取る処理を記述。

Titanium.App.addEventListener('app_webview_open_link', function(e) {
    console.log(e);
    if (e.href) {
        // Open browser
        Titanium.Platform.openURL(e.href);
    }
});

 

 

< Related Posts >

Related Posts Plugin for WordPress, Blogger...

Blog Archives