Go to file
Jasder 529a64194e FIX update .gitigore and rm .idea directory 2020-03-25 12:36:28 +08:00
config FIX 更改build profuction的配置文件 2020-03-17 21:58:04 +08:00
public issue 2020-03-23 20:33:47 +08:00
scripts FIX 更改build profuction的配置文件 2020-03-17 21:58:04 +08:00
src 修改权限 2020-03-25 10:43:45 +08:00
.gitignore FIX update .gitigore and rm .idea directory 2020-03-25 12:36:28 +08:00
LICENSE LICENSE 2020-03-16 10:48:08 +08:00
add.txt FIX test push 2020-03-18 16:11:04 +08:00
index.js first commit 2020-03-16 14:12:11 +08:00
package-lock.json 前端修改build 2020-03-23 15:59:50 +08:00
package.json 前端修改build 2020-03-23 15:59:50 +08:00
readme.txt first commit 2020-03-16 14:12:11 +08:00

readme.txt

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

其他的文档位置:
/educoder/public/react/public/js/readme.txt					关于js_min_all
/educoder/educoder/public/react/scripts/readme-cdn.txt		关于CDN
/educoder/public/react/src/modules/page/readme.txt			关于TPI
/educoder/public/editormd/lib/readme-marked.txt				关于md编辑器 marked.js

1、 安装node v6.9.x此安装包含了node和npm。

2、 安装cnpm命令行 npm install -g cnpm --registry=https://registry.npm.taobao.org

3、 安装依赖的js库public/react目录下<即项目package.json所在目录>,开启命令行): cnpm install

4、 如果你的ruby服务使用的是3000端口则需要在package.json中修改"port"参数的值

