概要

ELZで配布されているFlash Zoom EngineをNucleusアイテム内で利用できるようにするためのプラグインです。

大きめの画像に対するプレビュー画像を自動的に作成し、ズームイン、アウトさせることができます。

JavaScript無効の環境では、プレビュー画像を単純に表示させることができます。つまりFlashが利用できない環境下ではズーム機能は無効になりますが、プレビュー画像は表示させることができるわけです。

当プラグインを作成するにあたり、既存のプラグインをいろいろ参考にさせて頂きました。ありがとうございます。

主な機能 version 0.1.1

  • Flash Zoom Engineを利用したズーム表示機能
  • JavaScript無効時の代替画像表示機能
  • プレビュー画像自動作成機能
  • テロップ組込み機能
  • 撮影日取得機能
  • サーバ負荷軽減機能

注意点

  • PHPでGDが扱える環境が必要です。(プレビュー画像自動作成の為)
  • 日本語フォントの利用にはご利用のPHPがFreetypeライブラリを組み込んでいる必要があります。
  • 撮影日の取得はご利用のPHPがexif_read_data 関数をサポートしている必要があります。
  • Nucleus 3.23の環境で動作確認をしています。
  • Flash Player 7もしくは8以降が必要です。
  • Version 0.1.1はベータ版です。

ダウンロード

NP_Misfze011 (EUC) 2006.10.01
※UTF-8環境の方は変換してご利用下さい。
Flash Zoom Engine 本体
ELZよりダウンロードして下さい
JavaScriptファイル郡
plugins/misfe/js/ディレクトリへコピーして下さい

使い方

・アイテム投稿時に<%Misfze(画像ファイル名|横幅|高さ|テキスト)%>とします。imageタグと同じ感じです。横幅及び高さはあくまでもプレビュー時のサイズです。プレビュー画像が存在しない際に指定サイズのプレビュー画像が自動作成されます。

<%Misfze(001.jpg)%>とした場合、横幅は管理画面で設定したデフォルト値が利用されます。

・パス指定無しの場合Private Collection(media/1等)の画像を利用します。

<%Misfze(001.jpg|300|0|テキスト)%>と『高さ』を0や省略すると比率を維持した状態で横幅300に合わせてプレビュー画像の高さを調整します。

・view_modeがfull以外の場合は画像の横幅と高さはしっかりと指定して下さい。もしかすると条件によっては上手く動作しないかもしれません。

・指定パラメータ例(多くのパラメータを指定した場合)


<%Misfze(001.jpg|300|200|テキスト|offzoom|onnavi|effect=5|time=12)%>

