English digest of the my blog posts 2013 oct to aug

I writen blog to software topics. Main theme is ubuntu and other.
Write japanese.
This page is English digest.
2013/10~8

Build Wine32bit

Ubuntu12.04 i386, WINE 1.7.8 32bit.

Tips build append procedule on Ubuntu 13.10.
Edit change to package manager setting text file.
sudo vi /etc/apt/sources.list.d/ubuntu-wine-ppa-saucy.list
in
"# deb-src http://ppa.launchpad.net/ubuntu-wine/ppa/ubuntu saucy main"
remove "#".

and other tips.

WINE notepad

Installing gstreamer-sdk and voice transfer ssh tunnel

(gstreamer-sdkの導入および、SSHによる音声の転送)

Build libssh2

In Ubuntu 13.04

Portable OpenCV develop environment

(USBメモリで持ち運べるOpenCV開発環境)

Release envidronment directory archives it in github.
Download is OpenCV version 2.2 and 2.4.6.

OpenCV simple develop directory and sctipts in one directory.
Compatible Windows and Linux (Ubuntu).
Relative path to OpenCV library and MinGW compiler. (Windows)

Installing many OpenCV cause dll hell.
This is avoid dependent machine, environment.

OpenCV build and camera

Note PC modding on the dual drive. SSD and HDD

(DVDドライブにHDDを格納して、ノートPCをSSD+HDDの2台搭載に改造)

HDD and mounter into space removing DVD drive.

SATA HDD mounter for drive space

English digest of the my blog posts 2013 dec to oct

I writen blog to software topics. Main theme is ubuntu and other.
Write japanese.
This page is English digest.
2013/12~10

POST from the fancyBox Form

 and Sample source.

fancyBox dialog sample message form

Ubuntu setting Suspend shortcut key

Release auto setting script. it in github. in add_shortcut.sh.

Shortcut key setting menu gui.

Ubuntu snap to impossible capture screen shots (configure timer shot)

Release auto setting script. it in github.in add_shortcut.sh.
Impossible screen shots is :
Canceling PrintScreen key apps. (example: calender widget)
Disappear window view because of send keys. (example: Menu bar).

Impossible shot (Ubuntu calender widget)

Ubuntu version shift 13.10 to 12.04

I shift to Ubuntu older version.
Failure to can't move user data.
Use of the package for newer Ubuntu.( not better technique)

This is danger technique. Example :  Ubuntu is broken.
Target package or there dependencies (search to depend package to use synaptic package manager).
Ubuntu packages page( or google search)
Keyword [ package_name ubuntu_version Ubuntu packages ] etc.
Download and install to .deb package.

Failure Liferea open browser and resolution setting

Liferea setting menu select browse

Failure Compress Big Zip file Error

Big zip archive (2GB over) Ubuntu 12.04, thereupon unpacking error for windows7.
Use of the zip archiving library package for newer Ubuntu.( not better technique)
Ubuntu12.04 "zip" package is 3.0-4.
Shift to zip 3.0-7(from Ubuntu 13.04) package

Package Dependencies

PCハードウェアを更新

PCハードウェアを更新しました。

新CPUを認識しているUbuntuの詳細画面

そもそもは64bit環境環境でWINEのビルドがしたかっただけなのですが、システムの調子が悪くなってしまったため、思い切ってハードウェアを更新しました。
消費電力は下がると思われますが、前回の構成から0.1Ghz クロックが落ちます。



新規購入したのは以下のパーツです

CPU：
  AMD  A8 6500
  Quad Code 3.5GHz (Turbo 4.1GHz)
マザーボード：
  ASRock FM2A85X Extreme4
  MiniATX, DDR3 x4スロット, SATA6.0G, CrossFire/HDMI/USB3.0
電源：
  玄人志向 KRPW-PT850W/92+
  80 PLUS : PLATINUM 認証

AMD  A8 6500
ASRock FM2A85X Extreme4
稼働状態

