リアルタイムクイズを公開

　Geoの掲示板設置でいろいろ苦労していた時に、
ふと思いついたんですが、もしかして、この掲示板で
リアルタイム性のあるアンケート、いやクイズ的なものが
出来るんじゃないかと。

すなわち、普通のアンケートＣＧＩだと、データをサーバ
に蓄えて、サーバのデータを元にアンケート結果を表示するが、
さすがにGeoはＣＧＩ使用を許していないので、これが出来ない。

しかし、書き込み後のＨＴＭＬ内にINPUTタグでHIDDENタイプに
して選択値をVALUE属性に書き込んでおけば、
それを元にJavaScriptで集計し、
その集計データをグラフ化が出来そうである。

この思い付きを具体的にやってみました。
初めは苦労したが、基本が出来たら、あとは飾り付けるだけ。
ということで、一気にリアルタイムクイズを作っちゃいました。

あとは盛り上がりそうな内容の問題文を考えて公開した。
そしたら、掲示板は書き込みゼロだけど、こちらは
反応早かったですね。皆さん結構答えてくれました。

やはり掲示板となると、書き込みは敷居が高いようですね。
クイズの方は、自分のコメントとか書かないため、
気楽に書き込みできることが、反応が良い点かな。
ゲームの方も、そういう点でアクセスがありますね。

掲示板の開設

　他サイトの掲示板とか見てると、管理者が投稿に対して
レスしているが、これが結構大変そうなので、ちょっと
設置には引いていたが、それはアクセス数が巨大なサイト
の掲示板なので、アクセスが殆ど無いサイトではあまり
考えなくてもいいんじゃないかと。

で設置することに。で掲示板と言ってもどうやって設置する
のかがよく分からなかったが、なにしろGeoに掲示板があるので
これを利用することに。ただし、Geoのデフォルトのものは、
ゲストブック的なものなので、これに改善を加えたものを考えた。

Geo内の掲示板サポートサイト内の情報を見て、
いろいろ試してみたが、なかなか上手く行かず、結構苦労したが
一応、teacupのような掲示板を作ることが出来た。

　実際に設置したが、書き込みがない！！
仕方なしに日記的に書き込んでいたら、やっと書き込みが
あった。いやー、嬉しかったですね。でも、その後も
自分も殆ど書き込みとかしなくなって、
そこに友人が連載書き込みしてくれて、なんか体裁は
あったけど。。。。。

公式戦開幕に向けてのコンテンツを作成

公式戦の開幕に向けて以下のコンテンツを作成した。

・勝敗グラフ
　　・例えば○●△雨だけ入力すれば、自動折れ線グラフを
　　　作成するJavaScriptアプリを作成する。

　　・当初ＥＸＣＥＬや、グラフソフトとかでグラフ書いて、
　　　それをＧＩＦに落としてＵＰしようとか考えたけど、
　　　時間掛かるし、そもそも１４０試合全部を
　　　表示してＧＩＦに変換しようとしても、
　　　数試合分がなぜかカットされる。^^);;

　　・なので、JavaScriptで作成する無謀なことを考えた。
　　　この折れ線グラフをJavaScriptで書いてあるページは
　　　探したけど無かった。そこで、どうやってやるか考えて、
　　　思いついたのが、単純にグラフをＧＩＦ画像に分解して、
　　　ＧＩＦ画像をタイル式に貼り付けて行く形態で作成。

　　☆その後、これだとグラフ以外の隙間も空白画像で埋める
　　　ので表示時間が物凄く掛かるため、
　　　ダイナミックＨＴＭＬでグラフ部分のみ画像を配置する
　　　ように書き直した。

　　☆さらに直線部分を図形用のＶＭＬで描画するバージョンも
　　　作成したが、こちらはＩＥ専用ということもあって
　　　未公開のままですね。

・ＣＳ接続奮闘記
　　　これは、広島、中日、阪神主催ゲームをＣＳ放送で
　　　ＴＶ視聴できると聞き、早速購入することにした。

　　　そこで、接続してみたら、いろいろ問題があったので

