JavaScript

TOKYO IDOL FESTIVAL 2016 のタイムテーブル画像化ツールを作った

日本最大規模のアイドルの祭典・"TOKYO IDOL FESTIVAL"(通称TIF)。 今年は明日からの8/5〜8/7の3日間の日程で、始まります。 TOKYO IDOL FESTIVAL 2016 で、こういったフェスってステージが複数あって観たいステージが幾つもあるなか、どの時間にどれを見る…

EC2 Spot Instanceの価格変動をターミナルでモニタリングする

というものを作った。こんな感じの。 Repository : https://github.com/sugyan/spot-price-watcher 背景 TensorFlowを使ったDeep Learningでアイドルの顔識別なんかをずっとやってきたけど、やっぱりCPUマシンだけでやっていくのは厳しいな、と思い、 やっぱ…

集中線アニメーションさせるChrome拡張

!!!集中線GIFメーカー!!!っていうのが面白くて、Goに移植されたりもしていて、 集中線GIFメーカー in Golang - syohex’s diaryじゃあJSでも出来るかな、と思ってChrome拡張にしてみた。 ブラウザ上で表示している画像たちに自動的に集中線アニメーションをつ…

ctagsでjsx(ES6 class)の定義にジャンプできるようにする

React を使うにあたって、最近は ES6 classes を使ってJSXを書くようにしているのだけど、Componentを色んなファイルに分けて書いてるとそれぞれの定義に移動するのがつらくなってきた。 そういえば普段PerlやRubyを書くときはctags -eでTAGSを作っておいて…

「React.js meetup #1」に参加してLTしてきた

React.js meetup #1 に参加してきた。参加者枠を大きく上回る応募のあった超人気イベントだったけど、@koba04さんにReact.jsのこと色々おしえていただいた縁もありLT枠で出させていただいた。 slide: http://sugyan.com/presentations/reactjs-meetup-1/ 成…

react-routerでsingle pageなrails scaffold

React をちょっと触ってみたい、というのと 最近すこし Ruby on Rails も勉強はじめた、ということで、rails g scaffoldで作るような管理画面のViewを react-router を使ってSingle Page Applicationで作ってみた。 https://react-router-scaffold.herokuapp…

Heat mapで動きが活発な地域を可視化する

Ingressの話。 先月 にA14になり、もはやGold Medalは不要になったしGuardianはキッパリ諦めることにした(Max Time Portal Heldが19 daysで壊される、というのを3回経験した…)わけだけど。実際のところ自分の活動圏付近でどのあたりで入れ替わりが激しくてど…

WebGLでPortal Shieldとかを描く (続き)

WebGLでPortal Shieldとかを描く - すぎゃーんメモ の続き。 色々追加したものを以下で公開してみた。http://sugyan-static.herokuapp.com/webgl/ingress/index.html INVENTORYで見られる全アイテムを追加 ナビゲーションバーからの選択で切り替え 選択前は…

WebGLでPortal Shieldとかを描く

唐突にWebGLを勉強してみようと思って、練習として作ってみた。 http://sugyan-static.herokuapp.com/webgl/portalkey.html http://sugyan-static.herokuapp.com/webgl/portalshield.html (※WebGL対応ブラウザでご覧ください) WebGLについて全然知識が無かっ…

Google Doodleのルービックキューブを解くChrome拡張を作った

http://www.google.com/doodles/rubiks-cube のやつ。 とっくに旬を過ぎていて今さら感あるけど、、URL 開いてスタートした瞬間に自動で解いてくれるChrome Extension 誰か2014-05-19 16:02:43 via Twitter for Macって自分で言ったし。 Google Doodle's Rub…

アメブロ「いいね!」機能を使うためのChrome拡張を作ってみた

先月末あたりに、スマートフォン版アメーバブログに新機能として「いいね!」というのが加わったらしい。 【ブログ】スマートフォン版アメーバブログの新機能追加・改善のお知らせ|スタッフブログ アメブロパワーアップ!アメーバブログがもっと楽しく!も…

Slateを入れてみた

Macで起動中のアプリを切り替えるのに、⌘+Tabだけだとたくさん起動しているときに選択するために連打するのが面倒だし頻繁に使うものは一発で切り替わるようにしたい、というのがあって、 今までずっとそれをQuicksilverのHotKey機能を利用して ⌘+Ctrl+Q でi…

アメーバブログの画像を取得するブックマークレットを書いた

ももクロちゃんたちも使っているブログサービス、アメブロ。 最近、投稿画像の閲覧ページの表示が変わったらしい。 【画像】画像拡大ページ・画像一覧ページの表示方法が変わります|スタッフブログ で、その新しい画像ページではその画像を取得して保存しよ…

任意の要素数の密な配列を生成するスニペット

Perlだと、 use Data::Dumper; my @hoge = ("fuga") x 5; print Dumper \@hoge; __END__ $VAR1 = [ 'fuga', 'fuga', 'fuga', 'fuga', 'fuga' ]; みたいな感じでx演算子を使って任意の個数の密な配列を簡単に作ることができるのだけど、JavaScriptではどうし…

「JavaScriptテクニックバイブル ~効率的な開発に役立つ150の技」を読みました

