ペットストアアプリケーション

Java Pet Store をモチーフに、マスカットを用いて Ajax リッチクライアント化したものです。

従来の Java Pet Store ではフォームデータの送信ごとに画面全体が再描画され、紙芝居のように動作のたびに画面が切り替わっていました。マスカット Pet Store では画面内で更新が必要な部分だけが再描画され、通常のウィンドウアプリケーションのような操作感が実現されています。

アプリケーション画面

Internet Explorer 8 以降のブラウザでは動作保障外となりました。

操作方法

  1. [Pet Store] タブの左上のボタンもしくは画像 (魚、犬、爬虫類、猫、鳥) をクリックすると、そのカテゴリに応じたペットの商品一覧が画面右上のグリッドに表示されます。
  2. 商品一覧のグリッドから一つの商品を選択すると、在庫情報が画面右下のタブフォルダに表示されます。
  3. 在庫情報から購入したいペットを選択し、[add to cart] ボタンを押下するとショッピングカート ([Shopping Cart] タブ) に選択したペットが追加されます。
  4. 買い物かごをチェックアウトする場合は [checkout] ボタン、さらにペットの購入をしたい場合は [continue shopping] ボタンを押下します。