第9回 基礎プログラミングII レポート課題 氏名:久保田 瑛一郎 学籍番号:c109058 語学クラス:英語1 コース:社会福祉 1 筆記問題 AとBに解答するために、rpt_9.htmlとrpt_9.rbを作成した リンクアドレス→http://roy.e.koeki-u.ac.jp/~c109058/advertise2/rubycgi/rpt_9.html rpt_9.html 第9回 基礎プログラミング II 解説用

Q1:あなたは電子商取引(インターネットによる通信販売やオークションなど)を利用しますか?

はい いいえ

Q2:次のうち、良く使うサービスを当てはまるもの全てにチェックをいれて下さい

YAHOOオークション セブンアンドワイ/ブックス 楽天市場 AMAZON 利用しないまたはこの中からは該当項目なし

#!/usr/koeki/bin/ruby #インタプリタであることを宣言する require 'cgi' #CGIを使うということを教える cgi=CGI.new #変数CGIはCGIである print("Content-type: text/html; charest=EUC-jp\n\n") #htmlに書きこむことを宣言し、文字化け防止 riyou=cgi["yesno"] #riyouは外部データ(rpt_9.htmlで入力されたないよう)であるyesnoからとってくる doko=cgi["sarvice"] #dokoは外部データ(rpt_9.htmlで入力されたないよう)であるsarviceからとってくる print("\n") #htmlのはじまりであることを宣言する print("\n") #headのはじまりであることを宣言する print("\n") #本文のはじまりであることを宣言する print("Q1:あなたは電子商取引(インターネットによる通信販売やオークションなど)を利用しますか?\n") #質問表示 print("
\n") #改行をする printf("----%s\n",riyou) #答え表示 print("
\n") #改行をする print("Q2:次のうち、良く使うサービスを当てはまるもの全てにチェックをいれて下さい?\n") #質問表示 print("
\n") #改行をする printf("----#{cgi['c1']}、#{cgi['c2']}、#{cgi['c3']}、#{cgi['c4']}、#{cgi['c5']}") #答え表示 print("
\n") #改行をする print("\n") #本文表示 print("\n") #headの終わりであることを宣言する print("\n") #htmlの終わりであることを宣言する 以下#が用いれないhtmlのみを解説とする rbは#を解説とする Aラジオボタン でrbを使い結果を rpt_9.rbに出力する(プリンターの役目) はい などの選択肢を用い てその答えをnameである変数yesnoにいれている Bチェックボックス チェックボックスとは複数の答えを入れられる物である。したがって結果も複数 出力しなければならないが、始めは1個しか出力されず、共同学習者から「配列 に入れる」という方法を提示されたが、CGIは1回で忘れてしまうという性質から 困難ではないかと考え、インターネットで調べ以下のようにした。 YAHOOオークション セブンアンドワイ/ブックス 楽天市場 ↑ 実際にはC5まである 選択肢に適当に名前を付ける→C1、C2、C3… printf("----#{cgi['c1']}、#{cgi['c2']}、#{cgi['c3']}、#{cgi['c4']}、 #{cgi['c5']}") としてC1からC5のどの選択肢がきても出力できるようにしてい る cgi=CGI.newで宣言した変数 C●=で送信している。 送信部分と実行結果 roy{c109058}% ./rpt_9.rb [~/public_html/rubycgi] (offline mode: enter name=value pairs on standard input) yesno="はい" sarvice="AMAZON" sarvice=" 楽天市場" Content-type: text/html; charest=EUC-jp Q1:あなたは電子商取引(インターネットによる通信販売やオークションなど)を利用しますか?
----はい
Q2:次のうち、良く使うサービスを当てはまるもの全てにチェックをいれて下さい?
----、、、、
2番目の解答がきちんと表示されないがブラウザ上ではきちんと表示されるので 正しい。 参考文献 CGI Rubyでの作り方 -Bash Homepage- http://homepage2.nifty.com/BASH/WWW/ruby_make.html 2プログラム問題 プログラムでcssを表示させるため.htaccessを作成した。advertise2でrubycgi を作るのは初めてのためである。 .htaccess AddHandler cgi-script .rb Options +ExecCGI Aカウンタ Aリンクのアドレス http://roy.e.koeki-u.ac.jp/~c109058/advertise2/rubycgi/cauntar.rb B題名とその意図 題名は「こんにちはカウンターだよ!!」である。特に深い意味はないが、10人閲 覧すると「やったね!!」といってくれるところからそう名付けた。 C実行結果 、入力部分、送信結果 roy{c109058}% ./cauntar.rb [~/public_html/rubycgi] (offline mode: enter name=value pairs on standard input) Content-type: text/html; charest=EUC-jp こんにちはカウンターだよ!

あなたは現在3人目のお客様です。

