HonestyWorks TechNote

CodeMirror はブラウザ上でのソースコード編集に便利なjavascriptモジュールです。
なんでもCMS でもテンプレート編集画面に導入しています。
そのときにIEでエラーが出てしまって嵌ったことがあったので記録しておきます。
IEでjavascriptのエラーが出ると追跡が困難で厄介なんですよね。。

今回の原因は、CodeMirrorで編集対象のtextareaタグがpタグの中に入っていたことでした。（なんと単純）
pタグじゃなくてdivタグのなかにtextareaを入れたら、すんなりエラーが無くなりました。
DOMのinnerHTML操作がinlineのコンテナだとIEではエラーになるそうです。

たったこれだけのことで結構はまってしまいました。

概要

なんでもCMS にはこれまで簡易的な画像リサイズモジュールが付いていましたが、もう少しイケてる感じにしようと思い作り直しました。
たとえば、
/files/Sunset.jpg という元画像があったとして、

/icache/w100/files/Sunset.jpg にアクセスすると

こんな感じで幅100pxの画像が表示されたり、

/icache/w200h200bFFFFFF/files/Sunset.jpg のように

余白を指定したカラーで埋めて固定サイズの画像を作れたりします。

一度リサイズした画像はキャッシュされるのでパフォーマンスも問題無いですし、元画像が変更されればキャッシュも更新されるようになっています。

このモジュールはなんでもCMSのモジュールからは完全に独立しているのでいろいろなところに転用できそうです。

仕様

/icache/`パラメータ指定`/`元画像のパス名` というURL形式でアクセスすると指定したパラメータのとおりに加工した画像が表示されます。パラメータの指定方法は

w120
h200
w150h150
w200h200bFFFFFF

のようになります。

• wXXX 幅をpxで指定します。（省略可能）
• hXXX 高さをpxでしていします。（省略可能。幅または高さのどちらかは必須）
• bXXXXXX 余白の色を指定します。これを指定すると幅、高さ固定となります。

リンクの書き方次第で様々な大きさの画像を作り出せるので非常に汎用的で使いやすい仕組みではないかと思います。

なんでもCMS では「EAVモデル」というデータ構造を採用しています。
EAVとは Entity, Attribute, Value の略です。
この名称が一般的なのかは知りませんが、Magento というeCommerceシステムで EAVモデルという言葉が使われています。
http://4plus.jp/tech/2011/02/magentoeav.html

従来のRDBMSよるスキーマ構造とは大きく異なり、本来テーブルとして定義すべきものを全て Entity, Attribute, Value の3つのテーブルで管理します。（なんでもCMSではRecordというテーブルも使っています。）

これにより管理画面から自由にオブジェクト設定(＝データベースのテーブル設計)ができ、動的に変更が可能な構成を実現しています。メタデータがDBに登録されているので画面の生成なども容易に自動化できるわけです。
EAVモデルはなんでもCMSにとっては欠かせない要素のひとつなのです。

逆にEAVモデルのデメリットは

1. 正規化されたRDBMS設計のようにSQLでの取り扱いが簡単ではない
2. データ量が増えてきたときのパフォーマンス（特定のカラムにインデックスをつけたりとかできない）

といったことが挙げられます。

1についてはO/Rマッパー層で吸収するコードを書いたので、あたかも普通のテーブル設計のようにプログラミングすることができるようになりました。

2についてはメリットとのトレードオフということで割り切って考えています。
CMSでそれほどデータ量が問題になるとも思えないですし、データ量の多いオブジェクトは専用のテーブルを作るなどのハイブリッドな設計にすればよいかと思います。

EAVモデルはCMSとの親和性が非常に高いということに気づいたのがなんでもCMS開発のきっかけでもあります。

概要

「なんでもCMS」はWeb製作をするデザイナーさんが簡単にCMSを構築することを目的としたプロダクトです。
Web製作を請け負う課程で、お知らせや事例などちょっとした更新をするための画面やお問い合わせフォームの作成など、プログラミングが必要な部分は別途システム開発屋に頼む必要がありました。
「なんでもCMS」を導入することで上記のようなことは全てデザイナーさん自らが構築することができます。
そしてそれ以上のことも。。。

特徴

• 静的ページは通常通りFTP等で管理可能。動的更新をしたいページのみを管理画面から設定。
• 動的ページもサーチエンジンフレンドリーなURL体系 (ex. foo/bar.html)
• 既存のホームページをかんたんに更新可能にできる。
• 入稿する項目を自由に設定可能。そのためわかりやすい操作での更新が可能。
• 後からでも項目を追加可能。
• お問い合わせ等のフォームページにも対応。

エンドユーザーのメリット

• 更新用の画面がシンプルで直感的。更新すべき項目が明確なため迷わない。
• WordPressやMTなど、余計な機能が多すぎて慣れている人でないと使えない。「なんでもCMS」なら誰でも直感的に操作可能。

デモ動画を公開しましたのでよろしければご覧ください。
お問い合わせは こちら からお願いいたします。