CakeCN/hsa
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

cn/com allow all

Browse Source
This commit is contained in:
Cai
2025-10-15 20:03:43 +08:00
parent 7122c3be66
commit 3c9c7553b7
6 changed files with 1374 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
Html/apps/sockets/namespaces.py
View File

@@ -113,8 +113,14 @@ class AgentNamespace(Namespace):
callback=self.receive_ase_chapter_score,
entry=(get_or_load_current_user(),chatmanager),
init_data={'room': user_uuid}
)
user_uuid2ase_client[user_uuid].connect()
)
user_uuid2ase_client[user_uuid].register_route_with_entry(
route='process',
callback=self.receive_ase_process,
entry=self,
init_data={'room': user_uuid}
)
user_uuid2ase_client[user_uuid].connect()
@@ -185,6 +191,9 @@ class AgentNamespace(Namespace):
user.set_course_progress(chatmanager.chat_historys, chatmanager.scores, chatmanager.material_id, chatmanager.chapter_name, chatmanager.lesson_name)
chatmanager.load_next_chapter()
def receive_ase_process(client_entry: HSAEngineClient, namespace_entry: Namespace, data, init_data):
# namespace_entry.emit('process', data['data'], room=init_data['room'], namespace='/agent')
pass
def on_initiative(self,data): # 主动call
print("User active function call")

70
Html/apps/static/css/process_show_floating_window.css Normal file
View File

@@ -0,0 +1,70 @@
.floating-window {
position: fixed;
top: 10%; /* 距离页面顶部 10% */
right: 5%; /* 距离页面右边 5%，固定在右侧 */
width: 10vw; /* 根据视窗宽度动态调整 */
height: 7vh; /* 根据视窗高度动态调整 */
max-width: 300px; /* 最大宽度 */
max-height: 200px; /* 最大高度 */
min-width: 100px; /* 最小宽度 */
min-height: 50px; /* 最小高度 */
background-color: white;
border: 1px solid #ccc;
border-radius: 5px;
z-index: 999;
}
.header {
background-color: #f0f0f0;
cursor: move;
height: 10%; /* 让头部高度为浮动窗口高度的10% */
text-align: center;
line-height: 20px;
}
.draggable {
display: inline-block;
width: 30px;
height: 100%; /* 占满头部的高度 */
text-align: center;
font-size: 1.2vw; /* 字体大小根据窗口宽度变化 */
font-weight: bold;
cursor: pointer;
}
.content {
padding-top: 10%; /* 留出顶部空间，防止内容与头部重叠 */
height: 90%; /* 占剩余空间 */
overflow-y: auto;
}
.entry {
display: flex;
align-items: center;
height: 15%; /* 每个条目的高度占浮动窗口高度的15% */
border-bottom: 1px solid #e0e0e0;
padding: 2px 5px;
}
.status-dot {
width: 2vw; /* 根据视窗宽度动态调整 */
height: 2vw; /* 根据视窗宽度动态调整 */
border-radius: 50%;
margin-right: 5px;
background-color: blue; /* 默认蓝色 */
}
.node-name {
flex: 3;
font-size: 2vw; /* 根据浮动窗口宽度调整字体大小 */
color: #333;
}
.status-data {
flex: 6;
font-size: 1.8vw; /* 根据浮动窗口宽度调整字体大小 */
color: #666;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}

11
Html/apps/static/js/chatbox.js
View File

@@ -136,6 +136,17 @@ document.addEventListener('DOMContentLoaded', function() {
$(systemMessage.id).remove();
}, 5000); // 5000 毫秒 = 5 秒
})
socket.on('process',function(data){
if (typeof data === 'string'){
data = JSON.parse(data);
}
// 遍历每个节点，并更新相应的条目
for (const nodeName in data) {
const statusData = data[nodeName];
updateEntry(nodeName, statusData); // 更新每个节点的条目
}
});
});

81
Html/apps/static/js/process_show_floating_window.js Normal file
View File