「JavaScriptテクニックバイブル」献本いただいたのでありがたく読んでるけど内容盛りだくさんでなかなか読み終わらない! URL2012-08-31 00:44:04 via Instagram JavaScriptテクニックバイブル ~効率的な開発に役立つ150の技作者: JSサポーターズ出版社/メ…

ももクロのメンバーブログが更新される曜日/時間帯を可視化してみた

http://blog.bitly.com/post/22663850994/time-is-on-your-side の記事のような可視化が面白いなーと思って、そういえばすぐに使えるデータがあった、と思い、ももいろクローバーZのメンバーのブログが更新される曜日/時間帯の頻度を可視化してみた。 http:…

JavaScriptで、もう連想配列の最後のカンマに悩んでないので

JavaScriptで、もう連想配列の最後のカンマに悩まない!(※追記あり) · DQNEO起業日記 で言及いただいていたので今の自分の意見を。 その発想は無かったし、無いですね。2012-05-02 09:55:29 via Twitter for iPhoneです。 要素数が変わる、無駄なkeyが入る N…

ももクロの人気上昇ぶりをグラフで可視化する

「最近、ももクロの人気が急上昇中。」とだけ盲目的に言っていてもアレなので、参考になる資料を用意したく。 ちょうど最近ファンの間で「メンバーのブログへのコメント件数が増えているよね」というのがあったので、その推移をグラフで可視化してみた。 htt…

Processing.jsで踊るPerfume

既に誰かやってるかな…? と思ったけど。 https://github.com/perfume-dev で、Processingでの動作サンプルがあったので、これそのまま使ってProcessing.js使って動かせるようにすればweb上でも動きが見られるんじゃないの、と思ってワケも分からないままpde…

Software Design 2012年3月号 にコラムを書かせていただきました

Software Design (ソフトウェア デザイン) 2012年 03月号 [雑誌]出版社/メーカー: 技術評論社発売日: 2012/02/18メディア: 雑誌購入: 1人 クリック: 43回この商品を含むブログ (8件) を見る色々と縁がありまして、第2特集「エンジニアだからできるハック」の…

Functionの期待する引数の数をlengthプロパティで取れる

知らなかったのでメモ。 https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Function/length $ node > (function () {}) [Function] > (function () {}).length 0 > (function (a) {}).length 1 > (function (a, b) {}).length 2これを…

JavaScriptによるcross domain, streamingなAPIアクセスについて

最近までお仕事でちょいちょい調べてたことのまとめを書いた。 JavaScriptによるcross domain & streamingなAPIアクセスの方法色々 - Nakamap APIの場合 - | tech.kayac.com - KAYAC engineers' blog

nodelintでflymake

node-jslintでflymake - すぎゃーんメモ で設定した、node-jslintによるflymakeを使っていたのだけど、 var util = require('util'); とかに対して警告を出してきてちょっとイラっとする。どうもnode-jslintで使われているjslintがちょっと古いらしく、"util…

FileReaderを使って選択した画像の真ん中あたりを正方形に切り取って表示する

フォームで画像をアップロードする際にプレビュー表示したい、というとき、FileReaderが使えるブラウザだとそれを使って簡単に実現出来る。 html5の File API を使って、アップロード無しで画像プレビュー - 超自己満足プログラミング 「プレビュー表示する…

orion editor updated.

http://livecoder.sugyan.com/で使っているeclipse OrionのJavaScriptエディタがupdateされていて名前空間などが変わってた。 Orion - Eclipsepedia eclipse.orionだったものがorion.textview.TextViewなどに変更されている。 追従してlivecoderもアップデー…

Quine ruBy JavaScript版

Quine ruBy - まめめも への挑戦。 Quine ruBy Perl版 - すぎゃーんメモ に引き続き、JavaScript版。 eval ($a= 'a=1;p= this[1\ &&"alert" ]?(a=0+0\ ) ||alert:1 &&this["p"+ "rint"]?( \ 1 &&print):console.log,u=unescape,q=u(( \ 0 ||"%27")),f=Functi…

node-jslintでflymake

javascript-modeでのflymakeに、今までSpiderMonkeyを使っていたけど、試しにnode-jslintを使ってみることにした。 GitHub - reid/node-jslint: The JavaScript Code Quality Tool — for Node.js. node-jslintはnpmでinstallすると"jslint"コマンドを提供し…

手作りiPhoneTracker

これは不気味―iPhoneには過去の位置情報が逐一記録されていることが判明 | TechCrunch Japanという記事が話題に。 iPhoneで取得した位置情報が記録されている、というもの。そのデータを抜き出して可視化するツールが公開されている。 petewarden/iPhoneTrac…

東京Node学園 1時限目 メモ

東京Node学園 1時限目 : ATND var memo = { opening: [ { speaker: '@meso', title: 'ご挨拶 / 5分でわかるNode.js', contents: [ 'http://tng1.mesolabs.com/', 'キーワードはイベント駆動, 非同期(non blocking)', '簡単に早い非同期サーバが書けるよ!' ]…

JavaScriptで住所入力支援 その2

JavaScriptで住所入力支援 - すぎゃーんメモ にて、id:sun-basix氏から「google maps apiのGeocoderクラスを使った検索は?」とツッコミをいただきました。全然その発想がなかった… orz というわけでgeocoderバージョンを作り直してみました。 forked from: …