第 9 回 ことえらび レポート課題 氏名:夏井 知恵子 学籍番号:c1101655 語学クラス:英語クラス6 コース:政策マネジメント 1.筆記問題 A.ラジオボタンとは、選択肢の中から1つだけ回答を選ぶしくみである。 ラジオボタンの作り方は今回の講義で使用したものを例に挙げると、 自由席 となる。type="radio"とすることでラジオボタンを使うことを宣言する。 また、name="seat"の"seat"はCGIスクリプトに引き渡す時にnameの違う 複数のラジオボタンと区別するために使う名称である。 value="自由席"の"自由席"はCGI変数の値である。これが選択された場合、 プログラムに送られる。 参考文献 http://roy/~madoka/2011/r2/09/r2_09_04_theme_04_radio.html 基礎プログラミング II 第 9 回 (ことえらび) 「ラジオボタンの作り方」 西村まどか B.チェックボックスはラジオボタンとは違い、複数の選択肢を選択することが可 能である。 チェックボックスの作り方は今回の講義で使用したものを例に挙げると、 つや姫 となる。type="checkbox"とすることでチェックボックスを使うことを宣言する。 name="rice"の"rice"とは、CGIスクリプトに引き渡す時にnameの違う 複数のチェックボックスと区別するために使う名称である。 value="米"の"米"はCGI変数の値である。これが選択された場合、プログラムに 送られる。 参考文献 http://roy/~madoka/2011/r2/09/r2_09_05_theme_05_checkbox.html 基礎プログラミング II 第 9 回 (ことえらび) 「チェックボックスの作り方」 西村まどか C.基礎プログラミングキャラクタ(char_r2_c110165.png) キャラクタ名 : 微笑む葡萄 キャラクタ解説:葡萄は実をたくさんつけるので、私もこのプログラミングの授 業を通して、多くのことを身に付けられればという願いを込めて作成した。 葡萄に顏を付けたのは単に可愛さを出したかったからである。 作った方法:円や四角形を描くツールを使って描いた。 工夫した点:複製を使ってぶどうの実に色を付けた点。 基礎プログラミングキャラクタ掲載ページ http://roy/~c110165/advertise2/char_r2_c110165.png 2.プログラム問題 <> i. 考えた設定 自分のwebサイトに訪れた人数を数えるプログラム。 ii. 作成したプログラム(counter.rb) #!/usr/bin/env ruby require 'cgi' # CGI の使用を宣言 cgi = CGI.new("html4") # CGI に変数を入れる。バージョン4 print("Content-type: text/html; charset=EUC-JP\n\n") # 日本語コードの定義 number = 0 #初期値を0と設定 open("number.txt","r") do |read| # openで "number.txt" を開いて "r" でデータを読みこむ。 while data = read.gets # 読みこんだデータを "read" にしまう。 if /(\d+)/ =~ data # data 変数に number.txt からデータを持って来る。 number = $1.to_i end # ifの終わり end # whileの終わり end # open do の終わり print("\n") # 以下htmlで表示される部分 print("\n") print("カウンター\n") # タイトル print("\n") # counter.css というスタイルシートを使う print("\n") # print("\n") # 以下、本文 print("

Welcome!!

\n") printf("

あなたは %d 人目 のお客様です

\n", number) #人数を表示 print("\n") print("\n") number += 1 # numberに1足す open("number.txt","w") do |write| # counter.txtに書きこむ。 write.printf("%d\n",number) # 書きこむ内容は number に代入。 end # open do 終わり ---入力部分---(counter.html) カウンタ #タイトル #fork.cssというスタイルシートを使用する #本文開始

ここに訪れた人の人数が分かります。

# 出力先をcounter.rbと指定 #出力先へ移動
iii.もとにしたプログラム 基礎プログラミング II 第 9 回 「ことえらび」 レポート課題 のカウンタ例を 参考にプログラムを作成した。 iv.実行結果 Ktermで実行してみると pan{c110165}% ./counter.rb [~/public_html/advertise2/rubycgi] (offline mode: enter name=value pairs on standard input) Content-type: text/html; charset=EUC-JP カウンター

Welcome!!

あなたは 7 人目 のお客様です

もう一度実行してみると pan{c110165}% ./counter.rb [~/public_html/advertise2/rubycgi] (offline mode: enter name=value pairs on standard input) Content-type: text/html; charset=EUC-JP カウンター

