Commit 1e45e73d80347a79466413262dd17fcbfd29df40

Authored by ykxie
2 parents 6e08202d 6792eda2

Merge branch 'fixbug'

src/css/recording.css
... ... @@ -341,6 +341,27 @@ button {
341 341 border-bottom: 1px solid #999;
342 342 border-radius: 0; }
343 343  
  344 +#previewpanel #autorun {
  345 + background: url("../img/icon/run.svg") no-repeat;
  346 + background-size: 100%;
  347 + height: 28px;
  348 + width: 28px;
  349 + margin: 4px 8px; }
  350 +
  351 +#previewpanel #runnow {
  352 + background: transparent;
  353 + border: none;
  354 + color: #FFF;
  355 + margin-top: 1px;
  356 + font-size: 16px; }
  357 +
  358 +#previewpanel #fontendrun {
  359 + border-radius: 20px;
  360 + padding: 0px 8px;
  361 + color: #FFF;
  362 + background: -webkit-linear-gradient(left, #1FB6FF, #62DDF5);
  363 + background: -moz-linear-gradient(left, #1FB6FF, #62DDF5); }
  364 +
344 365 #countdown {
345 366 position: absolute;
346 367 top: 0;
... ...
src/img/icon/run.svg 0 → 100644
  1 +<?xml version="1.0" encoding="UTF-8"?>
  2 +<svg width="14px" height="14px" viewBox="0 0 14 14" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
  3 + <!-- Generator: Sketch 41 (35326) - http://www.bohemiancoding.com/sketch -->
  4 + <title>点击运行</title>
  5 + <desc>Created with Sketch.</desc>
  6 + <defs>
  7 + <linearGradient x1="100%" y1="50%" x2="0%" y2="50%" id="linearGradient-1">
  8 + <stop stop-color="#5CEFFF" offset="0%"></stop>
  9 + <stop stop-color="#4CE2FF" offset="100%"></stop>
  10 + </linearGradient>
  11 + <ellipse id="path-2" cx="7" cy="7" rx="7" ry="7"></ellipse>
  12 + <mask id="mask-3" maskContentUnits="userSpaceOnUse" maskUnits="objectBoundingBox" x="0" y="0" width="14" height="14" fill="white">
  13 + <use xlink:href="#path-2"></use>
  14 + </mask>
  15 + </defs>
  16 + <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
  17 + <g id="01-学习中心-实境编程-前端语言" transform="translate(-772.000000, -183.000000)">
  18 + <g id="视频" transform="translate(120.000000, 171.000000)">
  19 + <g id="右侧运行窗口" transform="translate(635.000000, 0.000000)">
  20 + <g id="点击运行" transform="translate(11.000000, 9.000000)">
  21 + <g transform="translate(6.000000, 3.000000)">
  22 + <use id="Oval-3" stroke="url(#linearGradient-1)" mask="url(#mask-3)" stroke-width="2" fill="#FFFFFF" xlink:href="#path-2"></use>
  23 + <path d="M9.98962544,4.22519836 L9.38188024,4.83303696 C9.90319161,5.40580705 10.2236645,6.16442622 10.2236645,7.0000467 C10.2236645,8.78027552 8.78029887,10.2236879 6.99992996,10.2236879 L6.99992996,9.25680567 L6.99992996,9.25661888 C6.99992996,9.07861468 6.85559339,8.93413803 6.67768258,8.93413803 C6.49949159,8.93413803 6.23001041,9.25661888 6.23001041,9.25661888 L4.421017,11.08331 L6.99992996,11.08331 C9.25524136,11.08331 11.0833333,9.25503123 11.0833333,7.0000467 C11.0833333,5.92711841 10.666387,4.95397895 9.98962544,4.22519836 M3.77633545,7.0000467 C3.77633545,5.21972448 5.21970113,3.7763121 6.99992996,3.7763121 L6.99992996,4.74338112 C6.99992996,4.9215721 7.14440661,5.06581528 7.32241082,5.06581528 C7.50055511,5.06581528 7.76998959,4.74338112 7.76998959,4.74338112 L9.578983,2.91669001 L6.99992996,2.91669001 C4.74494542,2.91669001 2.91666667,4.74492208 2.91666667,7.0000467 C2.91666667,8.07283489 3.33361303,9.04597435 4.01037456,9.77470825 L4.61811976,9.16691635 C4.09699518,8.59414626 3.77633545,7.83557378 3.77633545,7.0000467" id="Fill-26-Copy" fill="#58ECFF"></path>
  24 + </g>
  25 + </g>
  26 + </g>
  27 + </g>
  28 + </g>
  29 + </g>
  30 +</svg>
0 31 \ No newline at end of file
... ...
src/index.html
... ... @@ -125,6 +125,12 @@
125 125 <p id="replay">预览录制</p>
126 126 </div>
127 127 <div class="btn-group pull-right" id="comprunbtngrp"></div>
  128 + <!-- <div class="btn-group pull-right" id="fontendrun">
  129 + <button id="autorun" type="button" class="btn" title="切换自动/手动运行代码" data-placement="bottom" data-autorun="1"></button>
  130 + <button id="runnow" type="button" class="btn" title="手动运行代码" data-placement="bottom" disabled="disabled">
  131 + 自动运行
  132 + </button>
  133 + </div> -->
128 134 </div>
129 135 <div class="panel-body hidden" id="cmprun-output">
130 136 <div id="resultoutput">
... ...
src/js/gbreplayer.js
... ... @@ -539,15 +539,14 @@ $(function(){
539 539  
540 540 // 播放录制代码过程
541 541 $('.audio-play').unbind('click').click(function(){
542   - Hourglass.init();
543 542 var resultData = {
544 543 output: '',
545 544 stderr: '',
546 545 cmpinfo: '',
547 546 result: 1
548 547 }
  548 + GBCodePlayBack.htmlplayereditor.setValue('');
549 549 compileResult(resultData);
550   -
551 550 var data = $(this).attr('data');
552 551 if (_role == 0) {
553 552 $('.audio-play').attr('disabled', true);
... ... @@ -569,10 +568,10 @@ $(function(){
569 568 }
570 569 GBCodePlayBack.recordtimeoutcontrolls = [];
571 570 /* END 初始化播放 */
572   - GBCodePlayBack.htmlplayereditor.setValue('');
573 571  
574 572 playbtn.data('status', 0);
575 573 $('#play').trigger('click');
  574 + Hourglass.init();
576 575 });
577 576  
578 577 //setting speed in cookie
... ... @@ -932,7 +931,6 @@ $(function(){
932 931 dataType: "json",
933 932 contentType: "application/json",
934 933 success: function(data){
935   - console.log(data);
936 934 $(window).unbind('beforeunload');
937 935 var _data = {
938 936 "programId": data.codeReplayId,
... ... @@ -986,53 +984,19 @@ $(function(){
986 984 GBCodePlayBack.replay_enhancement = !GBCodePlayBack.replay_enhancement;
987 985 });
988 986  
989   -
990   - $('#autorun').click(function(){
991   - var $this = $(this), autorun = $this.data('autorun');
992   -
993   - if(autorun===1){
994   - $('#runnow').prop('disabled',false).toggleClass('btn-success').toggleClass('btn-default');
995   - }else{
996   - $('#runnow').prop('disabled',true).toggleClass('btn-success').toggleClass('btn-default');
997   - }
998   -
999   - $this.data('autorun', (autorun)?0:1);
1000   - GBCodePlayBack.autorun = !GBCodePlayBack.autorun;
1001   -
1002   - $('#runnow').trigger('click');
1003   - });
1004   -
1005   - if(GBCodePlayBack.autorun===1){
1006   - $('#runnow').prop('disabled',true).removeClass('btn-success').addClass('btn-default');
1007   - }else{
1008   - $('#runnow').prop('disabled',false).addClass('btn-success').removeClass('btn-default');
1009   - }
1010   -
1011   - $('#runnow').click(function(){
1012   - if(typeof GBCodePlayBack.htmleditor !== 'undefined'&&typeof GBCodePlayBack.csseditor !== 'undefined'&&typeof GBCodePlayBack.jseditor !== 'undefined'){
1013   - GBCodePlayBack.generateResult(GBCodePlayBack.htmleditor.getValue(),
1014   - GBCodePlayBack.csseditor.getValue(),
1015   - GBCodePlayBack.jseditor.getValue()
1016   - );
1017   -
1018   - return false;
1019   - }
1020   -
1021   - if(typeof GBCodePlayBack.htmlplayereditor !== 'undefined'&&typeof GBCodePlayBack.cssplayereditor !== 'undefined'&&typeof GBCodePlayBack.jsplayereditor !== 'undefined'){
1022   - GBCodePlayBack.generateResult(GBCodePlayBack.htmlplayereditor.getValue(),
1023   - GBCodePlayBack.cssplayereditor.getValue(),
1024   - GBCodePlayBack.jsplayereditor.getValue()
1025   - );
1026   - }
1027   - });
1028   -
1029 987 // 使用服务端编译语言
1030 988 $('#comprunbtngrp').unbind("click").on('click', '#comprun', function(event){
1031 989 event.preventDefault();
1032 990 var l = Ladda.create(this);
1033   - $('#comprun').find('ladda-spinner').remove()
  991 + $('#comprun').find('ladda-spinner').remove();
1034 992 l.start();
  993 + var runStatus = $("#comprun").data('run');
1035 994  
  995 + if(runStatus == 1){
  996 + Hourglass.pauseTimer(); // 暂停计时器
  997 + recorder.pause(); // 音频暂停
  998 + }
  999 + $("#comprun").data('run', 0);
1036 1000 // 暂停录制
1037 1001 var pauseState = $('#pause').data('pause');
1038 1002 if(pauseState == 1 && _role == 0){
... ... @@ -1055,10 +1019,6 @@ $(function(){
1055 1019 playTime: 0
1056 1020 };
1057 1021 GBCodePlayBack.records.push(recordobj);
1058   - console.log(GBCodePlayBack.records)
1059   -
1060   - Hourglass.pauseTimer(); // 暂停计时器
1061   - recorder.pause(); // 音频暂停
1062 1022  
1063 1023 $('#pause').data('status', '1');
1064 1024 $('#pause').data('pause', '0');
... ... @@ -1066,21 +1026,18 @@ $(function(){
1066 1026 $('#start-recording').hide();
1067 1027  
1068 1028 $('.pause-shodow').removeClass('hidden').addClass('show');
  1029 +
1069 1030 }
1070 1031  
1071 1032 var code = (typeof GBCodePlayBack.htmleditor !=='undefined' && GBCodePlayBack.htmleditor.getValue())
1072 1033 || (typeof GBCodePlayBack.htmlplayereditor !=='undefined' && GBCodePlayBack.htmlplayereditor.getValue());
1073   -
1074 1034 var langid = $('#htmlbutton').data("languageid");
1075   -
1076 1035 var input = $('#input').val() || '';
1077   -
1078 1036 var compileData = {
1079   - code:code,
1080   - langid:langid,
1081   - input: input
  1037 + code: code,
  1038 + langid: langid,
  1039 + input: input
1082 1040 }
1083   -
1084 1041 $.ajax({
1085 1042 type: "post",
1086 1043 url: gxb_api + "/submit/submitCode/api",
... ... @@ -1098,7 +1055,7 @@ $(function(){
1098 1055 },
1099 1056 error: function(){
1100 1057 l.stop();
1101   - alert('错误')
  1058 + alert('错误');
1102 1059 }
1103 1060 });
1104 1061 });
... ... @@ -1108,6 +1065,7 @@ $(function(){
1108 1065 $('#save_compile').unbind("click").click(function(){
1109 1066 var length = GBCodePlayBack.records.length - 1;
1110 1067 Hourglass.pauseTimer();
  1068 + $("#comprun").data('run', 1);
1111 1069 GBCodePlayBack.records[length].compile = GBCodePlayBack.compileResultData;
1112 1070  
1113 1071 GBCodePlayBack.records[length].output = GBCodePlayBack.compileResultData.output;
... ... @@ -1117,13 +1075,14 @@ $(function(){
1117 1075  
1118 1076 GBCodePlayBack.record_continue_time = new Date().getTime();
1119 1077  
1120   - contrlPause()
  1078 + contrlPause();
1121 1079  
1122 1080 })
1123 1081  
1124 1082 // 不保存编译结果
1125 1083 $('#cancel_compile').unbind('click').click(function(){
1126 1084 Hourglass.pauseTimer();
  1085 + $("#comprun").data('run', 1);
1127 1086 contrlPause()
1128 1087 GBCodePlayBack.record_continue_time = new Date().getTime();
1129 1088 })
... ... @@ -1412,7 +1371,6 @@ $(function(){
1412 1371 };
1413 1372 GBCodePlayBack.records.push(recordobj);
1414 1373 GBCodePlayBack.record_startime = currenttime; //设定起始时间
1415   - console.log(GBCodePlayBack.records);
1416 1374 },
1417 1375 changeValueCallback: function(record, replay_type, offset) {
1418 1376 var obj = record.changeobj,
... ... @@ -1452,8 +1410,6 @@ $(function(){
1452 1410 }else{
1453 1411 GBCodePlayBack.triggertotal += 1;
1454 1412 }
1455   -
1456   - console.log(record);
1457 1413  
1458 1414 /*计算播放进度*/
1459 1415 var percertage = '0%',
... ... @@ -1579,6 +1535,7 @@ $(function(){
1579 1535 cmpinfo: '',
1580 1536 result: 1
1581 1537 };
  1538 + runResult()
1582 1539 if(data == 1){
1583 1540 $("#countdown").find('img').attr('src', 'img/ready-go.gif');
1584 1541 $("#countdown").find('img').load(function(){
... ... @@ -1601,6 +1558,10 @@ $(function(){
1601 1558 })
1602 1559  
1603 1560 $('#re-recoding').click(function(){
  1561 + $('#audio')[0].pause();
  1562 + Hourglass.stopTimer();
  1563 + playEnd()
  1564 + $('.audio-play').attr('disabled', false);
1604 1565 $('.re-tips').show();
1605 1566 })
1606 1567  
... ... @@ -1613,6 +1574,40 @@ $(function(){
1613 1574 $(".re-tips").hide();
1614 1575 })
1615 1576  
  1577 + // 切换自动/手动运行代码
  1578 + $('#autorun').click(function(){
  1579 + var $this = $(this),
  1580 + autorun = $this.data('autorun');
  1581 + autoRun(autorun)
  1582 + $this.data('autorun', (autorun) ? 0 : 1);
  1583 + GBCodePlayBack.autorun = !GBCodePlayBack.autorun;
  1584 + runResult()
  1585 + });
  1586 +
  1587 + $('#runnow').click(function(){
  1588 + runResult()
  1589 + });
  1590 +
  1591 +
  1592 + // 切换自动/手动运行代码
  1593 + function autoRun(autorun){
  1594 + if(autorun===1){
  1595 + $('#runnow').prop('disabled',false).html('手动运行').attr('data-original-title', '手动运行');
  1596 + }else{
  1597 + $('#runnow').prop('disabled',true).html('自动运行').attr('data-original-title', '自动运行');
  1598 + }
  1599 + }
  1600 +
  1601 + // 编译结果
  1602 + function runResult(){
  1603 + if(typeof GBCodePlayBack.htmleditor !== 'undefined'){
  1604 + GBCodePlayBack.generateResult(GBCodePlayBack.htmleditor.getValue());
  1605 + return false;
  1606 + }
  1607 + if(typeof GBCodePlayBack.htmlplayereditor !== 'undefined'){
  1608 + GBCodePlayBack.generateResult(GBCodePlayBack.htmlplayereditor.getValue());
  1609 + }
  1610 + }
1616 1611  
1617 1612  
1618 1613 // 初始化页面
... ... @@ -1748,7 +1743,7 @@ $(function(){
1748 1743 // $('#comprunbtngrp').html('<button id="runnow" type="button" data-style="expand-right" class="btn" title="运行代码">&nbsp; 运行</button>');
1749 1744 }else{
1750 1745 $('#fontendrun').addClass('hidden');
1751   - $('#comprunbtngrp').html('<button id="comprun" type="button" data-style="expand-right" class="btn" title="编译并运行代码">&nbsp;编译&运行</button>');
  1746 + $('#comprunbtngrp').html('<button id="comprun" type="button" data-run="1" data-style="expand-right" class="btn" title="编译并运行代码">&nbsp;编译&运行</button>');
1752 1747  
1753 1748 $('#ifrcontainer').addClass('hidden');
1754 1749 $('#cmprun-output').removeClass('hidden');
... ...
src/scss/recording.scss
... ... @@ -211,8 +211,6 @@ button{
211 211 border: none;
212 212 }
213 213 }
214   -
215   -
216 214 }
217 215  
218 216 .recording-audio{
... ... @@ -441,6 +439,28 @@ button{
441 439 border-radius: 0;
442 440 }
443 441 }
  442 +
  443 + #autorun{
  444 + background: url('../img/icon/run.svg') no-repeat;
  445 + background-size: 100%;
  446 + height: 28px;
  447 + width: 28px;
  448 + margin: 4px 8px;
  449 + }
  450 + #runnow{
  451 + background: transparent;
  452 + border: none;
  453 + color: #FFF;
  454 + margin-top: 1px;
  455 + font-size: 16px;
  456 + }
  457 + #fontendrun {
  458 + border-radius: 20px;
  459 + padding: 0px 8px;
  460 + color: #FFF;
  461 + background: -webkit-linear-gradient(left, #1FB6FF, #62DDF5);
  462 + background: -moz-linear-gradient(left, #1FB6FF, #62DDF5);
  463 + }
444 464 }
445 465 #countdown{
446 466 position: absolute;
... ...