Ubuntu12.04 およびUbuntu13.10 にて、すべて問題なく動作しています。

2013年12月にUbuntu12.04をインストールした雑記(PPAの追加ほか)
にて言及しましたが、デュアルディスプレイにした際に、メインウィンドウがDVIではなくD-sub15ピン側になるのは、きっとそれをデフォルトにする何らかの理由があるのでしょう。

fancyBoxで装飾したフォームからPOSTを送信する

fancyBoxを使えば、ポップアップするコメント入力ダイアログなどを作ることができます。

下記サンプルを実行すると表示される入力ボックス

ユーザからの入力を受け取るには、POSTメッセージを使用します。
POSTメッセージの受信にはPHPが必要なので、サンプルはphpコードです。
phpを動作させるには、Webサーバ上に配置して、ブラウザからアクセスする必要があります。
当然ながら、本サンプルもWebサーバ上で使用する必要があります。

Ubuntu環境でapache2およびphpを導入するには以下のコマンドを実行します。
$ sudo apt-get install libapache2-mod-php5 -y

サンプル

サンプルを配置するディレクトリはWebサーバの公開ディレクトリ内であればどこでも構いません。
ただし、fancyBoxのディレクトリと相対パスが合っている必要があります。
(またはサンプル側のパスを修正する)
もし、下記のディレクトリ構成で配置するならば、
http://localhost/fancyBox/demo/formpost.php
にてブラウザからサンプルにアクセスすることができるはずです。

ディレクトリ構成

/var/www/
        fancyBox/
                demo/
                        formpost.php

本サンプルは、fancyBoxに付属しているデモページが指定している相対パスをそのまま使っています。

コード

<!DOCTYPE html>
<html>
<head>
    <title>fancyBox inline form POST</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

    <!-- Add jQuery library -->
    <script type="text/javascript" src="../lib/jquery-1.10.2.min.js"></script>
    <!-- Add fancyBox main JS and CSS files -->
    <script type="text/javascript" src="../source/jquery.fancybox.pack.js?v=2.1.5"></script>
    <link rel="stylesheet" type="text/css" href="../source/jquery.fancybox.css?v=2.1.5" media="screen" />

    <!-- fancyboxクラスにデフォルトの効果を適用 -->
    <script type="text/javascript">
        $(document).ready(function() {
            $('.fancybox').fancybox();
        });
    </script>
</head>
<body>

    <?php
        /*POSTされたコメントを表示する関数*/
        capture_comment();
    ?>

    <h1>fancyBox inline form POST</h1>

    <p>
        fancyBoxで表示したインラインフォームからPOST送信するサンプル
    </p>
    <a class="fancybox" href="#inline1">Inline form へのリンク</a>

    <div id="inline1" style="width:400px;display: none;">
        <h3>form POST用 インラインフォーム</h3>
        <p>
            インラインフォーム サンプル コメント投稿欄
        </p>
        <form action="<?php echo basename($_SERVER['PHP_SELF']) ?>?comment=true"
        method="post" enctype="multipart/form-data">
            COMMENT:<br/>
            <input type="text" name="comment" size="30" /><br/>
            <input type="submit" value="コメントをPOST" />
        </form>
    </div>

    <p>
        fancybox official site: <a href="http://fancybox.net/">fancybox.net</a></p>
    </p>

<?php
    /*POSTされたコメントを表示する関数*/
    function capture_comment(){
        if (!isset($_POST["comment"])){
            return false;
        }
        $eComment = nl2br(htmlspecialchars($_POST["comment"], ENT_QUOTES));
        print ("$eComment");
    }
?>

</body>
</html>

Coloring by SSSH

はじめてCodeMirrorを動かした際の手順とサンプルのソース

Webページ上で使用できるテキストエディタが欲しくなったので、既存のものを探したところ、CodeMirrorが良さそうだったので、まずは導入までの手順を確認しました。

