Firefox Search

先程 Fedora 20 Update で Firefox が 29 になった。
ヲタ共には Google Chrome サルマネになったと話題みたいだが。

firefox_search_bar

ついに検索バーが消せる（隠せる）ようになったぞ！
下記動画のように DnD すれば検索バーもメニューに移動できる。
What’s new in Firefox? – YouTube

もちろんそのまま検索バーとして利用できるのだけど。
知っていると思うけど最近の Firefox はアドレスバーで検索できる。
元々 Opera の機能だったキーワード検索も Chrome 同様に可能。
たとえば Youtube の検索窓で右クリックして「この検索にキーワードを設定」を選択。

firefox_youtube_search

適当なキーワード（上記は yt ）を設定し保存。
Opera や Chrome と違いブックマークに保存されるけど使い方は同じ。
後は Ctrl+T or Ctrl+L から [yt 検索文字列] でオケ。

英語版 Google みたいな検索も自分でブックマークに登録で使える。
ブックマークサイドバーを表示して右クリからね。

http://www.google.com/search?&hl=en&lr=lang_us&q=%s

随分前からコレができたはずなのにバーが消せないのが不思議だった。
スマートフォンに慣れてしまった目からは余計なものでしかない。
iPhone, Android 共に標準ブラウザがアドレスバーで検索ですし。

chrome_and_forefox

しかしこうするとどっちがどっちか判らなくなりそうだけど。
スクロールバーが GTK+ 標準のままなのが Firefox だな。

気のせいか初期化も早くなった感じ。
アドオンはゼロですけど、だって初期化が遅過ぎでまったく使っていなかったし。

自サイト表示確認の為に Chrome は今後も入れ続けるわけだが。
普段はどちらをメインに使うか少し迷う所。

Ctrl+F でハイライトがデフォルトではないのが少し残念。
逆にハイライトにすると Esc でハイライトのままなのも残念。
とはいえ、スクロールは Firefox のほうがスムースなんだよな。
Ctrl+U が別ウインドウになるとかはどっちでもいいし。

キーボード操作等はほぼ同じだし筆者の使う範囲での違いは上記程度。
他は何が違うの？ってやっぱりサルマネですわ。

**********

関係ないけど。
Wordpress 投稿で文字列の OLE DnD ができなくなって面倒臭い。
いつも Gedit で書いて Ctrl+A から文字列ドラッグで投稿していた。
のだけどこの操作は画像の投稿に変更となっちゃっているよ、まいった。

Gtk+ 3.10 on Ubuntu 14.04

Ubuntu 14.04 が出たが Fedora な筆者はどうでも…よくない。
GtkHeaderBar や GtkStackSwitcher は Unity 環境ではどうなるか確認せねば。
使用感とかは他人に任せてと。

筆者が書いた下記サンプルコードで試してみる。
GTK+ 3.10 – L’Isola di Niente

gtkheaderbar

GtkHeaderBar はそのまま使えるけど標準とは異なるものになってしまう。
つまり標準の Nautilus とかは改造しているということだったのか。

それに枠に影がなくなるのでウインドウが重なると境界が解らない。
更に最大化しても上部バーと一体化せず一段下へと標準とは異なる動作に。
というか、リサイズできなくなる。

なんだよ、つまり GtkHeaderBar は使えないということじゃないか。
詰めが甘いのか意図的なのかは解らないけど。
GtkStack, GtkStackSwitcher, GtkListBox は問題なく使えるようです。

GtkHeaderBar and GStreamer | PaePoi

GTK+ 3.10 なのだからこの動画の画面が出ない症状は同じだった。
いや GNOME だと真っ黒だけど Unity だと透明になる、音だけなのは同じ。
でも Totem 3.12 は GtkHeaderBar 採用になっているんだよな。
このあたりは Fedora 21 の時に。

appmenu

ApplicationMenu は GNOME と同様になるようにしたようです。
なのに何故か Nautilus 等のメニューバーは古いものを採用。

nautilus_gnome

menubar_ubuntu

同じ Nautilus 3.10.1 のはずなのに何だよこの違い。
というかこれなら 3.8 のままでいいじゃないか、と思うのだが。

他にも GNOME 3.10 を知っている人ならツッコミ所が多々。
3.10 で GtkStackSwitcher になった部分が全部 GtkNotebook に変更って。
ユニバーサルアクセス設定等の GtkListBox も同様、これは古いアプリのまま？
GtkHeaderBar 以外は特に問題ないのに何故古いままな UI に戻すやら。

他にも GNOME がボタンをアイコン化した部分等も何故か文字列ボタンに戻している。
GNOME プロジェクトの成果物に昔ながらの UI をわざわざ被せた感じ。
おかしいな、Unity ってタッチパネル向けに振った UI じゃなかったか？

独自にやっていたらベースの GNOME アプリ側もやってきたので色々あるだろうけど。
3.12 は Gedit も Totem も GtkHeaderBar になるんだが、どうするのだろう。

当面 GTK+ アプリは Unity 環境専用ビルドを別途で用意する必要あり。
なんて嫌だぞこのやろう。

xkill

最近 xkill というコマンドを知った。
今まで debug 中の自作 GUI アプリを強制終了する場合は端末を起動し

ps ax | grep hoge
12345 ****
kill 12345

kill

みたいに古臭い手段でやっていた。
xkill ならコマンド実行後にマウスでクリックするだけ、簡単すぎ。

