Ver.6.04:アルバムにCSSフィルタ等追加

MyHome Portal Ver.6.04をリリースしました。
http://ok2nd.web.fc2.com/download.html

「アルバム」のスライドモードのオプションに「ImageFilters」を追加。
「ImageFilters.js」を使って、ブラウザ上で画像加工が出来ます。
加工した結果は、PNGまたはJPEGでダウンロードできます。IEでは正常動作しません。
https://github.com/arahaya/ImageFilters.js

「アルバム」のスライドモードのオプションに「さざ波」を追加。
画像の上にマウスを重ねると、さざ波のような効果が出ます。「ImageFilters.js」を使っています。

「アルバム」のスライドモードのオプションに「CSSフィルタ」を追加。
フィルタ効果は、キーボードでページ移動しても引き継がれます。
フィルタ加工した結果の保存はできません。Chrome(webkit系)のみ動作。
http://www.propra.nl/playground/css_filters/

imagefilters1.jpg
imagefilters2.jpg
css_filters1.jpg
css_filters2.jpg
スポンサーサイト

はてなブックマークに追加 はてなブックマーク - Ver.6.04:アルバムにCSSフィルタ等追加

theme : JavaScript
genre : コンピュータ

Ver.5.06:アルバム全画面スライドとライフプラン

MyHome Portal Ver.5.06をリリースしました。
http://ok2nd.web.fc2.com/download.html

「アルバム」の全画面スライドショーを、ブラウザのウインドウサイズと画像サイズの縦横比率を判断して、画像がウインドウ内に収まるようにしました。ただ、ブラウザのウインドウサイズの判断は1つ前のウインドウ状態で判断しますので、ウインドウサイズを変更した直後は正しく表示されない可能性があります。2回ほど、リロードすれば正しく表示されます。

「預貯金管理」の「ライフプラン」のデータ保存先を、localStorage(Webストレージ)からMySQLデータベースに変更しました。 元のバージョンでは勉強のためにlocalStorageを使っていましたが、特定のブラウザのローカルストレージに保存では実用性に乏しいので。 データベースには、データをJSON形式にまとめて登録します。

はてなブックマークに追加 はてなブックマーク - Ver.5.06:アルバム全画面スライドとライフプラン

theme : PHP
genre : コンピュータ

Ver.4.12:アルバム、RSSリーダーをAjax化

MyHome Portal Ver.4.12をリリースしました。
http://ok2nd.web.fc2.com/download.html

「アルバム」のディレクトリ移動や画像ページ移動等の処理をAjax処理するようにしました。これにより、ページ遷移がなくなり操作性がアップしました。
ただし、「フォルダ画像表示」状態では、フォルダ画像をシフトキーを押しながらクリックして別ウインドウを開く操作が出来るように、あえて通常のリンクにしています。

「アルバム」スライドモードのオートプレイを廃止しました。全画面表示では、オートプレイできます。
「アルバム」スライドモードの画像エフェクト機能を廃止しました。
「アルバム」スライドモードのルーペ機能を廃止しました。

「アルバム」にギャラリ6を追加。(IEでは正常動作しません。)
「FULLSCREEN BACKGROUND IMAGE SLIDESHOW WITH CSS3」を利用。
http://tympanus.net/codrops/2012/01/02/fullscreen-background-image-slideshow-with-css3/
demo4をベースにしています。画像がゆっくりとズームアップしながら、切り替わります。縦長画像にも対応するように調整しています。

GAEで作成した写真共有サイト「2nd Foto」にも追加しました。例えば、以下のページを開いて、右上の「Fullscreen Zoom」をクリックしてください。
http://2ndfoto.appspot.com/?user=aglzfjJuZGZvdG9yEgsSC1VzZXJBY2NvdW50GIwnDA
※ 「2nd Foto」は、GAE無料枠で立ち上げていますので、Frontend Instance Hoursが制限時間を越えてしまってアクセスできない可能性があります

「RSSリーダー」の個々のRSSリード処理を、Ajax非同期(async:true)で取り込むようにしました。
ただ、これだけでは、ブラウザがしばらく待ち状態になり、その間ページ遷移もできない状態は変わりません。Ajaxコールされる側のPHPのsession_start()コールを除いたら、レスポンスが劇的に向上しました。

はてなブックマークに追加 はてなブックマーク - Ver.4.12:アルバム、RSSリーダーをAjax化

theme : JavaScript
genre : コンピュータ

Ver.3.18:画像ギャラリ5仕様変更

MyHome Portal Ver.3.18をリリースしました。
http://ok2nd.web.fc2.com/download.html

3.17で追加した「アルバム」の「ギャラリ5」が、ブラウザがIE6の場合、テンポラリディレクトリに大量にファイルが残ってしまうことが判明。原因は不明ですが、サムネイル表示時点でなく、個別の画像をクローズアップした時点でimg-view.phpが複数回呼ばれてしまいます。

ギャラリ5の仕様を変更し、テンポラリファイル名をランダムでなく、ユーザーアカウント毎に固定のファイル名24個として、テンポラリディレクトリから消さない方式にしました。同一ユーザーアカウントで複数画面を開いて、別ディレクトリの画像を表示した場合、違う画像が表示される可能性があります。

既にIE6でギャラリ5を試された場合、ERROR_LOG_DIRで指定したディレクトリにjpgファイルが残っている可能性がありますので、削除をお願いいたします。

はてなブックマークに追加 はてなブックマーク - Ver.3.18:画像ギャラリ5仕様変更

theme : JavaScript
genre : コンピュータ

画像ギャラリのサーバー側処理補足

MyHome Portal Ver.3.17で、JavaScriptライブラリ「Merging Image Boxes with jQuery」を利用した画像ギャラリー「ギャラリ5」を追加しました。
http://ok2nd.blog87.fc2.com/blog-entry-255.html
boxes2.jpg

