yendo weblog


「続きを読む」をJavaScriptで書いてみた

Facebookなんかである「続きを読む」の例を書いてみました。 JQueryを使ってます。 実例もどうぞ。


<html>

<head>
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>

  <style>
  .more-text {display: none;}
  </style>

  <script type="text/javascript">
    function readMore(target){
      var id = '#'+$(target).closest('.status').attr('id');
      var main = id+' .main-text';
      var more = id+' .more-text';

      $(main+','+more).toggle();
    }
  </script>
</head>

<body>

<div class='status' id="123">
  <div class="main-text">
  <p><a href="#123" onclick="readMore(this)">続きを読む</a></p>
  </div>

  <div class="more-text">
  ここに記事の内容を記入します。
  <p><a href="#123" onclick="readMore(this)">折りたたむ</a></p>
  </div>
</div>

</body>

</html>

2013/05/15 (Wed) 21:20 | タグ: computer | 固定リンク


GFeedLine: GNOME 向け SNS クライアント

GNOME 3 向けのシンプルな Twitter クライアントを作り始め、今では Facebook や Tumblr にも対応しています。 Twitterについて言えば、以下のような機能をサポートしています。 ただ、細かいところは手抜きが多く、ウェブに丸投げしたりしてもいます。

設定で各フィードのグループを設定すると、 そのグループごとにマルチカラム表示を行えます。 フィードの表示順序は設定画面上でドラッグ & ドラッグすることで変更可能です。

ちょっと面白い機能としては、フィードの統合ができます。複数のフィードの、 ソースと名前とグループ名がそれぞれ同じ場合、それらを一つのタブにまとめるよ うになりました。例えば、Twitterで複数のリストや検索を一つのタブにまとめるこ とができます。

最新版は 2.2 beta 3 です。tar.gz 以外に、Debian および Ubuntu 向けのパッケージを用意しています。以下からどうぞ。

gfeedline - Google Project Hosting

追記: 最新情報に追随するため、内容を大幅に更新しました。 (2013/5/28)

2012/02/15 (Wed) 20:36 | タグ: computer | 固定リンク


NetWalker 向けパッケージ (Twitim および GNOME Photo Frame)

いまさらなのだけど、SHARP NetWalker を使う機会ができたので、自作アプリの NetWalker 向けのパッケージを作成した。

Twitim はチャットクライアント風の Twitter クライアント。 ちょっと古いものだけど、複数のタブやポップアップ通知をサポートしている。 チャット風ということで、一覧できるメッセージは比較的多い。 NetWalker 標準の Ubuntu Jaunty では日本語入力ができない問題に対処した。

GNOME Photo Frame は、Gnome デスクトップ向けの写真フレームガジェット。 ローカルや大手ネットサービスから写真を取得して表示する。 スクリーンセーバーとしても利用可能。 NetWalker で動くように、いくつかのバグを修正した。 ただ、NetWalker 標準の Ubuntu Jaunty の古さゆえ、最新のバージョンは動かないので、少し古いバージョンになる。

いずれも APT ラインに以下の行を加えて、

deb http://www.tsurukawa.org/debian/netwalker/ ./ 

Twitim なら

apt-get install twitim 

Gnome Photo Frame なら

apt-get install gphotoframe
で、インストールできる。問題があれば Twitter: yendo0206 までどうぞ。

2011/07/17 (Sun) 20:24 | タグ: computer | 固定リンク


デスクトップアプリケーションで Facebook Graph API を使うときのポイント

基本的にドキュメント通り。認証の手続きも簡単。 ただ、大したものではないけど、 デスクトップアプリケーションにおける利用で分かりにくいポイントを二つ。

認証

デスクトップアプリケーションでは、 パーミッション の設定 (scope) で 'offline_access' も指定しておくこと。 これはブラウザで Facebook にログインしていなくても (すなわちオフラインでも)、 自分の情報に (デスクトップアプリなどが) アクセスできるという権限みたい。 この権限がないと、アクセストークンは一定時間でエクスパイアされるのかな。

ログイン画面

認証に関するドキュメントではコンパクトなログイン画面が例としてあげられているが、ログインプロセスを説明通りに行うと、通常の大きなウェブのログインページが表示される。 コンパクトなログイン画面を利用したい場合は、 ログインのアクセスには display というオプションが利用できるのだけど、これに popup を指定する。 OAuth ダイアログのドキュメントには記載がないが、 ダイアログのドキュメントだと記載がある。

2011/03/30 (Wed) 16:24 | タグ: computer | 固定リンク


GNOME ドキュメントの作成と利用

GNOME でドキュメントを作成し、利用してみる。 ドキュメントを作成し、翻訳を行い、インストールを行って、 最終的に yelp で閲覧するところまで。 今回は GNOME Photo Frame のヘルプを例とする。 通常の GNOME アプリケーションとは異なり、Python を使う。 以下のツールが必要となる。