端末から debug 起動なら端末を終了すればいいけど筆者は下記なので。
Gedit で Python スクリプトを debug – L’Isola di Niente

とはいえ今時の Linux では debug の時くらいしか利用しないコマンド。
いざ必要になった時にコマンドを忘れてしまう、筆者だけかそんな奴。
なので忘れてもいいように Gedit から起動するように外部ツールに登録。

xkill

これでスクリプトの debug が少し楽になるといいな。
Python はまだいい、Gjs ってエラーも吐かずにフリーズが多すぎる…

JavaScript Touch Events

iPhone に変更してからスマホゲームを始めた。
ひたすらポチポチするだけだとバカにしていたがコレが意外に面白い。

こんなのを Web アプリで作ってみたい、ということで。

とりあえず画面をポチると少しずつ一行文字列が流し込まれていく方法を。
エロゲでよく見かけるやつね、凄く古いのしか知らないけど。

ソレっぽいワードで検索すると基本みたいなのは日本語でゴロゴロ出る。
筆者メインの Python for GTK+ じゃ英語しか見つからないので逆に戸惑うよ。

JavaScriptプログラミング講座【タッチスクリーン操作について】

addEventListener で touchend のハンドラを処理すればよさそう。
それだけだとパソコンからは動かないので mouseup も同じハンドラで。
touchstart, mousedown ではないのはオンラインソフトでの経験から。

JavaScriptを解説します

文字列流し込みはこの上書きする手段がよさそう。
しかし clearInterval しなくてもいいのかな？
しかしみんな関数名が、GTK+ を主に使っていると凄く気になる。

結構簡単に作れたけど色々問題があった。
touchend, mouseup 両方を Android Chrome は拾ってしまう。
表示が終る前にポチるとハンドラが多重発生してしまう。
表示が終わるまで何らかの手段で排他制御を行うしかないな。

removeEventListener で一時ハンドラを外す方法が沢山見付かる。
でも筆者の実装手段が悪いのかうまくいかない。
最適ではないかもだけど下記がうまくいった方法。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<!-- for Smart Phone -->
<meta name="viewport" content="
    width=device-width,
    initial-scale=1.0,
    minimum-scale=1.0,
    maximum-scale=1.0,
    user-scalable=no" />
<title>test</title>
<script type="text/javascript"><!--

    var count = 0;
    var lock = false;
    var lines = [
        "JavaScript で一文字ずつ表示する。",
        "日本語(Japanese)も一文字として扱ってくれるよ。",
        "end." ];

    // Text Out Function
    var writeLine = function(line) {
        lock = true;
        var i = 0;
        var id = null;
        var setText = function() {
            if (i <= line.length) {
                document.getElementById("text_area").innerHTML = line.substring(0, i);
                i++;
            } else {
                clearInterval(id);
                lock = false;
            }
        }
        id = setInterval(setText, 50);
    }
    // Event Handler
    var onTouchEnd = function() {
        if (lock == false) {
            if (count < lines.length) {
                writeLine(lines[count]);
                count++;
            }
        }
    }
    // Connect
    var init = function() {
        if (window.TouchEvent) {
            document.getElementById("event_check_area").innerHTML = "Support the Touch Events.";
            document.addEventListener("touchend",onTouchEnd);
        }
        document.addEventListener("mouseup",onTouchEnd);
    }
    //-->
</script>
</head>
<body onLoad="init()">
<p id="event_check_area">Don't Support the Touch Events.</p>
<p id="text_area"></p>
</body>
</html>

touch_event

iPhone, Android でもうまくいった、IE はしらない。
しかし Google Chrome は Linux デスクトップ版もタッチ対応なのか。
意味があるのかな？

あとはエレメントを特定 canvas にして美少女画像を別に表示すれば
くるぉおえるめぇぇるですおおお＾q＾
みたいなのが作れるかも、まだ先は長いけど。

Android and iPhone word-break

前回 table タグを使わない方向にすると書いたけど
iPhone で table タグ内の英文を強制改行させる方法をみつけた。

長い英単語を途中で折り返したいときの CSS の指定方法: Days on the Moon

手持ちで実験した結果こうなった。
word-break: break-all で iPhone 強制改行。
word-wrap: break-word で Android 強制改行。

body {
	-webkit-text-size-adjust: 100%;
	word-break: break-all; /* iPhone */
	word-wrap: break-word; /* Android */
}

しかしこんなのは使うなということらしい。
だがそれは英文での話、コマンドやソースコードは強制改行してほしい。

IMG_0053

すべては .NET Framework の長すぎるメソッド名が悪い。
Linux 屋なら端末で長いコマンドが折り返されることに慣れているしね。

更に viewport は

<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0" />

これで iPhone でも拡大は可能で横向き時に文字拡大されなくなる。
-webkit-text-size-adjust: 100%; という上記の CSS 指定も必要だけど。

maximum-scale=1.0,user-scalable=no

とよく見つかる、これを指定すると拡大できなくなるので場合による。
スマホ重視なサイトなら拡大しなくても使い易いレイアウトにすればいい。

ついでに、これは以前から指定していたけど

img {
	max-width: 100%;
	height: auto;
}

としておくと縮小画像を用意しなくても自動で縮小表示される。
大半を縮小画像に入れ替えた後に知ってションボリした思い出。

とにかく iPhone 対応は一段落。
IE つか Windows で表示確認していないけど多分大丈夫だろう。