5、 启动服务(命令行-目录同3 npm start

6、 build初始化 npm run build

注意:
1、cnpm install 之前先需要修改下ruby mine的一个settings防止ruby mine对node_modules目录里的内容建索引详情见线上文档-react开发环境搭建


线上文档-react开发环境搭建 地址: https://www.trustie.net/boards/6862/topics/46425

2、package.json中配置
"proxy": "http://localhost:3000",
"port": "3007"

目前暂时必须写为和上面的一样ruby服务端口为3000node服务端口为3007当当前端口为3007时程序会将axios发出的请求转到localhost:3000上进行跨域请求。

3、静态js加载问题
	editormd源码改动注释掉了564行 加载codemirror/codemirror.min的js代码。因为codemirror 已经加载了codemirror对象会带有插件重复加载会覆盖全局codemirror对象使得之前加载的插件失效

----------------------------------------------------------------------------------------------

React开发相关知识点
	需要了解的ES6的知识 https://www.trustie.net/boards/6862/topics/46427

----------------------------------------------------------------------------------------------

新加入的lib有	axios、material-ui、lodash、classnames、moment、immutability-helper
				rc-tree、rc-form 、rc-rate、rc-pagination、rc-select 、showdown
考虑替代删除确认弹出框的组件http://react-component.github.io/tooltip/examples/onVisibleChange.html


----------------------------------------------------------------------------------------------
TPI State整理 START
----------------------------------------------------------------------------------------------
TPIContextProvider  详情接口的所有state

	Index.js 
		taskListLoading
		challenges
		challengesDrawerOpen

	MainContentContainer.js
		repositoryCode: '',     
		currentPath: '', 		// 当前所选的path可能是一个只读的path只读path的话challenge.athIndex为-1
		isEditablePath			//  是否是可以编辑的path
          
        open: false,			// 繁忙等级等提示用Dialog TODO 考虑重构封装到根组件
        gameBuilding: false, // 评测中标志
        codeStatus: 2, //  0 已修改  1 保存中  2 已保存   3 保存失败 

        codeLoading: false,		 			// code加载中
        resetCodeDialogOpen: false,			// TODO考虑重构封装到根组件
        resetPassedCodeDialogOpen: false,	// TODO考虑重构封装到根组件


        LeftViewContainer.js
        	tabIndex: 0,				页签index
			dialogOpen: false,
			gameAnswer: '',				答案
			snackbarOpen: false,
			comments: [],				评论
			comment_count_without_reply: 0,		评论数量  TODO 和详情接口字段重复
			// 默认pageSize为10
			currentPage: 1,				评论分页
			loadingComments: true,		评论加载中
			gotNewReply: false,			新的回复

        CodeRepositoryViewContainer.js
        	drawerOpen: false,					
			loadingFirstRepoFiles: false,			  	drawer里的loading状态
			fileTreeData: "",							文件树
			codeRepositoryViewExpanded: false,			展开状态


		CodeEvaluateView.js
			testSetsInitedArray:  testSetsExpandedArrayInitVal.slice(0),		测试集是否初始化标志	
			evaluateViewExpanded: false,
			tabIndex: 1,					页签index
----------------------------------------------------------------------------------------------
TPI State整理 END
----------------------------------------------------------------------------------------------

----------------------------------------------------------------------------------------------
重要TPI实现时修改的js库的记录 START
----------------------------------------------------------------------------------------------

----------------------------------------------------------------------------------------------
重要TPI实现时修改的js库的记录 END
----------------------------------------------------------------------------------------------
create_kindeditor.js  					__isR 表示是react环境react环境下采用事件通知react组件来处理
	if (window['__isR'] === true) {
        $(document).trigger("onReply", { commentContent:tContents, id:id, editor:params.editor } );
    } else {
        params.form.submit();
    }

editormd.min.js  						直接注释掉了codemirror.min的加载应该改成有codeMirror了则不加载
	// codemirror 已经加载了codemirror会有插件重复加载会使得之前加载的插件失效
    // editormd.loadScript(loadPath + "codemirror/codemirror.min", function() {
对应提交项 
Revision: 73d95ce266d5d7e55a3a88d08d1247b3a08c7caf
Date: 2018/4/2 16:12:21
Message: 切下一题时更新左侧editormd里的内容更新右侧codemirror内容。

js_min_all.js     						最后面手动加入了若干js代码还没做分离、再合并处理		date:180507
	is_cdn_link tpi_html_show方法




----------------------------------------------------------------------------------------------
TPM使用react实现的利弊 START
----------------------------------------------------------------------------------------------
1、全部使用react重写
	做法第一屏使用新接口之前的js脚本还是继续使用有必要的话需要局部刷新的将部分jquery实现改为react实现
利:
	tpi中评论组件、文件树组件方便复用
	js、css库管理方便

	暂时不依赖于react的状态管理
		之前的ajax请求还是可以暂时复用


弊:
	接口评估?
	rails模板要改成jsx语法
	头部功能区域、底部静态链接区域会存在重复代码  react版和非react版
	codemirror等组件的使用会不会有问题

	学习成本

	目前决定新页面或者评论组件所在页面使用react实现
----------------------------------------------------------------------------------------------
TPM使用react实现的利弊 END
----------------------------------------------------------------------------------------------


其他方式comments组件build到新入口后将代码copy到rails页面
----------------------------------------------------------------------------------------------
不错的库 START
----------------------------------------------------------------------------------------------
https://livicons.com/icons-original			-- 收费  动画icon
https://github.com/maxwellito/vivus			-- 让SVG标签动起来
http://ianlunn.github.io/Hover/				-- hover 动画
https://github.com/legomushroom/mojs
https://github.com/juliangarnier/anime    --js动画
https://codepen.io/juliangarnier/pen/gmOwJX
https://github.com/daneden/animate.css


A responsive tour snippet, with a step-by-step guide(onboarding) to help users understand how to use your website.

https://github.com/sorich87/bootstrap-tour
https://github.com/linkedin/hopscotch
https://github.com/Robophil/Product-Tour

code editor
https://microsoft.github.io/monaco-editor/