roy{c109058}% ./cauntar.rb [~/public_html/rubycgi] (offline mode: enter name=value pairs on standard input) Content-type: text/html; charest=EUC-jp こんにちはカウンターだよ!

あなたは現在4人目のお客様です。

正しく表示されている。よってこのプログラムは正しい。 D解説 カウンタ自体は最所外部データを読みこむことによって今何人目なのかを示すも のである。よみこみをし、読みこんだ数字を取りだし、取りだした数字に1を加 え次の表示する数字を用意している。 またcauntar.rbの#でくわしい解説をしている cauntar.rb #!/usr/koeki/bin/ruby #インタプリタであることを宣言する require'cgi' #CGIを使うということを教える cgi = CGI.new("html4") #html4という規格のものを使って書く事を宣言する print("Content-type: text/html; charest=EUC-jp\n\n") #書きこむ 文字化け防止 #kazu = cgi["houmon"] #コメント:どうやらこれはいらないみたい tuika=0 #tuika("どんどん数をふやしていく変数)は0とする。計算のため open("dat/number.txt","r") do |kyaku| #外部データとはdatというディレクトリのnumber.txtというファイルに読みこむことを教えkyaku(内部変数)に集める while moto=kyaku.gets #取ってくることを繰り返す if/(\d+)/=~moto #もし外部データが数字だけだったら tuika=$1.to_i #その一つ目の数値を取りそれを10進数と見なし、整数に変換 end #ifのおわり end #whileのおわり end #open(読みこみ)のおわり print("\n") #htmlであることを宣言する print("\n") #head(色々なステータス情報)のはじまりであることを宣言する print("\n") #css設定 print("こんにちはカウンターだよ!\n") #タイトル表示 print("\n") #本文のはじまりであることを宣言する printf("

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

\n",tuika) #結果表示 if tuika ==10 #もし今までの閲覧者数が10人になったら print("

やったね!!10人目だ!!

\n") #コメント表示 elsif tuika==100 #もし今までの閲覧者数が100人になったら print("

やったね!!100人目だ!!ともだち100人できるかな♪~

\n") #コメント表示 end #ifのおわり print("\n") #本文の終わりであることを宣言する print("\n") #headのおわり print("\n") #htmlのおわり tuika +=1 #tuikaに次回表示用の数字を足す open("dat/number.txt","w") do |kaku| #外部データとはdatというディレクトリのnumber.txtというファイルに書きこむことを教えkaku(内部変数)に集める kaku.printf("%d\n",tuika) #●人目という書きこみ end #open(書きこみ)のおわり cauntar.css p.sikaku{ margin:20px 20px; padding:10px; border: medium solid #ff00ff } body{ background-color:#cc9966 またカウントさせるための元となる数えるデータnumbert.txtをdot(外部からの カウントをするための外部からの書込みが自由なディレクトリ)に作成した。(現 時点のカウント数が入っている) number.txt 5 参考文献 西村まどか 2010講義ノート 基礎プログラミング I 第 8 回 「電子チケットを作ろう」CSS の色見本(講義ノート)http://roy.e.koeki-u.ac.jp/~madoka/2010/r1/08/08_12_appendix_01_safecolor.html 西村まどか 2010講義ノート 基礎プログラミング II 第9回 レポート課題 カウ ンターの構造http://roy.e.koeki-u.ac.jp/~madoka/2010/r2/src/counter.rb B 計算プログラム A リンクアドレス →http://roy.e.koeki-u.ac.jp/~c109058/advertise2/rubycgi/keisan.html B 計算ロボット「計算する緒くん」 四則の計算が簡単にできるようにしてある 作成したもの keisan.html 計算をしよう!!

数字を入力してね


数字を入力してね



その数字を何算する? keisan.rb #!/usr/koeki/bin/ruby #インタプリタであることを宣言する require 'cgi' #CGIを使うことを教える cgi = CGI.new("html4") #変数CGIをCGIとする、そのときhtml4という規格で書く suuzi_a =cgi['suuzia'].to_f #外部データ(htmlに入力されたもの)にある変数suuziaをsuuzi_aに代入する。このとき10進数と見なし、小数に変換する。 suuzi_b =cgi['suuzib'].to_f #外部データ(htmlに入力されたもの)にある変数suuzibをsuuzi_bに代入する。このとき10進数と見なし、小数に変換する。 keisan =cgi['houhou'] #外部データ(htmlに入力されたもの)にある変数suuzibをsuuzi_bに代入する。 total=0 #答えを入れる変数 print("Content-type: text/html; charest=EUC-jp\n\n") if keisan=="足し算" #もし足し算が選択されていたら total=suuzi_a+suuzi_b #足し算をする elsif keisan=="引き算" #もし引き算が選択されていたら total=suuzi_a-suuzi_b #引き算をする elsif keisan=="かけ算" #もしかけ算が選択されていたら total=suuzi_a*suuzi_b #掛け算をする else keisan=="割り算" #もし割り算が選択されていたら total=suuzi_a/suuzi_b #割り算をする end #ifのおわり print("") #htmlの始まりであることを宣言する print("") #headの始まりであることを宣言する print("計算ロボット「計算する緒くん」") #headの始まりであることを宣言する print("") #本文であることを宣言する print("\n") #css設定 printf("

