标签:上下 提交 实战 enter 部分 作业 ide 一个 文本
这是一个Python学习系统,主要提供给成年人。交互方式为对话式,不过里面的对话全部是通过脚本内置好的。用户通过Enter
展示下一句对话,支持语音自动朗读。
先看架构!
提供了课程学习回使用到的通用功能模块
图片展示系统。标准化图片展示(限制展示图片在640px*480px范围内)、点击放大、多图切换,以及可定制化功能(比如知识卡片中定制了一个点击按钮,点击后定位到图片所在的学习上下文环境)
习题系统。提供标准的习题模块,供互动学习、巩固练习使用。
在线Python编程系统。该系统的核心。分为两个模块,编辑器和在线终端。流程是:
1.初始化编程模块\链接websoket,websoket直接链接python的docker镜像。
2.用户编写代码,点击运行。将代码传递给后台,后台保存为一个py文件,返回文件路径以及执行命令字符串。
3.前端将执行命令字符串通过websoket
传递给python的镜像
运行。运行过程中产生的打印通过websoket源源不断传递给前端。前端接收后展示到在线终端。websocket的接收前端可以控制,当遇到base64格式
的数据,前端会缓存下来,接收的图片数据不会展示到终端,而是额外展示。还支持url
格式(这种格式主要是html链接,可以支持动态交互的效果)。
4.识别服务端通过websocket传递来的终止符号,判断打印中是否有报错,没有报错则视为成功,自动断开websokect。此时用户不能再对代码经行编辑。
5.如果打印有报错,则认为程序执行异常。保持为异常状态。此时用户可以二次编辑程序和运行。或者跳过,跳过视为失败,断开websocket。
再2-3步中间有一个检测websocket链接的过程,如果websocket是断开的状态,则重新链接成功后再继续往下走。
编程系统的完整的状态机如下
这个状态机有一个特点Websocket
对用户来说是透明的,最多就一个提示,但不影响操作。市面上很多产品都是Websocket断开后,整个编程模块就用不了,需要用户手动点击后重新链接。
还有一个特点是,如果程序执行报错,如果用户没有点击跳过而是直接关闭浏览器(视为放弃),用户下次进来是最近的一个最终状态,数据也是这个状态的数据。这个特点仁者见仁吧。
这一层是用户学习的主要板块,包括三个功能部分
互动学习。作为课堂学习的主要内容。支持的数据类型丰富:文本、图片、视频、代码段、内嵌编程练习器、选题题等。
额外还支持的功能有弹幕系统、知识卡片(用户学习过后的课程图片整理,便于用户复习)、语音朗读控制。
巩固练习。可以理解为做题练习。目前支持单选题,题目以及选项支持文本、图片、代码段展示。
项目实战。编程挑战练习,给定任务要求,用户根据要求编程。
这块主要模块式基础支持层的在线Python编程系统。
这里有一个提交作业
的按钮,这个按钮的展示主要有三种状态:disabled/enable/hide:分别表示按钮展示但不可点击/展示且可点击/隐藏。这三种状态又和编程系统中的Python代码运行状态有关系。
最终形成的状态机如下
这个状态机可以结合着在线Python编程系统的状态机来看。有一点不同就是:项目实践中用户不可以“跳过该题
”。
这一层主要包括课程中心、用户中心、路由和独立出来的数据/状态管理器(UI和数据分离)。
还有一个基础模块,数据采集模块。在三个层都可以使用。支持声明式埋点和命令式埋点。
标签:上下 提交 实战 enter 部分 作业 ide 一个 文本
原文地址:https://www.cnblogs.com/chuaWeb/p/13686720.html