自作自演

Firefox の話題を中心に Web 関係の話も扱うつもりの雑記。だった。
zisakuzien.exblog.jp

Top

画像の naturalWidth と naturalHeight とれるかな

naturalWidth、naturalHeight 便利ーって言っていたら
取れない時もあるよ。 と言われたので確認してみました。
使ったブラウザは Firefox 18 です。


■仮説
DOM の解釈後から画像の読み込みまでは、
naturalWidth、naturalHeight が取得できないのではないかと予想しました。
表示できるところから表示して、画像は大きいかもしれないから後から読み込む、
という方がユーザに親切というか、遅い回線はそんな感じに見えるので。
従って、DOMContentLoaded と load イベントそれぞれの発生時点で取得できるか確認します。


■下準備
ローカルで検証すると、画像がすごい早さで取得できてしまいそうなので
PHP で決まった秒数 sleep してから応答するスクリプトを用意しました。
参考・PHP/画像のレスポンスを返す - 俺の基地

// 遅延秒数 (0未満か指定なしなら1秒にする。0秒の指定はありにしておく。)
$seconds = (int)$_GET['sec'];
if ($seconds < 0) $seconds = 1;
sleep($seconds);

header('Content-Type: image/png');
readfile('./hiyoko-01.png');
exit();

PHP 5.4 以上が入っていれば、ビルトインウェブサーバでさくっと試せます。
書いたスクリプトのあるディレクトリに移動して、
php -S localhost:8000
とかすればサーバが立ち上がります。
PHP: ビルトインウェブサーバー - Manual


■検証用 HTML と JavaScript
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8" />
<title>画像の naturalWidth と naturalHeight とれるかな</title>
</head>
<body>
<script>
var listener = function(evt){
// ブログの都合でドットが全角になってるが実際は半角
var image = document.getElementById('image');
var out = [];
out.push(evt.type);
out.push(new Date().toString());
out.push(' width: ' + image.naturalWidth);
out.push('height: ' + image.naturalHeight);
console.log(out.join('\n'));
};
window.addEventListener('DOMContentLoaded', listener, false);
window.addEventListener('load', listener, false);
</script>
<img id="image" src="http://localhost:8000/?sec=3" />

</body>
</html>


■結果
DOMContentLoaded
Tue Feb 05 2013 22:33:54 GMT+0900 (JST)
width: 0
height: 0

load
Tue Feb 05 2013 22:33:57 GMT+0900 (JST)
width: 500
height: 625

DOMContentLoaded イベントの発生時点では 0 となってしまっていますが、
load イベントの発生後はきちんと使った画像のサイズを取得できています。

ただ、画像が一度読み込まれていると(普通にリロードすると)
DOMContentLoaded の段階で、前回読み込んだ画像のサイズが取得できました。
ページのリロード前に、画像を差し替えサイズを変えてやると
DOMContentLoaded では前回読み込み時のサイズ、
load では実際表示した画像のサイズになりました。
[PR]
# by tokage-shippo | 2013-02-05 22:49

MySQL のデータを取捨選択して別環境へコピーしたかった

お手軽に。ご利用は計画的に(これでよかったのか…?)。
mysqldump で全部ダンプすれば良いのでは? → コピーしたくないデータがありました><


■ユーザについて

select Host, User from mysql.user;
で現在いるユーザを確認する。

show grants for 'ユーザ名'@'サーバ(localhostとか)';
必要なユーザについて、上記コマンドを叩いて GRANT 文を取得して
コピー先でそのまま流す。


■データベースについて

show create database DB名;
で create 文が取得できるのでそのままコピペ。


■テーブルについて

mysqldump -uユーザ名 -p DB名 テーブル名 > ダンプファイル
とかすると、テーブルごとにダンプがとれるので、それを投入する。

-d オプションで、データ抜き(テーブル定義のみ) にできる。
--skip-lock-tables でロックをせずにダンプを取れる(ダンプしている間に更新されうる)。

が、--single-transaction の方が整合性のとれたデータが取得できるらしいので
--skip-lock-tables は使わない方が良さそう。
PHPのテクメモ ≫ Blog Archive ≫ mysqldumpで「when using LOCK TABLES」と怒られる
MySQL :: MySQL 5.1 リファレンスマニュアル :: 4.9.2.1 バックアップ ポリシー
[PR]
# by tokage-shippo | 2013-02-01 21:11

