2006年09月01日

ヘルプ - Standardテーマ

Standardテーマはpcyp2 YP風表示モード用のカスタムテーマです。

 

■必要動作環境

  • pcyp2 2.0.0.157以降 (問題がない限りpcyp2最新版を推奨)
  • InternetExplorer 5.5以降 (IE7以降を推奨)

チャンネルリストの閲覧にはJavaScriptを利用していますので、IE側でJavaScript(アクティブスクリプト)を必ず有効にしてください。また、設定の保存にIEのCookie、チャンネル履歴にFlash(要Flash Player8以降)を利用しています。

IE7を動作基準としているため、それ未満のIEがインストールされている環境では一部のデザインが崩れたり異なる場合があります。

 

■ファイル構成

Standardテーマフォルダ内には以下のファイルが必要です。

  • ie_header.html / ie_channel.html / ie_footer.html
    • YP風表示に用います。
  • clipboard.txt / notify.txt / popup.txt
    • 必要なファイルですがテーマ側では利用していません。詳細はpcyp2のヘルプなどを参照して下さい。
  • standard.js
    • メインスクリプトファイル。
  • setting.js
    • 設定ファイル。一部の設定を変更できます。詳細はこのファイル内をテキストエディタなどで開いて参照して下さい。
  • standard.css
    • CSSファイル。デザインを変更できます。詳細はこのファイル内をテキストエディタなどで開いて参照して下さい。
  • standard_ie5-.css / standard_ie6-.css / standard_ie.css
    • それぞれIE6未満/IE7未満/IE5以上用のCSSファイル。
  • data.swf / flash.js
    • 前回更新時のリスナー/リレー数などを保存しておくFlashファイルと、そのFlashを埋め込むスクリプトファイル。

必要な場合に編集するファイルはsetting.jsと各CSSファイルですが、これらは同じフォルダに作成した「user.js」および「user.css」ファイルに変更したい部分の内容だけをコピーしてから編集して下さい。詳細は後述のユーザーが用意した設定ファイルについてをご覧下さい。また、そのほかのファイルを編集する必要はありません。

 

■インストール

  1. ダウンロードしたファイル(Standard_******.zip)内のフォルダを、pcyp2のテンプレートフォルダへコピーします。 imagesフォルダも上書きして下さい。
    1. テンプレートフォルダ例:「C:\Program Files\pcyp\templates」
    2. コピー後のフォルダ例:「C:\Program Files\pcyp\templates\standard」
  2. pcyp2の表示メニュー→「YP風表示」→「ナビゲート」→「テンポラリファイルをナビゲート」を選択。
  3. pcyp2の表示メニュー→「テーマ変更」を選択し、作成されたフォルダ名を記入。(例:standard)

インストールする際、テーマのフォルダ名(standard)は自由に変更して構いません。

PeerCastやpcyp2のインストール方法・使い方などについては、それらのヘルプやドキュメントなどを参照して下さい。

なお、pcyp2が生成したテンポラリファイル(temp.html)をWebブラウザで表示させた場合、Flash Playerの設定を行う必要があります。以下のFlash Player設定ページからテーマフォルダ(例: 「C:\Program Files\pcyp\templates\Standard」)を常に信頼するよう設定してください。

Adobe - Flash Player: 設定マネージャ - [グローバルセキュリティ設定] パネル

普通にpcyp2でStandardテーマを利用する場合、この設定を行う必要はありません。

 

■画面構成

▼ヘッダ

