触読点字 e-learning 問題の作成方法
2010 年 8 月 3 日
神戸大学大学院医学研究科 内科系講座小児科学分野
ゲノム医療実践学部門

触読点字 e-learning 問題の作成方法
この文書では、触読点字 e-learning の問題ページの作成方法を説明します。

１．ファイル構成
触読点字 e-learning が使用するファイルと保存先フォルダは、以下の通りです。
（１）出題ページ「q」フォルダ（２）正解ページ「t」フォルダ（３）不正解ページ「f」フォルダ（４）解答解説ページ 「a」フォルダ（５）問題の点字画像 「illust」フォルダ（６）JavaScript ファイル (list.js)

トップフォルダ

フォルダ構成は、下図のようになります。

触読点字 e-learning 問題の作成方法
2010 年 8 月 3 日
神戸大学大学院医学研究科 内科系講座小児科学分野
ゲノム医療実践学部門

２．ファイル群の作成
ここでは、「mondai01」という名前で新しい問題を作成する例を示します。
2.1 出題ページの作成
出題ページは、「q」フォルダ内に「q+問題の名前.html」というファイル名で保存します。
出題ページの例を以下に示します。問題毎に変更が必要な部分を赤字で示します。
(q¥qmondai01.html)<html><head><title>点字 e-learning - 問題</title><style type="text/css" media="screen"><!-.button { font-size: 32pt }.button2 { font-size: 24pt; width:270px;background-color: white;}body{background-color: #000000;color: #FFFFFF;}--></style><script type="text/javascript" src="../list.js"></script><script type="text/javascript"><!-var q="mondai01";
var a="";
function set_a(ans, n){document.getElementById("btn1").style.backgroundColor="#C0C0C1";
document.getElementById("btn1").style.fontSize="32pt";
document.getElementById("btn2").style.backgroundColor="#C0C0C1";
document.getElementById("btn2").style.fontSize="32pt";
document.getElementById("btn3").style.backgroundColor="#C0C0C1";
document.getElementById("btn3").style.fontSize="32pt";
document.getElementById("btn4").style.backgroundColor="#C0C0C1";
document.getElementById("btn4").style.fontSize="32pt";
document.getElementById("radio1").checked=false;
document.getElementById("radio2").checked=false;
document.getElementById("radio3").checked=false;
document.getElementById("radio4").checked=false;
if((5-n) * n > 0){
document.getElementById("btn"+n).style.backgroundColor="#FFFF00";
document.getElementById("btncheck").style.backgroundColor="#FFFFFF";
document.getElementById("radio"+n).checked=true;
document.getElementById("radio"+n).checked=true;}else{
document.getElementById("btncheck").style.backgroundColor="#808080";}
a=ans;
return 0;}
BMSendMessage(“111100_010001”);
function go(){if(a != ''){
location.href="../"+a+"/"+a+q+".html";}}
document.onkeydown=documentKeyDown;//--></script></head><body><table summary="table" width="900" style="border:none" cellspacing="0" cellpadding="0"><tr><td colspan="4"><div style="text-align:center"><span style="font-size: 32pt">なんと読むでしょうか？</span></div>
</td>
</tr>
<tr>

触読点字 e-learning 問題の作成方法
2010 年 8 月 3 日
神戸大学大学院医学研究科 内科系講座小児科学分野
ゲノム医療実践学部門<td colspan="4"><div style="text-align:center"><img src="../illust/111100_010001.jpg" alt="" width="496" height="331" style="border:none"></div><p> .</p>
</td>
</tr>
<tr>
<td style="width:225px"><div style="text-align:center"><input type="radio" id="radio1" name="radiogroup" onclick="set_a('t', '1')" value="1"></div></td><td style="width:225px"><div style="text-align:center"><input type="radio" id="radio2" name="radiogroup" onclick="set_a('f', '2')" value="1"></div></td><td style="width:225px"><div style="text-align:center"><input type="radio" id="radio3" name="radiogroup" onclick="set_a('f', '3')" value="1"></div></td><td style="width:225px"><div style="text-align:center"><input type="radio" id="radio4" name="radiogroup" onclick="ｓet_a('f', '4')" value="1"></div></td>
</tr>
<tr>
<td valign="top"><div style="text-align:center"><input id="btn1" class="button" onclick="set_a('t', '1')" type="button"
value="1. 数字 5 " tabindex="1" accesskey="1"></div></td><td valign="top"><div style="text-align:center"><input id="btn2" class="button" onclick="set_a('f', '2')" type="button"
value="2. 数字 6 " tabindex="2" accesskey="2"></div></td><td valign="top"><div style="text-align:center"><input id="btn3" class="button" onclick="set_a('f', '3')" type="button"
value="3. 数字 7 " tabindex="3" accesskey="3"></div></td><td valign="top"><div style="text-align:center"><input id="btn4" class="button" onclick="set_a('f', '4')" type="button"
value="4. 数字 8 " tabindex="4" accesskey="4"></div></td>
</tr>
<tr>
<td><span style="font-size: 32pt">数字 5</span></td><td> <span style="font-size: 32pt">数字 6</span></td><td> <span style="font-size: 32pt">数字 7</span></td><td> <span style="font-size: 32pt">数字 8</span></td></tr></table><br><table summary="table" style="border:none" width="900"><tr><td style="width:300px"><input type="button" id="btncheck" class="button2" onclick="go()"value="答えをチェック" tabindex="9" accesskey="Z"></td><td style="width:300px"><div style="text-align:center"><input type="button" id="btnreset" class="button2" onclick="set_a('', 0)"value="リセット" tabindex="10" accesskey="X"></div></td><td style="width:300px"><div style="text-align:center"><input type="button" id="btnexit" class="button2" onclick="go_exit()"tabindex="11" accesskey="C" value="終了"></div></td></tr></table><script type="text/javascript"><!--set_a("", 0);//--></script></body></html>触読点字 e-learning 問題の作成方法
2010 年 8 月 3 日
神戸大学大学院医学研究科 内科系講座小児科学分野
ゲノム医療実践学部門
問題ごとに変更する箇所

説明var q="mondai01";

問題のファイル群の名称を設定します。

BMSendMessage("111100_010001");

点字ディスプレイドライバに送信するビットパターンを設定します。詳細はAPI仕様書を参照ください。

<img src="../illust/111100_010001.jpg"

問題の点字画像ファイルを指定します。

onclick="set_a('t', '1')"

正解の選択肢には"t"を、不正解の選択肢には"f"を記述します。 (8箇所)value="1.

回答選択ボタンに表示する文字を設定します。(4箇所)

5"<td><span style="font-size: 32pt">数字5</span></td>

回答選択肢を記述します。(4箇所)

2.2 正解ページの作成
正解ページは、「t」フォルダ内に「t+問題の名前.html」というファイル名で保存します。
ファイルの内容は変更不要です。
（t¥tmondai01.html）<html><head><title>点字 e-learning</title><style type="text/css" media="screen"><!-.button { font-size: 32pt }.button2 { font-size: 24pt; width:270px;background-color: white;}body{background-color: #000000;
color: #FFFFFF;}--></style><script type="text/javascript" src="../list.js" ></script><script type="text/javascript"><!-BMSendMessage("000000");
document.onkeydown=documentKeyDown;
read_cookie();//--></script></head><body><table summary="正解" width="900" style="border:none"><tr><td colspan="2"><div style="text-align:center"><span style="font-size:32pt">正 解！！</span></div>
</td>
</tr>
<tr>
<td colspan="2"><div style="text-align:center;margin:50px;0"><img src="../illust/o.JPG" alt=""
width="350" height="270" style="border:none"></div></td>
</tr>
<tr>
<td align="center"><input id="btnnext" class="button2" onclick="javascript:nxt()" onkeypress=""
type="button" value="次の問題へ" tabindex="1" accesskey="Z"></td><td align="center"><input class="button2" onkeypress="" id="btnexit" onclick="go_exit()"tabindex="3" type="button" value="終了" accesskey="C"></td></tr></table></body></html>触読点字 e-learning 問題の作成方法
2010 年 8 月 3 日
神戸大学大学院医学研究科 内科系講座小児科学分野
ゲノム医療実践学部門
2.3 不正解ページの作成
不正解ページは、「f」フォルダ内に「f+問題の名前.html」というファイル名で保存します。
不正解ページの例を以下に示します。問題毎に変更が必要な部分を赤字で示します。
（f¥fmondai01.html）<html><head><title>点字 e-learning</title><style type="text/css" media="screen"><!-.button { font-size: 32pt }.button2 { font-size: 24pt; width:270px;background-color: white;}body{background-color: #000000;
color: #FFFFFF;}--></style><script type="text/javascript" src="../list.js"></script><script type="text/javascript"><!-BMSendMessage("000000");
document.onkeydown=documentKeyDown;//--></script></head><body bgcolor="black" text="white"><script type="text/javascript" src="../list.js"></script><table width="900" border="0" cellspacing="0" cellpadding="0"><tr><td colspan="3"><div align="center"><font size="7">不正解！！</font></div>
</td>
</tr>
<tr>
<td colspan="3"><div align="center" style="margin: 50px 0px"><img src="../illust/x.JPG" alt=""
width="349" height="269" border="0"></div></td>
</tr>
<tr>
<td><input id="btnredo" class="button2"
onclick="location.href='../q/qmondai01.html'" onkeypress="" type="button"
value="問題をやり直す" tabindex="1" accesskey="Z"></td><td><input id="btnanswer" class="button2"
onclick="location.href='../a/amondai01.html'" onkeypress="" type="button"
value="解答へ" tabindex="2" accesskey="X"></td><td><input onkeypress="" id="btnexit" class="button2" onclick="go_exit()" tabindex=3 type=button
value="終了" tabindex="3" accesskey="C"></td></tr></table></body></html>問題ごとに変更する箇所

説明

onclick="location.href='../q/qmondai01.html'"

出題ページのファイル名を設定します。

onclick="location.href='../a/amondai01.html'"

解答解説ページのファイル名を指定します。

触読点字 e-learning 問題の作成方法
2010 年 8 月 3 日
神戸大学大学院医学研究科 内科系講座小児科学分野
ゲノム医療実践学部門
2.4 解答解説ページの作成
解答解説ページは、「a」フォルダ内に「a+問題の名前.html」というファイル名で保存します。
解答解説ページの例を以下に示します。問題毎に変更が必要な部分を赤字で示します。
（a¥amondai01.html）<html><head><script type="text/javascript" src="../list.js"></script><title>点字 e-learning - 正解</title><style type="text/css" media="screen"><!-.button { font-size: 32pt }.button2 { font-size: 24pt; width:270px;background-color: white;}body{background-color: #000000;
color: #FFFFFF;}--></style><script type="text/javascript"><!-BMSendMessage("111100_010001");
document.onkeydown=documentKeyDown;//--></script></head><body><p id="cs" style="position:absolute; width:1px; height: 1px">.
</p><table summary="正解" style="width:900;border:none;" cellspacing="0" cellpadding="0"><tr><td colspan="2" style="font-size: 32pt; text-align:center">［ 解 答 ］<br>
正解は</td></tr><tr><td style="width:330;text-align:center" valign="middle"><span style="font-size:120pt"> 数字５</span></td><td style="width:570"><img src="../illust/111100_010001.jpg" alt="" width="248" height="331" style="border:0">
</td>
</tr>
</table><br><table style="width:900;border:none;" summary="ボタン"><tr><td align="center"><input class="button2" id="btnnext" onclick="nxt()"
onkeypress="" type="button" value="次の問題へ" tabindex="1" accesskey="Z"></td><td align="center"><input class="button2" id="btnexit" onclick="go_exit()"onkeypress="" tabindex="2" type="button" value="終了" accesskey="C"></td></tr></table></body></html>触読点字 e-learning 問題の作成方法
2010 年 8 月 3 日
神戸大学大学院医学研究科 内科系講座小児科学分野
ゲノム医療実践学部門

問題ごとに変更する箇所

説明

BMSendMessage("111100_010001");

点字ディスプレイドライバに送信するビットパターンを設定します。詳細はAPI仕様書を参照ください。

<span style="font-size:120pt"> 数字５</span>

正解を記述します。

<img src="../illust/111100_010001.jpg"

問題の点字画像ファイルを指定します。

触読点字 e-learning 問題の作成方法
2010 年 8 月 3 日
神戸大学大学院医学研究科 内科系講座小児科学分野
ゲノム医療実践学部門
2.5 list.js の編集
JavaScript ファイル list.js に、作成した問題を登録します。
list.js ファイルをメモ帳などで開きます。以下に、list.js ファイルの冒頭を示します。
var i=0;// 実装する最大レベルを記述
var MAX_LEVEL = 6;
var LV=0;// 各レベルの出題フラグ。1: 出題する Q_RANGE[0]は未使用（レベル 0 に対応）
var Q_RANGE = [0,0,0,0,0,0,0,0,0,0];// questions[]変数には出題点字コードを格納
var questions=[0];// 音声を再生するかどうかの変数。1=play (default)
var playsound = 0;// qlv[]変数には、その問題の出題レベルを格納(最低 1。0 を設定すると絶対に出題しない)
var qlv=[0];qlv[i] = 2; questions[i++]="000001";
qlv[i] = 3; questions[i++]="000010";
qlv[i] = 2; questions[i++]="000011";（中略）
qlv[i] = 5; questions[i++]="sen01";

qlv[i] = ~ と記述されている行の末尾に、以下の 1 行を追加します。
qlv[i] = 1; questions[i++]="mondai01";

qlv[i] = 1; は問題の種類を設定します。この例では、作成した問題の出題レベルを１ （数字）に設定しています。
qlv[i]の設定値と問題の種類の対応は、下表の通りです。
qlv[i]の設定値

問題の種類

1

数字

2

ひらがな５０音

3

濁音、半濁音、特殊記号4

アルファベット5

ひらがな文