HTML と JavaScript と Android 4 で位置情報を取得した感想文

■環境
GALAXY S III SC-06D (Android 4.0.4)

■コードについて
Geolocation の利用 | MDN
Geolocation API-HTML5のAPI、および、関連仕様
などを参考に…

対応していないブラウザは
if (!navigator.geolocation) {
alert ("geolocation services are not supported by your browser.");
return;
}
みたいな感じで処理を分けておく。
(※ブログの都合で全角スペース入れてます…)

1回だけ取得なら navigator.geolocation.getCurrentPosition
定期的に監視するなら navigator.geolocation.watchPosition
を使う。
どちらも成功時に呼ばれるコールバック関数に
位置情報のオブジェクトが渡される。
失敗時の方はエラーに関するオブジェクトが渡される。
navigator.geolocation.getCurrentPosition(
function(position){
success(position);
},
function(error){
fail(error);
},
{maximumAge:0}
);
こんな感じにしておくと、
位置情報の有効期限なし(都度取得)で取得できる。

■位置情報がキャッシュされる?
getCurrentPosition だと位置情報がキャッシュされてしまう、
という話を聞いて、書いて試したものの
第三引数に {maximumAge:0} を渡すようにしたからか、Android 4 だからなのか、
ちゃんと都度位置情報を取得しなおしているように見えた。
(数秒あけて、繰り返し実行した際に、位置がずれることがあった。)
Android 2.3 や iPhone ではキャッシュされてしまうものがあるのかないのか、
検証できていないのでわからない。

■GPS をオンにしても位置情報が取得できない
Galaxy S3 だけなのかそうでないのかわからないが
設定 → 位置情報サービス → GPS機能を使用 にチェックを入れても
エラーコード 2 (The last location provider was disabled) となって
位置情報が取得できなかった。
設定 → 位置情報サービス → 無線ネットワークを使用 にチェックを入れたところ
GPS機能を使用 のチェックの有無にかかわらず位置情報を取得することができた。

■取得した位置が明らかに遠いことがあった
関東某所の駅・電車内で実行したところ、大阪の位置情報が返されることがあった。
その際、同じような場所で3分ほどの間に11回実行し、5回が大阪の位置情報だった。
GPS による位置取得でなかったのが原因だと思う。
ただ、GPS を使用して位置情報を取得するかどうかは
端末側の設定次第で HTML や JS を書く側からは指定できないので
サービスに組み込む場合は、位置情報が違うかもしれませんよ、と
あらかじめユーザに伝える必要がありそう。

■感想
位置情報を単純に取得して、さらに Google Maps API で
地図上に表示するだけならとても簡単。お手軽。
ただ、位置情報の取得は一瞬では終わらないので
待ち時間をどうユーザに示すかは、工夫した方が親切かもしれない。

また、どのような設定をすれば位置情報の取得ができるのか、
どの程度の精度での取得になるかはわかりづらいと感じた。
GPS のオンオフは画面上部を"引っ張る"とボタンが出てくるが、
「無線ネットワークを使用」に相当するものは一度ホームに戻って
設定から選ばないといけなくてオンオフの切り替えが面倒だと感じた。

最後に、位置情報はある程度誤差が出ることを考えると
検証は移動しながら行うことになるので
検証しながらコードをいじるのが難しくてやりづらいと思った。
[PR]
# by tokage-shippo | 2013-01-28 23:12 | プログラミング

MySQL 5.5 で外部キー制約使おうとしたらエラーではまった。

ALTER TABLE `hoge_table` ADD FOREIGN KEY ( `id` ) REFERENCES `hoge`.`fuga_table` (`id`
) ON DELETE SET NULL ON UPDATE CASCADE ;

みたいにして、外部キー制約を追加しようとしたらエラーになりました。
原因は、NOT NULL のカラムなのに ON DELETE SET NULL を指定していたため。
原因がわかるまで手間取ったのでメモしておきます。

上記の SQL を実行したところ、下記のようなエラーが出ました。(xxxの部分は英数字)
ERROR 1005 (HY000): Can't create table 'hoge.#sql-xxx_xxxx' (errno: 150)