Welcome!!

あなたは 8 人目 のお客様です

v.考察 ivの実行結果からも分かるように、実行の回数を重ねると人数が増えている。 よって、カウンタのプログラムは正しく作動している。 なぜ、カウンタが動くかというと、counter.rb で指定されたテキストファイル が counter.rbの実行する度に1を足したものに書き換えられているからである。 この書き換えをWEB上の第三者でも可能にするために、テキストファイルの属性 をKterm上で chmod o+w number.txt と入力し -rw-r--rw-と変更した。 この操作により、カウンタが動くことが可能となる。 vi.参考文献 基礎プログラミング II 第 9 回 (ことえらび) 「ファイルを使ってみよう」 http://roy/~madoka/2011/r2/09/r2_09_08_theme_08_hashfile.html 西村まどか vii. このプログラムの掲載ページ http://roy/~c110165/advertise2/rubycgi/fork.html <> i. 考えた設定 web上で四則演算が出来るプログラム。 ii. 作成したプログラム(keisan.rb) #!/usr/bin/env ruby $KCODE = 'e' # 日本語を使う宣言 require 'cgi' # CGI の使用を求める cgi = CGI.new("html4") # CGI という Hash をつくり、 # HTMLで入力されたものが cgi に代入される # これらを HTML 文書で使う print("Content-type: text/html; charset=EUC-JP\n\n") # 日本語コードにする s1 = cgi["suti1"] # s1 に CGI でもらった値 suti1 を代入する s2 = cgi["suti2"] # s2 に CGI でもらった値 suti2 を代入する k = cgi["keisan"] # k に CGI でもらった値 keisan を代入する print("\n") #以下 html で表示される部分 print("\n") print("計算結果\n") print("\n") # keisan という css を使う print("\n") print("\n") if k == "tasu" # k が "tasu" だったら a = s1.to_i + s2.to_i # s1 + s2 をする elsif k == "hiku" # k が "hiku" だったら a = s1.to_i - s2.to_i # s1 - 2 をする elsif k == "kakeru" # k が "kakeru" だったら a = s1.to_i * s2.to_i # s1 * s2 をする else # k が 上記以外 だったら a = s1.to_f / s2.to_f # s1 / s2 をする end print("

計算結果

\n") # 以下、計算結果の表示 if k == "tasu" # k が "tasu" だったら printf("

%d + %d = %d

\n",s1 ,s2 ,a) #上で計算された結果を表示する elsif k == "hiku" # k が "hiku" だったら printf("

%d - %d = %d

\n",s1 ,s2 ,a) #上で計算された結果を表示する elsif k == "kakeru" # k が "kakeru" だったら printf("

%d * %d = %d

\n",s1 ,s2 ,a) #上で計算された結果を表示する else # k が 上記以外 だったら printf("

%d / %d = %11.2f

\n",s1,s2,a.to_f) #上で計算された結果を表示する end print("\n") print("\n") ---入力部分--(keisan.html) 計算 #このページのタイトル #fork.cssというスタイルシートを使う #本文

計算プログラム

