Javascript
ブログを書いていると、 自分が書いた記事にどれくらいブックマークがついているかが 気になるものである。 はてなブログでブログを管理している場合は、 ブログ管理画面や「はてなのお知らせ」というChrome拡張で ブックマークされたことを知ることができる…
ある開発プロジェクトで、 非技術系のメンバーにも進捗を知っておいてもらいたいものの、 「お前らSubversion入れろ」とか「リポジトリログを見ろ」といっても見そうになく、 いちいち伝えるのも面倒大変そうだったので、 Subversionにコミットがあったらメ…
個人的にNode.jsを習得しようと色々調べてた時に 仕事でWebアプリの速度改善の依頼が飛び込んできたので、 Node.jsでHTTPリクエストのレスポンス時間をチェックしたい時は どう書くのかな、と調べてみた。
とあるWeb開発プロジェクトで WBS(Excel製)に書かれた、機能ごとの開発担当・開始日・期日・予定工数を そのままRedmineのチケットとして登録するという、 手作業でやったらえらく時間のかかりそうな作業があったので、 RedmineのAPI経由でチケットを一括登…
Node.jsのRESTクライアントモジュールを試すため、 以前Groovyで作成したBit.lyの履歴を取得するスクリプトをNode.jsで焼きなおしてみる。 「node-rest-client」というモジュールを使用した。 get_bitlinks.js var RestClient = require('node-rest-client')…
そろそろNode.jsスクリプト作成にも慣れてきたので、 簡単なWebアプリ作成に挑戦してみた。 Meteor、MEAN.js、Sails.jsなど色々あって迷ったけど、 まずはシンプルにExpressを使ってみる。 MongoDBコレクションに保存された情報を Webページ上に一覧表示する…
MongoDBの勉強を兼ねて、Apacheのアクセスログを後でログ分析や ビジュアライズに使えるようにMongoDBにインポートするスクリプトを書いた。 下記のスクリプトはログファイルを行単位で読み込んでMongoDBの 特定のコレクションに登録する。 行単位のファイル…
Nashornというのは、Java8に同梱されている新しいJavascriptエンジンで、 Javaライブラリを呼び出して利用するJavascriptプログラムを作成することができる。 Node.jsで適当なライブラリが見つからない場合やJavaライブラリに精通していて ちょっとしたスク…
Javascriptがプログラミング言語としてどうか、ということはさておいて、 「もうJavascriptさえ覚えておけば何でもできるんじゃない?」 というくらいJavascriptでできることが増えているので、それをまとめてみる。 Javascriptでできること Webサイトのクラ…
node.jsはWindowsでもLinuxでも同じスクリプトが そこそこ安定して動くので嬉しい。 今回は、ExcelJSモジュールを使って、 Excelのシート一覧を出力するスクリプトを書いた。 リダイレクトでファイルに出力できる。 簡単なスクリプトだけど、こういうものを…
Web開発を仕事にしていると 「マニュアルやプレゼンに使うのでWebアプリのスクリーンショットをくれ」 と依頼されることがよくある。 ChromeのFireshotのようなブラウザの拡張機能を使ったりすれば 1画面ずつ撮っていけるのだけど、 chrome.google.com たく…
あるプロジェクトのソース分析を行う必要があったので、 まずはソースファイルの一覧をExcelに出力してみることにした。 treeコマンドがいい感じで階層出力してくれるのだけど、 それをそのままExcelに持っていくと文字化けするので、 treeコマンドから一旦J…
以前Groovyで作成したパスワード付きExcelを開くスクリプトをJavascriptでも 書いてみよう、ということでnode.jsで色々試してみたところ、パスワード付き Excelに対応しているライブラリが見つからなかった。 (普通にExcelを操作するだけならxlsjs等良さげ…
ページに記載した外部リンクが何回クリックされたかを知りたかったので、 リンククリックをカウントするスクリプトを作成した。 Google Analyticsのイベントトラッキング機能の簡易版。 リンクにあらかじめ決めたCSSクラスとリンクを識別するための属性を 設…
jQuery Mobile http://jquerymobile.com/ いろいろはまったので、メモ。 バージョンは 1.0 ALPHA 2。 page毎にHTMLを分けて作成する これは好みだと思うのだけど、URL直指定でそれぞれのページを呼び出せたりするようにするなら、分けた方が簡単な気がした。…
Google AJAX Search API http://code.google.com/intl/ja/apis/ajaxsearch/ ドキュメントに掲載されているサンプルでは備えつけのフォームや検索結果を表示する ようになっているのだけど、Javascript内で検索処理を実行して 結果をJSONで処理する方法もあっ…
別の記事でも書いたけど、個人で開発しているWebアプリでは、だいたいjQuery UIを使用してる。 今回はその中でもよく利用しているdialogの使い方をまとめておく。 dialog機能を使うと、割と簡単にエラーダイアログやフォーム表示用のサブウィンドウを作成す…
Google App Engineを使うようになって、リクエスト時間の節約のために 重いページ(HTML)のロードは最初の1回だけにして、以降はページ遷移なしで AjaxでJSONのやりとりをしてビューを変更するような方法をとることが多くなった。 UIについても毎回デザイン…
jQueryプラグインの作成方法を学びつつ、色々作ってみる。 今回は、HTMLのフォームで場所の情報を登録する際に座標情報を入力してもらうのに使えそうなプラグインを作った。 表題のままだけど、地図で地点を選択するとその座標情報が指定したフォームフィー…
ここ数件のプロジェクトでリストやテーブルの行追加、削除やソート、上下移動などの処理を書く事があったので、メモしておく。 今回は行の上下移動。 リストの各行に「上へ」「下へ」というボタンなりリンクなりアイコンなりを配置しておき、それをクリック…
他に方法が思いつかなかったので、親ウィンドウ側に関数を用意して それをThickbox側から呼び出す方法をとった。 iframe版しか考えていないので、ajax版の使い方だとまた別の方法があると思う。 parent.html <head> ... <script type="text/javascript" src="jquery-1.3.1.min.js"></script> <link rel="stylesheet" href="thickbox.css" type="text/css" /> </link></head>
前回発見したjQuery Form Pluginを使って実際にファイルをアップロードするサンプルを作った。 http://d.hatena.ne.jp/piro_suke/20080615/1213498024 ファイルをアップロードする場合のみ、iframeが使用される関係でサーバ側から 返却するデータをtextarea…
通常のフォームを画面遷移なしで送信可能にしてくれる jQuery Form Pluginを使ってみた。 jQuery Form Plugin http://malsup.com/jquery/form/ フォームに何も加えなくてもjsファイルを読み込んで ajaxForm関数でサブミット後の処理を定義するだけで サブミ…
Actionscript3で作成したSWFからActionscript2で 作成したSWFは呼び出せないようだ。 YoutubeのAPIで提供される動画再生用のSWFがActionscript2で 作成されたものらしく、Flex2(Actionscript3)から呼び出しても うまく動いてくれなかった。 (やり方がおかし…
これまたもっといい方法があると思われるが、一応メモしておく。 <script type="text/javascript" src="/static/javascripts/jquery-1.1.3.1.pack.js"></script> <script type="text/javascript"> $(function() { $("#add_customer_btn").click(function() { if ($("#customer_select").val() != "") { var customer_id = $("#customer_select").val(); al…
javascriptで画像の範囲選択をしたかったのだけど、 jQuery用のinterface.jsの機能ではちょっと物足りなかったので、 prototype.js用のライブラリとして作られたImage Cropper UIライブラリを 使ってみる。 Image Cropper UIライブラリのダウンロードはこち…
画面に対する絶対的な座標の取得方法はすぐ見つかったが、 画像の左上を基点とする座標を取得する方法を見つけるのに手間取ったのでメモ。 マウス座標の取得方法には色々ある(offsetXやらlayerXやら)ようだが、 ブラウザによって取得できる値が異なるみた…
見つけにくかったのでメモ。 コードがハイライトされるというだけで、ソースを載せたくなるのはなぜだろう。 タグに設定されたid属性から数値で設定されたID値を取得する。 jQueryを使うとリストの中のliタグや、テーブルの中のtdタグに設定された IDを一括…
DjangoのJSONデータ生成処理も、jQueryのタグ生成処理もなかなか使いやすい。 jQueryでサーバサイドを呼びだし、サーバサイドでDjangoでModelのリストを JSON化してクライアントに返し、それをselectタグ内のoptionタグとして生成する。 views.py from djang…
Djangoを使う時はJavascriptライブラリにjQueryを使うのが流行らしい。 jQueryは最近注目されている楽しいライブラリのようなので、以前prototype.jsで 実装した、チェックボックス一括チェック処理を書き換えてみる。 <script type="text/javascript" src="/static/javascripts/jquery-1.1.3.1.pack.js"></script> <script type="text/javascript">