mabulog

このブログは、mabuの平凡な日常を淡々と描く物です。 過度な期待はしないでください。 あと、部屋は明るくして、 モニターから3メートルは離れて見やがってください。

Useing dash.js

背景 Background

前々からGithubをウォッチしていたのですが、最近開発が盛んになっているようなので、私の方でも動かしてみようと思いました。

目標 Goal

  • dash.jsを使ってローカル環境で動画再生

環境 Environment

手順 Operation

基本的にdash.jsに必要なパッケージ情報とその公式HPがGithubのREADME.mdに載っているため、 準備は容易に行えました。

Setting dash.js

今回は"/srv"配下に環境構築

get source

$ sudo chown mabulog:mabulog -R /srv
$ cd /srv
$ git clone https://github.com/Dash-Industry-Forum/dash.js.git

CSS load error

再生がうまくいかなかったため、100%関係ないと思いつつ、typoの修正

$ cd /srv
$ sed -i -e "s/glyphiconshalflings-regular.woff/glyphicons-halflings-regular.woff/" dash.js/chromecast/sender/css/bootstrap-glyphicons.css
$ sed -i -e "s/glyphiconshalflings-regular.woff/glyphicons-halflings-regular.woff/" dash.js/app/lib/bootstrap/css/bootstrap-glyphicons.css

set Apache

$ sudo vi /etc/httpd/conf/httpd.conf

  DocumentRoot "/srv/dash.js"

$ sudo service httpd restart

install node.js

今回はnenvは利用せず、サーバに直接インストールします。 リポジトリ追加については既に適用済みです。

$ sudo yum install -y --enablerepo=epel nodejs npm

install grunt

$ cd /srv
$ sudo npm install -g grunt-cli

install grunt-template-jasmine-istanbul

$ cd /srv
$ sudo npm install grunt-template-jasmine-istanbul --save-dev

install some other dependencies

$ cd /srv
$ sudo npm install grunt-contrib-connect grunt-contrib-watch grunt-contrib-jshint grunt-contrib-uglify

Confirm

Chromeブラウザで"http://localhost:2223/index.html"にアクセスする。
Chromeでアクセスする理由は本記事作成時(2014/03/30)ではFireFox28で再生がうまくいきませんでした。 どのブラウザなら問題なく表示できるかはGithubにデモへのリンクがあるため、 そちらにて動作確認をする事をオススメします。

感想

日本でDash.jsの記事をあまり見ませんが、パートナー企業が熱く、厚いので、 日本で流行る前に海外で土台が出来上がって、出遅れるケースになりそうです。 もしくは、廃れる。

参考サイト Reference

install node.js

install grunt

install grunt-template-jasmine-istanbul

Setting dash.js