　　　それなら、その接続記なるものを書いたら、
　　　いいコンテンツになるし、今後の購入する人にも
　　　参考になるだろうということで、書いてみた。

　　☆その後の雑誌主催のＨＰコンテストで、
　　　このコンテンツがいい評価を受けたので、
　　　雑誌関係の方には、この手のコンテンツが受けるのかな。

・リンク集
　　　野球に関して、特に横浜ベイスターズを応援する
　　　ために必要なジャンル毎に分けて、リンクの許可や、
　　　相互リンクのお願いなどして、なんとか形になった。

折れ線グラフをJavaScriptで自動作成

公式戦の開幕に向けて以下のコンテンツをJavaScriptで作成した。

・勝敗グラフ

　　・例えば○●△雨だけ入力すれば、自動折れ線グラフを
　　　作成するJavaScriptアプリを作成する。

　　・当初ＥＸＣＥＬや、グラフソフトとかでグラフ書いて、
　　　それをＧＩＦに落としてＵＰしようとか考えたけど、
　　　時間掛かるし、そもそも１４０試合全部を
　　　表示してＧＩＦに変換しようとしても、
　　　数試合分がなぜかカットされる。^^);;

　　・なので、JavaScriptで作成する無謀なことを考えた。
　　　この折れ線グラフをJavaScriptで書いてあるページは
　　　探したけど無かった。そこで、どうやってやるか考えて、
　　　思いついたのが、単純にグラフをＧＩＦ画像に分解して、
　　　ＧＩＦ画像をタイル式に貼り付けて行く形態で作成。

　　☆その後、これだとグラフ以外の隙間も空白画像で埋める
　　　ので表示時間が物凄く掛かるため、
　　　ダイナミックＨＴＭＬでグラフ部分のみ画像を配置する
　　　ように書き直した。

　　☆さらに直線部分を図形用のＶＭＬで描画するバージョンも
　　　作成したが、こちらはＩＥ専用ということもあって
　　　未公開のままですね。

ゲームに挑戦

　クイズを作ったので、今度はゲーム作成に挑戦してみた。
クイズと違いゲームとなると、ある程度、動きのある
コンテンツ作成ということになる。

この時点でJavaScriptを使用しているページは、殆どがVer1.1で
新しい規格のVer1.2を扱うページは少なかったし、
見る人が使用しているブラウザも、Ver1.1しか対応していなもの
が混在していると思われるし、そもそもV1.2は難しそうだし
で、Ver1.1で作成することに。

V1.1で作るとなると、そんなに凝ったことは出来ず、
単純にアクション系のゲームがいいかなと。
どうせ作るのなら、野球関係のゲームにしよう。

ということで、頭に思い浮かんだのが「もぐらたたき」。
でも動画的なことは、とても無理なので、
叩くのは、マウスでクリックすればいいので、
そうすると、単純にボタンをクリックすればいい。

で基本構成は、ボタン内に表示する文字列を制御すれば
ＯＫかなと。これであとは、ゲーム性を持たせて
遊んでくれる人が、熱くなるような肉付けをすればよい。

ということで、応援チームとそれ以外のチーム名を表示させ、
他のチーム名をクリックすれば得点し、応援チームを
クリックすると減点。さらに監督をクリックすると
さらに＋何点、または−何点が与えられるようにした。

さらに応援チームをクリックすると、減点に加え、
ペネルティとして、数秒間、クリックできなくした。
で「クリックもぐら」と命名し公開した。

ゲーム作成自体は、タイマで制御すればいいので単純。
ところが、NetscapeとIEでボタンの表示のされかたが
違う。IEだとボタン内に表示する文字列により、
ボタンの横幅が可変になる。

まあ、勝手にゲーム的には難しくなってるんだけどね。^^);;

それと、Ｍａｃ使いの友達にＭａｃで試してもらったら、
全く動かないようだ。状況がわからないので、対処のしようが
ないので、JavaScriptの大家に質問したら、どうもＭａｃじゃ
動作しないようで、別な手段で作成することに。

これがボタンの変りに画像内でマウスイベントを取得する方法に
替えたが、こちらはこちらでマウスの表示が変るし、
クリック抜けもあるしで、積極的な公開は諦めました。