エラーメッセージで検索したところ、下記のページがヒットしました。
InnoDBの複合FOREIGN KEY制約について - Yet Another Hackadelic
FOREIGN KEYを張る際に怒られた時はSHOW ERRORSよりもSHOW INNODB STATUSを見ましょう。
とのことなので、SHOW INNODB STATUS をやってみました。
mysql> SHOW INNODB STATUS\G
ERROR 1064 (42000): You have an error in your SQL syntax;
check the manual that corresponds to your MySQL server version
for the right syntax to use near 'INNODB STATUS' at line 1

エラーになりました。調べたところ、
SHOW INNODB STATUS

SHOW ENGINE INNODB STATUS
となったそうです。
MySQL :: MySQL 5.5 Reference Manual :: 14.3.14.2 SHOW ENGINE INNODB STATUS and the InnoDB Monitors

SHOW ENGINE INNODB STATUS\G を実行して、
「LATEST FOREIGN KEY ERROR」の項目を確認したところ、
「You have defined a SET NULL condition though some of the
columns are defined as NOT NULL.」とあったので、エラー詳細がわかりました。
[PR]
# by tokage-shippo | 2013-01-15 17:50 | プログラミング

nicoWnnG IME のユーザ辞書のインポートを使ってみた。

nicoWnnG IME - GORRY's Website
Android の IME で、ベル打ちができるので愛用しています。

当然(理由は後述)なのですが、地名の変換が弱いと感じる時があります。
なので、ユーザー辞書に地名を登録することにしました。

ユーザー辞書 - nicoWnnG IME
タブ区切りのテキストファイルを辞書としてインポートできます。
設定画面 → 日本語ユーザー辞書 → 画面上部のボタンの右の方の 辞書読込 ボタン

どのような所から地名をとれば良いのか考えましたが
地名を入力する場合、乗り換えを調べるとか「○○駅で待ち合わせ」とか、
駅に関わることが多いので、駅名を使うことにしました。

JR東日本:駅情報検索
えきから時刻表 東京都(路線名一覧)
JR東日本とえきから時刻表のサイトは、一覧にふりがなも載っているので、
これを見てふりがなと漢字の組を取得しました。

で。まず、手当り次第に都内を走る路線の駅を辞書登録したところ
「ひがし」などと入力すると、変換候補の始めの方が地名で埋め尽くされることとなりました。
登録すればするほど、たくさんの地名で埋もれます。
おそらく、そういう理由もあって地名は多く入っていないのだと思いました。
欲張らず、よく乗る路線に絞って登録したところ、ほどほど快適になりました。

また、作ったテキストファイルは、DropBox に入れておいたら
割合楽にスマホから取得できました。
もしかしたら Bluetooth でも良いのかもしれません。
[PR]
# by tokage-shippo | 2012-11-01 00:04 | その他

タブ区切りのテキストを扱う時のメモ

覚えられないのでメモ。

echo "select * from table_name;" | mysql -u -p db_name > hoge.txt
とすると MySQL のテーブルのデータをタブ区切りのテキストにできる。

cut -f 1
指定のカラムだけを切り取れる。-d で区切り文字を指定できる。デフォルトはタブ。

paste ファイル名1 ファイル名2
ファイルを行ごとにタブ区切りで結合する。-d で区切り文字を指定できる。

grepでタブを検索
grep $'\t' ファイル名
逆引きUNIXコマンド/grepでタブを検索する方法 - Linuxと過ごす

vim で 改行 を カンマと改行 に置換する(タブ区切りじゃないけど)
:%s/\n/,^M/g
(^M は Ctrl+v の後に Retrun を入力する)
参考・Mazn.net » vimで改行に置換
[PR]
# by tokage-shippo | 2012-10-21 17:56

万歩計買った。

商品情報|活動量計 Jog style ジョグスタイル HJA-312|オムロン ヘルスケア

先日、面白そうだったので、万歩計(活動量計)買ってみました。
個人的には満足しているのですが、罠ポイント多い感じでした。

■良いところ
・Android アプリに記録を転送できる。
 その際オムロンのサーバ(WellnessLINK)に記録が転送される。
 (おサイフケータイ or NFC 搭載端末でないとダメ)

・パソコンから CSV で、記録をダウンロードできる。(過去6ヶ月分まで)
 自分でダウンロードした CSV を DB に入れとけば後で何とでもできそう。楽しい。

■罠ポイント
・2012/9 現在、アプリでは歩数が見られない。見られるのはトレーニング時の記録のみ。
 パソコンから歩数は見られるので、アプリはあくまでデータ転送という認識なら問題ない。