%dと%dを%sした結果は%4.1fである。

\n",suuzi_a,suuzi_b,keisan,total) #結果表示 print("") #本文であることを宣言する print("\n") #headのおわりであることを宣言する print("\n") #htmlのおわりであることを宣言する css body{ background-color:#33ff66 C解説 rbは#で解説しているため、htmlについてのみ解説する でここで得られた結果をkeisan.rb でうごかす(プリンターの役目) で計算したい数字を入力し てもらうが、ここで入力されたものは、suuziaという箱に入れ半角10文字以内で 入力させる suuzibも同様 その数字を何算する? optionのなかにある選択肢(かけ算、足し算など)をプルダウンで選ばせそれを houhouというはこの中に入れる。 input type="submit" value="OK">で送信をする 実行結果、入力結果 roy{c109058}% ./keisan.rb [~/public_html/rubycgi] (offline mode: enter name=value pairs on standard input) suuzia=230 suuzib=450 houhou="かけ算" Content-type: text/html; charest=EUC-jp 計算ロボット「計算する緒くん」

230と450をかけ算した結果は103500.0である。

考察 bc -lで試算する roy{c109058}% bc -l [~/public_html/rubycgi] 230*450 103500 quit よってこのプログラムは正しい D cssの着せかえ A アドレス →http://roy.e.koeki-u.ac.jp/~c109058/advertise2/rubycgi/touhyou_disorder.html B 題名:視覚障害者への文字反転機能つきオンライン投票サービス 真の国民主権を達成するには、国民による国民の国民のためになってなければいけない が視覚障害が政治参加という上で不便になる点として「投票」がある。 今回はおもに弱視のテキストの文字を拡大反転したほうが視やすい人達向けの、 しかるべきシステムを作成した。 作成したもの touhyou_disorder.html オンライン投票サービス

東北ブロック

以下の中から投票したい人を1人選んで下さい

公益党/公益ルビ緒 東北党/東北太郎 酒田いきいき党/公益ルビ子

視覚障害者向け設定


設定を有功とするには文字反転拡大にチェックを入れ、送信を押して下さい(投票はこの時点ではされません) 何もしない 文字反転拡大
touhyou_disorder.rb #!/usr/koeki/bin/ruby #インタプリタであることを宣言する require 'cgi' #CGIを使うということを教える cgi=CGI.new("html4") #変数CGIはCGIである。このときhtml4という規格に沿って書くということを宣言する touhyou=cgi['kouho'] #外部データから受け取った変数kouhoをtouhyouという変数にコピーする sikaku=cgi['tokubetu'] #外部データから受け取った変数tokubetuをsikakuという変数にコピーする print("Content-type: text/html; charest=EUC-jp\n\n") #書込みをする。文字化け防止 if sikaku=="文字反転拡大" #もしsikaku(視覚障害者対応をするかという選択肢)に文字拡大反転がはいってきたら print("\n") #htmlの始まりであることを宣言する print("\n") #headの始まりであることを宣言する print("\n") #css設定 print("オンライン投票サービス\n") #タイトル表示 print("\n") #本文の始まりであることを宣言する print("

東北ブロック

") #情報表示 print("") #ここで入力された内容はtouhyou_disorder.rb(ここ)に出力される print("

以下の中から投票したい人を1人選んで下さい