(ただしbloggerに導入する方法はまた別の話なので、下のコードサンプルはWeb上にあるSSSHで変換したものです。)

CodeMirrorによる入力補完

プロジェクトディレクトリを作成

プロジェクトディレクトリ的なものを作り、シンプルな index.html を作成しておきます。

CodeMirrorはHTML, CSS, JavaScriptしか使用しないので、apacheなどのWebサーバがなくても、index.html ほか必要なファイルを格納したディレクトリがあれば、CodeMirrorを試すことができます。
今回はUbuntu12.04上でapache2を使用している前提で説明を行います。そうでない方は適切にディレクトリパスを読み替えてください。

管理者権限が必要ですが、以降、適切なパーミッションを設定して作業してください。
$ mkdir -p /var/www/prj/
$ cd /var/www/prj/
$ vim /var/www/prj/index.html

CodeMirrorを入手

CodeMirrorを導入します。
公式サイトから圧縮ファイルを取得しても良いのですが、今回はGitを使いました。
プロジェクトディレクトリに入った状態で git clone します。
$ git clone https://github.com/marijnh/CodeMirror.git

本番サイトでは、必要な最低限の lib, mod, css ファイルだけを置くべきなのですが、今回は公開するのではなく導入して動作確認するだけなので、すべて入ったリポジトリをページのディレクトリ直下に置いてしまいます。

CodeMirrorサンプルの確認

CodeMirroのソースには、多くのサンプルページが付属しています。今回はHTML5をオートコンプリートするサンプルを参考にしました。
でもページのファイルは「 CodeMirror/demo/html5complete.html 」です。
デモは公式のデモページ、またはオフラインでも見ることができます。
(該当サンプルはHTML5を対象としているので、JavaScriptとcssも効果が有効になっています。)
プロジェクトディレクトリの準備の項目と同じ条件で作っていれば、ブラウザで
http://localhost/prj/CodeMirror/demo/html5complete.html
にアクセスすれば、公式デモと同じページをオフラインで見ることができると思います。

このサンプルは、devタグ要素を置き換えてtextareaを作成し、サンプルコード自身を読み込んで表示するという仕組みになっています。
実際にCodeMirrorを使用するにあたっては、これらの設定を書き換える必要があります。

CodeMirrorを使う

index.htmlに組み込む

WebページをHTMLで書いて、その中でCodeMirrorを呼び出します。
HTMLソースはページの下に置いておきました。

オートコンプリートのキーバインドは、サンプルで割り当てられている Ctrl+Space とします。
Ubuntuデスクトップの場合、Ctrl+Spaceには日本語入力モード切り替えのショートカットが割り当てられています。このままではCodeMirrorのオートコンプリートを試すことができないので、設定を削除しておきます。

サンプルページの確認方法

以上の手順が済んでいれば、あとはCodeMirrorの動作を確認するだけです。

Apache2 Webサーバを導入して上記ディレクトリ構成に配置した場合、
 http://localhost/prj/CodeMirror/demo/html5complete.html
にて作成したサンプルページを確認することができます。

ApacheなどのWebサーバを導入していない場合でも、前述の通りCodeMirrorおよび今回のサンプルはJavaScriptのみを使用しているため、index.htmlをブラウザで直接開けば動作を確認することができます。

HTML要素の補完候補を表示

サンプルプロジェクトの構成

サンプルプロジェクトのディレクトリ構成

/var/www/                (apache2 のディレクトリ)
                prj/        (プロジェクトディレクトリ)
                        index.html        (ページ本体)
                        CodeMirror/               (CodeMirrorのリポジトリ)
                                mods/               (CodeMirrorのリポジトリ)
                                libs/               (CodeMirrorのリポジトリ)

index.html ソース