・Google Play で「オムロン」で検索するといくつもアプリがヒットするが
 Jog style で使えるのは 2012/9 現在「Jog style アプリ」のみ(たぶん)。
 将来的には「からだグラフ」で歩数が見られるのかも。

・説明書のようなものが3種類もあるが、
 どれを読んだらとりあえず目の前の万歩計が使用可能になるのかわからない。
 一番分厚い取扱説明書の「設定のしかた」全部と
 「使い方」の始めの方を読めばひとまず使える。
 他は歩いたり走ったりして落ち着いた後に読むのでも間に合う。

■まとめ
PC 用の USB 通信トレイ(Jog style とは別売)がないと、
PC からデータ取れないのかな…と思ったのですが、
インターネット経由で CSV で取れたので良かったです。
日付と歩数がセットで残っていくので、体調管理の助けになれば良いなぁと思っています。
[PR]
# by tokage-shippo | 2012-09-29 18:01

Windows7 で Apache をサービスとして動かす

任意の設定ファイルを読ませて、サービスとして登録する。
たまに必要になって方法をすっかり忘れているのでメモ。

・設定ファイルを作成・配置
・管理者権限でコマンドプロンプト実行
・"C:\Program Files (x86)\Apache Software Foundation\Apache2.2\bin\httpd.exe" -k install -n "サービス名" -f "設定ファイルのフルパス"
  (httpd.exe のディレクトリはインストールしてある環境に合わせる)

設定ファイルの内容にエラーがあっても、サービスの登録は完了する。
管理者権限でコマンドプロンプトを実行していないと、
「(OS 5)アクセスが拒否されました。 : Failed to open the WinNT service manager」のエラーになる。
[PR]
# by tokage-shippo | 2012-09-10 19:37

vi で全部コメントアウトしたい。

参考・vi で範囲を指定してコメントアウト - Bacchus.gif

vim じゃなくて、vi で。
具体的に言うと、crontab の設定を全部コメントアウトしたい時にどうするか。

1. vi で目的のファイルを開く
2. Shift + g で最終行に移動
3. Ctrl + g で現在の行を表示
4. 行頭を置換する。例えば10行のファイルなら、 :1,10 s/^/#/
5. コメントをはずすときは、 :1,10 s/^#//

crontab の内容を、部分的にではなく、全部無効化する、という目的だと、
何かもっと良い方法もあるような気もします。
[PR]
# by tokage-shippo | 2012-06-25 17:49

コマンドラインから画像の EXIF 情報を変更する

はてなフォトライフ に画像を上げようとしたら
ある2枚の画像がどうしても片方しか上がりませんでした。
はてなフォトライフ - ヘルプ を読むと
※撮影順にした場合、カメラの時刻設定がされていないとすべて同じ日付になっているため2枚以上の写真をアップロードできないことがあります。
とありました…
EXIF 情報の撮影日時を編集して異なる時刻に撮影したことにします。

ExifTool by Phil Harvey
自分のマシンは Mac OS X 10.7 なので、Mac 用をダウンロード。
展開してそのままインストーラでインストール。

exiftool 画像ファイル
のコマンドで設定されている EXIF 情報を確認できます。

exiftool -CreateDate="2008:06:29 18:27:01" 画像ファイル名
のコマンドで作成日時を指定できます。
1秒ずらして設定したところ、無事にアップロードできました。
他にもタグ名の部分を変えれば違うタグについても値が設定できると思います。
タグ名の一覧 → EXIF Tags

参考
Tempus - 昨今明日: Macで EXIF を操作するには ExifTool が便利
穀風: ExifTool.exe の簡単な使い方 - 編集編
[PR]
# by tokage-shippo | 2012-06-21 22:08 | その他
Mozilla Firefox ブラウザ無料ダウンロード

about this...

書き手の名前は 晴柳祐志 と言います。


リンク

Twitter
いつか何とかしたいサイト

最新のトラックバック

[foxkeh]フォクす..
from 「 Firefox ×?=!..
[Firefox]Fir..
from +Sun Flower〜報告〜+
Firefoxバトン
from MなMによるMのための日記
スキン変更!
from SUKA・SUKA・BLOG
Firefox 1.5に..
from mmkg

検索

S M T W T F S
1 2 3 4 5 6
7 8 9 10 11 12 13
14 15 16 17 18 19 20
21 22 23 24 25 26 27
28 29 30 31
XML | ATOM

個人情報保護
情報取得について
免責事項