1up noob: 2014

2014/12/12

【JavaScript】YouTubeのサムネをクリックでiframeに入れ換える

サイトにYouTubeの埋め込みを入れすぎると読み込みが重くなることがあります。
そこでJavaScriptでクリックしてから、iframeに切り替えるようにしてみようという試みです。

当方JavaScript初心者ですので間違えがあってもご容赦を。
コメントで教えてくれると幸いです。

function changeThumbnail(obj)
{
 var width  = 480;
 var height = 360;
 var pattern = /vi\/([^&]+)\//;
 var video_id  = obj.childNodes[0].src.match(pattern);
 var iframe = "<iframe width=\""+width+"\" height=\""+height+"\" src=\"http://www.youtube.com/embed/"+video_id[1]+"\" frameborder=\"0\" allowfullscreen></iframe>";
 obj.innerHTML = iframe;
}

<a href="https://www.youtube.com/watch?v=n7H4p0ArZUU">Mr.Children「フェイク」Music Video</a><br/>
<div onClick="changeThumbnail(this);"><img src="http://i.ytimg.com/vi/n7H4p0ArZUU/hqdefault.jpg"></div>

テストページ
jQueryを使えばもっと簡易化できそうです。

2014/10/19

【PHP】動画サイトの埋め込みプレイヤーを呼び出す

PHPで動画サイトのURLを入力して、埋め込みプレイヤーを呼び出すというのが今回の目標です。
URLをformに入力して、そのURLを元に動画のIDを抽出し、外部プレイヤー用の埋め込みコードを作成します。

[テストページ]

まだ、対応サイトは少ないです。
正規表現を使って、各動画サイトのURLから動画のIDを抽出しているのですが、なかなか上手く書けず苦労しています。

参考にした記事

・ YoutubeのURLリンクを外部プレイヤーのものに正規表現で置換する
・ YOUTUBEのURLから動画のIDだけを抜き出す正規表現
・【PHP】 YouTubeのURLを解析してiframeを作成する

追記

「Embedly」というサイトで似たようなことができるようです。

マスプロ電工の「VSW41」を購入

マスプロ電工のAVセレクター「VSW41」（画像下）を購入しました。

オーディオセレクターは、オーディオテクニカやSONYからも発売されていますが、プラスチック製で外観に安物感があります。AVセレクターでもオーディオ端子だけ使えば機能は同じですので、この商品を購入しました。

実売価格3000円強程度と他社のオーディオセレクターよりも少しお高めですが、その分高級感のある見た目と質感です。

4入力1出力に対応しているので、今はPCとPS3から以前買ったLepaiのアンプ（画像上）に繋いでいます。

PCとゲーム機のスピーカーを共有しようと考えている方や普通のオーディオセレクターではもの足りない方の参考に成れば幸いです。

2014/02/21

【RSS】アンテナサイト作成した時の参考ブクマ

前回の続き

前回はGoogle Feed APIを用いたものの作成例を参考に作ってみたのですが、更新が反映されるのが遅いというのが難点だったので、PHPで書かれた作成例を参考にして作り直しました。

~~［テストページ］~~

参考にしたサイトのサンプルでは取り扱われいない部分で躓いた点の解決策や参考サイトをまとめておきます。

画像が取得できない

Google Feed APIを用いたものではサムネイル表示できたのですが、参考元のサンプルにはサムネイル表示機能がなかったので、画像取得のためのPHPのコードだけを追加してそのまま用いると、失敗しました。RSSで配信されたデータ中の画像リンクはCDATAセクション中にあるのでSimpleXML関数で取得しようとするときに拾えていなかったことが原因だったようです。

・「simplexml_load_file関数の第三引数にLIBXML_NOCDATAを指定する」
・「名前空間指定のあるデータへのアクセス」→children()関数

これで、テキストとして取得できるので、画像のリンクをpreg_match関数で漁ると取得できました。

[参考]:PHPのSimpleXML関数でRSSを取得する場合の注意点
[参考]:PHPでXMLの名前空間つきタグを読み込む色々

記事のカテゴリが表示したい

先ほどの「名前空間指定のあるデータへのアクセス」と被りますが。

[参考]:simplexml_load_fileでdc:subjectやcontent:encodedを読み込む

追記

先ほど参考元とは別のサイトですが、こちらのサイトのサンプルの方が割とそのままでも使いやすそうです。

2014/02/02

PDFファイルのパスワード設定を解除して保存する方法(Google Chrome)

本記事では、Google Chromeを使って、パスワード設定されたPDFファイルの設定を解除して再保存する方法を紹介します。

注意
・パスワードが分かっている時にだけしか使えない方法です。
・セキュリティ上問題があるものなどへの使用は自己責任で行ってください。

1. Google ChromeでPDFファイルを開く。

ローカルのファイルなら、Google Chromeのアドレス欄にファイルをドラッグ＆ドロップすると開かれます。オンラインのファイルならPDFのURLを開いてください。

2. パスワードを入力し、印刷ボタンを押す。

パスワードの入力を求められるのでパスワードを入力してください。

ファイルが開かれます。
上の画像で示している赤枠の保存ボタンをクリックすれば保存できますが、この状態ではパスワード保護が残ったままです。

保存ボタンの右の印刷ボタンを押して、印刷画面に移ります。「右クリック」>「印刷」でも可能です。

3. 送信先を「変更」から「PDFに保存」に切り替えて保存する。

これでパスワード保護を外して保存できます。

2014/02/01

「Lepai LP-2020A+」を購入

LepaiのデジタルアンプLP-2020A+を購入しました。

ヨドバシカメラの福袋として入っていたケンウッドのC-414というシステムコンポをRCAステレオミニ変換ケーブルでPCと繋いで、PC用のスピーカーとして使ってきました。
しかし、ラジオやCDの再生機能は使わず、アンプ機能のみの使用ばかりなので、本体の部分が邪魔に感じてきました。

そこで、裸接続のスピーカー端子をそのまま挿せるアンプを探していたところ、このLepai LP-2020A+を見つけました。

C-414のアンプと比べて、音が良くなったのかはっきりとは分かりませんが、場所をとっていたコンポ本体を片づけることができ、PC周りがすっきりして満足です。

中華製だけあってスピーカー接続の端子の表示が左右逆でしたが…。

2014/01/10

【RSS】アンテナサイトを作成した

最近、RSSに興味を持ちました。
そこでオリジナルな複数サイトのRSSの情報をまとめて表示するサイトを作ってみます。

htmlとcssが多少書ける程度の知識しかないので、JavaScriptは試行錯誤しながらで、参考サイトのサンプルコードを存分に使わせてもらっています。
まだ、改善するべき点も多いですが、一応の枠組みはできたので公開します。
多少は自分で組んだので…

［テストページ］

[参考]
・【Google Feed APIを使用して、複数のサイトのRSSフィードを取得して更新日順でソート（並び替え）して、さらにそれを「サムネイル付きで」表示する方法】

・ブログサイトなどのRSSを取り込んで画像も一緒に表示させるフィード機能