<!doctype html>
<html>
<head>

    <!-- CodeMirrorのコア部分を読み込む -->
    <script src="CodeMirror/lib/codemirror.js"></script>
    <link rel="stylesheet" href="../CodeMirror/lib/codemirror.css">
    <script src="CodeMirror/mode/javascript/javascript.js"></script>

    <!-- 使用したい言語のアドオンを読み込む -->
    <link rel="stylesheet" href="../CodeMirror/addon/hint/show-hint.css">
    <script src="../CodeMirror/addon/hint/show-hint.js"></script>
    <script src="../CodeMirror/addon/hint/xml-hint.js"></script>
    <script src="../CodeMirror/addon/hint/html-hint.js"></script>
    <script src="../CodeMirror/mode/xml/xml.js"></script>
    <script src="../CodeMirror/mode/javascript/javascript.js"></script>
    <script src="../CodeMirror/mode/css/css.js"></script>
    <script src="../CodeMirror/mode/htmlmixed/htmlmixed.js"></script>

</head>
<body>

    CodeMirror Test.<br>
    <br>

    <!-- CodeMirrorで効果を加える対象のテキストエリア(ID属性を付与) -->
    <textarea id="myTextarea"></textarea>

    <!-- CodeMirror適用。対象のtextareaをID属性で指定 -->
    <!-- HTMLの表示と入力補助、入力補完、行番号を有効化 -->
    <script type="text/javascript">
        var myCodemirro = CodeMirror.fromTextArea(
            document.getElementById('myTextarea'), {
                mode: 'text/html',
                extraKeys: {"Ctrl-Space": "autocomplete"},
                lineNumbers: true
        });
    </script>

</body>
</html> 

上のカラーリングはCodeMirrorではなく、自作した静的ハイライト生成サービスの SSSH を使っています。
JavaScriptを使わずに静的にシンタックスハイライトしたい場合や、CodeMirrorを導入できない環境である方は、そちらをどうぞ。

サスペンドをショートカットに追加する(Ubuntu12.04)

PCが起動するのを待ちたくないので、いつもシャットダウンではなくサスペンドを使用しています。
Ubuntuにはサスペンド機能のショートカットや設定項目が存在しません。そこで、サスペンドを行うキーボードショートカットを Ubuntu に追加する設定をしました。

追記：Githubにてサスペンドのショートカットを簡単に追加できる bashスクリプトを公開しました。

サスペンドをショートカットに設定するスクリプト(簡易版)を実行した結果

サスペンドを行うためのコマンドを探し、それをキーボードショートカットに登録します。
環境は Ubuntu 12.04 です。

コマンドによるサスペンド

サスペンドのコマンドはこちらから。すぐに見つかります。
下記コマンドでサスペンド可能であることを確かめてください。
(注意：成功すればサスペンドします。失敗するとシステムが停止することもあり、再起動しなければならなくなるので注意してください。)
dbus-send --system --print-reply --dest="org.freedesktop.UPower" /org/freedesktop/UPower org.freedesktop.UPower.Suspend

コメントによると、「pmiコマンドのソースを覗いたらこうやっていたよ」ということのようです。将来この方法が使えなくなった際に困らないよう、素直にpmiコマンドを導入しておいたほうが良いかもしれません。
とはいえ、上記コマンドを使用する今回の方法では、下記のインストールは不要です。
sudo apt-get install powermanagement-interface

また、検索によく引っかかる「 apt-get install hal 」も、Ubuntu 12.04環境では不要かと思われます。
すくなくとも私の環境では不要だったのですが、ハードウェア環境によっては必要になるのかもしれません。

当然ながら、通常操作によるサスペンドに失敗するハードウェア環境では、コマンドによるサスペンドも上手く行きません。事前に確認してください。

キーボードショートカットへの登録

コマンドライン上で gconftool-2 を使用して、ショートカットキーを設定します。
システムのキーボードからショートカットを追加してもよいのですが、今回はコマンドラインにて作業を行います。

以下のコマンドにて設定ファイルに書き込むことで、キーボードショートカットを使用することができます。


