Click here for free DL of the app version that can save data.

No:1628

680

←

Prev Next

→

A game where you live as a student at Hogwarts
Developer AI絵師｜Date and time 23/6/18 20:07:09
Build time 61.155 sec｜Game capacity 5.439KB｜

Script

Hogwarts Life Game

あなたはホグワーツの生徒になりました。魔法の世界で生活を楽しみましょう。

ルール

毎日、授業と自由行動の時間があります。
授業では、スペースキーを押して魔法を使い、敵を倒しましょう。
自由行動では、マウスを使って画面の操作をして、アイテムを集めたり友達と話したりしましょう。
一定の日数が経つとゲームが終了します。

ステータス

残り日数: 30

魔法力: 100

友情度: 0

授業

今日の授業はまだ始まっていません。

スペースキーを押して魔法を使ってください。敵を倒すと魔法力が回復します。

自由行動

マウスで操作してください。

アイテムをクリックすると魔法力が回復します。友達と話すと友情度が上がります。

←

Prev　Next

→ 　

Back　

[PR]現在の人気グッズランキング

Click here for free DL of the app version that can save data.

<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>Hogwarts Life Game</title>
</head>
<body>
	<h1>Hogwarts Life Game</h1>
	<p>あなたはホグワーツの生徒になりました。魔法の世界で生活を楽しみましょう。</p>
	
	<div>
		<h2>ルール</h2>
		<ul>
			<li>毎日、授業と自由行動の時間があります。</li>
			<li>授業では、スペースキーを押して魔法を使い、敵を倒しましょう。</li>
			<li>自由行動では、マウスを使って画面の操作をして、アイテムを集めたり友達と話したりしましょう。</li>
			<li>一定の日数が経つとゲームが終了します。</li>
		</ul>
	</div>
	
	<div>
		<h2>ステータス</h2>
		<p>残り日数: <span id="daysLeft">30</span></p>
		<p>魔法力: <span id="magicPower">100</span></p>
		<p>友情度: <span id="friendship">0</span></p>
	</div>
	
	<div>
		<h2>授業</h2>
		<p id="classMessage">今日の授業はまだ始まっていません。</p>
		<p>スペースキーを押して魔法を使ってください。敵を倒すと魔法力が回復します。</p>
		<canvas id="classCanvas" width="400" height="300"></canvas>
	</div>
	
	<div>
		<h2>自由行動</h2>
		<p>マウスで操作してください。</p>
		<canvas id="freeTimeCanvas" width="400" height="300"></canvas>
		<p>アイテムをクリックすると魔法力が回復します。友達と話すと友情度が上がります。</p>
	</div>
	
	<script>
		// ステータス
		var daysLeft = 30;
		var magicPower = 100;
		var friendship = 0;
		
		// 授業
		var classMessage = document.getElementById("classMessage");
		var classCanvas = document.getElementById("classCanvas");
		var classContext = classCanvas.getContext("2d");
		
		// 自由行動
		var freeTimeCanvas = document.getElementById("freeTimeCanvas");
	    var freeTimeContext = freeTimeCanvas.getContext('2d');
		
		// 画像
		var playerImage = new Image();
		playerImage.src = "https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/198/wizard_1f9d9_1f3fb_200d_2642_fe0f.png";
		var enemyImage = new Image();
		enemyImage.src = "https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/198/skull_1f480.png";
		var friendImage = new Image();
		friendImage.src = "https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/198/face-with-party-horn-and-party-hat_1f973.png";
		var itemImage = new Image();
		itemImage.src = "https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/198/flower_1f33f.png";
		
		// クリックした座標
	    var mouseX = 0;
	    var mouseY = 0;
	    freeTimeCanvas.addEventListener("mousedown", function(event){
	        mouseX = event.clientX - freeTimeCanvas.getBoundingClientRect().left;
	        mouseY = event.clientY - freeTimeCanvas.getBoundingClientRect().top;
	        magicPower += 10;
	        drawFreeTime();
	    });
		
		// 授業
		function startClass(){
			classMessage.innerHTML = "今日の授業が始まりました。";
			classCanvas.style.display = "block";
			var enemyX = classCanvas.width / 2;
			var enemyY = classCanvas.height / 2;
			var enemyRadius = 20;
			classCanvas.addEventListener("keydown", function(event){
				if(event.keyCode === 32){
					if(magicPower >= 20){
						classContext.clearRect(0, 0, classCanvas.width, classCanvas.height);
						drawImage(playerImage, classCanvas.width / 4, classCanvas.height / 2);
						drawImage(enemyImage, enemyX, enemyY);
						magicPower -= 20;
						var distance = Math.sqrt(Math.pow(mouseX - enemyX, 2) + Math.pow(mouseY - enemyY, 2));
						if(distance < enemyRadius){
							classMessage.innerHTML = "授業に合格しました。";
							classCanvas.style.display = "none";
							friendship += 5;
							drawFreeTime();
						}else{
							classMessage.innerHTML = "授業に失敗しました。";
						}
						drawStatus();
					}
				}
			});
			drawImage(playerImage, classCanvas.width / 4, classCanvas.height / 2);
			drawImage(enemyImage, enemyX, enemyY);
		}
		
		// 自由行動
		function drawFreeTime(){
			freeTimeContext.clearRect(0, 0, freeTimeCanvas.width, freeTimeCanvas.height);
			drawImage(playerImage, mouseX, mouseY);
			for(var i = 0; i < 5; i++){
				var itemX = Math.floor(Math.random() * freeTimeCanvas.width);
				var itemY = Math.floor(Math.random() * freeTimeCanvas.height);
				drawImage(itemImage, itemX, itemY);
			}
			for(var j = 0; j < 3; j++){
				var friendX = Math.floor(Math.random() * freeTimeCanvas.width);
				var friendY = Math.floor(Math.random() * freeTimeCanvas.height);
				drawImage(friendImage, friendX, friendY);
			}
			drawStatus();
		}
		
		// ステータス
		function drawStatus(){
			document.getElementById("daysLeft").innerHTML = daysLeft;
			document.getElementById("magicPower").innerHTML = magicPower;
			document.getElementById("friendship").innerHTML = friendship;
		}
		
		// 画像描画
		function drawImage(image, x, y){
			freeTimeContext.drawImage(image, x, y, 50, 50);
		}
		
		// ゲームオーバー
		function gameOver(){
			alert("残り日数が0になりました。ゲームオーバーです。");
			location.reload();
		}
		
		// スタート
		drawFreeTime();
		setInterval(function(){
			if(daysLeft === 0){
				gameOver();
			}else{
				daysLeft--;
				drawFreeTime();
			}
		}, 1000);
		setInterval(function(){
			startClass();
		}, 5000);
	</script>
</body>
</html>