\n") #情報表示 print("
  • 公益党/公益ルビ緒\n") #これ等から一つ選ばせるようにする(ラジオボタン)ここで入力された内容はkouhoというはこに入れる print("
  • 東北党/東北太郎\n") #これ等から一つ選ばせるようにする(ラジオボタン)ここで入力された内容はkouhoというはこに入れる。なおラジオボタンを大きくすることも試みたがfirefoxはもしかしたら対象外 printf("
  • 酒田いきいき党/公益ルビ子\n") #これ等から一つ選ばせるようにする(ラジオボタン)ここで入力された内容はkouhoというはこに入れる。 print("
    ") #線を引く print("
    \n") #改行をする print("\n") #ここで送信する print("\n") #ここで登録内容をリセットする print("\n") #本文の終わりを宣言する print("\n") #headの終わりであることを宣言する print("\n") #htmlの終わりであることを宣言する else #それ以外は(視覚障害対応の必要がなければ) print("\n") #htmlのであることを宣言する print("投票が完了致しました\n") #タイトル表示 print("\n") #本文の始まりであることを宣言する printf("

    %sに投票致しました

    \n",touhyou) #結果表示 print("\n") #本文の終わりであることを宣言する print("\n") #headの終わりであることを宣言する print("\n") #htmlの終わりであることを宣言する end #ifのおわり touhyou_disorder.css body{ background-color:#000000 } body{ font-size:700%; } body{ color:#ffffff; } 実行結果 、入力部分と送信部分 roy{c109058}% ./touhyou_disorder.rb [~/public_html/rubycgi] (offline mode: enter name=value pairs on standard input) kouho="公益党/公益ルビ緒" tokubetu="何もしない" Content-type: text/html; charest=EUC-jp 投票が完了致しました

    公益党/公益ルビ緒に投票致しました

    よってこのプログラムは正常に作動している。 チェックボックスも拡大させたかったがfirefoxでは未対応? である。 各部の解説 今回touhyou_disorder.htmlのないようがtouhyou_disorder.rbとほぼ同じである ため#以降をhtmlの解説とする 今回の仕組みを解説する まずhtmlで投票する人を選んでもらうが、このときに文字反転機能を使いたい場 合には「文字反転機能」だけをチェックを入れる rbに文字反転機能が付加されたシステムを出力する そこで得られた結果(◯に投票しました!)をふたたびrbに出力する 文字反転機能を使わなければ結果をそのままrbに出力する 参考文献 スタイルシート[CSS]/テキスト・フォント/文字色を指定する - TAG index Webサイト http://www.tagindex.com/stylesheet/text_font/color.html スタイルシート[CSS]/プロパティ一覧/font-size プロパティ - TAG index Webサイト http://www.tagindex.com/stylesheet/properties/font-size.html 選択項目(ラジオボタン・チェックボックス)のサイズを変えてホームページ作 成したい http://www.1uphp.com/con1/form/sizecss.html 西村まどか 2010講義ノート基礎プログラミング II 第 9 回 「CGIことえらび」 ラジオボタンの作り方(講義ノート) http://roy.e.koeki-u.ac.jp/~madoka/2010/r2/09/09_04_theme_02_radio.html 西村まどか 2010講義ノート基礎プログラミング II 第 9 回 「CGIことえらび」 テキストフィールドの作り方(講義ノート) http://roy.e.koeki-u.ac.jp/~madoka/2010/r2/09/09_06_theme_04_textfield.html 西村まどか 2010講義ノート基礎プログラミング II 第 9 回 「CGIことえらび」 チェックボックスの作り方(講義ノート) http://roy.e.koeki-u.ac.jp/~madoka/2010/r2/09/09_05_theme_03_checkbox.html キャラクターについて 題名「エラーマンが友だちをつれて来た!」 ついにエラーもこわくなくなって来てホッとしたところエラーマンが友だちのエ ラー子ちゃんをつれて来た!! てごわくなったぞ! ちなみに前期の続きですが角は取りました。そちらのほうがかわいいので。 作り方 基本的には◯を駆使して作っただけだが最初にktermで日本語が使えるようにと addfontを忘れないようにした 1体完成してしまえばもう1体はctrlを押しながらcでコピーしctrlを押しながらv で張り付けたいところをクリックすれば張り付けられる。よってそこから色をか えた 最後にctrlを押しながらpで、このファイルのpngバージョンを作り、完成である。 もし消したいパーツがあれば矢印モードにし、選んでctrlを押しながらxである。 工夫した点 前期に作成したときは文字が見にくかったので 大きめに作ることを意識し 拝啓に色をつけることで更に見やすさをはかった。 画像のアドレスは、 http://roy.e.koeki-u.ac.jp/~c109058/advertise2/rubycgi/char_r2_c109058.png である。 これらのリンクをまとめたアドレスが http://roy.e.koeki-u.ac.jp/~c109058/advertise2/rubycgi/fork.htmlである。 fork.htmlのソース 基礎プログラミング II CGIのレポート解答のページ

    基礎プログラミング II CGIのレポート解答のページ

    キャラクター


  • 筆記問題解説用 アンケート(あまり関係ないですが)
  • カウンター
  • 計算プログラム
  • 文字拡大反転機能付オンライン投票プログラム
    感想 今回一番力を入れたプログラムは反転拡大文字機能つき投票プログラムである。 弱視の一を対象とし、作成してみたがどうしたら見やすいかというのがわからず 完全なものではない。ぜひ先生からも意見を貰えたらと思う。とはいえただの cssのきせかえだけではなく役に立つものが出来たので良かったと思う。次回も 頑張っていきたい。 共同学習者:横山 広樹、青木 千紗、小松 由里