<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>小説生成アプリ</title>
</head>
<body>
<h1>小説生成アプリ</h1>
<form>
<label for="genre">ジャンル:</label>
<input type="text" id="genre" name="genre"><br><br>
<button type="button" id="generateBtn">生成</button>
</form>
<p id="generatedText"></p>
<script>
const generateBtn = document.getElementById('generateBtn');
const generatedText = document.getElementById('generatedText');
generateBtn.addEventListener('click', function() {
const genre = document.getElementById('genre').value;
if (genre === '') {
alert('ジャンルを入力してください');
return;
}
// 文章を生成する関数
function generateNovel(genre) {
const firstLines = [
'あるところに、',
'昔々、',
'この世界には、'
];
const middleLines = [
'ある人物がいた。',
'そんな中、事件が発生。',
'主人公は苦境に立たされる。'
];
const lastLines = [
'そして、彼は希望を見出した。',
'しかし、そこに悲劇が待ち受けていた。',
'そして、彼は決断を下した。'
];
const firstLine = firstLines[Math.floor(Math.random() * firstLines.length)];
const middleLine = middleLines[Math.floor(Math.random() * middleLines.length)];
const lastLine = lastLines[Math.floor(Math.random() * lastLines.length)];
return `${firstLine} ${genre}に関する${middleLine} ${lastLine}`;
}
// 生成された文章を表示
const generatedNovel = generateNovel(genre);
generatedText.textContent = generatedNovel;
});
</script>
</body>
</html>