Standard_Header.png

  1. ページ全体の文字サイズを変更します。
  2. お気に入り表示モードを切り替えます。
    • お気に入りのみ表示
      • 文字色および背景色を指定したお気に入りチャンネルのみを表示。
    • 新着/更新 & お気に入りのみを表示
      • 通知が「新着/新着(前回)/Change」のチャンネルとお気に入りチャンネルのみを表示。
    • デフォルト表示
      • この絞り込み表示機能は用いずに、通常通りすべてのチャンネルを表示。
  3. 詳細表示モードを切り替えます。
    • デフォルト
      • 全チャンネルの「詳細/Playing/コメント」を表示します。
    • アップデート
      • 新着/更新チャンネルのみ「詳細/Playing/コメント」を表示します。
    • シンプル
      • 全チャンネルの「詳細/Playing/コメント」を非表示にします。
  4. テーマ設定欄を開きます。
    • 各項目にマウスを重ねるとツールチップに説明が表示されます。
  5. ヘルプを表示します。
  6. イエローページ別に絞り込み表示します。
    • イエローページ名や絞り込み判別用のURLは設定ファイルで指定できます。
  7. タイプ別に絞り込み表示します。
  8. チャンネル通知別に絞り込み表示します。
  9. ジャンル別に絞り込み表示します。
    • ジャンル名や絞り込み判別用の文字列は設定ファイルで指定できます。

※ 2行目にある各列のリンクをクリックすることでその列がソートされます。

▼チャンネル

Standard_Channel.png

  1. キャス子アイコン
    • クリックでそのチャンネルを再生します。
    • 32×32pxの大きさで表示します。
  2. 通知アイコン
    • 通知が「変化なし」の場合は表示されません。
  3. チャンネル名
    • pcyp2のお気に入りで指定した文字色はこのチャンネル名にのみ適用されます。
  4. 詳細・Playing・コメント
    • 個別に表示/非表示させたり改行するかをテーマ設定欄より変更できます。
    • 新着チャンネルおよび更新チャンネルは設定ファイルで指定した文字色で装飾します。
  5. リスナー/リレー数
    • ツールチップに前回更新時との差分や視聴率を表示します。
    • 前回更新時との差分により設定ファイルで指定した文字色で装飾します。
  6. 配信時間
    • 時間によって設定ファイルで指定した文字色で装飾します。
  7. ビットレート
    • 設定した最大帯域幅を基準として設定ファイルで指定した文字色で装飾します。
    • リンクをクリックするとpcyp2専用のコンテキストメニューを表示します。
  8. 順位
  9. イエローページ
    • 設定ファイルで指定した画像を表示します。未指定の場合はそのイエローページのFavicon(favicon.ico)を表示します。
  10. タイプ
    • 動画・音楽・RAW・その他の画像を表示します。
  11. チャットURL
  12. 統計URL

※ チャンネル欄(リンクされていない部分)をダブルクリックすると、ページ右上にチャンネル詳細欄が表示されます。チャンネル詳細欄をダブルクリックすると閉じます。

▼フッタ

Standard_Footer.png

  1. チャンネルデータ取得日時(更新日時)
  2. 再生/リレー中のチャンネル/ビットレート合計数
    • pcyp2設定の通信タブにある「ローカルなチャンネル情報を取得する」のチェックを外している場合は表示されません。
  3. 現在表示しているチャンネルのチャンネル/リスナー/リレー合計数
    • ダブルクリックすることで全チャンネルのチャンネル/リスナー/リレー合計数へ表示を切り替えます。

 

■デフォルトテーマとの主な違い

  • 全体の文字サイズを簡単に変更できます。
  • お気に入りチャンネルのみの表示、またはお気に入りチャンネル&新着/更新チャンネルのみを表示させることができます。
  • 新着/更新チャンネルのみ「詳細/Playing/コメント」を表示させるようにしたり、全チャンネルの「詳細/Playing/コメント」を隠すことができます。
  • 全チャンネルの「詳細/Playing/コメント」をそれぞれ隠すことができます。
  • お気に入りチャンネルや新着チャンネルをほかのチャンネルよりも上部に表示させることができます。
  • キャス子アイコンや配信者が指定したアイコンの表示に対応。
  • イエローページ別/タイプ別/チャンネル通知別/ジャンル別にそれぞれ絞り込み表示できます。
  • 前回更新時のリスナー/リレー数を参照して、どれだけの人数が増減したか分かるようリスナー/リレー数の文字色を装飾します。
  • リスナー/リレー数のツールチップに前回更新時との差分、および視聴率を表示します。
  • どれくらい配信時間が経過したか分かるよう配信時間の文字色を装飾します。
  • 設定した最大帯域幅を基準にビットレートの文字色を装飾します。
  • 設定した最大帯域幅を超えるチャンネルの再生時に注意を表示します。
  • チャンネル欄をダブルクリックすることで、そのチャンネルの詳細を表示します。
  • 現在表示しているチャンネルのみの合計チャンネル/リスナー/リレー数を表示します。

