Pryn 1.0、デビュー。

長い雌伏のバージョン0.2.xの時期を経て、Pryn 1.0をリリースしました。

PrynはJavaScriptとCSSのファイルを1つずつ読み込むだけでWebサイトのユーザービリティを向上させる、つまり「おもてなし」度を上げるツールです。

内容的にはJavaScriptの方はクロスブラウザに特にフォームまわりの使い心地を楽に良くすることを中心に書かれています。それに対してCSSの方は学んできたTipsの集積地という感じです。

最初にこれを作った頃は、JavaScriptのフレームワークはまだPrototype.jsが一番手で、それに対してjQueryがカウンターテーゼとして台頭してきたという頃でした。他にもDojoやMootoolsがコアなファンに後押しされて、JavaScriptライブラリ群雄割拠という感じでした。
そんな状況で、どのフレームワーク/ライブラリにも依存しない、かつどのフレームワーク/ライブラリとも併用できるようなライブラリが欲しくなり、作ったのがこのPryn.js & cssです。
当初はクロスブラウザなイベントリスナーの追加やclass属性の追加・削除、それにいくつかのフォーム部品等のおもてなし向上とYUI2 CSSのインポートとシンプルな内容でしたが、老舗の鰻屋のタレのように、じっくり時間をかけてじわじわ知り得た知識や経験を足していき、旨みを凝縮させました。(忘れないようにメモがわりにしつつ、かつ、実験場にしてきたとも言います。)

なにはともあれ、Pryn.js & css、可愛がってやってください。

Pryn.js & Pryn.cssバージョンアップ(0.2.5)

読み込むだけでWebページの「おもてなし度」を向上 – Pryn.js & Pryn.css [ゼロと無限の間に]

Pryn.jsの主な変更点

  • HTML5のautofocus属性に対応(autofocus未対応のブラウザでもautoでfocusできる)
  • HTML5のplaceholder属性に対応(placeholder未対応のブラウザでも、テキストボックスに未入力の場合のみメッセージをグレイアウトで表示できる)
  • select要素の選択されているoption要素を簡単に取得できるfunctionを追加(Pryn.getSelected())
  • 四角いBOXをちょっとだけ角丸っぽく見せられるfunctionを追加(Pryn.round())
  • formをsubmitした時のマウスカーソルを「待ってる」感が出るものに変更
  • Stringを拡張してword2regexp()を持たせるのをやめた

Pryn.cssの主な変更点

  • importするYUIのCSSのスキームをスキーム指定無しからhttpsに変更(スキームなしだとIEが2回読み込んでしまう問題を回避するため)
  • テキストボックスの背景色を変えたときに枠線の見た目が変わらないようにした(IE6は非対応)
  • ボタンの見た目のブラウザ間の差異を小さくした。かつ、ボタンを押しやすいように左右のpaddingを広めにした
  • フォントはIE7・IE8はメイリオ、Macはヒラギノ角ゴ、それ以外はブラウザの設定のフォントになるようにした
    (IE6やFirefoxは設定しないとClearTypeが有効にならないので自動でメイリオにするのはやめた。ブラウザの設定等でメイリオにしている人にはFirefox等でもメイリオになる)
  • リンクの色を綺麗な青等にした
  • 角丸(border-radius)のブラウザ別のサンプルを入れた

なんかゴチャゴチャしてきたので、JavaScriptはjQueryベースで書き直したくなってきた。

CSSはjQuery UI CSS Framworkベースで?でもYUIないとクロスブラウザ的に辛いかな...

Pryn.js & cssバージョンアップ(0.2.4)

読み込むだけでWebページの「おもてなし度」を向上 – Pryn.js & Pryn.css [ゼロと無限の間に]

主な変更点(js)

  • フォームSubmit後にフォームを凍結する時間を3秒から5秒に変更
  • 古いSafariがDOMContentLoadedに対応していないことによる問題を解消
  • 表(table)を簡単にシマシマにできる機能を追加

主な変更点(css)

  • 読み込むYUIのCSSを2.7.0にバージョンアップ
  • disabledなform要素はマウスカーソルをそれにふさわしいものに変更(IEは一部のみ対応)
  • Googleのカスタム404ページのCSSを取り込んだ

Pryn.js & Pryn.css バージョンアップ(0.2.3)

読み込むだけでWebページの「おもてなし度」を向上 – Pryn.js & Pryn.css [ゼロと無限の間に]

Pryn.jsの主な変更点

  • IEでlabel要素内のimg要素をクリックしてもチェックが付かない問題を解消
  • ページのunload時に、操作不可にしていたformを操作可能に戻すようにした

Pryn.cssの主な変更点

  • YUIのホスティング元を米Yahoo!からGoogleに変更
  • 上記に伴い、httpsのページではYUIのロードもhttpsになるようにした

Pryn.js & Pryn.css バージョンアップ(0.2.2)

読み込むだけでWebページの「おもてなし度」を向上 – Pryn.js & Pryn.css [ゼロと無限の間に:Sandbox]

久しぶりにバージョンアップ。Beta版として細かい変更はしていたけど。

主な変更点(Pryn.js)

  • (Firefoxのみ)windowへonloadを追加しようとした場合、windowのloadイベントを待たずにDOMContentLoadedイベントでfunctionを実行するようにした
  • (IEのみ)フォームのファイルアップロード(input要素でtype属性がfile)にマウスカーソルが当たった時にマウスカーソルが手になるようにした
  • フォームSubmit後にフォームを操作可能になるまでの時間を指定できるようにした
  • label要素のクロスブラウザ対応(label要素にfor属性を書かなくても動作する)
  • 画像にtitle属性が無い場合、alt属性をtitle属性にコピーする
  • input要素に”input-<type属性の値>”というclassを付与できるようにした(デフォルトではこの機能はOff)

主な変更点(Pryn.css)

  • importするYUIのバージョンを2.5.0から2.5.2に上げた
  • Yahho Sticky Footerを取り込んだ
  • centerクラスを追加
  • デフォルトのfont-sizeとline-heightを追加

こんなとこかな。忘れてるのもありそうだけど。

Sitcky Footerとかデフォルトのフォントサイズとかは無い方が便利な時もあるけど、迷ったけど入れた。いらないならコメントアウトか上書きすればいいし。でもそのうち外すかも。

Pryn.js & cssに、当サイトへのリンクのお願いを追加

読み込むだけでWebページの「おもてなし度」を向上 – Pryn.js & Pryn.css [ゼロと無限の間に:Sandbox]

プログラムの変更ではなく、Wikiにお願いを追加しただけ。

強制ではないけど、これを使う人はこのサイトにリンクバックしてくれたらいいなというお願い。

諸事情ある場合や、単にリンクしたくないという人もいるでしょう。だからリンクしなくても使うのは全然構わない。

気持ちとしては、フリーウェアのDonateみたいな感じで。

Pryn.js & Pryn.css 細かくバージョンアップ (0.2.1)

読み込むだけでWebページの「おもてなし度」を向上 – Pryn.js & Pryn.css [ゼロと無限の間に:Sandbox]

主な変更点

  • Pryn.ClassAccessorでクラス名にハイフンが含まれる場合に正しく動作しないバグを修正
  • IEで、テキストエリアのスクロールバーを不要な時は非表示になるようにした
  • Firefoxで、常にスクロールバーを表示するようにした