この機能追加について補足事項を書いておきます。

「Merging Image Boxes」は、1枚の画像をクローズアップした時の画像サイズが固定値前提になっています。サムネイル画像の6倍、例えばサムネイルの横幅が125pxの場合750pxでないときれいに表示できません。

そのため、MyHome Portalのギャラリ5では、サーバー側で、それにあわせて画像をリサイズしています。(縦長画像の考慮はしていません。動画のサムネイル静止画も未対応です。)

画像のリサイズには、IrfanViewを使用しています。リサイズ画像はテンポラリとして作成していますが、IrfanViewがリサイズ先のファイル名の拡張子がjpgでないと動作しないため、tempnam()を使えません。そこで、定義ファイルでERROR_LOG_DIRで指定されたディレクトリに一時的にファイルを作成しています。

3.17に不具合があったため、以下の処理は3.18で使わない仕様に変更しました。(2/7追記)

ただ、このファイルが
  fpassthru($fp);
  @fclose($fp);
をした後でもunlink()で消えないケースが発生するため、確実に消すため次の処理を入れています。
 if ($temp_file) {
    while (!unlink($temp_file)){
      usleep(10000);
    };
 }

はてなブックマークに追加 はてなブックマーク - 画像ギャラリのサーバー側処理補足

theme : PHP
genre : コンピュータ

Ver.3.17:画像ギャラリ Merging Image Boxes

MyHome Portal Ver.3.17をリリースしました。
http://ok2nd.web.fc2.com/download.html

3.17はIE6で不具合が発生します。3.18にアップデートしてください。(2/7追記)

「アルバム」に、JavaScriptライブラリ「Merging Image Boxes with jQuery」を利用した画像ギャラリーを追加しました。
http://tympanus.net/codrops/2010/11/30/merging-image-boxes/
24枚単位で表示します。
[Esc]キーで元のアルバムページに戻ります。[Enter], [Space],[→]キーで次の24枚に移動します。[←]キーで前の24枚に移動します。

「INDEX」の「ブックマーク」とツール「ファイルマネージャー」の検索機能をファイル名だけでなくフォルダ名も対象にするように仕様変更しました。

boxes.jpg
boxes2.jpg


はてなブックマークに追加 はてなブックマーク - Ver.3.17:画像ギャラリ Merging Image Boxes

theme : JavaScript
genre : コンピュータ

Ver.3.05:アルバムにフォルダ画像表示機能

MyHome Portal Ver.3.05をリリースしました。
http://ok2nd.web.fc2.com/download.html

アルバムのサムネイルモードに、フォルダ画像表示機能を追加しました。下位フォルダ内の画像を1枚表示させることができます。

folder-img.jpg

はてなブックマークに追加 はてなブックマーク - Ver.3.05:アルバムにフォルダ画像表示機能

theme : PHP
genre : コンピュータ

Ver.3.04:全画面スライドショーに傾きモードを追加

MyHome Portal Ver.3.04をリリースしました。
http://ok2nd.web.fc2.com/download.html

「アルバム」の「全画面」に、傾きモードを追加しました。写真を縁ありにして傾けてスライドショー表示します。「全画面」で、[L]キーを押してください。傾きモードは「全画面(Ajax)」にも引き継がれます。
CSS3を利用しているため、IEでは傾きません。
slide-lean.jpg

「ログアウト/管理」の「MyHome Portal ログイン履歴表示」に、古いログインログの削除機能を追加しました。
log-clean.jpg

Ver.3.01の修正ミスによるjquery.jsのインクルード漏れが、まだあったので修正。

はてなブックマークに追加 はてなブックマーク - Ver.3.04:全画面スライドショーに傾きモードを追加

theme : JavaScript
genre : コンピュータ

Ver.3.02:アルバムの不具合修正

MyHome Portal Ver.3.02をリリースしました。
http://ok2nd.web.fc2.com/download.html

Ver.3.01でphoto/slide.phpを誤って修正したために、「アルバム」の「全画面」「全画面(Ajax)」が正常動作しなくなった不具合を修正。

はてなブックマークに追加 はてなブックマーク - Ver.3.02:アルバムの不具合修正

theme : JavaScript
genre : コンピュータ

Ver.3.00:トップメニューの色を任意設定

MyHome Portal Ver.3.00をリリースしました。
http://ok2nd.web.fc2.com/download.html

Ver.1.00リリースから約2年経過で3年目に入ったということで、Ver.3.00としました。

トップメニュー(コンテンツ・ナビ)の色をユーザーが任意に設定できるようにしました。「My設定:アカウント情報修正」で、設定してください。
top-menu.jpg
top-menu2.jpg


「My設定:アカウント情報修正」で、ログインパスワードを3分間保持するようにしました。連続再修正の利便性を考慮しました。

「アルバム」で、フォルダの前後移動機能を追加しました。画面右上の|← ← → →| をクリックしてください。
photo-dir-move.jpg


Ver.2.80で追加した「アルバム」のディレクトリの自動スクロールのスクロール量を微修正しました。

はてなブックマークに追加 はてなブックマーク - Ver.3.00:トップメニューの色を任意設定

theme : PHP
genre : コンピュータ

プロフィール

ok.2nd

Author:ok.2nd
HomePage:
http://ok2nd.web.fc2.com/
Email: m.ok.2nd@gmail.com

最新記事
最新コメント
最新トラックバック
月別アーカイブ
FC2ブログランキング

FC2Blog Ranking

検索フォーム
カテゴリ
リンク
RSSリンクの表示
ブロとも申請フォーム

この人とブロともになる

QRコード
QRコード
ユーザータグ