1. 作成するデータ

作成するデータは以下の通り。

基本的なファイルは以下のように help ディレクトリに配置する。

help/
    gphotoframe.omf.in
    C/gphotoframe.xml
    C/figure/gphotoframe.png
    ja/ja.po
    ja/figure/gphotoframe.png

インストールする前には PO ファイルから、ヘルプの XML ファイルと、OMF ファイルを 各言語ごとに生成する必要がある。

ヘルプ本体の XML ファイル

適当に他の GNOME ドキュメンテーションの XML ファイルを参考に書けると思う。 基本的には 1 ファイルで、1 ドキュメントを記述する。 ちゃんとしたことは以下を参照。

ちなみに GNOME アプリケーションのドキュメントのライセンスは、だいたい GNU Free Documentation License (GFDL) になっているみたい。

OMF ファイルの雛形

ドキュメントをシステムに登録するには、 OMF (Open Metadata Framework) ファイルが必要になる。 GNOME Photo Frame だと以下の通り。これを gphotoframe.omf.in として help ディレクトリに配置する。

<?xml version="1.0" standalone="no"?>
<omf>
  <resource>
    <subject category="GNOME|Applications|Graphics"/>
    <type>user's guide</type>
    <relation seriesid="01bfe79a-d094-c319-a063-ca3c4b5eb74d30"/>
    <rights type="GNU FDL" license.version="1.1" holder="Cristian Marchi"/>
  </resource>
</omf>

このうち seriesid はコマンド scrollkeeper-gen-seriesid で生成する。

PO ファイル

XML ファイルの翻訳には xml2po を使う。ドキュメントの po は、メッセージカタログの po とは別途管理する。 help ディレクトリに移動してから、以下のコマンドを実行する。

POT ファイルを作成する。後で説明するが、最終的には OMF ファイルを生成しておき、以下のようにこれも翻訳対象ファイルとして指定しておいた方がよい。

% xml2po -o help.pot C/gphotoframe.xml C/gphotoframe-C.omf
% cp help.pot ja/ja.po

PO ファイルを更新する

% xml2po -u ja/ja.po C/gphotoframe.xml C/gphotoframe-C.omf 

詳しい使用法は man を参照。

2. ビルド

通常の GNOME アプリケーションなら gnome-doc-utils.make を使う。 Migrating to GNOME Documentation Build Utilities の 2.2 を参考にすればよい。ただ、Python など、make を使わないシステムで、ビルドを自前でやろうとすると結構面倒。

各言語用に OMF ファイルを生成

gphotoframe.omf.in から OMF を生成するには、xsltproc で行う。 これは各言語ごとに行うが、後で翻訳を行うためにも、まずは C 向けの OMF を作成する。なお、対象となる XML ファイルが翻訳されていると、それに応じて各要素も翻訳が行われる。OMF ファイル用に別途 PO ファイルが必要になることはない。

% xsltproc \
-o ./C/gphotoframe-$lang.omf \
--stringparam db2omf.basename gphotoframe \
--stringparam db2omf.format 'docbook' \
--stringparam db2omf.dtd "-//OASIS//DTD DocBook XML V4.1.2//EN" \
--stringparam db2omf.lang C \
--stringparam db2omf.omf_dir "/usr/share/omf" \
--stringparam db2omf.help_dir "/usr/share/gnome/help" \
--stringparam db2omf.omf_in ./gphotoframe.omf.in \
`pkg-config --variable db2omf gnome-doc-utils` \
./C/gphotoframe.xml

OMF ファイルの生成は面倒なので、スクリプトを用意した方がよいだろう。 gphotoframe では、 makedoc.py - gphotoframe のようなスクリプトを用意した。

各言語用に XML ヘルプファイルを生成

xml2po を利用する。

% xml2po -p ja/ja.po -o ja/gphotoframe.xml C/gphotoframe.xml

Python でのインストール

C なら標準のビルドシステムを使うだけなのだが、python の場合は DistUtilsExtra を使うのが今のところ一番楽みたい。 setup.py と setup.cfg の記述については上記のリンクを参照。

OMF ファイル、XML ファイルなどを各言語ごとに全部生成しておく必要はあるが、 決められたフォルダ (デフォルトでは help) にそれらを置いておけば、setup.py でインストールで可能となる。

3. 閲覧

yelp の利用

閲覧に GNOME の標準システムでは yelp を使う。 インストール済みならば、URI で開くことができる。

% yelp ghelp:gphotoframe

ゆえにプログラムから呼び出すには、show_uri をコールすればよい。 Python なら以下の通り。

