-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathhang.html
432 lines (411 loc) · 18.3 KB
/
hang.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<meta name="twitter:card" content="summary" />
<meta name="twitter:site" content="なっかのう" />
<meta name="twitter:title" content="瞬間韓単語" />
<meta name="twitter:description" content="韓国語力を向上するページです。" />
<meta name="twitter:image" content="https://flashkorean.herokuapp.com/kantan.png" />
<meta name="twitter:url" content="https://flashkorean.herokuapp.com/hang.html" />
<title>瞬間韓単語</title>
<style>
body{
margin: 20px; /* bodyの外側の余白を指定する */
padding: 50px 10px 50px 10px; /* bodyの内側余白を指定する(上:右:下:左) */
background-color:#eeeeee;
}
.Header {
position: fixed; /* ヘッダーを固定する */
top: 0; /* 上部から配置の基準位置を決める */
left: 0; /* 左から配置の基準位置を決める */
width: 100%; /* ヘッダーの横幅を指定する */
height: 35px; /* ヘッダーの高さを指定する */
padding: 10px; /* ヘッダーの余白を指定する(上下左右) */
background-color: #333333; /* ヘッダーの背景色を指定する */
color: #ffffff; /* フォントの色を指定する */
font-size:150%;
}
.Contents {
width: 100%; /* コンテンツの横幅を指定する */
overflow: auto; /* コンテンツの表示を自動に設定（スクロール） */
}
.box11{
padding: 0.5em 1em;
margin: 2em 0;
color: #4a4d5e;
background: white;
border-top: solid 5px #5d627b;
box-shadow: 0 3px 5px rgba(0, 0, 0, 0.22);
}
.box11 p {
margin: 0;
padding: 10px;
}
.box12{
display:none;
padding: 0.5em 1em;
margin: 2em 0;
color: #4a4d5e;
background: white;
border-top: solid 5px #5d627b;
box-shadow: 0 3px 5px rgba(0, 0, 0, 0.22);
}
.box12 p {
margin: 0;
padding: 10px;
}
.center{
text-align:center;
}
input[type="text"]{
outline: none;
border: 1px solid #aaa;
-webkit-transition: all .3s;
transition: all .3s;
width:70%;
text-align:center;
height:25px;
font-size:20px;
}
input[type="text"]:focus{
box-shadow: 0 0 7px #1abc9c;
border: 1px solid #1abc9c;
}
#moji{
border-radius: 3px ;
padding: 5px;
background-color: skyblue;
}
.btn-push {
display: inline-block;
max-width: 180px;
text-align: left;
background-color: #1abc9c;
font-size: 16px;
color: #FFF;
text-decoration: none;
font-weight: bold;
padding: 10px 24px;
border-radius: 4px;
border-bottom: 4px solid #1add9c;
}
.btn-push:active {
transform: translateY(4px);
border-bottom: none;
}
.box2 {
display:none;
border: 1px dashed #ccc;
padding: 0.5em 1em;
margin: 2em 0;
font-weight: bold;
color: #ff0000;/*文字色*/
background: #FFF;
border: solid 3px #d36060;/*線*/
border-radius: 10px;/*角の丸み*/
}
.box2 p {
margin: 0;
padding: 0;
}
#mono2{
color: #00aa00;
border: solid 3px #60d373;/*線*/
}
.lin{
float:right;
color:red;
padding: 0px 50px;
}
#twitter{
display:none;
}
.twitter {
background-color: #008DDE;
box-shadow: 0 4px 0 #0078BD;
display: inline;
position: relative;
font-family: Arial;
font-size: 14px;
font-weight: bold;
text-align: center;
text-decoration: none;
color: white;
border-radius: 5px;
padding: 14px 80px;
}
.twitter:active {
top: 2px;
box-shadow: 0 2px 0 #0078BD;
}
.twitter:hover {
background-color: #1397D8;
}
</style>
</head>
<body>
<div class="Header">瞬間韓単語<a href="zhong.html" class="lin">瞬間中単語</a></div>
<div class="Contents">
<div class="box11">
<p>
<b>現在の経験値：</b><span id="exp"></span>
</p>
</div>
<div class="box11" id="menubox">
<p>
レベル選択（左のリストから選択してください。）<br><br>
<select name="league" id="classes" onchange="teamSet()">
<option value="0">=ステージを選択=</option>
<option value="1">ステージ1</option>
<option value="2">ステージ2（未実装）</option>
</select>
<select id="level">
<option value="0">=========</option>
<option value="1"></option>
<option value="2"></option>
<option value="3"></option>
<option value="4"></option>
<option value="5"></option>
<option value="6"></option>
<option value="7"></option>
<option value="8"></option>
<option value="9"></option>
<option value="10"></option>
</select>
<input type="button" value="開始する" onclick="kantango();"><br>
韓国語を見て、日本語の意味を答えてください。
<div id="twitter">
<a href="#" class="twitter" onclick="botan();">Twitter</a>
</div>
</p>
</div>
<div class="box12 center" id="box12">
<p>
<div id="mono"class="box2">
<p>正解不正解</p>
</div>
<div id="mono2"class="box2">
<p>正解不正解</p>
</div>
<h1 id="monda">問題文</h1>
<span id="moji">●文字で回答</span><br><br>
<input type="text" id="kotae">
<div class="container">
<a href="#" class="btn-push" onclick="kaitou();">回答</a>
</div>
</div>
</div>
<script>
var stage_1=new Array(
"=stage 1=","レベル1（〜は）","レベル2（名詞1）","レベル3(名詞2)","レベル4(お金)","レベル5(学校)","レベル6(会話)","レベル7(天気)","レベル8(形容詞1)","レベル9(母音だけ)","レベル10（複合母音祭り）"
);
var stage_2=new Array(
"=stage 2=","レベル11","レベル12","レベル13","レベル14","レベル15","レベル16","レベル17","レベル18","レベル19","レベル20"
);
var tango1=["나는","당신은","그는","그녀는","남자","여자","이것은","그것은","저것은","이름"]
var tantan1=["私は","あなたは","彼は","彼女は","男","女","これは","それは","あれは","名前"]
var tango2=["펜","사과","오렌지","개","고양이","내","집","내가","안녕하세요","사람"]
var tantan2=["ペン","りんご","オレンジ","犬","猫","私の","家","私が","こんにちは","人"]
var tango3=["노래","어머니","아버지","야구","바다","가치","포도","슈퍼","가구","단어"]
var tantan3=["歌","お母さん","お父さん","野球","海","価値","ぶどう","スーパーマーケット","家具","単語"]
var tango4=["돈","가족","학교","숫자","요일","동물","계산","가격","쓰다","모자라다"]
var tantan4=["お金","家族","学校","数字","曜日","動物","お会計","価格","使う","足りない"]
var tango5=["유치원","초등학교","중학교","고등학교","대학","대학원","전문","분야","국어","수학"]
var tantan5=["幼稚園","小学校","中学校","高校","大学","大学院","専門","分野","国語","数学"]
var tango6=["맛","시간","관심","수업","일","정말","예","아니오","약속","팬"]
var tantan6=["味","時間","関心","授業","仕事","本当に","はい","いいえ","約束","ファン"]
var tango7=["날씨","일기 예보","맑음","비","흐림","눈","태풍","벼락","장마","기온"]
var tantan7=["天気","天気予報","晴れ","雨","曇り","雪","台風","雷","梅雨","気温"]
var tango8=["크다","작다","많다","적다","길다","짧다","높다","낮다","무겁다","가볍다"]
var tantan8=["大きい","小さい","多い","少ない","長い","短い","高い","低い","重い","軽い"]
var tango9=["이","오","아이","아우","오이","우유","이유","여우","여유","여아"]
var tantan9=["歯","5","子供","弟","きゅうり","牛乳","理由","きつね","余裕","幼児"]
var tango10=["위","웨어","와요","왜요?","외워요","예의","의외","의의","아우의","위에"]
var tantan10=["上","ウェア","来ます","なぜですか","覚えます","礼儀","意外","意義","弟の","上の"]
var tango=[]
var tantan=[]
var now = 0
var i=0
var seito=0
var cook; //cookieデータを格納する変数
var cStart,cEnd; //訪問回数部分を切取る為の位置を格納
var cnt; //訪問回数を格納
function kantango(){
now=0
seito=0
document.getElementById("kotae").value=""
var num = document.getElementById("level").selectedIndex;
var num2 = document.getElementById("classes").selectedIndex;
if(num==0){
alert('レベルが選択されていません。')
return
}else{
if(now>10){
alert("現在、LV10~未実装です。")
return;
}
document.getElementById("box12").style.display = "block";
document.getElementById("menubox").style.display = "none";
seito=0
i=0
now=num2*10+num-10
eval("tango=tango"+num)
eval("tantan=tantan"+num)
document.getElementById("monda").innerHTML=tango[i]
document.getElementById("moji").innerHTML=tantan[i].length+"文字で回答"
document.getElementById("mono2").style.display = "none";
document.getElementById("mono").style.display = "none";
}
}
function teamSet(){
//オプションタグを連続して書き換える
for ( i=0; i<11; i++ ){
//選択したリーグによって分岐
switch (document.getElementById("classes").selectedIndex){
case 0: document.getElementById("level").options[i].text="";break;
case 1: document.getElementById("level").options[i].text=stage_1[i];break;
case 2: document.getElementById("level").options[i].text=stage_2[i];break;
}
}
//チーム名のセレクトボックスの選択番号を０にする
document.getElementById("level").selectedIndex=0;
}
function kaitou(){
if (i==tantan.length){
alert("まずレベルを選択してください。");
return;
}
var kaito=document.getElementById("kotae").value
if (kaito==tantan[i]){
document.getElementById("mono2").style.display = "inline-block";
document.getElementById("mono").style.display = "none";
document.getElementById("mono2").innerHTML="正解<br>正答:"+tantan[i]+"<br>回答:"+kaito;
var cook; //cookieデータを格納する変数
var cStart,cEnd; //訪問回数部分を切取る為の位置を格納
var cnt; //訪問回数を格納
//cookieが使えるか確認
if (navigator.cookieEnabled)
{
cook=document.cookie + ";"; //変数cookにcookieデータを入れる
//変数cStartにカウントデータの最初の位置を入れる
cStart = cook.indexOf("counts2=",0);
//データの有無で分岐
if (cStart == -1){
//データの無い場合は最初の訪問ということ
document.getElementById("exp").innerHTML=("1");
//cookieに訪問回数=1を書き込む
document.cookie="counts2=1;";
}else{
//カウントデータの最後の部分「;」の位置を取得
cEnd=cook.indexOf(";",cStart);
//数値の部分だけを切り取る
cnt=cook.substring(cStart+8,cEnd);
//数値に変換できない例外が出た時の処理
try
{
//取得した回数に+1して表示する
cnt=parseInt(cnt)+1;
document.getElementById("exp").innerHTML=(cnt);
//cookieに訪問回数を書き込む
document.cookie="counts2="+cnt+";";
}
catch(e)
{
document.getElementById("exp").innerHTML=("");
}
}
}
else
{
//cookieが使用できない時の処理
document.getElementById("exp").innerHTML=""
}
seito+=1
}else{
document.getElementById("mono2").style.display = "none";
document.getElementById("mono").style.display = "inline-block";
document.getElementById("mono").innerHTML="不正解<br>正答:"+tantan[i]+"<br>回答:"+kaito;
}
i+=1
if(i==tantan.length){
document.getElementById("monda").innerHTML="終了<br>正答数："+tantan.length+"問中"+seito+"問"
document.getElementById('twitter').style.display="block";
document.getElementById("menubox").style.display = "block";
return;
}
document.getElementById("monda").innerHTML=tango[i]
document.getElementById("moji").innerHTML=tantan[i].length+"文字で回答"
document.getElementById("kotae").value=""
}
function openTwitter(text,url,hash,account) {
var turl = "https://twitter.com/intent/tweet?text="+text+"&url="+url+"&hashtags="+hash+"&via="+account;
window.open(turl,'_blank');
}
function botan(){
var num = document.getElementById("level").selectedIndex;
var keisan = String(parseInt(cnt)+parseInt(seito))
openTwitter("☆瞬間韓単語☆ レベル"+now+"で"+tantan.length+"問中"+seito+"問正解しました！現在の経験値は"+keisan+"です！","https://flashkorean.herokuapp.com/hang.html","瞬間韓単語","なっかのう");
}
function teamSet(){
//オプションタグを連続して書き換える
for ( i=0; i<11; i++ ){
//選択したリーグによって分岐
switch (document.getElementById("classes").selectedIndex){
case 0: document.getElementById("level").options[i].text="";break;
case 1: document.getElementById("level").options[i].text=stage_1[i];break;
case 2: document.getElementById("level").options[i].text=stage_2[i];break;
}
}
//チーム名のセレクトボックスの選択番号を０にする
document.getElementById("level").selectedIndex=0;
}
function nextForm(){
if(event.keyCode == 13){
kaitou();
}
}
window.document.onkeydown = nextForm;
//cookieが使えるか確認
if (navigator.cookieEnabled)
{
cook=document.cookie + ";"; //変数cookにcookieデータを入れる
//変数cStartにカウントデータの最初の位置を入れる
cStart = cook.indexOf("counts2=",0);
//データの有無で分岐
if (cStart == -1)
{
//データの無い場合は最初の訪問ということ
document.getElementById("exp").innerHTML=("0");
//cookieに訪問回数=1を書き込む
document.cookie="counts2=0;";
}
else
{
//カウントデータの最後の部分「;」の位置を取得
cEnd=cook.indexOf(";",cStart);
//数値の部分だけを切り取る
cnt=cook.substring(cStart+8,cEnd);
//数値に変換できない例外が出た時の処理
try
{
document.getElementById("exp").innerHTML=(cnt);
//cookieに訪問回数を書き込む
document.cookie="counts2="+cnt+";";
}
catch(e)
{
document.getElementById("exp").innerHTML=("");
}
}
}
else
{
//cookieが使用できない時の処理
document.getElementById("exp").innerHTML=""
}
</script>
</body>
</html>