そのほか、設定ファイルからイエローページ別にキャス子アイコンフォルダを別々に指定したり、特定文字列を含むチャンネルの場合に指定したキャス子アイコンへ置き換えて表示させることなどができます。また、CSSファイルからはデザインのカスタマイズ以外に、配信時間や順位などの列を非表示にすることもできます。

 

■Info/Simpleテーマとの主な違い

  • 全体のデザインをテーブルを用いないCSSレイアウトに変更(Liteテーマをベース)。
  • チャンネルリストの表示切替機能(お気に入り表示モード・詳細表示モード)を追加。
  • イエローページとチャンネル通知を別々に絞り込み表示可能に。
  • リスナー/リレー数のツールチップに視聴率を追加。
  • イエローページと種別をアイコンで表示。
  • 現在表示しているチャンネルリストのチャンネル/リスナー/リレー合計数を表示。
  • イエローページの名称・URL・背景色・アイコン・フォルダを設定ファイルで指定可能に。
  • 絞り込み表示やテーマ設定欄からの変更時にページを再読み込みせずに切り替え。

 

■ユーザーが用意した設定ファイルについて

setting.jsやstandard.cssなどCSSファイルを編集してもテーマのバージョンアップ時に誤って上書きしてしまい、今まで編集してきた内容が破棄されてしまいます。そこで、「user.js」「user.css」を同じフォルダに作成しテキストエディタなどを用いて編集することで、それらをsetting.jsやCSSファイルの代わりにすることができます。

user.jsおよびuser.cssはダウンロードしたファイルには含まれていませんので、setting.jsやCSSファイルから編集したい部分をコピーしuser.js・user.cssにペーストしてから編集することで、テーマのバージョンアップ時でも破棄せずに済みます。user.js・user.cssに記述した内容はほかのスクリプトファイル・CSSファイルよりも優先されます。

 

■よくある質問

pcyp2を起動したとき「YP風表示」ウインドウ内が真っ白でチャンネルが表示されない。
pcyp2 Ver2.0.0.160以降の仕様により、表示メニューの"YP風表示"→”ナビゲート”→"テンポラリファイルをナビゲート"を選択していて、かつpcyp2起動時のチャンネル情報を取得する際に「YP風表示」が選択されている場合、使用しているテーマに限らず上記の現象が起きます。この状態になった場合は1度テーマを変更することで正しく表示されるようになります。
pcyp2起動時、チャンネル情報を取得完了する前に「YP風表示」以外を選択しておくことで、上記の現象を暫定的に回避することができます。
チャンネルをソートさせようとすると「リストのインデックスが範囲を超えています」とエラーが表示されてしまう。
pcyp2の"設定"→"列"からそのソートさせたい項目を”表示する列”へ追加してください。
(例:チャンネル名, 詳細, Playing, ビットレート, ハッシュ, YpAddr, 配信時間など)
チャットURLや統計URLを開いても正しく表示されない。
pcyp2の”設定”→”YP”にある「チャットURL等をYP互換にする」のチェックボックスをチェックしてください。ビットレートをクリックしたときに表示されるpcyp2専用コンテキストメニューからはテーマ側で修正していないURLを開くため、正しく表示されない場合があります。
また、eXtremeYPなどイエローページ側がチャットページや統計ページを提供していない場合はエラーページが表示されます。
KPのチャンネルにバナナアイコンや配信者によるカスタムアイコンなどが表示されない。
KPの仕様によりローカルのアイコンを表示するかネット上のアイコンを表示するかの二通りの方法があります。ネットから取得した画像を直接表示したい場合は、pcyp2の設定でKPのURL欄の最後に「ex/」を追加してください。この場合、KP側や配信者側が提供しているアイコンをキャス子アイコンフォルダに入れておく必要はありません。

