新框架下TPI实训任务

This commit is contained in:
daiao 2017-03-29 14:34:14 +08:00
parent 54e4ec526d
commit f597027de5
9 changed files with 79 additions and 233 deletions

View File

@ -1,7 +1,7 @@
<%= content_for(:header_tags) do %>
<%= javascript_include_tag 'baiduTemplate', 'jquery.datetimepicker.js' %>
<% end %>
<div id="code_results">
<div id="code_results" class="panel-footer CELL COLS mt15 ml15">
</div>
<script id="t:exec_results" type="text/html">
<div class="col-width fl mt15 content-half-fix undis" style="margin-top:125px;">
@ -29,7 +29,7 @@
<! } !>
</div>
</div>
<div class="col-width fl content-history mt15" >
<div class="col-width content-history CELL" >
<div class="panel-header clearfix">
<h3 class="fl">测评历史</h3>
<div class="fr mt5">
@ -57,15 +57,15 @@
<!--<! } !>-->
</div>
</div>
<div class="col-width fl content-output ml15 mt15">
<div class="panel-header">
<div class="col-width content-output ml15 CELL">
<div class="panel-header clearfix">
<h3 >测试输出</h3>
</div>
<div class="content-history-inner" id="game_test_output">
<!=output !>
</div>
</div>
<div class="col-width fl content-submit ml19 mt15">
<div class="col-width content-submit ml15 CELL">
<div class="panel-header ">
<h3 >操作</h3>
</div>

View File

@ -26,40 +26,10 @@
// get value right from instance
$('#challenge-answer-edit-small').val(cMirror.getValue());
});
$(".CodeMirror").css("line-height", 1.2);
var web_h = window.innerHeight;
// 设置版本库字体间距
$("#challenge-answer-edit-small" ).nextAll(".CodeMirror").css("line-height", 1.2);
$(document).ready(function(){
if($.browser.msie) {
$(".CodeMirror").css("height", web_h * 0.61 + "px");
$("#edit_code_contents").css("height", web_h * 0.61 + "px");
$("#challenge-answer-edit-small").css("height", web_h * 0.61 + "px");
}
else if($.browser.safari)
{
$(".CodeMirror").css("height", web_h * 0.61 + "px");
$("#edit_code_contents").css("height", web_h * 0.61 + "px");
$("#challenge-answer-edit-small").css("height", web_h * 0.61 + "px");
}
else if($.browser.mozilla)
{
$(".CodeMirror").css("height", web_h * 0.595 + "px");
$("#edit_code_contents").css("height", web_h * 0.595 + "px");
$("#challenge-answer-edit-small").css("height", web_h * 0.595 + "px");
}
else if($.browser.opera) {
$(".CodeMirror").css("height", web_h * 0.61 + "px");
$("#edit_code_contents").css("height", web_h * 0.61 + "px");
$("#challenge-answer-edit-small").css("height", web_h * 0.61 + "px");
}else if($.browser.chrome){
if(window.navigator.userAgent.indexOf("MetaSr") == -1){
$(".CodeMirror").css("height", web_h * 0.61 + "px");
$("#edit_code_contents").css("height", web_h * 0.61 + "px");
$("#challenge-answer-edit-small").css("height", web_h * 0.61 + "px");
}else{
$(".CodeMirror").css("height", web_h * 0.58 + "px");
$("#edit_code_contents").css("height", web_h * 0.58 + "px");
$("#challenge-answer-edit-small").css("height", web_h * 0.58 + "px");
}
}
// 设置codemirror的高度/宽度自适应
editor_CodeMirror.setSize("auto","auto")
});
</script>

View File