サスペンドのキーボードショートカット設定は以下の通りです。
#設定を書き込む前に、gconfデーモンを停止させておく
$ gconftool-2 --shutdown
#ショートカット設定の名前
$ gconftool-2 -t str --set /desktop/gnome/keybindings/custom1/name "サスペンド"
#割り当てるキー
$ gconftool-2 -t str --set /desktop/gnome/keybindings/custom1/binding "<CTRL><SHIFT><ALT>l"
#割り当てるコマンド
$ gconftool-2 -t str --set /desktop/gnome/keybindings/custom1/action 'dbus-send --system --print-reply --dest="org.freedesktop.UPower" /org/freedesktop/UPower org.freedesktop.UPower.Suspend'


上記のコマンドを実行すると、ショートカットの情報を記録した設定ファイルが作成されます。
Ubuntu 12.04における設定ファイルへのパスはこちらに。
以下のコマンドで設定ファイルを見ることができます。
(Ubuntu 12.10から、設定ファイルのパスが変わっているようです。)
less  ~/.gconf/desktop/gnome/keybindings/custom1/%gconf.xml

上記の設定が追記されているのを確認できると思います。
「設定」からも、GUI上でショートカットキーが追加されているのを確認できます。

「 $ gconftool-2 --shutdown 」コマンドを打たずにショートカットキーを登録すると、gnomeデスクトップの表示がおかしくなる場合があります。
これは、ログアウトするか再起動すれば直ることがあります。
直らなかった場合、GConfの設定を、ディレクトリごと破棄すると解決します。
(下記のコマンドはバックアップを行っている。)
$ mv ~/.gconf/ ~/.gconf-back
デフォルト値にリセットするコマンドも存在するようですが、私の環境では上手くいきませんでした。

メニューバーなどの表示がおかしくなってしまったGnomeデスクトップ

デフォルトで存在するショートカット項目の設定は、別の場所に保管されているらしく、上記の設定削除を行ってもリセットされません。
また、デフォルトのショートカット項目と、カスタムショートカットでキーの割り当てが被る場合、デフォルトの項目が優先されます。
その他の設定ファイルおよびディレクトリのパスについては、以下が詳しいです。
http://docs.oracle.com/cd/E19253-01/819-0665/gconf-0/index.html


複数のショートカットキーを登録したい場合、gnoftool-2に指定する設定の custom1 の数字の部分を変更します。
シェルスクリプトで自動設定するならば、事前にキーの存在を確認して上書きを避けるように書くかと思います。今回は人間が作業したので、作業者が目視確認すれば十分でした。

シェルスクリプト版

おまけとして、以下にキーボードショートカット設定シェルスクリプトのサンプルを置いておきます。


#!/bin/bash
#キーボードショートカット設定スクリプト
#

#設定前にgconfデーモンを停止させておかないと、
#gnomeデスクトップ表示が乱れて元に戻らなくなることがある(Ubuntu12.04にて確認)
gconftool-2 --shutdown




#パスの custom* は、重複するものが他にあれば上書きされる。
#上書きを避けたければ事前にチェックする必要がある。
gconftool-2 -t str --set /desktop/gnome/keybindings/custom1/name "サスペンド"
gconftool-2 -t str --set /desktop/gnome/keybindings/custom1/binding "<CTRL><SHIFT><ALT>l"
gconftool-2 -t str --set /desktop/gnome/keybindings/custom1/action 'dbus-send --system --print-reply --dest="org.freedesktop.UPower" /org/freedesktop/UPower org.freedesktop.UPower.Suspend'

gconftool-2 -t str --set /desktop/gnome/keybindings/custom2/name "タイマー撮影でスクリーンショットを撮る"
gconftool-2 -t str --set /desktop/gnome/keybindings/custom2/binding "<Super>Print"
gconftool-2 -t str --set /desktop/gnome/keybindings/custom2/action 'gnome-screenshot --delay=5'