ローカルのキャス子アイコンが表示されない。
Standardテーマでは32×32pxでキャス子アイコンを表示しますが、ほかのテーマで利用しているアイコンは40×40pxなため、そのままでは表示しないようにしています。 ほかのテーマで利用しているアイコンも表示させたい場合は、それらのアイコンを同じ場所にコピーし下記のようにリネーム(ファイル名に「32」を追加)してください。ただし、その場合は縮小表示されるためアイコンがつぶれて表示されます。
例:「□□□.gif」→「□□□32.gif」

背景が真っ白で「データ処理中です、少々お待ち下さい。 」とだけ表示されたままになる。
pcyp2の表示メニュー→"YP風表示"→"ナビゲート"→"テンポラリファイルをナビゲート"を選択した後、ヘルプメニュー→"templatesを再読み込み"を選択して下さい。
スクリプトエラーが表示され、その後にチャンネル一覧が表示されなくなる。
デバッグモードを無効にした後、pcyp2を再起動してください。

 

■あとがき

このテーマについての要望・不具合・ご意見などは当ブログのコメントへお願いします。

このテーマによって発生した損害や問題などについて当方は一切責任を持ちません。

このテーマの改良およびテーマファイルの配布・転載は自己責任にてご自由にどうぞ。

posted by ぴあすき at 22:10| ヘルプ | このブログの読者になる | 更新情報をチェックする

マニュアル

チャンネル詳細表示対応 pcyp2用テーマ - info & simple
軽量版 pcyp2用テーマ - lite
http://peercast-theme.seesaa.net/

■はじめに

pcyp2の「YP風表示」で表示されるページの見た目をカスタマイズするテーマ(スキン)です。

pcyp2でチャンネル詳細表示機能が削除されたため、テーマ側で表示させようと思いなんとなく作成してみました。pcyp2 ver.2.0.0.157に付属のテンプレートをベースとし、なるべくCSSでスタイル設定するよう記述しています。

▼必要動作環境

  • pcyp2 Ver2.0.0.157以降
  • Windows InternetExplorer 6.0以降

pcyp2 Ver2.0.0.157未満ではテーマ側からCookieが利用できないため正しく動作しません。
IEのバージョンによりテーマの見た目が異なる場合もありますので、IE7がインストールされている環境を推奨します。また、IE5.5でも動作しますが、一部の表示が大きく崩れるため未対応とします。

軽量化および機能追加のためJavaScriptを使用しています。IE側でJavaScriptを無効にしている場合は、IEのオプション→"セキュリティ"→"アクティブ スクリプト"を有効にしてください。

posted by ぴあすき at 22:05| ヘルプ | このブログの読者になる | 更新情報をチェックする

主な特徴 - info & simple

■主な特徴

  • チャンネルごとの情報を記載したチャンネル詳細欄を表示できます。

 → 

  • チャンネル名のリンクをクリックしてpcyp2内にWebページを表示できます。

 → 

  • 「通知・順位・リスナー/リレー数・チャット/統計アイコン」などの項目を個別に表示するかどうか選択できます。

 → 

  • KPのバナナ/キャス子アイコンおよびユーザーが別途用意したキャス子アイコンの表示に対応。

  • 文字色を指定したお気に入りの場合、指定した文字色をチャンネル名のみに適応します。また、ほかのチャンネルよりも上部に表示させることもできます。

  • 設定ファイルに記述したリンクを簡易ブックマークとしてpcyp2内に任意のWebサイトを表示させることができます。

 → 

 

▼画面構成

 

▼simpleテーマとinfoテーマの相違点

simpleテーマとinfoテーマでは以下の点が異なります。ほかの点については基本的に同じです。

 

  simple info
チャンネルテーブルの行数 1行 1行〜複数行
キャス子/バナナアイコンの大きさ 文字の大きさに合わせる デフォルト
詳細など(※1)の表示位置 チャンネル名の右側 右側または下へ改行表示
詳細など(※1)の折り返し表示 折り返さない(※2) 折り返す
2つの項目を1つの列にまとめて表示 不可 対応(テーマ設定から選択)

※1:詳細(ジャンル)のほかにPlaying・コメントを含む。
※2:表示しきれない部分はツールチップから参照することができます。

