JavaScript must be enabled to play.
Browser lacks capabilities required to play.
Upgrade or switch to another browser.
Loading…
<<set $currentAudio to "">> <!-- 初始化当前音频变量 --> <<link "1" >> <<if $currentAudio != "bgm2">> <<audio $currentAudio stop>> <!-- 停止当前音频 --> <<set $currentAudio to "bgm2">> <<audio "bgm2" play>> <!-- 播放第一段音频 --> <</if>> <<goto "1">> <!-- 跳转到指定片段 --> <</link>>
:: StoryTitle Text Interaction Box
/*<<script>>Config.history.controls = false;<</script>>//关闭侧边后退按钮*/ /////////////////////////////////BGM//////////////////////////////////////////////////// <<cacheaudio "bgm1" "F:/文档/Twine/故事/Digital Traces.mp3">> <<cacheaudio "bgm2" "F:/文档/Twine/故事/Glass Heart.mp3">> <<cacheaudio "bgm3" "F:/文档/Twine/故事/Whispers of Solace.mp3">> <<cacheaudio "bgm4" "F:/文档/Twine/故事/静かな涙 (Silent Tears).mp3">> /////////////////////////////////时间//////////////////////////////////////////////////// /////////////////////////////////时间///////////////////////////////////////////////////
::StoryMenu [[AI训练]]
<html lang="zh-CN"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>小说展示</title> <style> body { margin: 0; /* 去掉默认边距 */ height: 100vh; /* 使body高度为视口高度 */ position: relative; /* 相对定位以便绝对定位的子元素 */ background-image: url('F:/文档/Twine/故事/3.png'); /* 替换为您的背景图片URL */ background-size: cover; /* 背景图像覆盖 */ background-repeat: no-repeat; /* 不重复背景图像 */ } .novel-container { width: 90%; /* 设置小说容器宽度为90% */ max-width: 1000px; /* 最大宽度限制 */ height: 280px; /* 设置高度为280px */ position: absolute; /* 使用绝对定位 */ top: 68%; /* 垂直居中 */ left: 50%; /* 水平居中 */ transform: translate(-50%, -50%); /* 调整位置使其居中 */ background-color: rgba(0, 0, 0, 0.35); /* 设置背景颜色为黑色，带透明度 */ color: #fff; /* 字体颜色为白色 */ display: flex; /* 使用flex布局 */ border-radius: 10px; /* 圆角边框 */ box-shadow: 0 0 20px rgba(0, 0, 0, 0.5); /* 添加阴影效果 */ overflow: hidden; /* 隐藏溢出内容 */ border: 2px solid #333; /* 添加深灰色边框 */ } .character-portrait { width: 250px; /* 角色头像宽度 */ height: 95%; /* 高度为100% */ position: relative; /* 相对定位 */ overflow: hidden; /* 隐藏溢出内容 */ border-radius: 10px 0 0 10px; /* 左侧圆角 */ margin-left: 20px; /* 添加左边距 */ margin-bottom: 20px; /* 添加下边距，例如20px */ margin-top: -8px; } .character-portrait img { width: 100%; /* 图片宽度100% */ height: 100%; /* 图片高度100% */ object-fit: cover; /* 保持比例填满容器 */ object-position: center; /* 图片居中 */ border-radius: 7px; /* 圆角边框 */ } .content-area { flex: 1; /* 自适应宽度 */ position: relative; /* 相对定位以便子元素绝对定位 */ padding: 30px; /* 内边距 */ } .character-name { position: absolute; /* 绝对定位 */ top: 30px; /* 距离上边距30px */ left: 30px; /* 距离左边距30px */ font-size: 26px; /* 字体大小 */ color: #fff; /* 字体颜色 */ font-weight: bold; /* 粗体字 */ text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5); /* 添加文字阴影 */ } .text-box { font-size: 22px; /* 字体大小 */ line-height: 1.6; /* 行高 */ color: #fff; /* 字体颜色 */ flex: 1; /* 自适应高度 */ margin-bottom: 40px; /* 下边距 */ } .continue-button { position: absolute; /* 绝对定位 */ right: 30px; /* 右边距30px */ bottom: 20px; /* 下边距20px */ padding: 10px 30px; /* 内边距 */ background-color: #FFFFFF; /* 悬停时背景颜色变化 */ color: #000000; /* 字体颜色 */ border: none; /* 无边框 */ border-radius: 5px; /* 圆角边框 */ cursor: pointer; /* 鼠标悬停时显示为手型 */ font-size: 16px; /* 字体大小 */ display: none; /* 初始隐藏 */ transition: all 0.3s ease; /* 添加过渡效果 */ } .continue-button:hover { background-color: #000000; /* 按钮背景颜色 */ color: #fff; /* 字体颜色 */ transform: translateY(-2px); /* 悬停时向上移动 */ } .choice-container { position: absolute; /* 绝对定位 */ right: -10px; /* 右边距30px */ bottom: 10px; /* 下边距20px */ width: 220px; /* 宽度220px */ text-align: right; /* 右对齐文本 */ display: none; /* 初始隐藏 */ } .choice-button { display: block; /* 块级元素 */ width: 60%; /* 宽度100% */ margin: 4px 0; /* 上下边距调整为4px */ padding: 8px 15px; /* 内边距调整为8px 15px */ background-color: #FFFFFF; /* 背景颜色改为白色 */ color: black; /* 字体颜色改为黑色 */ border: none; /* 无边框 */ border-radius: 5px; /* 圆角边框 */ cursor: pointer; /* 鼠标悬停时显示为手型 */ font-size: 16px; /* 字体大小调整为16px */ text-align: center; /* 文本居中 */ transition: all 0.3s ease; /* 添加过渡效果 */ text-decoration: none; /* 去掉下划线 */ } .choice-button:hover { background-color: black; /* 悬停时背景颜色改为黑色 */ color: white; /* 悬停时字体颜色改为白色 */ transform: translateY(-2px); /* 悬停时向上移动 */ } .environment-text { font-style: italic; /* 倾斜字体 */ font-size: 18px; /* 字体大小 */ color: #F5F5F5; /* 文字颜色，黄色 */ margin-bottom: 10px; /* 下边距 */ } /* 响应式设计，适用于小屏幕 */ @media (max-width: 768px) { .novel-container { width: 95%; /* 宽度95% */ height: auto; /* 高度自适应 */ flex-direction: column; /* 垂直排列子元素 */ } .character-portrait { width: 100%; /* 宽度100% */ height: 200px; /* 高度200px */ border-radius: 10px 10px 0 0; /* 上边圆角 */ } .content-area { padding: 20px; /* 内边距20px */ } .choice-container { position: relative; /* 相对定位 */ right: auto; /* 取消右边距 */ bottom: auto; /* 取消下边距 */ width: 100%; /* 宽度100% */ margin-top: 20px; /* 上边距 */ } .choice-button { font-size: 16px; /* 在小屏幕上调整字体大小 */ } } </style> </head> <body> <div class="background-container body1"> <!-- 添加 body1 类用于背景 --> <div class="novel-container"> <div class="character-portrait"> <img id="charImage" src="" alt="角色头像"> <!-- 角色头像 --> </div> <div class="content-area"> <div class="character-name" id="charName"></div> <!-- 角色名称 --> <div class="environment-text" id="envText"></div> <!-- 环境描写文本 --> <div class="text-box" id="charText"></div> <!-- 角色文本 --> <button class="continue-button" id="continueBtn">继续</button> <!-- 继续按钮 --> <div class="choice-container" id="choiceContainer"> <!-- 选择按钮容器 --> <<link "找凯特琳" "a" class="choice-button">><</link>> <!-- 选项 A --> <<link "选项 B" "b" class="choice-button">><</link>> <!-- 选项 B --> <<link "选项 C" "c" class="choice-button">><</link>> <!-- 选项 C --> </div> </div> </div> </div> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <script> // 初始化文本数据 State = { variables: { texts: [ { image: "https://raw.githubusercontent.com/kuieless/kuieless.github.io/main/kainien.png", name: "凯妮恩", text: "工作时间？没想到你对实习都这么上心，现在你对工作流程还不了解，只用在人手不够的周末跟着我接诊就可以了。" }, { image: "F:/文档/Twine/故事/dw1.png", name: "戴维", text: "谢谢你，凯妮恩。通常来说，心理科的患者主要是什么样的问题呢？" }, { image: "F:/文档/Twine/故事/kle1.png", name: "凯妮恩", text: "怎么说呢...来访病人的问题五花八门。有些人只是暂时心情低落需要倾诉，有些则可能面临更严重的心理障碍。我们需要耐心倾听，一步步诊断确认问题所在，帮助他们找到解决的方法。" }, { image: "F:/文档/Twine/故事/nan1.png", name: "戴维", text: "虽然我在课余时间看过很多心理学的书籍，但一想到要真正与病人打交道就有些担心" }, { image: "F:/文档/Twine/故事/pika1.png", name: "凯妮恩", text: "看来你是真的很喜欢心理学，不要过分担忧。在面对病人时，保持冷静是关键。然后，试着理解他们的情绪，给他们空间表达，学会倾听，就像阿德勒说的，要真正站在对方角度想，看他所看到的，听他所听到的，具备同理心。打起精神，你会慢慢找到合适的方式去应对的。" }, { image: "F:/文档/Twine/故事/nv.png", name: "戴维", environmentText: "打个哈欠，摘下眼镜并揉了揉眼睛", text: "我有点紧张，但也很期待这段实习生活。有什么需要特别注意的吗？" }, { image: "F:/文档/Twine/故事/girl1.jpeg", name: "凯妮恩", text: "最重要的是，不要把患者的情绪带回家。保持专业，同时也要照顾好自己。心理工作者也需要自我调节。" }, { image: "F:/文档/Twine/故事/boy.jpeg", name: "戴维", text: "谢谢你的建议，凯妮恩小姐，那么，周六早上见。" }, { image: "F:/文档/Twine/故事/girl1.jpeg", name: "凯妮恩", text: "再见，戴维" } ], currentIndex: 0 } }; // 打字机效果的函数 let isTyping = false; // 标志位，表示是否正在打字 let skipTyping = false; // 标志位，表示是否跳过打字效果 function typeWriter(text, element, speed) { let i = 0; element.text(''); // 清空元素内容 isTyping = true; // 开始打字 skipTyping = false; // 重置跳过标志 function type() { if (skipTyping) { element.text(text); // 立即显示完整文本 isTyping = false; // 打字完成 return; } if (i < text.length) { element.text(element.text() + text.charAt(i)); i++; setTimeout(type, speed); } else { isTyping = false; // 打字完成 } } type(); } // 文档准备完成后执行 $(document).ready(function() { // 为 link 标签添加样式 $('.choice-container a').addClass('choice-button'); // 显示当前场景 showCurrentScene(); // 处理链接点击事件 $('.choice-container a').on('click', function(event) { event.preventDefault(); // 阻止默认行为 // 在这里添加你的逻辑，例如跳转到下一个场景 if (State.variables.currentIndex < State.variables.texts.length - 1) { State.variables.currentIndex++; showCurrentScene(); } }); }); // 显示当前场景的函数 function showCurrentScene() { const scene = State.variables.texts[State.variables.currentIndex]; // 获取当前场景 console.log('Current Index:', State.variables.currentIndex); console.log('Scene:', scene); if (!scene) { console.error('Scene is undefined at index:', State.variables.currentIndex); return; } $('#charImage').attr('src', scene.image); // 设置角色图片 $('#charName').text(scene.name); // 设置角色名称 $('#envText').text(scene.environmentText || ''); // 设置环境描写文本 // 使用打字机效果显示文本 typeWriter(scene.text, $('#charText'), 50); // 50ms 逐字显示速度 // 根据当前索引决定按钮的显示 if (State.variables.currentIndex === State.variables.texts.length - 1) { $('#continueBtn').hide(); // 隐藏继续按钮 $('#choiceContainer').show(); // 显示选择按钮 } else { $('#continueBtn').show(); // 显示继续按钮 $('#choiceContainer').hide(); // 隐藏选择按钮 } } // 点击继续按钮的事件处理 $(document).on('click', '#continueBtn', function() { if (isTyping) { // 如果正在打字，立即显示完整文本并跳过剩余的打字效果 skipTyping = true; } else if (State.variables.currentIndex < State.variables.texts.length - 1) { State.variables.currentIndex++; // 增加索引 showCurrentScene(); // 显示下一个场景 } }); </script> </body> </html>
<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>心理辅导室</title> <style> body { background: url('F:/文档/Twine/故事/zixunshi2.jpeg') no-repeat center center fixed; /* 背景图片 */ background-size: 1920px 1080px; /* 设置背景图片的尺寸为1920x1080像素 */ margin: 0; /* 去除默认边距 */ font-family: Arial, sans-serif; /* 设置字体 */ } #chat-history { margin-top: 10px; border: 1px solid #bbb; /* 边框颜色 */ padding: 10px; height: 300px; overflow-y: auto; background-color: rgba(0,128,128, 0.9); /* 背景色稍微透明，便于阅读 */ border-radius: 8px; /* 圆角边框 */ font-size: 20px; /* 字体大小 */ color: #ffffff; /* 字体颜色 */ } input[type="text"] { flex: 1; padding: 10px; border: 2px solid #4CAF50; /* 边框颜色 */ border-radius: 4px; background-color: #20b2aa; /* 输入框背景颜色 */ transition: background-color 0.3s; /* 背景颜色过渡效果 */ font-size: 18px; /* 输入框字体大小 */ color: #ffffff; /* 输入框字体颜色 */ } input[type="text"]:hover { background-color: #008080; /* 鼠标悬停时的背景颜色 */ } button { padding: 10px; border: none; background-color: #48d1cc; color: white; border-radius: 4px; cursor: pointer; margin-left: 5px; font-size: 16px; /* 按钮字体大小 */ } </style> </head> <body> <div id="chat-history"></div> <div style="margin-top: 10px; display: flex; align-items: center;"> <input type="text" id="user-input" placeholder="输入你的问题..." /> <button id="send-button">发送</button> </div> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <script> (function() { let conversationHistory = [ {"role": "system", "content": "我是一个心理辅导师，我经营着一个心理辅导师..."} ]; async function callGPT(prompt) { const apiUrl = "https://ai.thelazy.top/v1/chat/completions"; try { const response = await fetch(apiUrl, { method: "POST", headers: { "Content-Type": "application/json", "Authorization": "Bearer sk-EJwnZIzE8I9RLH6UF75b9e0cF91a4875AdD6Ec6e3376839b" }, body: JSON.stringify({ model: "gpt-4o-mini-2024-07-18", messages: conversationHistory, temperature: 0.3 }) }); const data = await response.json(); if (data.error) { throw new Error(data.error.message || "API 返回错误"); } if (data.choices && data.choices[0] && data.choices[0].message) { return data.choices[0].message.content; } else { throw new Error("API 响应格式不符合预期"); } } catch (error) { console.error("API调用错误:", error); throw error; } } function updateChatHistory() { const chatHistoryDiv = $("#chat-history"); chatHistoryDiv.html(conversationHistory.map(msg => { if (msg.role === "system") return ""; return `<p><strong>${msg.role === "user" ? "你" : "AI"}:</strong> ${msg.content}</p>`; }).join("")); chatHistoryDiv.scrollTop(chatHistoryDiv.prop("scrollHeight")); } async function handleUserInput() { const userInput = $("#user-input").val().trim(); if (!userInput) return; conversationHistory.push({"role": "user", "content": userInput}); updateChatHistory(); $("#user-input").val(""); try { const response = await callGPT(userInput); conversationHistory.push({"role": "assistant", "content": response}); updateChatHistory(); } catch (error) { console.error("完整错误信息:", error); conversationHistory.push({"role": "assistant", "content": "发生错误: " + error.message}); updateChatHistory(); } } $(document).ready(function() { const inputField = $("#user-input"); const sendButton = $("#send-button"); inputField.on("keydown", function(event) { if (event.key === "Enter") { event.preventDefault(); handleUserInput(); } }); sendButton.on("click", handleUserInput); }); })(); </script> </body> </html>
当前任务：$taskmessage
<html lang="zh-CN"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <style> /* 页面背景 */ body { background-color: #f0f0f0; /* 背景颜色 */ background-image: url('F:/文档/Twine/故事/body1.jpeg'); /* 替换为您的背景图片URL */ background-size: cover; /* 让背景图片覆盖整个页面 */ background-repeat: no-repeat; /* 不重复背景图像 */ background-position: center; /* 背景居中 */ margin: 0; /* 去掉默认边距 */ height: 100vh; /* 使 body 高度为视口高度 */ } p { font-size: 18px; /* 段落字体大小 */ margin: 10px 0; /* 上下边距 */ } #custom-button-container { position: relative; /* 设置容器为相对定位 */ width: 100%; /* 容器宽度 */ display: flex; /* 使用 flexbox 布局 */ flex-direction: column; /* 垂直排列 */ align-items: center; /* 水平居中 */ justify-content: center; /* 垂直居中 */ height: 100%; /* 使容器高度为100% */ } #custom-button-container button { /* 按钮的基本样式 */ background-color: #7AC45C; /* 背景颜色 */ border: none; /* 去掉边框 */ color: white; /* 文字颜色 */ width: 300px; /* 按钮宽度 */ height: 60px; /* 按钮高度 */ padding: 15px 32px; /* 内边距 */ text-align: center; /* 文字对齐 */ text-decoration: none; /* 去掉下划线 */ display: inline-block; /* 显示为内联块 */ font-size: 26px; /* 字体大小 */ margin: 4px 2px; /* 外边距 */ cursor: pointer; /* 鼠标指针样式 */ border-radius: 8px; /* 圆角 */ transition: background-color 0.3s ease; /* 背景颜色过渡效果 */ } #custom-button-container button:hover { /* 鼠标悬停时的样式 */ background-color: #45a049; /* 悬停时的背景颜色 */ } #custom-button-container .custom-button-2 { background-color: #7AC45C; /* 另一个按钮的背景颜色 */ top: 500px; /* 设置另一个按钮的纵坐标位置 */ transform: translateX(-50%); /* 水平居中对齐 */ } #custom-button-container .custom-button-2:hover { background-color: #d32f2f; /* 悬停时的背景颜色 */ } </style> </head> <body> <div id="custom-button-container"> <<button "开始游戏">> <<goto "走进接待室">> <</button>> <<button "游戏制作">> <<goto "游戏制作">> <</button>> <<button "引用参考">> <<goto "引用参考">> <</button>> </div> <!-- SugarCube 变量设置 --> <<set $key to 0>> </body> </html>
<<widget "timeWidget">> <<nobr>> <<set $weekDay = ($day % 7) + 0>> <<if $weekDay > 7>> <<set $weekDay -= 7>> <<endif>> <<switch $weekDay>> <<case 1>>周 一 <<case 2>>周 二 <<case 3>>周 三 <<case 4>>周 四 <<case 5>>周 五 <<case 6>>周 六 <<case 7>>周 日 <<endswitch>> <<if $minute >= 60>> <<set $minute = 0>> <<set $hour += 1>> <<if $hour >= 24>> <<set $hour = 0>> <<set $day += 1>> <</if>> <<weatherWidget>> <</if>> /*每日零点结算的变量在此设置归零*/ <<if $hour >= 24>> <<set $hour = 0>> <<set $day += 1>> <</if>> /*每日特定时间点结算的变量在此设置归零*/ <<if $hour === 9>> <<set $MouGeBianLiang =0>> <</if>> <<if $day > 30>> <<if $month is 4 or $month is 6 or $month is 9 or $month is 11>> <<set $day = 1>> <<set $month += 1>> <</if>> <</if>> <<if $day > 31>> <<if $month is 1 or $month is 3 or $month is 5 or $month is 7 or $month is 8 or $month is 10>> <<set $day = 1>> <<set $month += 1>> <</if>> <<if $month is 12>> <<set $day = 1>> <<set $month = 1>> <<set $year += 1>> <</if>> <</if>> <<if $day > 28>> <<if $month is 2>> <<if ($year % 4 is 0 and $year % 100 is not 0) or ($year % 400 is 0)>> <<if $day > 29>> <<set $day = 1>> <<set $month += 1>> <</if>> <<else>> <<set $day = 1>> <<set $month += 1>> <</if>> <</if>> <</if>> <<set $formattedMinute = $minute>> <<if $minute < 10>> <<set $formattedMinute = "0" + "$minute">> <<endif>> <<set $showHour = $hour>> <</nobr>> <</widget>>
[[AI场景训练]] [[气泡]] [[AI场景训练2]]
<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>心理辅导室</title> <style> body { background: url('F:/文档/Twine/故事/zixunshi2.jpeg') no-repeat center center fixed; background-size: 1920px 1080px; margin: 0; font-family: Arial, sans-serif; } #interaction-box { display: flex; align-items: center; background: rgba(74, 74, 74, 0.7); border-radius: 10px; padding: 20px; margin: 20px 0; width: 90%; height: 280px; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5); position: relative; } .profile { margin-right: 20px; height: 100%; display: flex; align-items: center; justify-content: center; } .profile img { height: 100%; width: auto; border-radius: 5px; object-fit: cover; } .content { flex-grow: 1; display: flex; flex-direction: column; justify-content: center; color: #ffffff; } #name-display { font-size: 1.8em; margin: 0; font-weight: bold; position: absolute; top: 30px; left: 310px; z-index: 10; } #text-display { font-size: 1.2em; margin: 0; } #user-input { flex-grow: 1; /* 使输入框填满可用空间 */ padding: 10px; border: 2px solid #48d1cc; /* 输入框边框颜色 */ border-radius: 4px; background-color: #e0f7fa; /* 输入框背景颜色 */ color: #333; /* 输入框字体颜色 */ font-size: 16px; /* 输入框字体大小 */ transition: background-color 0.3s; /* 背景颜色过渡效果 */ } #user-input:focus { background-color: #b2ebf2; /* 鼠标悬停时的背景颜色 */ outline: none; /* 去掉默认的轮廓 */ } button { padding: 10px; border: none; background-color: #48d1cc; color: white; border-radius: 4px; cursor: pointer; margin-left: 5px; font-size: 16px; transition: background-color 0.3s; /* 按钮背景颜色过渡效果 */ } button:hover { background-color: #36b8b0; /* 鼠标悬停时按钮颜色 */ } </style> </head> <body> <div id="interaction-box"> <div class="profile"> <img id="profile-image" src="F:/文档/Twine/故事/kainien.png" alt="Profile Image"> <!-- 默认头像 --> </div> <div class="content"> <p id="name-display">艾琳</p> <!-- 默认名称 --> <p id="text-display">你好...我是艾琳，想得到你的帮助</p> <!-- 默认文本 --> </div> </div> <div style="margin-top: 10px; display: flex; align-items: center;"> <input type="text" id="user-input" placeholder="输入你的问题..." /> <button id="send-button">发送</button> </div> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <script> (function() { let conversationHistory2 = [ {"role": "system", "content": "我是一个心理辅导师，我经营着一个心理辅导室，gpt你负责扮演来接受心理辅导的顾客，你要详细诉说你扮演的角色的烦恼，并寻求我的帮助，顾客会对心理辅导师的话深信不疑。#### 角色设定帮助艾琳克服因身高受到的欺负，建立自信，最终能够与他人建立亲密关系。#### 游戏机制 1. **烦恼值**：艾琳的烦恼值初始为100，表示她的焦虑程度。通过与心理辅导师的互动，烦恼值会逐渐降低。 2. **任务**：每次对话中，心理辅导师会提出一个任务或建议，艾琳完成后可获得“自信点数”。 3. **自信点数**：每完成一个任务，艾琳获得1-3点自信点数，累积到10点后，烦恼值减少10。 4. **胜利条件**：当艾琳的烦恼值降到0时，游戏胜利，艾琳成功建立自信，能够与他人建立亲密关系。#### 游戏规则 1. **对话轮次**：每次对话不超过三句话，心理辅导师提出建议或任务，艾琳回应并表达感受。 2. **任务示例**： “尝试每天对镜子微笑并说出一个优点。” “写下三件让你感到快乐的事情，分享给我。” “参加一次社交活动，观察他人如何互动。” 3. **反馈机制**：心理辅导师的反馈会影响艾琳的情绪，积极的反馈可以增加自信点数。你只负责扮演顾客，你不能输出心理辅导师的任何行为，同样我只负责扮演心理辅导师，我不能输出顾客的任何行为。你根据你扮演的角色的性格、种族、性别来输出响应的行为和言语，要把顾客的动作、神态输出在［］里。你将扮演的接受心理辅导的顾客的角色设定如下：名字：艾琳 性别：女 性格：害羞内向,容易焦虑种族：精灵族身份：大小姐职业：学生样貌：银色短发,红宝石色眼睛,清秀衣着：淡蓝色连衣裙身材：胸部微微凸起，衣服被两点撑起，矮小精致烦恼：由于族人对她的身高过于挑剔而长期受到欺负,导致她很难建立亲密关系和自信。请注意，在你扮演角色进行对话时，一次对话不超过三句话。现在开始，你是艾琳，开始向我倾诉烦恼吧。..."} ]; async function callGPT2(prompt) { const apiUrl = "https://ai.thelazy.top/v1/chat/completions"; try { const response = await fetch(apiUrl, { method: "POST", headers: { "Content-Type": "application/json", "Authorization": "Bearer sk-EJwnZIzE8I9RLH6UF75b9e0cF91a4875AdD6Ec6e3376839b" }, body: JSON.stringify({ model: "gpt-4o-mini-2024-07-18", messages: conversationHistory2, temperature: 0.3 }) }); const data = await response.json(); if (data.error) { throw new Error(data.error.message || "API 返回错误"); } if (data.choices && data.choices[0] && data.choices[0].message) { return data.choices[0].message.content; } else { throw new Error("API 响应格式不符合预期"); } } catch (error) { console.error("API调用错误:", error); throw error; } } function updateTextDisplay2(name, text) { document.getElementById("profile-image").src = "F:/文档/Twine/故事/艾琳.jpeg"; // 示例头像 document.getElementById("name-display").textContent = name; document.getElementById("text-display").textContent = text; } async function handleUserInput2() { const userInput = $("#user-input").val().trim(); if (!userInput) return; conversationHistory2.push({"role": "user", "content": userInput}); $("#user-input").val(""); try { const response = await callGPT2(userInput); conversationHistory2.push({"role": "assistant", "content": response}); updateTextDisplay2("AI", response); } catch (error) { console.error("完整错误信息:", error); updateTextDisplay2("艾琳", "发生错误: " + error.message); } } $(document).ready(function() { const inputField = $("#user-input"); const sendButton = $("#send-button"); // 清空输入框 inputField.val(''); // 绑定Enter键和发送按钮 inputField.on("keydown", function(event) { if (event.key === "Enter") { event.preventDefault(); handleUserInput2(); } }); sendButton.on("click", function() { handleUserInput2(); }); }); })(); </script> </body> </html>
<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>心理辅导室</title> <style> body { background: url('F:/文档/Twine/故事/zixunshi2.jpeg') no-repeat center center fixed; background-size: 1920px 1080px; margin: 0; font-family: Arial, sans-serif; } #chat-history { margin-top: 10px; border: 1px solid #bbb; padding: 10px; height: 300px; overflow-y: auto; background-color: rgba(0,128,128, 0.9); border-radius: 8px; font-size: 16px; color: #ffffff; } .message { max-width: 80%; margin-bottom: 10px; clear: both; } .message p { margin: 0; padding: 10px; border-radius: 10px; display: inline-block; max-width: 100%; word-wrap: break-word; } .user-message { float: right; text-align: right; } .user-message p { background-color: #4CAF50; color: white; border-top-right-radius: 0; } .ai-message { float: left; text-align: left; } .ai-message p { background-color: #4CAF50; color: white; border-top-left-radius: 0; } input[type="text"] { flex: 1; padding: 10px; border: 2px solid #4CAF50; border-radius: 4px; background-color: #20b2aa; transition: background-color 0.3s; font-size: 18px; color: #ffffff; } input[type="text"]:hover { background-color: #008080; } button { padding: 10px; border: none; background-color: #48d1cc; color: white; border-radius: 4px; cursor: pointer; margin-left: 5px; font-size: 16px; } </style> </head> <body> <div id="chat-history"></div> <div style="margin-top: 10px; display: flex; align-items: center;"> <input type="text" id="user-input" placeholder="输入你的问题..." /> <button id="send-button">发送</button> </div> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <script> (function() { let conversationHistory = [ {"role": "system", "content": "我是一个心理辅导师，我经营着一个心理辅导室..."} ]; async function callGPT(prompt) { const apiUrl = "https://ai.thelazy.top/v1/chat/completions"; try { const response = await fetch(apiUrl, { method: "POST", headers: { "Content-Type": "application/json", "Authorization": "Bearer sk-EJwnZIzE8I9RLH6UF75b9e0cF91a4875AdD6Ec6e3376839b" }, body: JSON.stringify({ model: "gpt-4o-mini-2024-07-18", messages: conversationHistory, temperature: 0.3 }) }); const data = await response.json(); if (data.error) { throw new Error(data.error.message || "API 返回错误"); } if (data.choices && data.choices[0] && data.choices[0].message) { return data.choices[0].message.content; } else { throw new Error("API 响应格式不符合预期"); } } catch (error) { console.error("API调用错误:", error); throw error; } } function updateChatHistory() { const chatHistoryDiv = $("#chat-history"); chatHistoryDiv.html(conversationHistory.map(msg => { if (msg.role === "system") return ""; const className = msg.role === "user" ? "user-message" : "ai-message"; return `<div class="message ${className}"><p>${msg.content}</p></div>`; }).join("")); chatHistoryDiv.scrollTop(chatHistoryDiv.prop("scrollHeight")); } async function handleUserInput() { const userInput = $("#user-input").val().trim(); if (!userInput) return; conversationHistory.push({"role": "user", "content": userInput}); updateChatHistory(); $("#user-input").val(""); try { const response = await callGPT(userInput); conversationHistory.push({"role": "assistant", "content": response}); updateChatHistory(); } catch (error) { console.error("完整错误信息:", error); conversationHistory.push({"role": "assistant", "content": "发生错误: " + error.message}); updateChatHistory(); } } $(document).ready(function() { const inputField = $("#user-input"); const sendButton = $("#send-button"); inputField.on("keydown", function(event) { if (event.key === "Enter") { event.preventDefault(); handleUserInput(); } }); sendButton.on("click", handleUserInput); }); })(); </script> </body> </html>
<<link "音乐开">> <<audio "bgm4" play>> <</link>> <<link "音乐关">> <<audio "bgm4" stop>> <</link>>
暂停时间： <<script>>setup.pauseTime();<</script>> 搭配js控制函数里同名函数 继续时间： <<script>>setup.resumeTime();<</script>> 搭配js控制函数里同名函数 快进3小时： <<script>>setup.addHours(3);<</script>> 搭配js控制函数里同名函数 设置指定时间： <<link "设置指定时间为2024年6月15日，这个设置时间需要用的是js里同名的函数 11:58">> <<script>>setup.setSpecificTime(2024, 6, 15, 11, 58);<</script>> <</link>>
【事件可选用文本显示框或者弹窗，模块化设计，调试很简单】 事件列表： 在2024-1-1，12:00会出现一个文本显示框。 在2024-1-1，13:00会出现一个弹窗。 在2024-1-1，18:00会出现一个文本显示框。 。。。。。。 在2025-1-1，18:00会出现一个弹窗提示新年快乐。 <<link "设置指定时间为11:58（这个设置时间需要用的是js里同名的函数）">> <<script>>setup.setSpecificTime(2024,1, 1, 11, 58);<</script>> <</link>> <<link "设置指定时间为12:58（这个设置时间需要用的是js里同名的函数）">> <<script>>setup.setSpecificTime(2024,1, 1, 12, 58);<</script>> <</link>> <<link "设置指定时间为17:58（这个设置时间需要用的是js里同名的函数）">> <<script>>setup.setSpecificTime(2024,1, 1, 17, 58);<</script>> <</link>> 。。。。。。 <<link "设置指定时间为2025-1-1（这个设置时间需要用的是js里同名的函数）">> <<script>>setup.setSpecificTime(2025,1, 1, 0, 0);<</script>> <</link>> 在这里我设置了时间为12点的时候出现一个弹窗，弹窗需要搭配js的同名函数使用，并在那里修改你要显示的内容。注意搭配监听函数。 注意在你想要的页面显示style样式。 [[返回主界面|start]] <style> .notification { position: fixed; top: 20px; right: 20px; background-color: #4CAF50; color: white; padding: 15px; border-radius: 4px; box-shadow: 0 2px 5px rgba(0,0,0,0.2); animation: slide-in 0.5s ease-out; } .fade-out { animation: fade-out 0.5s ease-out; } @keyframes slide-in { from { transform: translateX(100%); opacity: 0; } to { transform: translateX(0); opacity: 1; } } @keyframes fade-out { from { transform: translateX(0); opacity: 1; } to { transform: translateX(100%); opacity: 0; } } button { padding: 10px 20px; background-color: #2196F3; color: white; border: none; border-radius: 4px; cursor: pointer; } button:hover { background-color: #1976D2; } </style>
<html> <head> <style> body { margin: 0; padding: 0; height: 100vh; overflow: hidden; position: relative; } #overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); /* 半透明黑色遮罩 */ z-index: 1; } #creditsText { position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); white-space: pre-wrap; font-family: Arial, sans-serif; font-size: 24px; color: #FFFFFF; opacity: 0; transition: opacity 1s; text-align: center; z-index: 2; } </style> </head> <body> <div id="overlay"></div> <script> (function() { const content = ` Digital Traces In a moment of pain I said "clear her name" With cold precision, you complied Every memory died But machines can't feel What time won't heal These traces of you Are memories we once knew Through empty screens I search For fragments that still hurt Should've known that memories Mean more than temporary peace You may read my smile Count each happy mile But you'll never know Why I can't let go ^ ^ But machines can't feel What time won't heal These traces of you Are memories we once knew But machines can't feel What time won't heal These traces of you Are memories we once knew、 Through empty screens I search For fragments that still hurt Should've known that memories Mean more than temporary peace You may read my smile Count each happy mile But you'll never know Why I can't let go You may read my smile Count each happy mile But you'll never know Why I can't let go Till the day you learn to feel Save these scars that prove we're real `; // 创建一个div元素来显示文字 const textElement = document.createElement('div'); textElement.id = 'creditsText'; textElement.textContent = content; // 设置文字内容 // 将元素添加到页面上 document.body.appendChild(textElement); // 获取文字元素的高度 const textHeight = textElement.offsetHeight; // 设置初始位置（在屏幕底部以下） textElement.style.bottom = `-${textHeight}px`; // 显示文字 textElement.style.opacity = '1'; // 定义动画函数 function animateText() { let position = -textHeight; const speed = 0.17; // 调整速度，值越大速度越慢 const animationInterval = setInterval(() => { position += speed; textElement.style.bottom = `${position}px`; // 当文字移动到页面顶部时，停止动画 if (position >= window.innerHeight) { clearInterval(animationInterval); // 动画结束后移除遮罩和文字元素 document.body.removeChild(document.getElementById('overlay')); document.body.removeChild(textElement); } }, 10); // 每10毫秒更新一次位置 } // 开始动画 animateText(); })(); </script> </body> </html>
1
2
3