#cgiで入力された値をkeisan.rbで使う

    数値 #テキストボックスをつくり、入力出来る文字を最大で10文字とした

    数値 #テキストボックスをつくり、入力出来る文字を最大で10文字とした

    + #ラジオボタンの作成 - #ラジオボタンの作成 × #ラジオボタンの作成 ÷ #ラジオボタンの作成

    #入力された値を送る #リセットする

    iii. もとにしたプログラム 基礎プログラミング II 第 9 回 (ことえらび) 「ラジオボタンの作り方」 基礎プログラミング II 第 9 回 (ことえらび) 「テキストエリアの作り方」 等を参考に作成した。 iv.プログラムを実行した結果画面 <足し算> pan{NATSUI Chieko}% ./keisan.rb [~/public_html/advertise2/rubycgi] (offline mode: enter name=value pairs on standard input) "suti1" = 10 "suti2" = 5 "keisan" = "tasu" Content-type: text/html; charset=EUC-JP 計算結果

    計算結果

    10 + 5 = 15

    <引算> pan{NATSUI Chieko}% ./keisan.rb [~/public_html/advertise2/rubycgi] (offline mode: enter name=value pairs on standard input) "suti1" = 10 "suti2" = 5 "keisan" = "hiku" Content-type: text/html; charset=EUC-JP 計算結果

    計算結果

    10 - 5 = 5

    <掛け算> pan{NATSUI Chieko}% ./keisan.rb [~/public_html/advertise2/rubycgi] (offline mode: enter name=value pairs on standard input) "suti1" = 10 "suti2" = 5 "keisan" = "kakeru" Content-type: text/html; charset=EUC-JP 計算結果

    計算結果

    10 * 5 = 50

    <割り算> pan{NATSUI Chieko}% ./keisan.rb [~/public_html/advertise2/rubycgi] (offline mode: enter name=value pairs on standard input) "suti1" = 10 "suti2" = 5 "keisan" = "waru" Content-type: text/html; charset=EUC-JP 計算結果

    計算結果

    10 / 5 = 2.00

    v.考察 bc -l を使い、この計算結果が正しいかどうか確かめ算を行った。 pan{c110165}% bc -l [~/public_html/advertise2/rubycgi] 10 + 5 15 10 -5 5 10 * 5 50 10 / 5 2.00000000000000000000 この計算結果がプログラムの計算結果と一致していた。 よって、このプログラムは正しく作動していると言える。 vi. 参考文献 基礎プログラミング II 第 9 回 (ことえらび) 「ラジオボタンの作り方」 http://roy/~madoka/2011/r2/09/r2_09_04_theme_04_radio.html 西村まどか 基礎プログラミング II 第 9 回 (ことえらび) 「テキストエリアの作り方」 http://roy/~madoka/2011/r2/09/r2_09_07_theme_07_textarea.html 西村まどか vii. このプログラムの掲載ページ http://roy/~c110165/advertise2/rubycgi/fork.html 計算機 <> i.考えた設定 webページの色をユーザの選択によって、変えることが出来るプログラム。 ii.作成したプログラム(color.rb) #!/usr/bin/env ruby require 'cgi' # CGI の使用を求める cgi = CGI.new("html4") # CGI という Hash をつくり、 # HTMLで入力されたものが cgi に代入される # これらは HTML 文書で使う print("Content-type: text/html; charset=EUC-JP\n\n") # 日本語コードにする color = cgi["color"] # 受け取ったデータをcolorに代入 print("\n") print("\n") print("きせかえ完了\n") #タイトル if color == "red" #color が "red" だったら print("\n") # iro1.css というスタイルシートを利用し、ページを赤に変える print("

    赤になりました

    \n") print("

    違う色も試してみませんか?\n") print("

    \n") print("
    \n") #入力されたものをkisekae.rbに送信することを指定する print("
      \n") print("

      \n") print(" 赤\n") #ラジオボタンを作成 print(" 青\n") #ラジオボタンを作成 print(" 黄色\n") #ラジオボタンを作成 print(" 緑\n") #ラジオボタンを作成 print("

      \n") print("

      \n") print("\n") #入力したものを指定した送信先へ送信する print("\n") #入力したものをリセットする print("

      \n") print("\n") elsif color == "blue" #color が "blue" だったら print("\n") # iro2.css というスタイルシートを利用し、ページを青に変える print("

      青になりました

      \n") print("

      違う色も試してみませんか?\n") print("

      \n") print("
      \n") #入力されたものをkisekae.rbに送信することを指定する print("
        \n") print("

        \n") print(" 赤\n") #ラジオボタンを作成 print(" 青\n") #ラジオボタンを作成 print(" 黄色\n") #ラジオボタンを作成 print(" 緑\n") #ラジオボタンを作成 print("

        \n") print("

        \n") print("\n") #入力したものを指定した送信先へ送信する print("\n") #入力したものをリセットする print("

        \n") print("\n") elsif color == "yellow" #color が "yellow" だったら print("\n") # iro3.css というスタイルシートを利用し、ページを黄色に変える print("

        黄色になりました

        \n") print("

        違う色も試してみませんか?\n") print("

        \n") print("
        \n") #入力されたものをkisekae.rbに送信することを指定する print("
          \n") print("

          \n") print(" 赤\n") #ラジオボタンを作成 print(" 青\n") #ラジオボタンを作成 print(" 黄色\n") #ラジオボタンを作成 print(" 緑\n") #ラジオボタンを作成 print("

          \n") print("

          \n") print("\n") #入力したものを指定した送信先へ送信する print("\n") #入力したものをリセットする print("

          \n") print("\n") else #color が "green" だったら print("\n") # iro4.css というスタイルシートを利用し、ページを緑に変える print("

          緑になりました

          \n") print("

          違う色も試してみませんか?\n") print("

          \n") print("
          \n") #入力されたものをkisekae.rbに送信することを指定する print("
            \n") print("

            \n") print(" 赤\n") #ラジオボタンを作成 print(" 青\n") #ラジオボタンを作成 print(" 黄色\n") #ラジオボタンを作成 print(" 緑\n") #ラジオボタンを作成 print("

            \n") print("

            \n") print("\n") #入力したものを指定した送信先へ送信する print("\n") #入力したものをリセットする print("

            \n") print("\n") end print("\n") print("\n") ---入力部分---(kisekae.html) きせかえプログラム<title> #タイトル <link rel="stylesheet" type="text/css" href="kisekae.css"> #kisekae.cssというスタイルシートを使用する <head> <body> <h2>きせかえプログラム</h2> <br> <h3>どの色に変えますか?</h3> <form method="POST" action="./kisekae.rb"> #入力結果の送信先をkisekae.rbと指定 <ul> <p> <input type="radio" name="color" value="red"> 赤 #ラジオボタンの作成 # name="color" は hash でいう key の部分に相当する # value="red" は hash でいう value の部分に相当し、この値がプログラム に送られる <input type="radio" name="color" value="blue"> 青 #ラジオボタンの作成 # name="color" は hash でいう key の部分に相当する # value="blue" は hash でいう value の部分に相当し、この値がプログラム に送られる <input type="radio" name="color" value="yellow"> 黄色 #ラジオボタンの作成 # name="color" は hash でいう key の部分に相当する # value="yellow" は hash でいう value の部分に相当し、この値がプログラム に送られる <input type="radio" name="color" value="green"> 緑 #ラジオボタンの作成 # name="color" は hash でいう key の部分に相当する # value="green" は hash でいう value の部分に相当し、この値がプログラム に送られる </p> <p> <input type="submit" value="Change!"> #入力された結果を指定された送信先に送る <input type="reset" value="変えない"> #入力されたものをリセットする </p> </form> </body> </html> iii.もとにしたプログラム 去年の先輩のレポートの着せ変えプログラムを参考にしました。 変更点として、このプログラムでは色をユーザが変更したあとでも更に変更する ことが出来るようにしました。 iv.実行結果 赤に変える場合 pan{c110165}% ./kisekae.rb [~/public_html/advertise2/rubycgi] (offline mode: enter name=value pairs on standard input) "color" = "red" Content-type: text/html; charset=EUC-JP <html> <head> <title>きせかえ完了

            赤になりました

            違う色も試してみませんか?

              赤 青 黄色 緑

              青に変える場合 pan{c110165}% ./kisekae.rb [~/public_html/advertise2/rubycgi] (offline mode: enter name=value pairs on standard input) "color" = "blue" Content-type: text/html; charset=EUC-JP きせかえ完了

              緑になりました

              違う色も試してみませんか?

                赤 青 黄色 緑

                黄色に変える場合 pan{c110165}% ./kisekae.rb [~/public_html/advertise2/rubycgi] (offline mode: enter name=value pairs on standard input) "color" = "yellow" Content-type: text/html; charset=EUC-JP きせかえ完了

                黄色になりました

                違う色も試してみませんか?

                  赤 青 黄色 緑

                  黄色に変える場合 pan{c110165}% ./kisekae.rb [~/public_html/advertise2/rubycgi] (offline mode: enter name=value pairs on standard input) "color" = "green" Content-type: text/html; charset=EUC-JP きせかえ完了

                  緑になりました

                  違う色も試してみませんか?

                    赤 青 黄色 緑

                    v.考察 プログラム通りに作動したので、このプログラムは正しいと言える。 vi.参考文献 2010年 第9回 基礎プログラミング II レポート課題 http://roy/~madoka/2010/r2/09/rpt/c109074.txt 酒井 春香 vii. このプログラムの掲載ページ http://roy/~c110165/advertise2/rubycgi/fork.html 何色にする? 3.感想 今回のプログラムは作成にとても時間がかかった。 スペースの空け忘れなど、少しのタイプミスでもエラーとなってしまうため、大 変だった。 Tgifを今回初めて使用し、使いこなすのが難しかった。また、絵心が無い私に は作成するキャラクタを決めてから描くまでが大変だったが、なんとか形になって 良かった。