posted by ぴあすき at 22:04| ヘルプ | このブログの読者になる | 更新情報をチェックする

インストール&設定 - info & simple

■インストール

  1. ダウンロードしたテーマファイル(.zip)を開き、すべてのフォルダをpcyp2のテンプレートフォルダ(例:「C:\Program Files\pcyp\templates」)へコピーする。
    (コピー後の例:「C:\Program Files\pcyp\templates\info」「C:\Program Files\pcyp\templates\simple」)
  2. pcyp2の表示メニュー→"YP風表示"→"ナビゲート"→"テンポラリファイルをナビゲート"を選択する。
  3. pcyp2の表示メニュー→"テーマ変更"を選択し、作成されたフォルダ名を記入。
    (例:info または simple)

※ フォルダ名(info・simple)は自由に変更して構いません。
※ アイコンなどの画像はデフォルトのテンプレートで使用している画像フォルダ内のもの(例:「C:\Program Files\pcyp\templates\images」)を使用します。設定ファイルから設定することで、複数用意した画像フォルダを画像セットとして切り替えるようなことも可能です。

 

■設定

CSSファイル(info.css / simple.css)および設定ファイル(setting.js)をテキストエディタなどで開いて編集することで、以下のような項目を変更することができます。

▼CSSファイルで変更できる主な項目

  • 全体/列/項目のフォントデザイン(フォントの種類/大きさ/文字色など)
  • テーブルヘッダ/フッタのフォントデザイン
  • チャンネルのデフォルト背景色
  • チャンネル詳細欄に表示する項目
  • キャス子/バナナアイコンの大きさ
  • チャンネル名の幅(simpleのみ)
  • チャンネル更新時に詳細・Playing・コメントが変更された場合の文字色

▼設定ファイルで変更できる主な項目

  • チャンネルテーブルに表示する列(※)
  • チャンネル名の右側に表示する項目(simpleのみ)(※)
  • 表示する項目の選択(infoのみ)(※)
  • 詳細欄に表示する各種URLの形式(※)
  • キャス子/バナナアイコンの表示/非表示(※)
  • 文字色を指定しているお気に入りを上部に表示(※)
  • チャンネルのデフォルト文字色
  • 表示するYPの名称

上記の※マークが記載されている項目は、テーマ設定欄より変更することができます。

CSSファイルや設定ファイルを編集した場合は、チャンネル情報を更新するか、pcyp2のヘルプメニュー→「templatesを再読み込み」を実行することで編集したテーマが反映されます。

▼ユーザーが用意した設定ファイルについて

「info.css/simple.css・setting.js」をユーザーの好みに合わせて編集しても、テーマのバージョンアップ時に誤って上書きしてしまい今まで編集してきた内容が破棄されてしまう場合があります。

そこで「user.css・user.js」を同じフォルダに作成して編集することで、それらを「info.css/simple.css・setting.js」の代わりにすることができます。「user.css・user.js」はアーカイブには含まれていません。

「info.css/simple.css・setting.js」から編集したい部分をコピーし「user.css・user.js」にペーストしてから編集することで、テーマのバージョンアップ時でも破棄せずに済みます。

「info.css/simple.css・setting.js」と「user.css・user.js」に同じ項目が記述されている場合は「user.css・user.js」の内容を優先させて反映します。

posted by ぴあすき at 22:03| ヘルプ | このブログの読者になる | 更新情報をチェックする

よくある質問 - info & simple

■よくある質問

