オープンデータを使ってアプリを作ろう

アプリケーションの作成と公開をサポートするサイト

お問い合わせ

アプリ作品の情報

すべらない姫路検定

fullscreen

すべらない姫路検定問題です．

2

評価指数

1

アプリケーション

Play
JavaScript
CSS
HTML
概要
保存した実行結果

/*
This is a Example program to retrieve and display the data. 
Press the Run button on the right of the screen (described the behavior of the Example program below). 
Please create a new application rewrite this program work. 
*/
var max = 12;
var category_q_num = 4;
var count = 0;
var correct_num = 0;
var all_q_data;
var q_data;
// 間違えた答えを配列に保存
var wrong_ans = new Array;

Array.prototype.shuffle = function() {
    var i = this.length;
    while(i){
        var j = Math.floor(Math.random()*i);
        var t = this[--i];
        this[i] = this[j];
        this[j] = t;
    }
    return this;
}

function initialize(){	
	// 初期化
	count = 0;
	correct_num = 0;
	all_q_data = new Array();
	q_data = new Array();
	
	// データをLinkDataから取得 
	tmp_q_data = new Array();
	$.each(LinkData.getWorks(), function(workKey, workValue) {
	$.each(LinkData.getFiles(workValue), function(fileKey, fileValue) {
		$.each(LinkData.getSubjects(workValue, fileValue), function(subjKey, subjValue) {
			var tmp_data = {}
			tmp_data["id"] = subjValue;
			$.each(LinkData.getProperties(workValue, fileValue), function(propKey, propValue) {
				$.each(LinkData.getObjects(workValue, fileValue, subjValue, propValue), function(objKey, objValue) {
					if(propValue == "http://linkdata.org/property/rdf1s560i#question"){
						tmp_data["q"] = objValue;
					}else if(propValue == "http://linkdata.org/property/rdf1s560i#choice1"){
						tmp_data["c1"] = objValue;
					}else if(propValue == "http://linkdata.org/property/rdf1s560i#choice2"){
						tmp_data["c2"] = objValue;
					}else if(propValue == "http://linkdata.org/property/rdf1s560i#choice3"){
						tmp_data["c3"] = objValue;
					}else if(propValue == "http://linkdata.org/property/rdf1s560i#choice4"){
						tmp_data["c4"] = objValue;
					}else if(propValue == "http://linkdata.org/property/rdf1s560i#answer"){
						tmp_data["a"] = objValue;
					}else if(propValue == "http://linkdata.org/property/rdf1s560i#category"){
						tmp_data["category"] = objValue;
					}else if(propValue == "http://linkdata.org/property/rdf1s560i#kaisetsu"){
						tmp_data["detail"] = objValue;
					}
				});
			});
			tmp_q_data.push(tmp_data);
		});	
	});
	});			
	all_q_data = tmp_q_data;
	
	// TODO: カテゴリごとに出題する問題を10問選ぶ
	var data_h = new Array();
	var data_c = new Array();
	var data_l = new Array();
	all_q_data.forEach(function(e, i, a){
		if(e.category == "歴史"){
			data_h.push(e);
		}else if (e.category == "文化・スポーツ"){
			data_c.push(e);
		}else if (e.category == "生活"){
			data_l.push(e);
		}
	});
	var selected_h = random(data_h, category_q_num);
	var selected_c = random(data_c, category_q_num);
	var selected_l = random(data_l, category_q_num);
	[].push.apply(q_data, selected_h);
	[].push.apply(q_data, selected_c);
	[].push.apply(q_data, selected_l);
	q_data = q_data.shuffle();
	
	$("#contents").empty();
	var intro = "<div id='introduction'><H3>すべらない</H3><H1>姫路検定</H1><H3>あなたの姫路力をチェック！</H3><div><div>下のボタンを押して<br/>検定をはじめましょう。</div><div class='button'><input type='submit' value='スタート' onclick='next();'/></div></div></div>";
	$("#contents").append(intro);
}

function next(){
                $("#contents").empty();
                if(count < max){
                    count++;
                    var tmp_q = q_data[count-1];                    
                    var q = $("<div id='question'>"); 
                    var c = $("<h1>第<span id='count'>"+count+"</span>問</h1>");
                    var h3 = $("<h3>"+tmp_q.q+"</h3>");
                    var choices = $("<div id='choices'/>"); 
                    var choice = [$("<div><input type='radio' name='answer' value='1'>"+tmp_q.c1+"</div>"),$("<div><input type='radio' name='answer' value='2'>"+tmp_q.c2+"</div>"),$("<div><input type='radio' name='answer' value='3'>"+tmp_q.c3+"</div>"),$("<div><input type='radio' name='answer' value='4'>"+tmp_q.c4+"</div>")];
                    choice.forEach(function(e, i, a){
                        choices.append(e);        
                    });
                    var checkbtn = $("<div class='button'><input type='submit' value='解答' onclick='check()'></div>");

q.append(c);
                    q.append(h3);
                    q.append(choices);
                    q.append(checkbtn);
					$("#contents").append(q);
                }else{
                    finish();
                }  
}

