読者です 読者をやめる 読者になる 読者になる

読み書きプログラミング

日常のプログラミングで気づいたことを綴っています

Twitter widget.js周辺のworkaround

サイトにTwitterボタンを入れていて、次はLINEで送るボタンを入れてみました。 すると、 Cannot read property 'match' of undefined という例外がwidget.jsの中で発生するようになって、Twitterボタンが正常に表示されません。 「LINEで送るボタン」は配置…

RMagickでTwitterに投稿するGIFアニメーションを作成する時に注意すること

6月19日にTwitterがGIFアニメーションをサポート開始しました。直接GIFアニメーションを見えるようにするのではなく、投稿時にGIFアニメーションをMP4に変換してそのリンクをツイート配信する枠組みです。RMagickでGIFアニメーションを作成して投稿してみた…

SGFパーサで四苦八苦

囲碁のプログラムのため、Jison(BisonのJavaScript版)を使ってSGFパーサを書きました。四苦八苦したので、その備忘録。まず、すんなり書けた第一版。 /* description: Parses SGF string and generates corresponding object. note1: This parser doesn't in…

日本語マニュアル更新

Maximaの日本語マニュアルを5.33.0に更新しました。 http://maxima.sourceforge.jp/maxima.html

[JavaScript] URIにマッチする正規表現

URIにマッチする正規表現が欲しかったので、URLにマッチする真の正規表現 – RFC3986定義のURIの話を参考にさせていただいて、簡略化とリファクタリングをしました。 ホストのipv6addressとipvFutureは長い割りに今のところ使うシーンを思いつかなかったので…

Iron-RouterとWeibo share button

Meteorアプリに新浪微博のシェアボタンを追加するに以下のようにします。 1. サーバーサイドで WebApp.addHtmlAttributeHook (request) -> 'prefix="wb: http://open.weibo.com/wb"' (CoffeeScriptで書いてますが、同様の内容をJavaScriptで書いてもOKです) …

Error: must use ordered observe with skip or limit

Meteorを0.8.0にアップデートした際、テンプレートのrenderedの仕様が変わったので、前のコードと同様の振る舞いをさせるために、renderedの中でobserveを追加しました。すると、 Error: must use ordered observe with skip or limit というエラーが出力さ…

Iron-Routerを使っている場合の0.8.0へのアップグレードと0.7.1.2へのダウングレード

Meteor 0.8.0がリリースされましたね。 今回のアップデートはレンダリングエンジンが一新されて、テンプレートのrenderedハンドラでHTML以外の色々な更新をしていたアプリには大きな変更になります。 以前のバージョンのレンダリングエンジンは、基本的にリ…

requestを使う

MeteorのHTTPはencodingがutf8固定で、バイナリ受信ができません。 なので、encodingを指定するために、npmのrequestを使いたくなりますが、非同期なのでMeteorの中では使い勝手が悪い。 そんなあなたにこの一行。(CoffeeScriptです) request = Meteor._wrap…

kombiloをMacで使う

kombiloは検索時の領域指定にマウスの右ボタンを押しながらドラッグという操作を要求します。 私はMacでMagic Trackpadを使っているのでこの操作はできません。 そんなユーザーのためのオプションも用意されていました。 kombiloを初めて起動して終了すると…

kombiloをOS Xにインストールする

kombiloは棋譜データベースプログラムです。以下からソースをダウンロードできます。 http://www.u-go.net/kombilo/ cd kombilo sudo easy_install configobj setuptools pyttk pip brew install boost brew tap homebrew/science brew install pmw export P…

珍瓏を解くウェブアプリ

珍瓏というのは元々は詰碁を示す昔の中国語でしたが、近年では盤全体を使った詰碁やシチョウ問題を示します。 ここではシチョウ問題という意味で使っています。 コンピュータがシチョウを追いかけて取れるかどうか判定し、その手順を示すアプリを作りました…

Pachiの使い方

1月31日に囲碁電王戦が発表されましたね。2012年から電聖戦という電気通信大学と日本棋院提携でコンピュータ碁の進歩を確認するためのプロ棋士との置き碁戦が始まっていたのですが、やはり、(将棋)電王戦で大きな盛り上がりの実績のあるニコ生が取り組むとな…

タッチデバイスの判定

いつからでしょう?気がついたらデスクトップChromeがTouchEventをサポートしていました。 document.createEvent('TouchEvent')を実行しても例外を発生させてくれず、自作のアプリでマウスとタッチでイベントハンドラを切り替えていたものがデスクトップChro…

Iron Routerとsubscribeその2

前回、ページ遷移の高速化を行いましたが、実質、ページ遷移毎にsubscribeが更新されて、まだ不満がありました。イメージとして、最大のsubscribeが済んだら後はページ遷移でsubscribeの更新は起こらないようにしたい。 で、以下のような感じに修正しました…

MavericksにはOpenCLのcl.hppが添付されていない

なので、/System/Library/Frameworks/OpenCL.framework/Headersにhttp://www.khronos.org/registry/cl/api/1.2/cl.hppをコピーする。

Iron Routerとsubscribe

マルチページアプリの場合、通常ページ毎に扱うデータベースが異なるので、Iron RouterではbeforeかwaitOnを使ってsubscribeすることになります。 データ量の大きなものをアクセスする場合にはwaitOnを使うと表示まで時間が掛かるので、beforeを使ってリアク…

日本語マニュアル更新

Maximaの日本語マニュアルを5.32.1に更新しました。 http://maxima.sourceforge.jp/maxima.html

Advent Calendar 11 - Iron Routerを一言で言うと

Meteorはシングルページウェブアプリのプラットフォームです。 マルチページにするにはmrtでIron Routerパッケージを追加します。 https://github.com/EventedMind/iron-router Iron Routerは(シングルページウェブアプリを拡張したためか)基本的にクライア…

Twitter公式サイトの画像プレビューは幅が435px以上の画像がプレビューされる

死活と詰め碁(@tsumego_bot)や囲碁対局中継「耳赤」を通じて画像投稿をしています。 ところが、この投稿画像、Twitter公式サイトでプレビューとして表示されない。画像は操作なく見えた方がいいので、なんでだろうと思いました。 png, gifはダメ? 調べた結…

Advent Calendar 10 - "Discover Meteor"が一日だけ無料公開

Meteor社自身もお勧めのMeteor本"Discover Meteor"が本日だけ全文無料公開されています。 http://free.discovermeteor.com/

Advent Calendar 9 - 番外編 Twitterの自動フォローバック〜私は見た!Twitterの闇の一端を〜

Meteor固有の話ではありませんが、面白いことが起こったので、実装含めてご紹介。Twitter APIとNPMのtwitterパッケージを使えば自動フォローバックが簡単に実装できます。 meteor add npm packages.json { "twitter": "0.2.4" }サーバー側 Twitter = Meteor.…

Advent Calendar 8 - MeteorでSNS

Meteorのaccounts関連のパッケージははアカウント管理にソーシャルサービス連携をサポートしています。 ユーザーにソーシャルサービスアカウントでアプリにサインインしてもらい時には、 accounts-facebook accounts-github accounts-google accounts-twitte…

Advent Calendar 7 - appcacheでアプリケーションキャッシュ

Meteorでアプリケーションキャッシュを有効にする方法は簡単です。 meteor add appcache ピリオド。 これでマニフェストを自動生成してくれます。マニフェストはサーバーを再起動する度に再生成されます。 ウェブアプリ(クライアント)はマニフェストが更新さ…

Advent Calendar 6 - Meteorでのユニットテスト

Meteorでのユニットテストは、Meteorの部分に関してスタブを作って、Mochaで流すのが一番よさそうです。すいません、以下、CoffeeScriptでのコーディングを前提にしています。 share = {} Meteor = require: require users: findOne: -> methods: -> startup…

Advent Calendar 5 - ライブHTMLの詳細

Meteorはでは、テンプレートHTMLにヘルパーメソッドでリアクティブなデータを盛り込むとそのHTMLの該当部分が自動的に更新されます。以下はMeteorの公式ドキュメントの例。 <body> {{> players}} </body> <template name="players"> {{#each topScorers}} <div>{{name}}</div> {{/each}} </template> Template.players.top…

Advent Calendar 4 - htmlタグへの属性追加方法

Meteorは、デフォルトではシングルページのウェブアプリケーションを作ることになります。 (iron-routerというパッケージを追加すると、マルチページにすることができます)MeteorのHTMLファイルは実際にはHTMLではなく、htmlタグを含まず、headとbodyとtempl…

Advent Calendar 3 - NPMの使い方

本格的なウェブアプリケーションを作ろうと思うと、既存のライブラリを活用することが事実上不可欠です。Meteorは、クライアント、サーバーともJavaScriptの世界ですから、クライアントではブラウザ用JavaScriptライブラリ、サーバーではNode.js用ライブラリ…

Advent Calendar 2 - autopublishとinsecureパッケージ

Meteorでアプリケーションを作るとき、最初に meteor create app-name を実行します。すると、app-nameという名前のフォルダーが生成され、中に必要なファイルやテンプレートが展開されます。 この状態でアプリケーションにはautopublishとinsecureというパ…

Advent Calendar 1 - Meteorとは

12月になると、各所でクリスマスまでプログラミング関連の記事を連載するAdvent Calendarが盛況になります。 私も遅ればせながらやってみようかと思いました。題材はMeteor。 http://www.meteor.com/ Meteorはウェブアプリケーションのプラットフォームです…

テーブルトップを紹介いただきました。

DraftPadとその後継Textwellの拡張方法を中心に独特の語り口調でiPadアプリを掘り下げるブログ「W&R: jazzと読書の日々」にテーブルトップをご紹介いただきました。 iPadのSafariで使えるOSXダッシュボード TableTop 元々(Macで)動いているものを(iPadで)動…

MeteorのHTTPはcontentにBufferも受け付ける。

Meteor.methodsでTwitterに写真付きstatusの投稿をするコードを書きました。 最初非同期で書いたのですが、そしたらクライアント側で投稿が成功したかどうか確認するタイミングが得られませんでした。 で、Meteorのhttpパッケージを使って書き直したのですが…

囲碁対局中継サイト「耳赤」

進行中の対局をリアルタイムで中継するサイトを作りました。明日の名人戦第五局で早速運営する予定です。 気になる局面から検討をすることもでき、その結果を画像として添付してツイートすることができます。囲碁が好きで、Twitterをしていて、中継を見るほ…

ダックタイピングの手引き? - Rubyでの静的型付けの心理学

「Dropboxは全部Pythonで信頼性の高いソフトウェアを作った」の中で「人生を変えた記事」として"Subject: How to duck type? - the psychology of static typing in Ruby"というメーリングリストへの投稿記事が紹介されていましたので、訳してみようかと思い…

計算機ウェブアプリをiOS7にまねてみました。

iPad用iOS 7にはやっぱり計算機アプリがないということなので、iOS 7パクリの計算機ウェブアプリを作りました。 http://y-ich.github.io/Calculator/calculator7.html フラットデザインって、ずいぶんHTMLやCSSのコードが減りますね。

iOS 7ではウェブ(クリップ)アプリでwatchPositionが正常動作

iOS 6では「ホーム画面に追加」したウェブアプリではwatchPositionのコールバックが1度しかコールされないという不具合がありましたが、iOS 7では直っていることを確認しました。 <html> <head> <meta charset="UTF-8" /> <meta name="apple-mobile-web-app-capable" content="yes" /> <title>watch location</title> </head> <body> <script type="text/javascript"> navigator.geo…</body></html>

Android Chromeで初回ロード時、touchstartがトリガーされない。

ご存知でしたら対処法教えてください。 Android Chromeで、タブを作成して以下のページにアクセスすると、#touch divをタッチしてもtouchstartがトリガーされません。ページをリロードすれば、トリガーされるようになります。初回ロードでもトリガーするよう…

Wolfram|AlphaのTwitter bot多言語化しました。

Twitterから問いかけると、Wolfram|Alphaが答えてくれるTwitter bot @wb_botを多言語化しました。40カ国語以上です! (Microsoft Translator APIを利用させていただきました。)@wb_botにメンションする形で探索式を入力すると、答えがリプライされます。 @wb…

MacのDashboardのようなサイト「テーブルトップ」

新Nexus 7を買って少しずつ触っています。iPadと比較していい点悪い点色々ありますね。ウィジェットはやっぱりいいなーと思いました。それほど役に立つという訳ではありませんが、華がある。で、iPadでもウィジェットを使いたくてサイトを作りました。 http:…

日本語マニュアル更新

Maximaの日本語マニュアルを5.31.0に更新しました。 http://maxima.sourceforge.jp/maxima.html

日本語マニュアル更新

諸般の理由により、年初以来、Maximaの日本語マニュアルの更新をさぼっていたのですが、5.30.0に更新しました。 http://maxima.sourceforge.jp/maxima.html

音声ガイド付きストリートビューナビゲーション

(注: 2013年10月9日、サイトをmaps2013.herokuapp.comからy-ich.github.ioに引っ越しました。) http://y-ich.github.io/maps/navi.html 最近、自転車で動き回っています。この前は住んでいる天理市から三重県の鳥羽市まで行ってきました。 ろくに地図を確か…

Mobile Safariで好きなタイミングで音を鳴らす

iOS Safariのaudio要素はユーザーイベントで再生をしないと音が出ないようになっています。iOS6でWeb Audio APIがサポートされ、この制約を緩和するノウハウが色々なブログで公開されています。 今回、このノウハウを実際に使うことになったので、CoffeeScri…

Mobile Safariで自動ロックを抑制する

ナビゲーションアプリ、パズルのようなゲームをウェブアプリで作ると、iPhoneの自動ロックを抑制したくなります。ネイティブアプリならidleTimerDisabledプロパティを使うところです。 解はあって、それは10秒以下の短いaudioを鳴らし続けることです。 Mobil…

ルートの標高、勾配を調べられるAthlete-Maps

http://y-ich.github.io/maps/athlete-maps.html自分用のツールなので、無愛想ですが、URLだけ。

四路の純碁ソルバ

四路の純碁ゲームの兄弟、「四路の純碁ソルバ」を作りました。 http://y-ich.github.io/yonro/solver.html 問題を出すと、コンピュータが一生懸命解きます。

Mobile SafariでスムーズなBootstrap モーダル

Bootstrap便利ですね。 でも、iPhone, iPadで使うとエフェクトのアニメーションがぎこちなくて重いアプリのように見えます。少し手を入れればスムーズになります。 bootstrap.cssの以下の部分を下のように直せばOK。 .modal.fade { -webkit-transition: opac…

Mobile SafariでBGM鳴らすときの注意事項3点

要素のサイズを0にする iOS Safariではdisplay: noneにしてもaudio要素が200x16の基本サイズを持ち、レイアウトに影響を与えます。 CSSでサイズを0にしておきましょう。 audio { width: 0px; height: 0px; } 先頭から再生を始めるには例外処理を入れておく c…

四路の純碁ゲーム

久しぶりにウェブアプリを作りました。どうぞ一度お遊びください。 http://y-ich.github.io/yonro/ iPhone, iPadでの表示を意識しています。デスクトップだと表示が大きすぎるかもしれないので、「縮小」などで対応いただければ幸いです。 WebKit系で確認し…

ウェブで、iOS7のような動く壁紙を作る

iOS7では壁紙にパノラマ写真を選ぶと壁紙が動くそうです。 面白い。でも、ウェブで簡単にできますね。やってみましょう。 端末の姿勢(オイラー角)を扱うのに、Three.jsを使いました。 <html> <head> <meta charset="UTF-8" /> <title>Wall paper</title> <style type="text/css"> html, body { height: 100%; } body { background-image</meta></head></html>…