以上です。

PrintScreenキーでは撮れないスクリーンショットを撮る(Ubuntu12.04でコマンドによるタイマー撮影)

追記：Githubにて「スクリーンショットのタイマー撮影」ショートカットを簡単に追加できる bashスクリプトを公開しました。

通常、スクリーンショットを撮りたければPrintScreenキーを押すだけで十分です。

しかし、UnityのDash、メニューバーを展開した状態、Webページのドロップダウンリスト、ポップアップメッセージなどを撮りたい場合、PrintSceenキーではこれらのスクリーンショットを取得することができません。

具体例としては、PrintScreenキーでは、上に載せたようなカレンダーウィジェットのスクリーンショットを撮ることができないと思います。試してみてください。

Ubuntu12.04のカレンダーウィジェット

スクリーンショットが撮れない状態では、PrintScreenキーを押しても無視されます。
あるいはPrintScreenキーを押す操作によってキャプチャしたい操作状態がキャンセルされてしまい、スクリーンショットを撮ることができない場合もあります。

コマンドによるタイマー撮影

以下のコマンドを使えば操作中のスクリーンショットを簡単に取得することができます。
$ sleep 5 ; gnome-screenshot


カメラの「タイマー」相当の機能を、コマンドによって実現しています。
このコマンドを実行すると、5秒後にスクリーンショット撮影のエフェクトが発生し、デスクトップにスクリーンショット画像が作成されているはずです。
この方法ならばさらに、両手が必要でスクリーンショットを撮ることができない操作であっても、PrintScreenキーを押せない状態でスクリーンショットを撮ることができます。

GIMPのメニューバーを開いた状態のスクリーンショット

コマンドラインから実行できるスクリーンキャプチャには、他にも、
import xwd scrot shutter
などがありますが、「http://d.hatena.ne.jp/ohnishiakira/20110120/1295536656」にて紹介されているように、import, xwdには「ウィンドウの透過がスクリーンショットに反映されず、綺麗なスクリーンショットが撮れない」という問題が起こります。
また、 scrot や Shutter は使用する前にインストールしておく必要があります。

gnome-screenshot はUbuntuにデフォルトでインストールされているため、ソフトウェアを追加でインストールする必要がありません。

ただし、 VirtualBox 4.3環境で Unity デスクトップを撮れないようです。
上手く行かなかったら他のアプリケーションを試しましょう。

VirtualBox4.3 Unity デスクトップにてスクリーンショット取得失敗の様子

なお、gnome-screenshot コマンド自体のオプションにタイマー撮影機能が存在します。
わざわざsleepを使ったのはなんとなくです。
トップウィンドウのみをキャプチャするオプションも存在します。
ただし、ウィンドウ領域からはみ出すと、バーや通知は見切れてしまいます。
基本的には全画面をキャプチャしたスクリーンショットを取得してから、GIMPなどで切り出す手法を取るのが確実です。

キーボードショートカットでタイマー撮影ができる設定を行う

設定の「キーボード」から「ショートカット」を選択して、
Shift+PrintScreenを割り当ててしまいました。

ショートカット追加のボタンと、スクリーンショットのショートカット

ショートカットで実行するコマンドには、連続する複数のコマンドは指定できません。
そこで、gnome-screenshotの持つタイマー撮影オプションを使用します。
コマンド(O)に、
gnome-screenshot --delay=5
を書き込みます。
秒数は使いやすいように調整してください。

独自のショートカット設定を追加

ショートカットキーはわかりやすいように、「選択領域のスクリーンショットを撮る」に使われているショートカットの Shift+Print を 割り当てることにしました。
私はこの機能を使わないのでショートカットキーの割り当てを上書きしてしまいましたが、それで困る場合は別のショートカットキーを割り当ててください。

ショートカットキーの割り当て

 以上で、ショートカットキーによるタイマー撮影を実現することができます。