gtk.show_uri(None, 'ghelp:gphotoframe', gtk.gdk.CURRENT_TIME)
インストール前に試し読みするならば、ファイルを直接指定してもよい。 ただ、いずれにせよ OMF ファイルは必要になる。
% yelp ja/gphotoframe.xml

HTML の生成

ブラウザで閲覧できるように、HTML を生成することもできる。

% xsltproc -o /tmp/index.html /usr/share/xml/gnome/xslt/docbook/html/db2html.xsl ja/gphotoframe.xml

2010/10/26 (Tue) 00:53 | タグ: computer | 固定リンク


LibGlade から GtkBuilder への移行 (PyGTK 編)

GNOME 3 では、LibGlade から GtkBuilder への移行が必須になる。 この移行でなにがどうメリットなのかよく分からない割りに、 細かいところで面倒だったので、ちょっとまとめておく。 以下 PyGTK を事例としているが、他の言語でもまぁ似たようなものだろう。

Glade ファイル UI ファイルへの変換

Glade で変換する。LibGlade 形式のファイルを読み込んで、GtkBuider 形式で保存するだけ。バージョン 3.6.7 で問題なく変換できた。

コードの修正

ほぼ機械的に変更できるが、シグナルの接続など場合によってはちょっとした手作業も必要になる。

インポートとオブジェクトの取得

プロジェクトファイルの読み込み

これも基本的には機械的に置き換えできる。

旧:

gui = gtk.glade.XML(GLADE_FILE)

新:

gui = gtk.Builder()
gui.add_from_file(UI_FILE)

しかし、単一の Glade ファイルに複数のトップレベルが含まれ、それぞれでシグナ ルが設定されている場合は、シグナルの接続に問題が起こる。(すべてのシグナルに ついて接続されていないとか警告をしてくれる。) それを回避するためには、以下 のようにあるトップレベル以下のみを読み込むことも可能である。

gui.add_objects_from_file(UI_FILE, ["window1"])

ただ、この場合別のツリー以下にあるオブジェクトの呼び出しに問題が起こる。 例えば adjustment のようなウィジェットツリーとは別のオブジェクトツリー以下 にあるオブジェクトの場合である。

いろいろ面倒なことを考えるよりも、シグナルを扱うウィジェットは、別の ui ファイルにまとめた方がいい。

シグナルの接続

基本的には signal_autoconnect → connect_signals である。

ただ、LibGlade で は複数回にわたって多重にシグナル接続を重ねることができたが、GtkBuider では、最初に接続したシグナル以外は無視される。 クラスの継承などでシグナルを多段設定している場合などは注意が必要。

よく質問されているようだが、 とにかくシグナルの接続は一回で済ますように変更するしかないようだ。 例えば以下のようにする。

旧:

dic = { "on_checkbutton_changed" : self._changed_checkbutton_cb }
gui.connect_signals(dic)

dic = { "on_combobox_changed" : self._changed_combobox_cb }
gui.connect_signals(dic)

新:

dic = { "on_checkbutton_changed" : self._changed_checkbutton_cb }

dic2 = { "on_combobox_changed" : self._changed_combobox_cb }
dic.update(dic2)
gui.connect_signals(dic)

i18n関連

プログラムを国際化している場合は、さらに変更が必要である。

POTFILE.in

メッセージを含むファイルを羅列すればよいのだが、 現在の intltool バージョン 0.41.0 だと GtkBuider ファイルに対応していない。 ui ファイルが bonobo の ui ファイルと見なされ、処理されない。 そのため glade ファイル同様に扱われるように、ファイル名の先頭に [type: gettext/glade] を付与しておく。 main.ui と sub.ui のようなファイル名の場合は以下のようになる。

[type: gettext/glade]main.ui
[type: gettext/glade]sub.ui

bindtextdomain

gtk.glade の代わりに locale モジュールを使う。

import gettext
import locale

for module in (gettext, locale):
    module.bindtextdomain(APP_NAME, LOCALE_DIR)
    module.textdomain(APP_NAME)

参照サイト

2010/04/06 (Tue) 20:48 | タグ: computer | 固定リンク


GPhotoFrame (写真フレーム)

最新の開発情報については gphotoframe - Google Code をどうぞ。

デスクトップ上に写真を表示するガジェット (フォトフレーム) は、 Windows なんかだとずいぶんさまざま公開されているけど、 GNOME デスクトップ向けだとちょっと高機能なものなど見あたらなかったので、 PyGTK で作ってみた。

特徴

インストール

GPhotoFrame は以下のパッケージに依存している。

また以下のパッケージが推奨されている。

ダウンロードして、展開後に ./setup.py install でインストールする。 あるいは一部機能が制限されるが、インストールせずに直接 gphotoframe を実行することも可能。

2009/05/16 (Sat) 23:21 | タグ: computer | 固定リンク