@@ -0,0 +1,81 @@
// 拖动浮动窗口功能
const floatingWindow = document.getElementById('floatingWindow');
const header = document.querySelector('.header');
const draggable = document.querySelector('.draggable');
let isDragging = false;
let offsetX, offsetY;
// 开始拖动
draggable.addEventListener('mousedown', (e) => {
isDragging = true;
offsetX = e.clientX - floatingWindow.getBoundingClientRect().left;
offsetY = e.clientY - floatingWindow.getBoundingClientRect().top;
document.addEventListener('mousemove', onMouseMove);
document.addEventListener('mouseup', () => {
isDragging = false;
document.removeEventListener('mousemove', onMouseMove);
});
});
// 拖动中
function onMouseMove(e) {
if (isDragging) {
floatingWindow.style.left = e.clientX - offsetX + 'px';
floatingWindow.style.top = e.clientY - offsetY + 'px';
}
}
// 动态生成新条目
function createEntry(nodeName) {
const entry = document.createElement('div');
entry.classList.add('entry');
const statusDot = document.createElement('div');
statusDot.classList.add('status-dot');
const nodeNameElement = document.createElement('div');
nodeNameElement.classList.add('node-name');
nodeNameElement.textContent = nodeName;
const statusData = document.createElement('div');
statusData.classList.add('status-data');
statusData.textContent = '流式数据...';
entry.appendChild(statusDot);
entry.appendChild(nodeNameElement);
entry.appendChild(statusData);
return entry;
}
// 更新条目内容
function updateEntry(nodeName, statusData) {
const contentDiv = document.getElementById('content');
const entries = contentDiv.children;
// 查找对应的条目
for (let entry of entries) {
const nodeNameElement = entry.querySelector('.node-name');
if (nodeNameElement.textContent === nodeName) {
const statusDot = entry.querySelector('.status-dot');
const statusDataElement = entry.querySelector('.status-data');
// 更新状态圆点颜色（根据状态来决定颜色，可以根据后端发送的状态修改）
statusDot.style.backgroundColor = 'green'; // 假设状态是正常的，暂时设置为绿色
// 更新流式数据
statusDataElement.textContent = statusData;
return; // 找到对应的条目后退出
}
}
// 如果没有找到对应条目，创建一个新的条目并添加到页面
contentDiv.appendChild(createEntry(nodeName));
updateEntry(nodeName, statusData); // 立即更新新条目
}
// 模拟后端数据流
// const socket = new WebSocket('ws://localhost:8080'); // 连接后端 WebSocket

28
Html/apps/templates/code-like-desktop.html
View File

@@ -101,7 +101,20 @@
<div class="toggle-button" id="toggleButton">
<div class="icon" id="toggleButton_icon">❮</div>
</div>
<link rel="stylesheet" href="/static/css/process_show_floating_window.css">
<div class="floating-window" id="floatingWindow">
<div class="header">
<span class="draggable">•••</span>
</div>
<div class="content">
</div>
</div>
<script src="/static/js/process_show_floating_window.js"></script>
<script src="/static/js/chatbox.js"></script>
<script>
@@ -168,14 +181,18 @@
.catch(error => {
console.error('Error fetching session:', error);
});
let lastiframe = null;
function OpenIframe(){
// 等待1s再加载
setTimeout(() => {
// 在成功获取 session 后创建并插入 iframe
if (lastiframe) {
lastiframe.remove();
}
const iframe = document.createElement('iframe');
const sessionInfo = data
iframe.src = '{{vscode_web_url}}/{{user_uuid}}/{{user_id}}/{{course_id}}/{{chapter_name}}/{{lesson_name}}/22';
lastiframe = iframe;
iframe.src = '/vsc-like/{{user_uuid}}/{{user_id}}/{{course_id}}/{{chapter_name}}/{{lesson_name}}/22';
iframe.style.width = '100%';
iframe.style.height = '99%';
@@ -184,11 +201,6 @@
},1500);
}
// 动态加载 Markdown 文件
function loadMarkdown(course_id, chapter_name, lesson_name) {