function check(){
				// 解答が選択されているかチェック
				if ($("input:radio[name='answer']:checked").val()){
					// 正解をチェック
					var flg = false;
					var user_a = $("input:radio[name='answer']:checked").val();
                	var a_idx = q_data[count-1].a;
					var a_str = q_data[count-1]["c"+a_idx]
					if (user_a == a_idx){
						flg = true
					}
					
					if(flg){
						var detail_url = q_data[count-1].detail;
						$("#contents").empty(); 
						var a = $("<div id='answer'/>"); 
						a.append("正解!「<span id='correct_answer'>"+a_str+"</span>」です！");
						//正解したら間違えた答えはリセット
						wrong_ans.length =0 ;
						a.append("<div id='correct'>○</div>");
						correct_num++;
						if(detail_url.match(/(http|ftp):\/\/[!#-9A-~]+\.+[a-z0-9]+/i)){
							a.append("<div id='detail'>詳しい解説は下のリンクからどうぞ．<br/><a href='"+detail_url+"' target='_blank'>"+detail_url+"</a></div>");
						}else{
							a.append("<div id='detail'>＜出典＞<br/>"+detail_url+"</div>");
						}
                
						 if (count < max){
							a.append("<div class='button'><input type='button' value='次の問題へ' onclick='next()'></div>");
						}else{
							a.append("<div class='button'><input type='button' value='最終結果' onclick='finish()'></div>");
						}   
						$("#contents").append(a);
					}else{
						//間違えた答えを保存
						wrong_ans.push(user_a);
						//間違えたらもう一度トライ
			    		retry();
					}
				}else{
					alert("解答を選択してください");
				}
 			}
//間違えてももう一度トライ
function retry(){     
				$("#contents").empty();
				var tmp_q = q_data[count-1];                    
				var q = $("<div id='question'>");
				if (wrong_ans.length<2){
					//再挑戦一回目
					var c  = $("<div id='wrong'>よ〜く考えて</div>");
				} else if (wrong_ans.length<3){
					//再挑戦二回目
					var c  = $("<div id='wrong'>よ〜〜く考えて</div>");
				} else {
					//再挑戦三回目
					var c  = $("<div id='wrong'>よ〜〜〜く考えて</div>");
				}
				//var c = $("<h1>第<span id='count'>"+count+"</span>問</h1>");
				var h3 = $("<h3>"+tmp_q.q+"</h3>");
				var choices = $("<div id='choices'/>"); 
				var choice = [$("<div><input type='radio' name='answer' value='1'>"+tmp_q.c1+"</div>"),$("<div><input type='radio' name='answer' value='2'>"+tmp_q.c2+"</div>"),$("<div><input type='radio' name='answer' value='3'>"+tmp_q.c3+"</div>"),$("<div><input type='radio' name='answer' value='4'>"+tmp_q.c4+"</div>")];
				//間違えた選択肢は表示しない
				for(i=0 ; i<wrong_ans.length;i++){
					var del_c = wrong_ans[i];
					delete choice[del_c -1];
				};
					
				choice.forEach(function(e, i, a){
					choices.append(e);        
				});
				var checkbtn = $("<div class='button'><input type='submit' value='解答' onclick='check()'></div>");
				q.append(c);
				q.append(h3);
				q.append(choices);
 				q.append(checkbtn);
				$("#contents").append(q); 
};

function finish(){
	// TODO: レベル分け or タイプ分けをして結果を表示する
	var message;
	if (correct_num >= 10){
		message = "<h1>合格!</h1>あなたの姫路力、すばらしいですね！<br/>ぜひ横浜の魅力を色んな人に<br/>伝えてくださいね。";
	}else if (correct_num >= 8 && correct_num < 10){
		message = "<h1>合格!</h1>さすが、よくご存知ですね。<br/>これからももっと横浜を<br/>楽しんでくださいね。";
	}else if (correct_num >= 5 && correct_num < 8){
		message = "<h1>惜しい！</h1>もう少しで合格です。<br/>さらに上を目指して、資料館や博物館で<br/>学んでみてください。";
	}else{
		message = "<h1>がんばろう</h1>とりあえず姫路で食べて遊んで<br/>姫路を好きになってくださいね。";
	}
	
	$("#contents").empty(); 
	$("#contents").append("<div id='result'><h3>検定結果</h3><h2><span id='correct_num'>"+max+　"問中 "+correct_num+"問 </span>正解</h2><div class='message'>"+message+"</div></div>");
	$("#contents").append("<div class='button'><input type='button' value='もう一度挑戦する' onclick='initialize()'></div>");
}

window.onload = function() {
    $(function(){
    	initialize();        
    });	
};

function random(array, num) {	// http://d.hatena.ne.jp/miya2000/20080607/p0
    var a = array;
    var t = {};
    var r = [];
    var l = a.length;
    var n = num < l ? num : l;
    while (n-- > 0) {
        var i = Math.random() * l | 0; // http://d.hatena.ne.jp/amachang/20070813/1186980089
        r[n] = t[i] || a[i];
        --l;
        t[i] = t[l] || a[l];
    }
    return r;
}

Initial content

このアプリをForkして新しいアプリを作るダウンロード

このアプリ作品をwebから探す

作者メッセージ送信	Atsuko_Takano
共同編集者	曽我部慎之介
Fork元のアプリ	松本豊 's すべらない横浜検定
実行回数	203
ウェブサイト	http://www.himeji-cci.or.jp/test/index.html
ライセンス
Fork count	0
作成日	2015年10月14日
最終更新日	2015年12月2日

Fork元のアプリ

すべらない横浜検定作者: 松本豊更新日: 2013年2月13日 658 回実行

入力データ
関連アイデア

このアプリ作品で入力データとして使われているデータ作品のリストです。
チェックボックスの選択を変更すると、入力データを変更して実行することができます。

横浜検定問題・解答集作者: Sayoko Shimoyama 更新日: 2015年2月9日
3548 ダウンロード
,

8 アプリケーション

yokohama_quiz
自分のデータを入力する

ニュースフィード

linkdata.org に関するツイート