2014-10-04
_ サーバーやっと入れ替え/縮小営業中
先代サーバーのNEC Express5800/110Gdが、とうとうイカレてしまったので、準備したまま置いてたhp ML110 G6と入れ替えました。それにともなって縮小営業中です。
一番大きな変更は、@nofuture.tvのメールアドレスを廃止しました。あと、外部に向けてのサービスはWebサービス以外、すべて止めました。
不具合は、ちょいちょいありますが、徐々に直していくのでよろしくお願いします。
2014-10-05
_ この日記のライセンスをわかりやすく表示した
www.nofuture.tvのライセンスは、のがたが書いた部分は基本的にCreative Commons License 表示-継承(CC BY-SA)なのだけど、わからない人もいるかもしれないので、タイトルのところに表示するようにしました。
2014-10-06
_ 7時前。警報が続くかどうか
台風18号すごいですが、こっちでは後ろっかわが引っかかっている状態。
風がかなり強い状態だけど、7時に警報が解除されれば大学の授業はあるので時計と気象庁のページをにらめっこ。
6時49分 警報解除になりました
_ Song Map - ロックの曲名を使った架空の地図
- Song Map - Good Enough To Get Lost In | NME.COM: http://www.nme.com/blogs/the-big-picture/song-map-good-enough-to-get-lost-in
- Dorothy - Song Map - Original Open Edition: http://www.wearedorothy.com/shop/song-map-original-open-edition
ロックの曲名を使った架空の地図だそう。 曲名は通りの名前のほかに建物や公園、地名なども細かく使われていて、見て、探すだけでも楽しい。
_ Curtis HurdingてMODなSOULでかっこいい
- SXSW Breakout Star Curtis Harding Is Coming To The UK | NME.COM: http://www.nme.com/blogs/nme-radar/sxsw-breakout-star-curtis-harding-is-coming-to-the-uk
NMEの記事で知ったのだけど、MODなSOULでかっこいい。イギリス人は好きそうだなー。
2014-10-10
_ サーバーを入れ替えたのでメタルラックを入れてみた/肩が痛い
前のnofuture.tvサーバーは床に直置きしてたけど、ほこりがすごかったので台を置こうと考えたら、手頃なものがなくて、ニトリで小さいメタルラックを買ってスタンディングデスクの下に置くことにした。スッキリ!
で、メタルラックはおととい買って自転車でぶら下げて持って帰ってきたのだけれど、今頃になって肩が痛い。
_ BBC MusicのGod Only Knowsカバーがすごい
- BBC Music - BBC Music - God Only Knows: http://www.bbc.co.uk/programmes/articles/2R3PxWX7hzMb8lNZs3Ngz5L/god-only-knows
BBC Musicが始まった記念に作られた、豪華アーティストによるGod Only Knowsのカバーがすげー。もちろん、Brian Wilsonも出てます。 設立記念だけでなく、この音源は、チャリティシングルとして販売されるそうです。
- BBC - BBC Children in Need - BBC Music’s God Only Knows in aid of BBC Children in Need: http://www.bbc.co.uk/programmes/articles/3sN8FVLQFVcyh2t4MrmnS6r/bbc-music-s-god-only-knows-in-aid-of-bbc-children-in-need
それにしてもBBCなのにGod Only Knowsを選曲するって。そこにビックリですよ。
こっちはメイキング。
_ leaflet.jsを使って地図を表示してみる
以前からAndroidとかのアプリを作りたいなと思っていたけど、Javaを覚えるのが嫌で放置していました。しかし、Apache Cordovaを使えばHTML5/CSS3/JavaScriptでアプリが作れそう。
ということで、その野望の一歩のために、まずはleaflet.jsを使ってブラウザに地図を表示することを始めてみた。
参考はこの辺。
- Quick Start Guide - Leaflet - a JavaScript library for mobile-friendly maps: http://leafletjs.com/examples/quick-start.html
- Documentation - Leaflet - a JavaScript library for mobile-friendly maps: http://leafletjs.com/reference.html
最初に
こんな風なHTML5のひな形を用意した。
<!DOCTYPE html> <html lang=""> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title></title> <link rel="stylesheet" href=""> </head> <body> <script src=""></script> </body> </html>
これにleaflet.jsを使うためのjsとcssのリンクを書く。
<script src="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.js"></script> <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.css">
さらにleaflet.jsが地図を書くためのdiv要素をbody要素の下に追加。 leaflet.jsを呼び出すjsを書くためscript要素も追加しておいた。
<div id="map"></div> <script> (この中にleaflet.jsを呼ぶためのスクリプトを書く) </script>
div要素に高さがないと地図が見えないので、headの中にスタイルシートでheightを500pxぐらいに設定した。
<style> body{ margin: 0; padding: 0; } div#map{ width: 100%; height: 500px; } </style>
ということで、こんな感じになった。
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>leaflet.jsの練習</title> <script src="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.js"></script> <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.css"> <style> body{ margin: 0; padding: 0; } div#map{ width: 100%; height: 500px; } </style> </head> <body> <div id="map"></div> <script> (この中にleaflet.jsを呼ぶためのスクリプトを書く) </script> </body> </html>
地図を表示してみる
script要素の中にleaflet.jsを呼び出すための処理を書いていきます。 まずは初期化。とりあえず姫路城の場所を緯度経度にしてみた。 ズームレベルは13。
var map = L.map('map').setView([34.839378, 134.694097], 13);
次にタイルサーバーとコピーライト、最大ズームレベルを設定する。 例ではMapboxになってるけどMapnikを使います。タイルサーバーは、ここに書いてある
- Tiles - OpenStreetMap Wiki: http://wiki.openstreetmap.org/wiki/Tiles
- OpenStreetMapの各種タイル指定 - Qiita: http://qiita.com/nyampire/items/fbe359a2c9ccf0116787
var tileLayer = L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',{ attribution: '© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors', maxZoom: 19 });
最後にtilelayerをaddTo(map)で呼びだせば表示できるはず。
tileLayer.addTo(map);
ということで、こんな感じになった。
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>leaflet.jsの練習</title> <script src="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.js"></script> <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.css"> <style> body{ margin: 0; padding: 0; } div#map{ width: 100%; height: 500px; } </style> </head> <body> <div id="map"></div> <script> var map = L.map('map').setView([34.839378, 134.694097],15); var tileLayer = L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',{ attribution: '© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors', maxZoom: 19 }); tileLayer.addTo(map); </script> </body> </html>
たった、これだけにどんだけ時間かかってんねん。
_ leaflet.jsの地図にマーカーを表示してメッセージをポップアップさせる
地図が出たのでマーカーを表示してみる。 リファレンスを参考にタイトルと動かせるようにdraggableをtrueにしてみた。
var marker = L.marker([34.839378, 134.694097],{ title: 'test', draggable: true }).addTo(map);
おおー。出たー。ドラッグするとマーカーが動くー。 けど、titleはマウスオーバーをしたときに小さくしか出ないので、ここはポップアップで表示して欲しいな。 ということで、こうすればいいそう。
最初からポップアップさせるには、openPopup()を呼びだせばいいそう。
marker.bindPopup("<b>Hello world!</b><br>I am a popup.").openPopup();
クリックさせてポップアップさせる場合はなしでOK。
marker.bindPopup("<b>Hello world!</b><br>I am a popup.");
script要素の部分だけ抜き出すとこんな感じ。
<script> var map = L.map('map').setView([34.839378, 134.694097],15); var tileLayer = L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',{ attribution: '© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors', maxZoom: 19 }); tileLayer.addTo(map); var marker = L.marker([34.839378, 134.694097],{ title: 'test', draggable: true }).addTo(map); marker.bindPopup("<b>Hello world!</b><br>I am a popup.").openPopup(); </script>
_ leaflet.jsの地図にGeoJSONの情報を表示させる
GeoJSONは、JSONを使った地理空間情報をやり取りするためのフォーマットだそう。
- GeoJSON フォーマット仕様: http://s.kitazaki.name/docs/geojson-spec-ja.html
よく使うのは、地図上で場所をプロットしてテキストを書き込んだりした情報をアプリ間でやり取りするときに使ったりしますね。
MapBoxが作ったgeojson.ioエディタを使うと、ブラウザからGeoJSONの編集ができます。
- geojson.io: http://geojson.io/
ということでgeojson.ioで作ったGeoJSONのデータを読み込んで表示したいと思います。
下準備
geojson.ioで適当に作ったmap.geojsonというGeoJSONファイルですが、これを編集して細工しておきます。
こうなっているのを
{"type":"FeatureCollection","features":[{"type":"Feature","properties":{"name":"大手前公園"},"geometry":{"type":"Polygon","coordinates":[[[134.6929943561554,34.83518757883375],[134.69268321990967,34.83438620953671],[134.69515085220337,34.83381379812039],[134.69548344612122,34.8348001045432],[134.6929943561554,34.83518757883375]]]}},{"type":"Feature","properties":{"name":"好古園"},"geometry":{"type":"Point","coordinates":[134.6897006034851,34.83799671290307]}},{"type":"Feature","properties":{"name":"動物園"},"geometry":{"type":"Point","coordinates":[134.69527959823608,34.837063280868]}},{"type":"Feature","properties":{"name":"シロトピア記念公園"},"geometry":{"type":"Point","coordinates":[134.69487190246582,34.84154541921616]}}]}
parkDataという変数に入れるよう、先頭に「var parkData = 」と最後「;」をつけます。
var parkData = {"type":"FeatureCollection","features":[{"type":"Feature","properties":{"name":"大手前公園"},"geometry":{"type":"Polygon","coordinates":[[[134.6929943561554,34.83518757883375],[134.69268321990967,34.83438620953671],[134.69515085220337,34.83381379812039],[134.69548344612122,34.8348001045432],[134.6929943561554,34.83518757883375]]]}},{"type":"Feature","properties":{"name":"好古園"},"geometry":{"type":"Point","coordinates":[134.6897006034851,34.83799671290307]}},{"type":"Feature","properties":{"name":"動物園"},"geometry":{"type":"Point","coordinates":[134.69527959823608,34.837063280868]}},{"type":"Feature","properties":{"name":"シロトピア記念公園"},"geometry":{"type":"Point","coordinates":[134.69487190246582,34.84154541921616]}}]};
表示する
編集したmap.geojsonファイルを読み込ませて表示します。
head要素の中、leaflet.jsを読み込んだ下あたりにでmap.geojsonを読み込みます。
<script src="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.js"></script> <script src="map.geojson"></script>
script要素の中の適当な場所にこんな風に書くと表示されます。
L.geoJson(parkData).addTo(map);
すげー!一行でここまで出た。
次はポップアップして情報を出したりしたいけど、今日は力尽きたのでとりあえずはここまで。
ここまでの成果
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>leaflet.jsの練習</title> <script src="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.js"></script> <script src="map.geojson"></script> <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.css"> <style> body{ margin: 0; padding: 0; } div#map{ width: 100%; height: 500px; } </style> </head> <body> <div id="map"></div> <script> var map = L.map('map').setView([34.839378, 134.694097],15); var tileLayer = L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',{ attribution: '© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors', maxZoom: 19 }); tileLayer.addTo(map); var marker = L.marker([34.839378, 134.694097],{ title: 'test', draggable: true }).addTo(map); marker.bindPopup("<b>Hello world!</b><br>I am a popup."); L.geoJson(parkData).addTo(map); </script> </body> </html>
2014-10-13
_ 台風で休講
先週はギリギリのところで警報が解除されましたが、今日はギリギリのところで警報が出たので大学は休講になりました。 用事があったので、ひとまず大学まで出て帰ってきたけど、家に着いたら雨風吹き荒れる嵐になったのでタイミング良かった。
2014-10-15
_ 腰をイワしております
台風の日の帰りの電車を待っていました。電車が入ってきたので、教科書とノートPCが入ってそこそこの重さのリュックを背負って立ち上がろうとしたときピキッと走った。
「マズいなぁ」と思ってたら、翌朝、見事に動かなかったのでギックリ腰決定。
肩が痛いとか腰が痛いとか、もうすっかり中年だな。 寒くなって腰が痛む秋にぴったりのKinksのAutumn Almanacでも貼っておこう。
_ Skype Qikのビデオに使われているFletcher C. JohnsonのMessin Up My Mindという曲が良い
Skypeのビデオメッセージサービスが始まったそうだけど、これの紹介ビデオに使われている曲がすごく良い。
- Skype Qik: Group Video Messaging - YouTube: https://www.youtube.com/watch?v=X-d_jO0pAY0
調べたら、Fletcher C. JohnsonというバンドのMessin' Up My Mindという曲だそう。 bandcampで曲が聞けて買えるので、ちょっと聞いてみよう。
- Music | Fletcher C. Johnson: http://fletchercjohnson.bandcamp.com/
2014-10-16
_ 大丈夫かな?
2日寝てましたが、そろそろ大丈夫ぽい?
_ Atomのクソ安いマシンがいっぱい出てきたのでDebian入れて遊んでみたい
49ドルのセットトップボックスとか。65ドルのWindowsタブレットとか。
- Mele PCG03 is a tiny, low-cost Intel-powered mini PC - Liliputing: http://liliputing.com/2014/10/mele-pcg03-tiny-low-cost-intel-powered-mini-pc.html
- $65 Windows tablets show up in Hong Kong - Liliputing: http://liliputing.com/2014/10/65-windows-tablets-show-hong-kong.html
値段は出ていないけど、HDMI端子にぶっ差すスティック型端末とか。
- MEEGO-T01 HDMI TV Stick Supports Android, Windows 8.1, and Ubuntu/Linux: http://www.cnx-software.com/2014/10/15/meego-t01-hdmi-tv-stick-supports-android-windows-8-1-and-ubuntulinux/
どれもハードウェア構成はBaytrailでほぼ同じだけど、似たようなハードウェアのZOTACのZBox picoを動かした記事によるとUbuntuが使えたそう。
- How to run Ubuntu on the Zotac ZBOX pico mini PC (kinda) - Liliputing: http://liliputing.com/2014/10/run-ubuntu-zotac-zbox-pico-mini-pc-kinda.html
問題としては32bit UEFIが必要でUbuntuだとそこが難しいようだけど、Wheezyだけど32bit UEFI対応インストーラあるしサクッと入れ替えられるのではと予想。 てことで、誰かください。
_ 書籍「3日でマスター JavaScript」読了/JavaScript挫折組におすすめ
読了。手を動かしながら一日2時間×3日の想定なので、読むだけなら1時間ほどで読めました。ということで感想。
leaflet.jsで作った地図をApache Cordovaでアプリにしたいと思ってJavaScriptを書こう!と決意したわけですが、自分にピッタリくる参考書がなかなかありませんでした。
書店にあるJavaScriptの書籍というのは、だいたい2つのタイプに分かれていて、一つはWebデザイナーなどのノンプログラマーに向けに書いたもの。もう一つはJavaScriptをバリバリ書いているフロントエンドエンジニア向けに書かれたものに分かれてます。
レガシーながらもプログラムを書いたことがある人にとっては、ノンプログラマー向けの説明は退屈で必要ないし、エンジニア向けの内容は、その過程に至るまでの解説が足りない。
ということでモヤモヤしながらも「JavaScriptは、もういいや」となってたのですが、この本は初心者向けの本でありながら、短期間で全体像を把握させる作りのためJavaScriptらしい部分の説明は押さえつつも、外れるところは断りを入れてあえて説明しないという割り切りは読んでいて気持ちが良かったです。
自分みたいに、次に行くために手っ取り早く全体像を知りたい人にはオススメですね。
_ Microsoftマウスのホイールがバカになった
Microsoftの「Comfort Mouse 3000」というマウスを使ってるけど、ホイールがバカになったのかクルクル回しても3回に1回ぐらい空回りするのが気持ち悪い。
このマウスは、以前のマウスが壊れて近所のJoshinで適当に買ったものだけど、当初からマウスボタンが硬すぎて指が痛かったり、使いづらくていい思い出はないけど、これはもう捨てだよな。
マイクロソフトのマウスも、昔のインテリマウスとかは良かったのにな。
2014-10-19
_ いい天気なのに出られない
出ようと思ったところで仮想マシンのWindows Updateが始まって、出鼻をくじかれたので出る気なくなった。
_ 必要なものは「人と違うオレ(ワタシ)すげー」という中二病的な気持ち
昨日は姫路IT系勉強会がありました。 そこで「Ubuntuをインストールしたけど、そこからどうしたらいい?」という話しが出ました。
今でこそLinuxは便利だから使っているけれど、自分がLinuxを使い始めた時を振り返ると、使い始めた一番の理由は「Windowsと違うから」→「人と違うOS使ってるオレ、カッコイイ!」という部分が一番大きかったような気がします。
Linuxに限らず、新しいことを始めるときの強い動機は、良い意味での勘違いと思い込みだと思いますよ。
_ isenkramを使うと必要なファームウェアを自動認識してインストールできるのか
- Petter Reinholdtsen: Automatically locate and install required firmware packages on Debian (Isenkram 0.4): http://people.skolelinux.org/pere/blog/Automatically_locate_and_install_required_firmware_packages_on_Debian__Isenkram_0_4_.html
- Petter Reinholdtsen: Debian Jessie, PXE and automatic firmware installation: http://people.skolelinux.org/pere/blog/Debian_Jessie__PXE_and_automatic_firmware_installation.html
試してみたいけど、そういう環境ないし、自動的にnon-freeのリポジトリを追加してインストールしてくれたら嬉しいのだけど。
2014-10-21
_ なんとか雨が降らなかった
網干の祭りだそうで、スーパーに行ったら祭り体制になってた。
_ leaflet.jsの地図にGeoJSONの情報を表示させるいくつかの方法(解決編)
まだ、leaflet.jsでバタバタしてます。
前回、日記に「leaflet.jsの地図にGeoJSONの情報を表示させる」というエントリを書きました。ですが、ファイルに手を加えて表示させるのは不格好だなと思ってました。 そういうこともあって、GeoJSONそのままの形で読み込む方法を探してバタバタした結果、納得できるようになったのでメモしておきます。
参考
- External GeoJSON and Leaflet: The Other Way(s) – Victory Formation: http://lyzidiamond.com/posts/external-geojson-and-leaflet-the-other-way/
leaflet AJAXプラグインを使って読み込む
悩んだ悩んだ。
最初に試したのがこの方法で、悩んで姫路IT系勉強会でも質問のネタにしたのだけど、何回試してもうまくいかない。
デバッガで見るとファイルを読み込んだところでコケるので、GeoJSONのファイルを作りなおしたりしたけれど結果は変わらず投げようかと思っていたところで、ふと、気がついた。 ローカルのHTMLファイルをブラウザで読み込ませるのではなく、httpを通して読み込ませるとどうなる?
これを参考に、
$ python3 -m http.server 8080
という感じでPython3でWebサーバーを実行してアクセスすると、ちゃんと読み込んで表示する!!!
はあ。疲れた。
ということで、ローカルからではなくWebサーバー越しでアクセスして使う方法。
Leaflet Ajaxプラグインは、CDNで配布していないのでローカルにダウンロードしておきます。
- calvinmetcalf/leaflet-ajax: https://github.com/calvinmetcalf/leaflet-ajax
Leaflet.jsを読み込んだ下あたりにLeaflet Ajaxプラグインを読み込むように書いておきます。
<script src="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.js"></script> <script src="leaflet.ajax.min.js"></script>
GeoJSON読み込み部分は、サンプルほぼコピペでいけます。
var geojsonLayer = new L.GeoJSON.AJAX("map.geojson"); geojsonLayer.addTo(map);
これで、http越しにアクセスするとGeoJSONの場所にピンが打たれるはずです。
Leaflet Ajaxプラグインの成果
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>leaflet.jsの練習</title> <script src="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.js"></script> <script src="leaflet.ajax.min.js"></script> <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.css"> <style> body{ margin: 0; padding: 0; } div#map{ width: 100%; height: 500px; } </style> </head> <body> <div id="map"></div> <script> var map = L.map('map').setView([34.839378, 134.694097],15); var tileLayer = L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',{ attribution: '© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors', maxZoom: 19 }); tileLayer.addTo(map); var marker = L.marker([34.839378, 134.694097],{ title: 'test', draggable: true }).addTo(map); marker.bindPopup("<b>Hello world!</b><br>I am a popup."); var geojsonLayer = new L.GeoJSON.AJAX("map.geojson"); geojsonLayer.addTo(map); </script> </body> </html>
jQueryを使って読み込む
姫路IT系勉強会で相談した時、「JSONの読み込みは、jQuery使うと楽」とのワテさんからのアドバイスがあったので、こっちでももがいた結果がこちら。 jQueryを使うと、汎用性とHTMLファイルをブラウザで読み込んでも、ちゃんとGeoJSONが読み込めるところがメリットですね。
まず、jQueryを読み込むように書いておきます。新しいブラウザだけでいいので2.x系使ってます。
<script src="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.js"></script> <script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
GeoJSONを読み込んで地図表示は、こんな感じ。
$.getJSON("map.geojson",function(data){ L.geoJson(data).addTo(map); });
たったこれだけなんだけど、これも結構時間かかった…。
jQueryを使った成果
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>leaflet.jsの練習</title> <script src="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.js"></script> <script src="https://code.jquery.com/jquery-2.1.1.min.js"></script> <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.css"> <style> body{ margin: 0; padding: 0; } div#map{ width: 100%; height: 500px; } </style> </head> <body> <div id="map"></div> <script> var map = L.map('map').setView([34.839378, 134.694097],15); var tileLayer = L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',{ attribution: '© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors', maxZoom: 19 }); tileLayer.addTo(map); var marker = L.marker([34.839378, 134.694097],{ title: 'test', draggable: true }).addTo(map); marker.bindPopup("<b>Hello world!</b><br>I am a popup."); $.getJSON("map.geojson",function(data){ L.geoJson(data).addTo(map); }); </script> </body> </html>
2014-10-23
_ 引きこもりバンザイ
いや、家にこもってゴソゴソしてるざんすよ。
_ 総務省にある合同会社設立登記申請書テンプレをLibreOfficeで完コピしてみた
以前にも書いたと思いますが、法務省のページに会社の登記申請に必要な書類のテンプレートが置いてあります。
- 法務省:商業・法人登記申請: http://www.moj.go.jp/ONLINE/COMMERCE/11-1.html
相変わらずdocファイルの中身はrtfですが、それはさておき、中身を見ると書式の直接指定と文字がベタ打ちのスペースを使ったインデントの嵐で、編集しようとすると体裁がガタガタ崩れるシロモノです。 (おそらく印刷したものに書き込むイメージで作成したのだろうなと想像。)
こういう力技で作ったオフィス文書を、スタイルなどの機能を使い文書を構造化してモダンなオフィス文書に書き直すとどうなるのだろう?と思ったので、LibreOffice Writerの練習がてら作りなおしてみました。
ハイブリッドPDFになっているので、LibreOfficeで読み込むと編集できます。IPAフォントを埋め込んでいるのでファイルサイズは大きくなっていますが、OSを問わず、ほぼ同じ見え方になると思います。
書式はスタイルに移植しましたが、元のレイアウトがスペースの挿入で調整されていることもあり正しい位置がわからないので、おおよその位置をインデントで調整しています。 そして、この文書はいくつかの書類の集合ですが、文書としてはセクションで分けるのがよいような気がしたのでセクションで区切っています。
具体的な違いは、編集記号をオンにしてスタイルとナビゲーターを使ってみると、どう変わったのかわかって面白いかもしれません。 こういうのは自己満足ですが、たまに練習がてら頭の体操として作ってみるのも面白いと思います。
_ 箇条書きの行頭文字が2文字の箇条書きをLibreOfficeではどう表現する?
- 箇条書きの行頭文字に2文字使うにはどうしたらいいでしょうか - Ask LibreOffice: http://ask.libreoffice.org/ja/question/40454/ge-tiao-shu-kinoxing-tou-wen-zi-ni2wen-zi-shi-unihadoushitaraiideshiyouka/
上の文書を再現しようとした時、「合同会社設立登記申請書」の「商号」「本店」など部分は「1.」と書いてあるので番号付け(リスト)のように見えますが、数字はインクリメントしないので単なる箇条書きです。
最初は「箇条書きの文字を変更すれば楽勝」と思ったけれど箇条書き/番号付けのダイアログを開いて気がついた。
これはどうやって表現したらいいのだろう。
LibreOfficeの箇条書きと番号付きリストの仕様は、こんな風になってます。
- 箇条書き: 行頭の文字は変えられるが1文字だけ。前後に区切り文字はつけられない。
- 番号付け: インクリメントできる数字/文字。カッコなどがある場合は前後に区切り文字を設定する。
箇条書きで設定しようとするとピリオドが指定できないし、番号付けだと数字がインクリメントされてしまうし、どうしようかと思ってask.libreoffice.orgで尋ねたところ、こんな答えが帰ってきました。
- 画像化した文字を使って箇条書きを書く
- 番号付きリストの前後区切り文字だけを使う
どちらも思いつかなったので、なるほど!と思いましたよ。
まあ、バッドノウハウといえばバッドノウハウで、正しくはバグ報告出して仕様を改めてもらうのがスジなのだけど、こういうやり方もあるのかと関心しましたよ。
2014-10-24
_ Apache CordovaでAndroidアプリを作ってみる
Apache Cordovaを使うとHTML/CSS/JavaScriptでできたWebアプリをパッケージにして、モバイルデバイスのアプリにすることができます。
- Apache Cordova: http://cordova.apache.org/
- Apache Cordova API Documentation: http://cordova.apache.org/docs/en/4.0.0/index.html
leaflet.jsで地図が出て、GeoJSONのデータ位置にピンを打つことができたので、これをCordovaでアプリにしてみました。
Android開発環境の準備
Apache Cordovaは、Ubuntu TouchやFirfoxOSにも対応しているので、それらでもいいのですが、せっかくなら実機で動かしたいので、ターゲットデバイスをAndroidに設定しました。
ということで、まずはApache Cordovaが利用するAndroid開発環境を整えます。
Android SDK関係のインストールは、Debian Sidではパッケージが揃っているので、それを使っても良かったのですが、Androidの開発自体不慣れなのでAndroid Studioをダウンロードして使いました。
ちなみにEclipseを使わなかったのは、Eclipseがコアを吐きまくって、まともに動かなかったからです。
- Android Studio | Android Developers: https://developer.android.com/sdk/installing/studio.html
Android Studioのインストールは、アーカイブをホームディレクトリの適当な場所に展開して、パスを通せばOKです。
$ tar xvfa android-studio-bundle-135.1339820-linux.tgz
パスの場所は、Android StudioのbinとバンドルされているAndroid SDKのtools、platform-toolsがあるので気をつけて下さい。 そして、LD_LIBRARY_PATHは、Android SDKのqemuがlibOpenglRender.soを見つけられないので、これも一緒に追加しておきます。
~/.bashrc抜粋(Android Studio 1.0になってSDKが~/Android/Sdk/に入るようになったのでアップデート版) # android export PATH=$PATH:$HOME/Android/Sdk/tools:$HOME/Android/Sdk/platform-tools:$HOME/bin/android-studio/bin export LD_LIBRARY_PATH=$LD_LIBRARY_PATH:$HOME/Android/Sdk/tools/lib
終わったら、Android StudioのアップデートとAndroid SDK Managerで必要なAPIのインストール。そして、Android Virtual Device Managerで検証用の仮想デバイスを作っておきます。 実機で検証してもいいのですが、cordovaのコマンド一発でビルドからエミュレーター上でアプリ起動までできるので、ちょっと確認するときには便利です。
(Android Studio) $ studio.sh (Android SDK Manager) $ android (Android Virtual Device Manager) $ android avd
Apache Cordovaのインストール
Apache Cordovaは、node.jsで動くので、Debianパッケージのnode.jsとnode.jsのパッケージマネージャnpmをインストールします。
$ sudo apt-get install nodejs nodejs-legacy npm
続いてnpmを使ってcordovaをインストールします。
$ sudo npm install -g cordova
サンプルアプリをビルドしてみる
この辺からは公式ドキュメントそのままです。テストでサンプルアプリを作成します。
- Apache Cordova API Documentation: http://cordova.apache.org/docs/en/4.0.0//guide_cli_index.md.html#The%20Command-Line%20Interface
cordova createコマンドで、ひな型をを作ります。
$ cordova create hello com.example.hello HelloWorld
最初の引数は、ひな型のディレクトリ名です。 2番目はドメイン名を逆から並べた識別子です。逆ドメインの形でない、おかしな識別子にしているとAndroidプラットフォームが追加できずハマるので気をつけて下さい。 3番目はアプリ名です。省略可能でconfig.xmlを編集して後から追加もできますが、最初に適切な名前をつけておいたほうがよいでしょう。
作成できたら、ひな型のディレクトリに下ります。
$ cd hello
用意されたファイルを見てみます。
$ ls config.xml hooks/ platforms/ plugins/ www/
config.xmlには、cordova createで設定したアプリの設定が書いてあります。
それでは作成するアプリのプラットフォームを追加します。 追加できるプラットフォームは、cordova platformをなにもつけずに実行すると一覧が表示されます。
$ cordova platform Installed platforms: Available platforms: amazon-fireos, android, blackberry10, browser, firefoxos, ubuntu
Androidを追加しました。
$ cordova platform add android
wwwディレクトリにマスコットキャラクターを表示するだけのHTML/CSS/JavaScriptファイル一式が用意されています。 これらのファイルはブラウザで普通に見ることができるので試しに見てみます。
$ iceweasel www/index.html
ビルドするとこれと同じものが表示されるはずです。cordova buildコマンドを実行してビルドしてみましょう。
$ cordova build
しばらく時間がかかりますが、正常に終了すると hello/platforms/android/ant-build/CordovaApp-debug.apk というapkファイルが作成されます。
apkファイルをエミュレータ上で実行するには、cordova emulateを実行します。
$ cordova emulate android
_ leaflet.jsの地図をAndroidアプリにしてみる
これで一通りの流れがわかったので、leaflet.jsを使った地図をアプリにしてみます。
まずはひな型を作って、プラットフォームを登録する。
$ cordova create leaflet tv.nofuture.leaflet LeafletTest $ cordova platform add android
wwwディレクトリにleaflet.jsとプラグイン、jQuery、bootstrapを置く。 ざっくりコピーしたので無駄なものも多いけど、treeで表示するとこんな感じ。
├── css │ ├── bootstrap-theme.css │ ├── bootstrap-theme.css.map │ ├── bootstrap-theme.min.css │ ├── bootstrap.css │ ├── bootstrap.css.map │ ├── bootstrap.min.css │ ├── index.css │ └── leaflet.css ├── data (leaflet.jsに読み込ませたいGeoJSONファイル) │ └── map.geojson ├── fonts (bootstrapのフォントファイル) │ ├── glyphicons-halflings-regular.eot │ ├── glyphicons-halflings-regular.svg │ ├── glyphicons-halflings-regular.ttf │ └── glyphicons-halflings-regular.woff ├── img │ └── logo.png ├── index.html (ここに書く) └── js ├── bootstrap.js ├── bootstrap.min.js ├── images │ ├── layers-2x.png │ ├── layers.png │ ├── marker-icon-2x.png │ ├── marker-icon.png │ └── marker-shadow.png ├── index.js ├── jquery-2.1.1.min.js ├── leaflet-src.js ├── leaflet.ajax.js ├── leaflet.ajax.min.js └── leaflet.js
index.htmlを編集して、leaflet.jsで地図を表示したコードをコピペする。
head要素にscript要素でライブラリを読み込む。
<script src="js/jquery-2.1.1.min.js"></script> <script src="js/bootstrap.min.js"></script> <script src="js/leaflet.js"></script> <script src="js/leaflet.ajax.js"></script>
続いてライブラリのスタイルシートなど。
<link rel="stylesheet" type="text/css" href="css/index.css" /> <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css" /> <link rel="stylesheet" type="text/css" href="css/bootstrap-theme.min.css" /> <link rel="stylesheet" type="text/css" href="css/leaflet.css" /> <style> body{ margin: 0; padding: 0; } div#map{ width: 100%; height: 500px; } </style>
body要素に移って、内容をごっそり削って地図用のdiv要素とスクリプトを移す。
<div id="map"></div> <script> var map = L.map('map').setView([34.839378, 134.694097],15); var tileLayer = L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',{ attribution: '© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors', maxZoom: 19 }); tileLayer.addTo(map); var marker = L.marker([34.839378, 134.694097],{ title: 'test', draggable: true }).addTo(map); marker.bindPopup("<b>Hello world!</b><br>I am a popup."); $.getJSON("data/map.geojson",function(data){ L.geoJson(data).addTo(map); }); </script>
この2行は、cordovaのライブラリで必要なので消さないこと。
<script type="text/javascript" src="cordova.js"></script> <script type="text/javascript" src="js/index.js"></script>
コピーし終わったらビルドしてエミュレーターで実行してみる。
$ cordova build $ cordova emulate android
きゃー!動いたー!
apkを実機で実行してみると…。
動いたー!
leaflet.jsで地図アプリを作る野望の大枠が見えたので、これで生きる希望が出た。
cordovaで動かしたindex.html
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta name="format-detection" content="telephone=no" /> <meta name="msapplication-tap-highlight" content="no" /> <!-- WARNING: for iOS 7, remove the width=device-width and height=device-height attributes. See https://issues.apache.org/jira/browse/CB-4323 --> <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" /> <script src="js/jquery-2.1.1.min.js"></script> <script src="js/bootstrap.min.js"></script> <script src="js/leaflet.js"></script> <script src="js/leaflet.ajax.js"></script> <link rel="stylesheet" type="text/css" href="css/index.css" /> <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css" /> <link rel="stylesheet" type="text/css" href="css/bootstrap-theme.min.css" /> <link rel="stylesheet" type="text/css" href="css/leaflet.css" /> <style> body{ margin: 0; padding: 0; } div#map{ width: 100%; height: 500px; } </style> <title>leaflet.js Test</title> </head> <body> <div id="map"></div> <script> var map = L.map('map').setView([34.839378, 134.694097],15); var tileLayer = L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',{ attribution: '© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors', maxZoom: 19 }); tileLayer.addTo(map); var marker = L.marker([34.839378, 134.694097],{ title: 'test', draggable: true }).addTo(map); marker.bindPopup("<b>Hello world!</b><br>I am a popup."); $.getJSON("data/map.geojson",function(data){ L.geoJson(data).addTo(map); }); </script> <script type="text/javascript" src="cordova.js"></script> <script type="text/javascript" src="js/index.js"></script> </body> </html>
2014-10-27
_ gobbyを使ってローカルネットワーク環境内で共同でドキュメントを書く
「インターネットに繋がらないローカルネットワーク内で共同でドキュメント作成をしたいのだけど何を使うといい?」という質問があったので、「gobbyがいいんじゃないすかねぇ」とあいまいに答えたのだけれど、ずっと昔に使ったきりでセットアップの方法を忘れていたので調べてみたメモ。
avahiをインストールする
gobbyとは直接関係ないけれど、ネットワーク内でマシンを見つけるには、avahiがあると楽だと思うのでインストールしておきます。
$ apt-get install avahi-daemon avahi-utils
インストールしたらavahi-browseで、ネットワーク内のマシンを探せるか確認します。
$ avahi-browse -at
これで、ネットワーク内のマシンがズラズラっと表示されるはず。
Windowsの人はAppleのBonjourをインストールして確認、と思ったらAppleのドキュメントがアップデートされてなくて、調べる方法がわかんないですけど。
- Bonjour for Windows: 正しくインストールされたことを確認する方法: http://support.apple.com/kb/HT2703?viewlocale=ja_JP
gobbyサーバー(Infinoted)を起動する
以前、使った時はsobyというサーバーを使っていたのですが、今どきはInfinotedを使うそうで知識のアップデートは必要ですね。
- Dedicated Server · gobby/gobby Wiki: https://github.com/gobby/gobby/wiki/Dedicated%20Server
- Gobby server in 3 steps | Fabián Rodríguez, « MagicFab »: http://fabianrodriguez.com/blog/2010/02/05/gobby-server-in-3-steps
- How To Set Up And Use Gedit Collaboration Plugin (With Infinoted Server) ~ Web Upd8: Ubuntu / Linux blog: http://www.webupd8.org/2011/04/how-to-set-up-and-use-gedit.html
パスワード無しでとりあえず動かすだけならこれでOK ユーザー権限で起動します。
$ infinoted --security-policy=no-tls
パスワードをつけて動かしたりする場合は、設定を書く必要があります。 ~/.config/infinoted.confに以下の設定を書きます。certificate-fileとkey-fileは生成した鍵を置く場所ですが、フルパスで書いておきます。この辺りの詳しい解説はgobby wikiを見ると書いてあります。
[infinoted] security-policy=require-tls certificate-file=/home/USER/.config/infinoted/infinoted.cert password=(ログインパスワードを書く) key-file=/home/USER/.config/infinoted/infinoted.key
設定を書いたら暗号化のための鍵を生成します。
$ infinoted --create-certificate --create-key
鍵を生成したら、ユーザー権限でinfinotedを起動します。
$ infinoted
gobbyを使う
gobbyを起動するとavahiで見つかるマシンがリストアップされるので、適当なマシンに接続します。
接続してドキュメントを作成すると、別のクライアントからも作成したドキュメントが見えるようになるので、参加する場合はドキュメントをダブルクリックして編集に参加します。
_ EtherPad Lite
ここまで書いてナンだけど、もしかするとEtherPad Liteのほうが向いてるかも。
ただ、node.jsが必要でRaspberry Pi/Raspbianだとwheezy-backportsがないから、インストールがちょっと面倒なのがあるけど。
2014-10-28
_ ローカルネットワーク内のRaspberry Pi/Raspbian(Wheezy)上でEtherpad Liteを動かして共同でドキュメントを書く
昨日の続き。 Etherpad liteは、Webブラウザ上からドキュメントを共同編集するEtherpadをnode.jsを使って書きなおしたシステムだそうです。
- ether/etherpad-lite: https://github.com/ether/etherpad-lite
これをローカルネットワーク内にあるRaspberry Piにインストールしてみたのでメモ。
前提としては、イベントで一時的に使うだけなので設定としてはゆるゆるです。 それとRaspberry piには、あらかじめavahi-daemonをインストールしてあり、raspberrypi.localで接続できる前提です。
nodebrewをインストール
Raspbian(Wheezy)には、一応、node.jsのパッケージがあるのですが、0.6系と古いので、nodebrewを使って0.10系をインストールします。
- hokaccha/nodebrew: https://github.com/hokaccha/nodebrew
インストールは簡単でgithubに書いてあるとおりサクッとインストールできます。
$ curl -L git.io/nodebrew | perl - setup
ホームディレクトリの.nodebrew以下にインストールされるのでパスを通しておきます。
export PATH=$PATH:$HOME/.nodebrew/current/bin
~/.bashrcにも書いておくと良いです。
# nodebrew export PATH=$PATH:$HOME/.nodebrew/current/bin
node.jsをインストール
nodebrewコマンドが使えるので、node.jsのバイナリをインストールします。 今、v0.10.32がカレントだそうですが、バイナリがないのでv0.10.28を使いました。
$ nodebrew install-binary v0.10.28
バイナリをインストールしたら、バージョンをセットします。
$ nodebrew use v0.10.28
Etherpad Liteをインストールする
インストールはgithubからクローンするだけです。
$ git clone https://github.com/ether/etherpad-lite.git
設定は後にして起動してみます。
$ cd etherpad-lite/ $ ./bin/run.sh
スクリプトを実行すると必要なライブラリのチェックなどが始まりますが、PCと違ってかなり待たされるので放置しておくとよいでしょう。
Etherpad Liteが起動すると、このようなメッセージが表示されます。
[2014-10-28 16:45:57.686] [INFO] console - You can access your Etherpad instance at http://0.0.0.0:9001/ [2014-10-28 16:45:57.690] [WARN] console - Admin username and password not set in settings.json. To access admin please uncomment and edit 'users' in settings.json
この状態になったらCtrl+Cで一旦止めて、設定ファイルsettings.jsonを変更します。 変更する部分は、adminに関する部分のコメントを外してパスワードを設定するぐらいでしょうか。
設定を変更したら、もう一度./bin/run.shを実行して http://raspberrypi.local:9001/ にアクセスします。
文書名を入力すると文書が開きますが、初回はかなり待たされます。
しばらく待って文書が書ける状態になると、それほど遅くもないので試しに使うにはいいと思います。
とはいえ、Raspberry Piでは一斉に接続したりなど何か作業が発生すると、CPUが100%に貼りつくので使うなら普通のPCを使うほうがいいかも。
2014-10-29
_ 寒い
昨日から急に寒くなったのでストーブ出しました。
_ WikipediaはPCからのアクセスでもモバイル版を使うとスッキリとした1カラムになって読みやすい
Wikipediaの画面レイアウトは、ごちゃごちゃしているし、ブラウザを画面いっぱいに広げる人にとって文章が横に広がりすきるのでとても読みにくいのですが、これを一発で解消する方法があります。
その方法は、モバイル版のページ( http://ja.m.wikipedia.org/ )にアクセスするだけ。
論より証拠。まずは見比べて下さい。
- デスクトップ版: 姫路城 - Wikipedia: http://ja.wikipedia.org/wiki/%E5%A7%AB%E8%B7%AF%E5%9F%8E
- モバイル版: 姫路城 - Wikipedia: http://ja.m.wikipedia.org/wiki/%E5%A7%AB%E8%B7%AF%E5%9F%8E
モバイル版はメニューなどが隠される上に、広い画面では適度な余白が確保されるので、とても読みやすくなります。
_ LibreOffice Writerで表をドラッグして動かす
Wordだと表の移動はドラッグして動かすことができますが、LibreOffice Writerで表の移動は、表全体を選択して「切り取り」、移動先で「貼り付け」という面倒な方法をとらなければいけません。
通常はこれでもあまり困ることは無いのですが、ページの関係で微妙にレイアウトを調整したいときは、やはりドラッグして操作したい時があります。 その場合は、表を枠に入れて枠を使ってコントロールすると良いです。
方法は、表を全選択して、メニューバー[書式]→[枠]を選択するだけ。 枠には外枠がついているので非表示にすると表だけの表示になります。
枠に入れると文字を回りこませたりもできるので、困ってる人はお試し下さい。
_ このblog記事が雑誌「Mr.PC」(晋遊舎)に無断転載されていました(解決済)
晋遊舎から出版されている雑誌「Mr.PC」2014年11月号掲載の特集「格安Office本音のスタートガイド」p.86「『文書ドキュメント』上級テクニック」に、2014年4月26日に当サイトに投稿したblog記事「LibreOffice Writer文書にオシャレな飾り枠をつける」(http://www.nofuture.tv/diary/20140426.html#p01)が、ほぼそのままの形で転載されていました。
書店で記事を見かけ、晋遊舎の方に連絡を取って調べていただいたところ、この記事を書いた方が当サイトの記事を参照して書いたとのことで、お詫びと12月号に訂正を出していただきました。
関係者の皆様、迅速な対応ありがとうございました。
_ このサイトの記事を転載したい場合を例に(公衆許諾としての)ライセンスと著作権を考える
ということで、著作権やライセンスについてちょいちょい話すオイラとしては *1 *2 *3 良いネタができたので、このサイトの記事を利用する場合を例にライセンスが適用されたコンテンツの利用方法について書いてみたいと思います。
まず、著作権者は野方です。野方が書いているこのサイト(nofuture.tv)の記事は、基本的に「クリエイティブ・コモンズ・ライセンス 表示 - 継承 (CC BY-SA)」でライセンスしています。 バージョン表記の揺れはありますが、基本的には新しいバージョンを適用しています。
- Creative Commons — 表示 - 継承 4.0 国際 — CC BY-SA 4.0: https://creativecommons.org/licenses/by-sa/4.0/deed.ja
CC BY-SAのリンク先でどういうことができるかを読んでもらった上で、このサイトの記事を利用したい場合、あなたはどういうアクションをすればいいか考えてみます。
野方に断りを入れず利用したい
この場合は、Creative Commons License 表示 - 継承 (CC BY-SA)にしたがって利用して下さい。
具体的には、野方のクレジットを表記して、野方の著作物を利用してあなたが制作する著作物にもCC BY-SAのライセンスを適用します。
今回の場合は個別に許諾を出したので適用外ですが、適用した場合を当てはめてると、野方のクレジットを載せてかつ 雑誌 ページまたは特集までをCC BY-SAにする 必要があります。
(2014/10/31追記: 雑誌全体は間違い。ページかせいぜい特集。続きはこちら→ 雑誌におけるCC BY-SAの及ぶ範囲は雑誌全体ではない: http://www.nofuture.tv/diary/20141031.html#p02 )
CC BY-SAを適用せず利用したい
CC BY-SAは、あなたの著作物にも同じCC BY-SAライセンスを適用しなければいけませんが、それを適用したくないという方もいらっしゃるかもしれません。 その場合は、著作権者である野方までご連絡下さい。相談の上、検討したいと思います。
- メール: nogajun+offer[@]gmail.com
- Twitter: https://twitter.com/nogajun
- Facebook: https://www.facebook.com/nogajun
今回の場合は、このケースに当てはまり、事後ですが著作権者が個別に利用を許諾したのでCC BY-SA適用外になります。
CC BY-SAを適用したくないケースで言えば、ライセンスを個別に変更、許諾する以外に、野方に原稿を依頼して新規に書き起こすというのでも構いません。 その場合は、このサイトのライセンスはまったく関係がなくなるので非常に楽に利用できると思います。 今までの雑誌媒体に書いた記事の一覧もあるので、よろしければご検討下さい。(・ω<)
野方に断りも入れたくないしCC BY-SAも適用したくない
利用はあきらめて自分で頑張ってください。
著作権を正しく活用するためにライセンスがあります
「ライセンス」というと難しく聞こえますが、著作権自体が利用者だけでなく権利者も縛る面倒で扱いにくい物です。それを利用者、権利者ともに扱いやすくしようと言うのがライセンスです。
今まで書いたことも、使って欲しい条件はあらかじめ提示しているのだから、それにしたがって使うか、条件に従いたくなければ個別に許諾を得るか、諦めるか、ただそれだけのことです。
ということで、怖がらず、面倒くさがらず、できる場合とできない場合を照らしあわせて、好みと状況に応じてライセンスが適用されたコンテンツを利用することが、インターネットコンテンツの正しい利用方法だと思います。
*1 ネットジェネレーション の著作権と考え方: http://www.slideshare.net/nogajun/copyright-and-creative-commons-presentation
*2 ライセンスを理解してますか?知っておきたいWordPressとGPLライセンス: http://www.slideshare.net/nogajun/20121124-wordbench-osakalicense
*3 オープンで行こう! オープンソース・ソフトウェアとオープンソース・コミュニティの基礎知識: http://www.slideshare.net/nogajun/ss-37779693
2014-10-30
_ 雑誌にCC BY-SAのコンテンツを取り込んだ時に及ぶ影響の範囲
昨日書いた話の続き。
Facebookでやまねさんにツッコまれたのだけど、雑誌にCC BY-SAのコンテンツを取り込んだ場合、そのライセンスの及ぶ範囲というのはどこまでなんだろうね。
_ leaflet.jsを使ったCordovaアプリのソースをgithubに置きました
- nogajun/cordovaapps: https://github.com/nogajun/cordovaapps
ソースがblogに貼り付けるにはデカくなってきたのと、ワテさんとかからツッコミが入ったのでgithubに置きました。 ツッコミ、コワイヨー
_ PHPでマルチバイト文字列を扱うのはmbstringとiconvどっち使うといいのだろう
NibbleBlogというPHPで書かれたblogシステムがあります。
見た目が今どきな感じでデータベース不要。データをXMLテキストで保存するので小規模なblogにぴったりなシステムですが困ったことがあります。 それは、保存されたXMLデータの日本語文字列が文字化けしていること。
blogとしては文字化けしていないので問題ないかもしれないけれど、保存データにgrepしたりテキストを操作するツールが使えないのは、ちょっとイヤな感じだなと思って調べてみました。
それで分かったことは、NibbleBlogは、XMLの保存にSimpleXMLを使っています。 SimpleXMLは、UTF-8以外でエンコーディングされた文字列が入るとパースの問題が出るそうで、その対策のためutf8_encode関数を使って入力された文字列を強制的にUTF-8エンコードします。
このutf8_encode関数、入力された文字列を調べることもなく、入ってきた文字列はすべてISO-8859-1として扱うのでヘンにぶった切ってエンコードした結果、保存されたXMLは文字化けになっているという事らしい。
原因が分かれば、utf8_encodeを止めて、ほかのマルチバイト文字列を扱う関数で置き換えればということで、utf8_encode($val) と書いてある部分を、mbstringの mb_convert_encoding($val,"UTF-8","auto") に置き換えて、出力部分のutf8_decodeを削ったところでハタと気がついた。
もしかして、海外の人はmbstring使わないかも…?
PHPの知識は昔のままで止まっているのだけど、PHPで今どきのマルチバイト文字列を扱うのはmbstringとiconvどっちがいいんですかね?
_ Apache Cordovaにはbash completionでオプションを補完するためのファイルが入ってる
- cordova-cli/bash.md at master · apache/cordova-cli: https://github.com/apache/cordova-cli/blob/master/doc/ja/bash.md
ビルドを繰り返すときサブコマンドの入力が面倒だなと思っていたけど、bash comletion用のファイルが入ってるそうなのでサクッと設定。
# ln -s /usr/local/lib/node_modules/cordova/scripts/cordova.completion /etc/bash_completion.d/
ちょっと楽になった。
2014-10-31
_ 許可を求めるな。跳べ。
最近、「○○していいですか?」と尋ねられることが多いのだけど、聞く前に先にやっちゃったほうがいいよ。やった後、ダメな時はダメって言うだけだし。失敗して謝り上手になろう。
- 許可を求めるな謝罪せよ。(Don't ask for permission, beg for forgiveness ) - 未来のいつか/hyoshiokの日記: http://d.hatena.ne.jp/hyoshiok/20110205/p1
- Leap Before You Look - W. H. Auden: http://web.mit.edu/cordelia/www/Poems/Leap_Before_you_look.html
_ 雑誌におけるCC BY-SAの及ぶ範囲は雑誌全体ではない
Facebook経由でenoさんから教えてもらった。 雑誌全体ではないとのこと。
作品のみということは、転載されたページか(その人が書いてるなら)特集ぐらいまでかな。
- FAQ よくある質問と回答 - クリエイティブ・コモンズ・ジャパン: http://creativecommons.jp/faq?a=41#41
クリエイティブ・コモンズ・ライセンスのついた作品とそうでない他の作品を合わせて、コンピレーションアルバムや文集など(以下、「編集物」と言います。)を作った場合、その全体に対してクリエイティブ・コモンズ・ライセンスを付けなければなりませんか。
そのような場合、クリエイティブ・コモンズ・ライセンスのついていない他の作品には、クリエイティブ・コモンズ・ライセンスを付ける必要はありません。編集物全体に対してクリエイティブ・コモンズ・ライセンスを付けたい場合は、クリエイティブ・コモンズ・ライセンスのついていない他の作品について著作権を有する方から同意を得た上で、行ってください。
もともとクリエイティブ・コモンズ・ライセンスのついている作品には、ライセンスを付けなければならないか、つけるとしたらどのライセンスを付けるべきかについては、こちらのページ(FFAQ)の「そのままの利用の場合」をご参照下さい。
- FAQ よくある質問と回答 - クリエイティブ・コモンズ・ジャパン: http://creativecommons.jp/faq?a=44#44
様々な作品を集めて一つのリソースにまとめています。この中にクリエイティブ・コモンズ・ライセンスのついた作品を含めることは可能でしょうか。
全てのクリエイティブ・コモンズ・ライセンスはそれが付された作品を編集著作物(例えば作品集、百科事典など)[やデータベース]の素材に含めることを許諾しています。しかしその場合は素材にする原作品についていたライセンスの許諾条項に従わなければなりません。例えば、「非営利」のクリエイティブ・コモンズ・ライセンスが原作品に付けられている場合、それを商業的に使われる編集著作物の素材に含めることはできません。以下の表【内部:以下の表が記載されていないようです。】で、あなたの作っている編集著作物にクリエイティブ・コモンズ・ライセンスの付いた作品を含めることができるかを確認して下さい。
編集著作物の素材にクリエイティブ・コモンズ・ライセンスのついた作品を含める場合、その作品には同じクリエイティブ・コモンズ・ライセンスを付けておかなくてはいけませんが、それはその作品のみのライセンスであり、編集著作物全体に同一のクリエイティブ・コモンズ・ライセンスをつける必要はありません。2.13も参照して下さい。
<記号の意味>
- by =表示のみ
- by-nd =表示-改変禁止
- by-nc-nd =表示-非営利-改変禁止
- by-nc =表示-非営利
- by-nc-sa =表示-非営利-継承
- by-sa =表示-継承
- pd =パブリック・ドメイン
原作品についているライセンスの種類 編集著作物の種類
記号 営利目的 非営利目的 pd ○ ○ by ○ ○ by-nc ☓ ○ by-nc-nd ☓ ○ by-nc-sa ☓ ○ by-nd ○ ○ by-sa ○ ○
_ コメント欄を閉じているのは
面倒だから。交流したくないから。 FacebookもTwitterも極力絞っています。