@ -1,14 +1,12 @@
<%= javascript_include_tag "/assets/codemirror/codemirror_python_ruby_c" %>
<%= stylesheet_link_tag "/assets/codemirror/codemirror" %>
<div class="content clearfix">
<div class="alert alert-blue mr45 mt15 ml15" id="myshixun_tip" >
<button data-dismiss="alert" class="task-close fr" type="button" id="close_myshixun_tip">×</button>
完成任务后,请点击“提交评测”按钮,若通过系统评测,将为你解锁下一关,祝你早日通关,加油!
</div>
<div class="content-row mr15">
<div class="content-info col-width fl">
<div class="panel-header clearfix">
<div class="alert alert-blue CELL mb15 ml15 mr15 mt15" id="myshixun_tip" >
<button data-dismiss="alert" class="task-close fr" type="button" id="close_myshixun_tip">×</button>
完成任务后,请点击“提交评测”按钮,若通过系统评测,将为你解锁下一关,祝你早日通关,加油!
</div>
<div class="content clearfix CELL _FLEX COLS ml15 mr15">
<div class="content-info col-width CELL" id="tpi_contents_info">
<div class="panel-header clearfix" id="contents_top">
<h3 class="fl">第<%= @game.stage %>关:<%= @game.subject %></h3>
<div class="fr mt5">
<a href="javascript:void(0);" onclick="extend_game_description();"><i class="fa fa-expand font-14 fl color-grey"></i></a>
@ -28,12 +26,14 @@
</ul>
<div class="cl"></div>
<div id="tab_con_1" class="tab-info" >
<div class="tab-info-inner">
<div class="tab-info-inner" id="task_pass_contents">
<%= h @game.task_pass.try(:html_safe) %>
</div>
</div>
<div id="tab_con_2" class="undis tab-info">
<div class="tab-info-inner"><%= h @game.ready_knowledge.try(:html_safe) %></div>
<div class="tab-info-inner" id="task_pass_contents">
<%= h @game.ready_knowledge.try(:html_safe) %>
</div>
</div>
<div id="tab_con_3" class="undis tab-info">
<div class="tab-info-inner" style="line-height: 1.9" id="game_answer_show"></div>
@ -41,14 +41,11 @@
</div>
</div>
</div>
<div id="code_content">
<%= render :partial => 'games/repository' %>
</div>
<%= render :partial => 'games/exec_results' %>
<%= render :partial => 'games/desc_full_show' %>
</div>
<%= render :partial => 'games/repository' %>
</div>
<%= render :partial => 'games/exec_results' %>
<%#= render :partial => 'games/desc_full_show' %>
<script type="text/javascript" language="javascript">
var myMirror = $("#game_answer_show")[0];
var myCodeMirror = CodeMirror(myMirror, {
@ -59,43 +56,9 @@
autofocus: true,
border: 0
});
$(document).ready(function(){
myCodeMirror.setSize('auto','590px');//设置高度
myCodeMirror.setSize('auto','auto');//设置版本库codemirror的高度
$("#game_answer_show").children().css("border", 0);
var web_h = window.innerHeight;
if($.browser.msie) {
$(".content").css("height", web_h - 75 + "px");
$(".tab-info-inner").css("height", web_h * 0.55 + "px"); //IE
$(".content-editor").css("height", web_h * 0.55 + 100 + "px");
}
else if($.browser.safari)
{
$(".content").css("height", web_h - 75 + "px");
$(".tab-info-inner").css("height", web_h * 0.55 + "px"); //Safari
$(".content-editor").css("height", web_h * 0.55 + 105 + "px");
}
else if($.browser.mozilla)
{
$(".content").css("height", web_h - 75 + "px");
$(".tab-info-inner").css("height", web_h * 0.48 + 50 + "px"); //Firefox
$(".content-editor").css("height", web_h * 0.48 + 155 + "px");
}
else if($.browser.opera) {
$(".content").css("height", web_h - 75 + "px");
$(".tab-info-inner").css("height", web_h * 0.55 + "px"); //Opera
$(".content-editor").css("height", web_h * 0.55 + 105 + "px");
}else if($.browser.chrome){
if(window.navigator.userAgent.indexOf("MetaSr") == -1){
$(".content").css("height", web_h - 75 + "px");
$(".tab-info-inner").css("height", web_h * 0.55 + "px");
$(".content-editor").css("height", web_h * 0.55 + 105 + "px");
}else{
$(".content").css("height", web_h - 75 + "px");
$(".tab-info-inner").css("height", web_h * 0.52 + "px");
$(".content-editor").css("height", web_h * 0.52 + 105 + "px");
}
}
});
//课程大纲tab
$("#close_myshixun_tip").click(function(){

View File

@ -10,7 +10,7 @@
<a href="javascript:void(0)" onclick="extend_repository();"><i class="fa fa-expand font-18 fl color-grey"></i></a>
</div>
</div>
<div class="content-editor-inner">
<div class="content-editor-inner" id="repository_contents_show">
<% if params[:action] == "entry" || @file_open %>
<div id="file_entry_content">
<%= render :partial => 'common/file', :locals => {:filename => @path, :content => @content} %>
@ -24,38 +24,8 @@
<script>
var web_h = window.innerHeight;
$(document).ready(function(){
if($.browser.msie) {
$(".content-half-fix02").css("height", web_h - 85 + "px");
$(".content-half-fix02").css("width", "86%");
$(".autoscroll_new").css("height", web_h * 0.61 + "px");
}
else if($.browser.safari)
{
$(".content-half-fix02").css("height", web_h - 85 + "px");
$(".content-half-fix02").css("width", "86%");
$(".autoscroll_new").css("height", web_h * 0.61 + "px");
}
else if($.browser.mozilla)
{
$(".content-half-fix02").css("height", web_h - 85 + "px");
$(".content-half-fix02").css("width", "86%");
$(".autoscroll_new").css("height", web_h * 0.595 + "px");
}
else if($.browser.opera) {
$(".content-half-fix02").css("height", web_h - 85 + "px");
$(".content-half-fix02").css("width", "86%");
$(".autoscroll_new").css("height", web_h * 0.61 + "px");
}else if($.browser.chrome){
if(window.navigator.userAgent.indexOf("MetaSr") == -1){
$(".content-half-fix02").css("height", web_h - 85 + "px");
$(".content-half-fix02").css("width", "86%");
$(".autoscroll_new").css("height", web_h * 0.61 + "px");
}else{
$(".content-half-fix02").css("height", web_h - 80 + "px");
$(".content-half-fix02").css("width", "85.7%");
$(".autoscroll_new").css("height", web_h * 0.583 + "px");
}
}
// 右侧版本库内容
$("#repository_contents_show").css("height", residue_h + 55 + "px");
});
function file_edit_submit(){
$('#file_update_id').submit();

View File

@ -1,52 +1,16 @@
<div class="content-editor col-width2 fl" id="myshixun_repository">
<div class="content-editor col-width2 CELL" id="myshixun_repository">
<%= render :partial => 'myshixun_repository' %>
</div>
<!--
<div class="col-width fl ml15 mt15 content-half-fix02 undis" style="border: none" id="myshixun_extend_repository">
<%= render :partial => 'myshixun_extend_repository' %>
<%#= render :partial => 'myshixun_extend_repository' %>
</div>
-->
<div class="cl"></div>
<script>
var web_h = window.innerHeight;
$(document).ready(function(){
if($.browser.msie) {
$(".content-half-fix02").css("height", web_h - 85 + "px");
$(".content-half-fix02").css("width", "86%");
$(".autoscroll_new").css("height", web_h * 0.61 + "px");
$(".autoscroll_extend").css("height", web_h * 0.825 + "px");
}
else if($.browser.safari)
{
$(".content-half-fix02").css("height", web_h - 85 + "px");
$(".content-half-fix02").css("width", "86%");
$(".autoscroll_new").css("height", web_h * 0.61 + "px");
$(".autoscroll_extend").css("height", web_h * 0.825 + "px");
}
else if($.browser.mozilla)
{
$(".content-half-fix02").css("height", web_h - 85 + "px");
$(".content-half-fix02").css("width", "86%");
$(".autoscroll_new").css("height", web_h * 0.595 + "px");
$(".autoscroll_extend").css("height", web_h * 0.825 + "px");
}
else if($.browser.opera) {
$(".content-half-fix02").css("height", web_h - 85 + "px");
$(".content-half-fix02").css("width", "86%");
$(".autoscroll_new").css("height", web_h * 0.61 + "px");
$(".autoscroll_extend").css("height", web_h * 0.825 + "px");
}else if($.browser.chrome){
if(window.navigator.userAgent.indexOf("MetaSr") == -1){
$(".content-half-fix02").css("height", web_h - 85 + "px");
$(".content-half-fix02").css("width", "86%");
$(".autoscroll_new").css("height", web_h * 0.61 + "px");
$(".autoscroll_extend").css("height", web_h * 0.835 + "px");
}else{
$(".content-half-fix02").css("height", web_h - 80 + "px");
$(".content-half-fix02").css("width", "85.7%");
$(".autoscroll_new").css("height", web_h * 0.58 + "px");
$(".autoscroll_extend").css("height", web_h * 0.825 + "px");
}
}
});
function close_big_repository(){
$(".content-half-fix02").hide()

View File

@ -1,46 +1,21 @@
<%= javascript_include_tag 'baiduTemplate', 'jquery.datetimepicker.js' %>
<%= javascript_include_tag "/assets/codemirror/codemirror_python_ruby_c" %>
<%= stylesheet_link_tag "/assets/codemirror/codemirror" %>
<div id="content_list">
<%= render :partial => "game_show" %>
</div>
<%= render :partial => "game_show" %>
<script type="text/javascript" language="javascript">
var web_h = window.innerHeight;
// contents_h 是中间左侧内容页的高度,不同浏览器的得到高度不一致
// contents_top_h 是内容页头部的高度
// contents_tab_nav是三个tab的高度
// residue_h contents剩余展示内容的高度
// 左侧内容
var contents_h = $("#tpi_contents_info").height();
var contents_top_h = $("#contents_top").height() + 20;
var contents_tab_nav = $("#tab_nav").height();
var residue_h = contents_h - contents_top_h - contents_tab_nav-15;
$(document).ready(function(){
if($.browser.msie) {
$(".content").css("height", web_h - 75 + "px");
$(".tab-info-inner").css("height", web_h * 0.55 + "px"); //IE
$(".content-editor").css("height", web_h * 0.55 + 100 + "px");
}
else if($.browser.safari)
{
$(".content").css("height", web_h - 75 + "px");
$(".tab-info-inner").css("height", web_h * 0.55 + "px"); //Safari
$(".content-editor").css("height", web_h * 0.55 + 105 + "px");
}
else if($.browser.mozilla)
{
$(".content").css("height", web_h - 75 + "px");
$(".tab-info-inner").css("height", web_h * 0.48 + 50 + "px"); //Firefox
$(".content-editor").css("height", web_h * 0.48 + 155 + "px");
}
else if($.browser.opera) {
$(".content").css("height", web_h - 75 + "px");
$(".tab-info-inner").css("height", web_h * 0.55 + "px"); //Opera
$(".content-editor").css("height", web_h * 0.55 + 105 + "px");
}else if($.browser.chrome){
if(window.navigator.userAgent.indexOf("MetaSr") == -1){
$(".content").css("height", web_h - 75 + "px");
$(".tab-info-inner").css("height", web_h * 0.55 + "px");
$(".content-editor").css("height", web_h * 0.55 + 105 + "px");
}else{
$(".content").css("height", web_h - 75 + "px");
$(".tab-info-inner").css("height", web_h * 0.52 + "px");
$(".content-editor").css("height", web_h * 0.52 + 105 + "px");
}
}
$(".tab-info-inner").css("height", residue_h+"px");
});
//课程大纲tab
function g(o){return document.getElementById(o);}
@ -52,6 +27,7 @@
g('tab_con_'+n).className='dis';
g('tab_nav_'+n).className='tab_hover';
if(n == 3){
// 点击参考答案时让codemirror展示,如果不refresh的话第一次展示会隐藏
myCodeMirror.refresh();
}
}

View File

@ -9,45 +9,48 @@
<%= favicon %>
<%= javascript_heads %>
<%= heads_for_theme %>
<%= stylesheet_link_tag 'jquery/jquery-ui-1.9.2','css/common', 'css/font-awesome','css/taskstyle','css/structure','scm','css/public', 'css/project','css/popup','repository','css/gantt', 'css/calendar', 'css/moduel' %>
<%= stylesheet_link_tag 'jquery/jquery-ui-1.9.2','css/common', 'css/font-awesome','css/taskstyle','css/structure','scm','css/public', 'css/project','css/popup','repository','css/gantt', 'css/calendar', 'css/moduel', 'css/cssPlus-v.0.2-build' %>
<%= call_hook :view_layouts_base_html_head %>
<!-- page specific tags -->
<%= yield :header_tags -%>
</head>
<%= @shixun %>
<!--add by huang-->
<body onload="prettyPrint();">
<div class="cl"></div>
<div class="task-container">
<div class="leftbar">
<div class="user-info">
<%= link_to image_tag(url_to_avatar(@myshixun.owner), :width => "100", :height => "100"), user_path(@myshixun.owner), :alt => "用户头像", :class => "user-info-img" %>
<!--<a href="#" class="user-info-img"><img src="images/user/male.jpg" width="100" height="" alt="100"></a>-->
<%= link_to @myshixun.owner.try(:show_name), user_path(@myshixun.owner), :class => "user-info-name" %>
<div class="task-container EXTENDER">
<div class="COLS">
<div class="leftbar CELL">
<div class="CELL">
<div class="user-info">
<%= link_to image_tag(url_to_avatar(@myshixun.owner), :width => "100", :height => "100"), user_path(@myshixun.owner), :alt => "用户头像", :class => "user-info-img" %>
<!--<a href="#" class="user-info-img"><img src="images/user/male.jpg" width="100" height="" alt="100"></a>-->
<%= link_to @myshixun.owner.try(:show_name), user_path(@myshixun.owner), :class => "user-info-name" %>
</div>
<div class="leftnav">
<ul>
<li class="leftnav-box">
<a href="<%= myshixun_game_path(@myshixun.current_task, :myshixun_id => @myshixun) %>" class="leftnav-box-inner leftnav-active" id="current_task_tab" data-remote="true">
<i class="fa fa-gamepad font-28"></i><br/><span class="font-16">当前任务</span>
</a>
</li>
<li class="leftnav-box">
<a href="<%= myshixun_games_path(@myshixun) %>" class="leftnav-box-inner" id="all_task_tab" data-remote="true">
<i class="fa fa-qrcode font-28"></i><br/><span class="font-16">全部任务</span><span class="btn-cir ml5"><%= @myshixun.games.count %></span>
</a>
</li>
</ul>
</div>
</div>
</div>
<div class="leftnav">
<ul>
<li class="leftnav-box">
<a href="<%= myshixun_game_path(@myshixun.current_task, :myshixun_id => @myshixun) %>" class="leftnav-box-inner leftnav-active" id="current_task_tab" data-remote="true">
<i class="fa fa-gamepad font-28"></i><br/><span class="font-16">当前任务</span>
</a>
</li>
<li class="leftnav-box">
<a href="<%= myshixun_games_path(@myshixun) %>" class="leftnav-box-inner" id="all_task_tab" data-remote="true">
<i class="fa fa-qrcode font-28"></i><br/><span class="font-16">全部任务</span><span class="btn-cir ml5"><%= @myshixun.games.count %></span>
</a>
</li>
</ul>
<div class="rightbar CELL _FLEX ROWS">
<%= render :partial => "myshixuns/myshixun_top" %>
<%= render_flash_messages %>
<%= yield %>
</div>
</div>
<div class="rightbar">
<%= render :partial => "myshixuns/myshixun_top" %>
<%= render_flash_messages %>
<%= yield %>
</div>
</div>
<div id="ajax-position">
<div id="ajax-indicator" style="display:none;">
<span><%= l(:label_loading) %></span>

View File

@ -1,4 +1,4 @@
<div class="rightbar-header clearfix">
<div class="rightbar-header clearfix CELL">
<h2 class="rightbar-h2 fl"><%= @myshixun.name %></h2>
<a href="javascript:void(0)" class="fr rightbar-pause" id="leave_shixun_page"><i class="fa fa-power-off font-20 mt5"></i><span class="ml10">暂时离开</span></a>
<ul class="rightbar-score fr" >

View File

@ -114,7 +114,7 @@ a.rightbar-pause{ color:#29bd8b; font-size: 18px; margin-right:245px; margin-top
.dis {display:block;}
.tab-info{ }
.content-editor-inner{ overflow:auto; height:600px; }
.tab-info-inner{ overflow:auto; height:600px; margin:15px 0 0px 15px;}
.tab-info-inner{ overflow:auto; height:600px; margin:0 0 0px 15px;padding-top: 15px}
.content-history-inner{height:135px; overflow:auto; padding:15px;}
.content-history{width:48.7%; min-width:500px; }
.history-success{ width: 100%; height:40px; line-height: 40px; background:#eef1f2; color:#666; }
@ -126,7 +126,7 @@ a.rightbar-pause{ color:#29bd8b; font-size: 18px; margin-right:245px; margin-top
.content-submitbox{ width:120px; margin: 15px auto; height:135px;}
.panel-inner{ background:#EFF2F7; margin:15px; padding:15px;}
.panel-inner-title{ font-size: 14px; color: #666; max-width:85%; line-height:30px;word-wrap: break-word;}
.panel-footer{ min-width:1000px;}
.panel-footer{ min-width:1000px; height: 210px!important;}
/* 弹框 */
.task-popup{ width: 30%;background: #fff; border:1px solid #e8e8e8; border-radius:3px; -webkit-box-shadow:0 0 10px #ccc; -moz-box-shadow:0 0 10px #ccc; box-shadow:0 0 10px #ccc; margin: 50px auto;}
.task-popup-text-center{ text-align: center; color: #666;}
@ -166,7 +166,7 @@ textarea.task-textarea-pd{ padding-bottom: 0px; padding-top:0px;}
input.knowledge_frame{height:30px;line-height:30px;border:none;background:#f3f5f7;}
/* TPi全屏展示css */
.content-all-fix{ margin:0; position: absolute; top:15px; z-index:99; }
.content-all-fix .tab-info-inner{ overflow:auto; margin:15px 0 0px 15px; }
.content-all-fix .tab-info-inner{ overflow:auto; margin:0 0 0px 15px;padding-left: 15px }
.content-half-fix{ min-width:450px; margin:0; position: absolute; top:15px; z-index:99;}
.content-half-fix02{margin:0; position: absolute; top:65px; z-index:99; right:45px;}