pcyp2を起動したとき「YP風表示」ウインドウ内が真っ白でチャンネルが表示されない。
pcyp2 Ver2.0.0.160以降の仕様(不具合?)により、表示メニューの"YP風表示"→”ナビゲート”→"テンポラリファイルをナビゲート"を選択していて、かつpcyp2起動時のチャンネル情報を取得する際に「YP風表示」が選択されている場合、使用しているテーマに限らず上記の現象が起きます。この状態になった場合は1度テーマを変更することで正しく表示されるようになります。 なお、pcyp2終了時(もしくは起動時のチャンネル情報を取得する前)に「放送中」もしくは「放送終了」を選択しておき、pcyp2起動時のチャンネル情報取得後(ステータスバーの左側にカウントダウン表示された後)に「YP風表示」を選択することで、上記の現象を暫定的に回避することができます。
チャンネルをソートさせようとすると「リストのインデックスが範囲を超えています」とエラーが表示されてしまう。
pcyp2の"設定"→"列"からそのソートさせたい項目を”表示する列”へ追加してください。  (例:チャンネル名, 詳細, Playing, ビットレート, ハッシュ, YpAddr, 配信時間など)
チャットURLや統計URLを開いても正しく表示されない。
KPなどでは配信者側がチャットURLを設定したり統計を公開している場合にのみ正しく表示されます。現時点ではその情報をテーマ側から判断することはできないため、すべてのチャンネルでチャットURLおよび統計URLをクリックできるようにしています。YP・VPのチャットや統計が正しく表示されない場合は、pcyp2の”設定”→”YP”にある「チャットURL等をYP互換にする」のチェックボックスをチェックしてください。また、ランクやビットレートをクリックしたときに表示されるコンテキストメニューからはpcyp2オリジナルの(テーマ側で修正していない)URLを開くため、正しく表示されない場合があります。
KPのチャンネルにバナナアイコンや配信者によるカスタムアイコンなどが表示されない。
KPの仕様によりローカルのアイコンを表示するかリモート(ネット上)のアイコンを表示するかの二通りの方法があります。ネットから取得した画像を表示したい場合はpcyp2設定でKPのURL欄の最後に「ex/」を追加してください。この場合、KP側や配信者側が提供しているアイコンを画像フォルダに入れておく必要はありません。
テーマ設定の「OK」ボタンを押すとエラー表示またはページが真っ白になる。
テーマ設定の「OK」ボタンを押しても変更した設定が反映されない。
pcyp2の表示メニュー→"YP風表示"→"ナビゲート"→"テンポラリファイルをナビゲート"を選択した後、ヘルプメニュー→"templatesを再読み込み"を選択して下さい。 また、これでも正しく動作しない場合はCookieが破損している可能性がありますので、pcyp2を終了した状態でIEのインターネットオプションからCookieを削除してください。使用しているCookie名は「info/」および「simple/」です。
このテーマを用いると表示されないチャンネルがある。
仕様上、チャンネル名・詳細・Playing・コメントなどに半角記号の「"」(ダブルクオーテーション)が使用されている場合はスクリプトエラーとなってしまうため、そのチャンネルは2回目以降のチャンネル情報更新時に表示されなくなります。 ※半角記号のダブルクオーテーションを使用している配信者の方は、お手数ですが全角記号の「”」もしくは半角/全角記号の「’」(アポストロフィー)などに置き換えて頂けると当テーマでも正しく表示されます。
スクリプトエラーが表示され、その後にチャンネル一覧が表示されなくなる。
デバッグモードを無効にした後、pcyp2を再起動してください。
オーバーレイ表示した掲示板などのWebサイトに文章を入力できない
pcyp2の入力関連の仕様が特殊なためか、日本語が入力できなかったり一部のキーを文章の入力および編集に使用することができません。
posted by ぴあすき at 22:01| ヘルプ | このブログの読者になる | 更新情報をチェックする

あとがき - info & simple

■あとがき

当マニュアルに記載された内容はテーマのバージョンアップなどの仕様変更により変更されたり放置されたままになる場合があります。

細かく動作チェックをしているわけではありませんので、特定の動作を行ったときにスクリプトエラーが繰り返し表示される場合(デバッグモード有効時)、具体的に行った操作を当サイトのコメントなどへ書き込んで頂けると助かります。

オーバーレイ表示にはThickBoxスクリプトを利用しています。
ThickBox
http://jquery.com/demo/thickbox/

このテーマによって発生した損害や問題などについて当方は一切責任を持ちません。
このテーマの改良およびテーマファイルの配布・転載は自己責任にてご自由にどうぞ。

posted by ぴあすき at 22:00| ヘルプ | このブログの読者になる | 更新情報をチェックする
×

この広告は1年以上新しい記事の投稿がないブログに表示されております。