利用前の準備

  • pluginsディレクトリにコピーする
  • plugins/misfe/jsディレクトリに*.jsをコピーする
  • plugins/misfeディレクトリにmisfze.swfをコピーする
  • 日本語フォントを利用する場合はplugins/misfe/fonts/へttfファイルをコピーする

    plugins/NP_Misfze.php
    plugins/misfe/misfze.swf
    plugins/misfe/js/flash7_check.js
    plugins/misfe/js/flash8_check.js
    plugins/misfe/js/misfe.js
    plugins/misfe/fonts/*.ttf

・mediaディレクトりにプレビュー画像保存用ディレクトリ(media/preview)を作成する。ディレクトリは自動的に作成されるようにしてますがphpセーフモードの場合、ご自身でディレクトリを作成しパーミッションを777等にする必要があるかもしれません。

・Nucleusプラグイン管理メニューよりMisfzeをインストールする

・NP_Misfzeの管理画面でfeedsと記述されている欄はxml-rss2.php経由の呼び出し時は処理をしないようにするための策です。(サーバ負荷軽減の為)
テンプレート名先頭がfeedsになっている場合は、組込み処理を行わないということになります。適時ご利用の環境に合わせて設定して下さい。

・スキン?(私の場合はデフォルトのhead.incを編集しました)の適所に<%Misfze(flash8)%>を記述。

・flash player7以上の環境を対象とする場合は<%Misfze(flash7)%>として下さい。


<!-- tooltips & stylesheet (activated by title="" on links) -->
<link rel="stylesheet" type="text/css" href="<%skinfile(nicetitle.css)%>" />
<script type="text/javascript" src="<%skinfile(nicetitle.js)%>"></script>

<%Misfze(flash8)%>

・・・省略

プラグイン管理画面での設定項目と<%Misfze%>への記述パラメータについて

Ommit template preitem events
処理対象外としたいテンプレート名を指定します。
これはRSS配信部分等で当プラグインの処理が不要と推測されるテンプレートを指定します。
feeds|default/any等の記述も可能です。
Preview photo directory
自動的に作成されるプレビュー画像格納用ディレクトリを指定します。
mediaディレクトリ直下に自動作成するようにしていますが、PHPがセーフモードの場合は手動でディレクトリ(パーミッション777)を作成する必要があります。
Background-color
ffffff等の形式で背景色を指定します。通常は表示画像の背後に隠れてしまう色なのであまり指定は必要ないかもしれません。

<%Misfze%>では第5パラメータ以降にbgcolor=ffffffの様に指定します。省略時は管理者画面で設定した値が利用されます。

Stage_width
プレビュー画像の横幅を指定します。このサイズに合わせて指定した画像をプレビュー画像格納用ディレクトリに作成します。

<%Misfze(画像ファイル名|横幅|高さ|テキスト|第5パラメータ以降・・・)%>では第2パラメータに指定します。省略時は管理者画面で設定した値が利用されます。

Stage_height
プレビュー画像の高さを指定します。このサイズに合わせて指定した画像をプレビュー画像格納用ディレクトリに作成します。
0と指定している場合は比率を維持したままStage_widthで指定された横幅に合わせて自動調整されます。

<%Misfze(画像ファイル名|横幅|高さ|テキスト|第5パラメータ以降・・・)%>では第3パラメータに指定します。省略時は管理者画面で設定した値が利用されます。

Preview jpeg quality
プレビュー画像の保存品質を指定します。100(高品質)から0(低品質)まで指定可能ですが、通常は変更しないで良いと思います。
Text
JavaScript環境が無効の場合Flashも無効になります。その際のプレビュー画像に対するalt属性を指定します。(imgタグ)

<%Misfze(画像ファイル名|横幅|高さ|テキスト|第5パラメータ以降・・・)%>では第4パラメータに指定します。省略時は管理者画面で設定した値が利用されます。

Zoom_effect
ズームエフェクトを指定します。

<%Misfze%>では第5パラメータ以降にeffect=1の様に指定します。1~14まで指定可能です。
省略時は管理者画面で設定した値が利用されます。

Zoom_fade
フェード方法を指定します。

<%Misfze%>では第5パラメータ以降にfade=1の様に指定します。0~6まで指定可能です。
省略時は管理者画面で設定した値が利用されます。

Zoom_time
ズーム時間を指定します。

<%Misfze%>では第5パラメータ以降にtime=6の様に指定します。10と指定すると1秒ということになります。
省略時は管理者画面で設定した値が利用されます。

Navi_mode
ナビゲーションモードを指定します。

<%Misfze%>では第5パラメータ以降にoffnavi,onnavi,openaviのいづれかを指定します。
省略時は管理者画面で設定した値が利用されます。

Navi_effect
ナビゲーションエフェクトを指定します。

<%Misfze%>では第5パラメータ以降にnavi_effect=100の様に指定します。指定は1から6まで、100から123まで、200-223までとなります。
省略時は管理者画面で設定した値が利用されます。

Navi_time
ナビゲーション表示時間を指定します。

<%Misfze%>では第5パラメータ以降にnavi_time=6の様に指定します。10と指定すると1秒ということになります。
省略時は管理者画面で設定した値が利用されます。

View_mode
表示モードを指定します。

<%Misfze%>では第5パラメータ以降にfull,scrollx,scrollyのいづれかを指定します。
省略時は管理者画面で設定した値が利用されます。

Zoom_mode
ズームモードを指定します。

<%Misfze%>では第5パラメータ以降にonzoom,offzoomのいづれかを指定します。
省略時は管理者画面で設定した値が利用されます。

Operation_mode
操作モードを指定します。

<%Misfze%>では第5パラメータ以降にautozoom,clickzoomのいづれかを指定します。
省略時は管理者画面で設定した値が利用されます。

Telop Text
プレビュー画像に組み込むテロップ文字を指定します。日本語を含むTTF(フォントファイル)指定が無い場合は半角英数のみ指定可能です。

<%Misfze%>では第5パラメータ以降にtelop=文字列の様に指定します。
省略時は管理者画面で設定した値が利用されます。

Telop Template
テロップの表示方法を指定します。
$date $telopとすると『日付 テロップ』の形式になります。
Date(exif) print
PHPがexif_read_data関数をサポートしている場合、デジカメ画像から撮影日を取得してテロップとして組み込めます。

<%Misfze%>では第5パラメータ以降にondate,offdateのいづれかを指定します。
省略時は管理者画面で設定した値が利用されます。

Date format
日付の表示形式を指定します。指定方法はNucleusの日付関係<%date%>と<%time%>と同様です。
Telop font_size
フォントサイズを指定します。1~5まではGD標準のビットマップフォントを利用します。6以上のサイズを指定した場合はTTFフォントを利用します。
Telop align
テロップ表示位置を指定します。
Telop padding
テロップ表示余白を指定します。
Telop Color
ffffff等の形式でテロップカラーを指定します。
Telop Shadow Color
000000等の形式でテロップシャドウカラーを指定します。省略時はシャドウカラー無しになります。
TTF Font FileName
plugin/misfe/fonts/ディレクトリに保存したフォントファイル名を指定します。
TTFフォントを利用したい場合は適時アップロードして下さい。日本語フォントを利用することで日本語表示も可能です。
JIS-mapped Japanese Font Support.
PHPのGD情報です。通常変更する必要はありません。
Limit Use Flash Zoom Engin Count
Flash Zoom Engineの最大利用数を指定します。
これは大量のアイテムを1ページ内で表示させる場合、先頭の3件のみFZEを利用する等の負荷軽減の為に利用します。
個人的には1ページ内に配置されるFlashコンテンツは数個くらいがベストだと思います。
0と指定すると、全くFZEを利用しなくなります。つまり単純なサムネイル自動生成プラグインの代わりとしても使えるかもしれません。
Limit CPU TIME
CPU最大利用秒数を指定します。
1とすると1秒指定となり、NP_Misfzeの処理時間が1秒を超えた時点でプレビュー画像作成処理は次回に持ち越しになります。
NP_Misfzeはプレビュー画像が存在しない場合、自動的に画像を作成します。プレビュー画像作成はサーバに負荷がかかる重い処理です。ご利用のサーバ環境に合わせて設定して下さい。
Server Info (GD & Exif Function)
ご利用のサーバのPHP環境情報が表示されます。変更不要です。
  • [GD Version] ==>> bundled (2.0.28 compatible)
  • [JPG Support] ==>> OK
  • [FreeType Support] ==>> OK
  • [FreeType Linkage] ==>> with freetype
  • [Exif Support] ==>> OK
上記5つの状態になっていれば『プレビュー画像自動生成、テロップ組込み、撮影日取得』の3つの機能が利用可能です。