これは備忘録 Unicode エスケープシーケンス 変換
Unicode エスケープシーケンス（\uXXXX)形式 に変換するもの ついでにHTMLの数字文字参照、文字実体参照にも対応させてみた。 メモ Unicode の UTF-8 エンコーディングは ASCII 文字と互換性があります。 Unicode 文字の U+0020 から U+007E までは ASCII 文字の 0x20 から 0x7E と同等です。 ASCII はラテンアルファベットをサポートしており、7 ビット文字セットを使用します。 UTF-8 は各文字について 1 オクテットから 4 オクテットを使用します。 （「オクテット」は 1 バイト、すなわち 8 ビット）。 \uXXXX形式 は多分、java、javascriptで使用可能。 数値文字参照（文字参照）：数値文字参照は、10進数もしくは16進数によって文書文字集合における該当文字を指定する方法 例： 「©
jsでTDD！MochaとChaiとsinon.js入門 - lxyuma BLOG
※この記事は社内勉強会向けの資料の下書きです。書きなぐりの下書きで見直すと最後の方の文書がヤバいので、いつか書き直します。読み辛い所は申し訳ないです。 概要 TDD テスト自動化とTDDを整理 TDDとBDDの違い Test Framework in javascript QUnit/jasmine/mochaについて、違いやメリデメを知る mocha 基本的な書き方 アサーションライブラリのメリデメを整理する chai 記述形式の違い整理 基本文法 sinonjs spy stubs mock TDD Test Driven Development テスト駆動開発 by ケントベック 特徴 xUnit系/BDD系のテストフレームワーク使う テストするコードも実装 テストファースト 実装の後にテストするのではなく、テストを先に書いて実装する サイクル Red(失敗) => Green(通過
chaiのインターフェース - 音の鳴るブログ
chai にはこういうインターフェースがあるけど expect(true).to.be.true; こういうアサーションは使わずに、普通に equal とかで書いたほうが良いと思う。 expect(true).to.equal(true); プロパティ止まりのアサーションだと、こういうのがどちらも通ってしまう。 expect("Mr.Big").to.be.with.you; // あってそう expect("Skid Row").to.be.with.you; // カバー？？ 最後の you というプロパティは存在しないので、単に undefined が返るだけの無意味な式になっているのだけど、アサーションが失敗するわけじゃないので問題ないみたいになる。最初に書くテストは失敗するというのを徹底すれば良いかもしれないけど、それで発見するのはテストの書き方のテストという感じであまり意味が無
今はJavaScriptでベースバンドをリアルタイムに処理する時代 | Scene Research Station
時代は変わりました。 今はJavaScriptでベースバンドをリアルタイムに処理する時代のようです(正確に言えばIFに落としてるからベースバンドじゃないけど)。 以前、 RTL-SDRでFM放送を聴く という記事を書きましたが、恐ろしい物が出ていることに今更気づきました。なんとJavaScriptのみで、RTL-SDRからベースバンドを取得しFM復調して、FM放送を再生するというChrome Appが出ているのです。 Chrome ウェブストア - Radio Receiver https://chrome.google.com/webstore/detail/radio-receiver/miieomcelenidlleokajkghmifldohpo 実行するにはお馴染みRTL2832U+R820Tの構成の地デジドングルが必要です。 ちょっと前までは1000円以下で売っていた気がします
Epoch·リアルタイム描画に対応したCanvas/SVGグラフライブラリ MOONGIFT
Webアプリケーションが企業においても利用されていくようになると必要になるのがグラフです。膨大なデータを見やすく整形して表示し、トレンドを見つけられるようにしなければなりません。 そのためには多種多様なグラフライブラリを知り、それがどのニーズにマッチするかを把握しておく必要があります。今回はリアルタイム系グラフに向いたEpochを紹介します。 Epochの使い方 エリアグラフ。滑らかな曲線がいいですね。 棒グラフ。 複数のグラフを比較もできます。 線グラフ。滑らかに描けます。 こちらも複数描画できます。 円グラフ。 分布図。 ヒートマップ。リアルタイムにデータを描画していきます。 ゲージ。こういうのも面白いですね。 棒グラフの積み上げ版。 エリアの積み上げ。 折れ線グラフの比較。 Epochはデベロッパーフレンドリー、リアルタイムグラフ、Canvas/SVG両方への対応が特徴となっています
Melvie - Web上の音楽を映像で彩るソーシャルVJ
Melvie x Songle （メルビー x ソングル）は、Web上の音楽を映像で彩るソーシャルVJサービスです。現在α版として、機能を限定して試験公開中です。 能動的音楽鑑賞サービスSongle (http://songle.jp) で解析済みの楽曲（YouTube、ニコニコ動画、ピアプロ、SoundCloud、Web上のMP3）を選択し、その再生に合わせてブラウザ上で動的に映像素材を組み合わせてエフェクトを付けて表示できます。 楽曲はMelvieを経由せずに、元の配信サイトからユーザのブラウザへ直接ダウンロードされ、ストリーミング再生されます。元の楽曲が削除されていると、再生できません。 Melvie x Songleは、中嶋 誠（東京大学大学院 情報理工学系研究科 コンピュータ科学専攻）が、東京大学五十嵐健夫研究室および、産業技術総合研究所メディアインタラクション研究グループにおい
コード進行を五度圏で可視化してみた - 西尾泰和のはてなダイアリー
Songleの外部埋め込みプレイヤーがJavaScriptでカスタマイズできるので、それを利用して五度圏の可視化をするデモを作ってみました。 スピッツの「ロビンソン」 中島みゆきの「地上の星」 きゃりーぱみゅぱみゅの「ファッションモンスター」 ロビンソンはコードの動きがわりとおとなしいですね。一方ファッションモンスターはGm Fmを交互にピコピコ動いてダンスを見ているような楽しさが。 Songleは音楽の理解を支援するサービスで、楽曲からコード進行などの情報を抽出し、可視化したり、コード進行を強調して再生したりしてくれます。詳しくはSongleのサイトの解説をごらんください。外部埋め込みプレイヤーを使うと、JavaScriptからそのコードの情報が取れるようになるので、以前から興味のあった五度圏での可視化を試してみました。100行未満のソースコードで実現できてとても手軽でした。このデモのソ
phiary
Node.js６連投. 第６弾! npm と Node.js 上で require を使ったモジュール読み込みの仕組みについてメモ Node.js 用に作った自作モジュール『merger』を npm で公開してみた Node.js 用の自作モジュールの作り方メモ Node.js 用に作った自作モジュールを npm に登録して公開する方法 JavaScript テストフレームワーク『Mocha』の使い方メモ JavaScript テストフレームワーク『Mocha』をブラウザ上で使う方法 <- いまここ 前回に引き続き Mocha の使い方についてのエントリーです. 今回はブラウザ上, つまりクライアント側で Mocha を使う方法について解説します. 何もインストールする必要がなく, dom 系のテストも出来るのでオススメです!! Code test.html テストプログラムの html
テストを始めるまでのヤク狩り - Memo
メモ。 色々言い訳作って JavaScript のテストを書かなかったけど、さすがにマズいので書いてみる。 なお、ここでの JavaScript のテストは Web ブラウザで動く JavaScript。 テストを始めるまでに敷居が異様に高いと感じたのでまとめる。 典型的な yak shaving! テストフレームワーク フルスタックな Jasmine か、色々選択できる Mocha か。 アサーションライブラリ Mocha を選択する場合は chai がよさそう。 理由は chai だと、expects や should や xUnit 風どれでもいけるから。 テストダブル とりあえず Sinon.js を使っとけという雰囲気。 テストランナー Grunt.js + Jasmine と Karma + Mocha を試す。 Gurntfile.js module.exports = fu
WebGLの能力を引き出すプログラマブルシェーダー
WebGLの能力を引き出すプログラマブルシェーダー Webページ上で利用できるグラフィック技術を紹介する本連載も、ついに最終回となりました。フィナーレを飾る題材は、WebGLの最も強力な機能である「プログラマブルシェーダー」です。前回（多彩な表現力のWebGLを扱いやすくする「Three.js」）と同様にThree.jsの使用を前提として、プログラマブルシェーダーの基本的な書き方と、Three.jsを各機能に組み込む方法を解説します。 前回はThree.jsの代表的な機能を解説し、いずれもWebGLでなければ実現の難しいものばかりでした。しかし、実はそれでもWebGLの能力のごく一部を使っているにすぎません。独自のプログラマブルシェーダー（カスタムシェーダー）を書くことができれば、描画処理の大部分を柔軟にカスタマイズでき、望み通りの表現を得られます。Three.jsの使い方に慣れたら、ぜひ
JSCapture·こんなことまで！JavaScriptでスクリーンショット&キャストの保存 MOONGIFT
HTML5ではgetUserMediaを使ってWebカムにアクセスできるのは良く知られています。しかしデータの入力元は他にも考えられます。その一つがディスプレイです。画面に表示されている内容は確かに出力データになるでしょう。 そんな画面の内容をキャプチャできる機能が最新のGoogle Chrome（35以上）から登場しています。その実験とも使い方を紹介するのがJSCaptureです。 JSCaptureの使い方 まず最初にGoogle Chromeの設定を有効にする必要があります。 設定を有効にしたら再起動しましょう。 まずはキャプチャです。JSCaptureのサイトで実際に試すことができます。キャプチャをクリックするとダイアログが出ます。 画面共有の確認が出ますので、はいを押します。 見事キャプチャされました。Downloadを押して画像として保存できます。 次にレコーディングです。結構
Smoky Backgrounds Generator - waterpipe.js
waterpipe.js by dragdropsite.com Tweet Smoke style Gradient start: Gradient end: Opacity: 10% Smoke size: 100% Line width: 2px Smokes #: 1 Background style Outer color: Inner color: Download size Width (px): Height (px): Samples (click to generate) Samples Generate Download Credits: rectangleworld.com
モンドリアンの絵をアルゴリズム的に描いてみた。 - アドファイブ日記
アルゴリズムアートにチャレンジしてみました。 こちらでご覧いただけます モンドリアンの有名な絵を描くというもの。以下はアルゴリズムで描いた1枚です。 毎秒1枚ずつ描くのを眺めていると、ときどきこうしたいい感じのが出てきます。 アルゴリズムの説明は割愛します。ソースコードを置いておきます。 Chiral’s gist コーディングにはProcessingという言語を使っています。この言語は、メディアアートに特化したJavaのサブセット言語のような感じのもので、言語仕様が簡単で色んな処理系が実装されています。Processing.jsはjavascriptによる処理系で、Webブラウザ上でProcessingのコードを動かす事が出来ます。 processing.js公式サイト アドファイブ社のホームページを作っていて、フリーの良い素材がないのでアルゴリズムアートで色々作ろうかと思い立って作って
JavaScriptでMacに歌ってもらう - Okiraku Programming
最近のChrome, SafariのJavaScriptには音声合成APIが入っています。 使い方は簡単で、JavaScriptコンソール等で var msg = new SpeechSynthesisUtterance('こんにちは!'); msg.lang = "ja-JP"; // 言語指定 window.speechSynthesis.speak(msg); のようにするだけで喋ってくれます。 音声エンジンを変えることも可能です。使える音声の一覧を var voices = speechSynthesis.getVoices(); で取得すると、voicesに音声オブジェクトのリストが返ってくるので、この中のlangやnameを見て使いたいものを msg.voice = voices[3]; などとSpeechSynthesisUtteranceオブジェクトのvoice属性に指定す
Three.js How To Tutorial
Part III of the particle engine breaks down the sphere type and fire. Fireball //fireball var settings = { positionStyle : Type.SPHERE, positionBase : new THREE.Vector3( 0, 0, 1 ), positionRadius : 0.5, velocityStyle : Type.SPHERE, speedBase : 1, speedSpread : 0, particleTexture : THREE.ImageUtils.loadTexture( 'images/smokeparticle.png' ), sizeTween : new Tween( [0,4], [0,10] ), opacityTween : new
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
JavaScript Promiseの本
Rubyのイテレータメソッドと似ているJavascriptの便利なメソッド - Qiita
Post by @niwaringo
寿司ゆき - 3D
WebGL procedural terrain [three.js]