Description:
add golden submit button - When the user submit more than or equal to 100 times the submit button will turn gold - Add golden-btn tag in applications.css.scss
Commit status:
[Not Reviewed]
References:
Comments:
0 Commit comments 0 Inline Comments
Unresolved TODOs:
There are no unresolved TODOs
Add another comment

r829:97816c2b8906 - - 2 files changed: 37 inserted, 1 deleted

@@ -463,96 +463,132
463 .announcement p {
463 .announcement p {
464 font-size: 12px;
464 font-size: 12px;
465 margin: 2px;
465 margin: 2px;
466 }
466 }
467
467
468 .pub-info {
468 .pub-info {
469 text-align: right;
469 text-align: right;
470 font-style: italic;
470 font-style: italic;
471 font-size: 9px;
471 font-size: 9px;
472
472
473 p {
473 p {
474 text-align: right;
474 text-align: right;
475 font-style: italic;
475 font-style: italic;
476 font-size: 9px;
476 font-size: 9px;
477 }
477 }
478 }
478 }
479
479
480 .announcement {
480 .announcement {
481 .toggles {
481 .toggles {
482 font-weight: normal;
482 font-weight: normal;
483 float: right;
483 float: right;
484 font-size: 80%;
484 font-size: 80%;
485 }
485 }
486
486
487 .announcement-title {
487 .announcement-title {
488 font-weight: bold;
488 font-weight: bold;
489 }
489 }
490 }
490 }
491
491
492 div {
492 div {
493 &.message {
493 &.message {
494 margin: 10px 0 0;
494 margin: 10px 0 0;
495
495
496 div {
496 div {
497 &.message {
497 &.message {
498 margin: 0 0 0 30px;
498 margin: 0 0 0 30px;
499 }
499 }
500
500
501 &.body {
501 &.body {
502 border: 2px solid #dddddd;
502 border: 2px solid #dddddd;
503 background: #fff8f8;
503 background: #fff8f8;
504 padding-left: 5px;
504 padding-left: 5px;
505 }
505 }
506
506
507 &.reply-body {
507 &.reply-body {
508 border: 2px solid #bbbbbb;
508 border: 2px solid #bbbbbb;
509 background: #fffff8;
509 background: #fffff8;
510 padding-left: 5px;
510 padding-left: 5px;
511 }
511 }
512
512
513 &.stat {
513 &.stat {
514 font-size: 10px;
514 font-size: 10px;
515 line-height: 1.75em;
515 line-height: 1.75em;
516 padding: 0 5px;
516 padding: 0 5px;
517 color: #333333;
517 color: #333333;
518 background: #dddddd;
518 background: #dddddd;
519 font-weight: bold;
519 font-weight: bold;
520 }
520 }
521
521
522 &.message div.stat {
522 &.message div.stat {
523 font-size: 10px;
523 font-size: 10px;
524 line-height: 1.75em;
524 line-height: 1.75em;
525 padding: 0 5px;
525 padding: 0 5px;
526 color: #444444;
526 color: #444444;
527 background: #bbbbbb;
527 background: #bbbbbb;
528 font-weight: bold;
528 font-weight: bold;
529 }
529 }
530 }
530 }
531 }
531 }
532
532
533 &.contest-title {
533 &.contest-title {
534 color: white;
534 color: white;
535 text-align: center;
535 text-align: center;
536 line-height: 2em;
536 line-height: 2em;
537 }
537 }
538
538
539 &.registration-desc, &.test-desc {
539 &.registration-desc, &.test-desc {
540 border: 1px dotted gray;
540 border: 1px dotted gray;
541 background: #f5f5f5;
541 background: #f5f5f5;
542 padding: 5px;
542 padding: 5px;
543 margin: 10px 0;
543 margin: 10px 0;
544 font-size: 12px;
544 font-size: 12px;
545 line-height: 1.5em;
545 line-height: 1.5em;
546 }
546 }
547 }
547 }
548
548
549 h2.contest-title {
549 h2.contest-title {
550 margin-top: 5px;
550 margin-top: 5px;
551 margin-bottom: 5px;
551 margin-bottom: 5px;
552 }
552 }
553
553
554
554
555
555
556 .grader-comment {
556 .grader-comment {
557 word-wrap: break-word;
557 word-wrap: break-word;
558 }
558 }
559 +
560 +
561 + golden-btn + .golden-btn { margin-top: 1em; }
562 +
563 + .golden-btn {
564 + display: inline-block;
565 + outline: none;
566 + font-family: inherit;
567 + box-sizing: border-box;
568 + border: none;
569 + box-shadow: 0 3px 6px rgba(0,0,0,.16), 0 3px 6px rgba(110,80,20,.4),
570 + inset 0 -2px 5px 1px rgba(139,66,8,1),
571 + inset 0 -1px 1px 3px rgba(250,227,133,1);
572 + background-image: linear-gradient(160deg, #a54e07, #b47e11, #fef1a2, #bc881b, #a54e07) !important;
573 + border: 1px solid #a55d07;
574 + color: rgb(120,50,5);
575 + text-shadow: 0 2px 2px rgba(250, 227, 133, 1);
576 + cursor: pointer;
577 + transition: all .2s ease-in-out;
578 + background-size: 100% 100%;
579 + background-position:center;
580 + }
581 + .golden-btn:focus,
582 + .golden-btn:hover {
583 + background-size: 150% 150%;
584 + box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23),
585 + inset 0 -2px 5px 1px #b17d10,
586 + inset 0 -1px 1px 3px rgba(250,227,133,1);
587 + border: 1px solid rgba(165,93,7,.6);
588 + color: rgba(120,50,5,.8);
589 + }
590 + .golden-btn:active {
591 + box-shadow: 0 3px 6px rgba(0,0,0,.16), 0 3px 6px rgba(110,80,20,.4),
592 + inset 0 -2px 5px 1px #b17d10,
593 + inset 0 -1px 1px 3px rgba(250,227,133,1);
594 + }
@@ -1,88 +1,88
1 %textarea#text_sourcecode{style: "display:none"}~ @source
1 %textarea#text_sourcecode{style: "display:none"}~ @source
2 .container
2 .container
3 .row
3 .row
4 .col-md-12
4 .col-md-12
5 %h2 Live submit
5 %h2 Live submit
6
6
7 .row
7 .row
8 .col-md-12
8 .col-md-12
9 .alert.alert-info
9 .alert.alert-info
10 Write your code in the following box, choose language, and click submit button when finished
10 Write your code in the following box, choose language, and click submit button when finished
11 .row
11 .row
12 .col-md-8
12 .col-md-8
13 %div#editor{style: 'height: 500px; border-radius: 7px; font-size: 14px;'}
13 %div#editor{style: 'height: 500px; border-radius: 7px; font-size: 14px;'}
14 .col-md-4
14 .col-md-4
15 - # submission form
15 - # submission form
16 = form_tag({controller: :main, :action => 'submit'}, :multipart => true, class: 'form') do
16 = form_tag({controller: :main, :action => 'submit'}, :multipart => true, class: 'form') do
17
17
18 = hidden_field_tag 'editor_text', @source
18 = hidden_field_tag 'editor_text', @source
19 = hidden_field_tag 'submission[problem_id]', @problem.id
19 = hidden_field_tag 'submission[problem_id]', @problem.id
20 .form-group
20 .form-group
21 = label_tag "Task:"
21 = label_tag "Task:"
22 = text_field_tag 'asdf', "#{@problem.long_name}", class: 'form-control', disabled: true
22 = text_field_tag 'asdf', "#{@problem.long_name}", class: 'form-control', disabled: true
23 .form-group
23 .form-group
24 = label_tag "Description:"
24 = label_tag "Description:"
25 = link_to_description_if_any "[download] <span class='glyphicon glyphicon-file'></span>".html_safe, @problem
25 = link_to_description_if_any "[download] <span class='glyphicon glyphicon-file'></span>".html_safe, @problem
26
26
27 .form-group
27 .form-group
28 = label_tag 'Language:'
28 = label_tag 'Language:'
29 = select_tag 'language_id', options_from_collection_for_select(Language.all, 'id', 'pretty_name', @lang_id || @current_user.default_language || Language.find_by_pretty_name("Python").id || Language.first.id), class: 'form-control select', style: "width: 100px"
29 = select_tag 'language_id', options_from_collection_for_select(Language.all, 'id', 'pretty_name', @lang_id || @current_user.default_language || Language.find_by_pretty_name("Python").id || Language.first.id), class: 'form-control select', style: "width: 100px"
30 .form-group
30 .form-group
31 .input-group
31 .input-group
32 %span.input-group-btn
32 %span.input-group-btn
33 %span.btn.btn-default.btn-file
33 %span.btn.btn-default.btn-file
34 Browse
34 Browse
35 = file_field_tag 'load_file'
35 = file_field_tag 'load_file'
36 = text_field_tag '' , nil, {readonly: true, class: 'form-control'}
36 = text_field_tag '' , nil, {readonly: true, class: 'form-control'}
37 .form-group
37 .form-group
38 - = submit_tag 'Submit', class: 'btn btn-success', id: 'live_submit',
38 + = submit_tag 'Submit', class: 'btn ' + (@submission && @submission.number >= 100 ? 'golden-btn' : 'btn-success'), id: 'live_submit',
39 data: {confirm: "Submitting this source code for task #{@problem.long_name}?"}
39 data: {confirm: "Submitting this source code for task #{@problem.long_name}?"}
40 - # latest submission status
40 - # latest submission status
41 .panel{class: (@submission && @submission.graded_at) ? "panel-info" : "panel-warning"}
41 .panel{class: (@submission && @submission.graded_at) ? "panel-info" : "panel-warning"}
42 .panel-heading
42 .panel-heading
43 Latest Submission Status
43 Latest Submission Status
44 = link_to "Refresh",get_latest_submission_status_submissions_path(@submission.user,@problem), class: "btn btn-default btn-sm", remote: true if @submission
44 = link_to "Refresh",get_latest_submission_status_submissions_path(@submission.user,@problem), class: "btn btn-default btn-sm", remote: true if @submission
45 .panel-body
45 .panel-body
46 %div#latest_status
46 %div#latest_status
47 - if @submission
47 - if @submission
48 = render :partial => 'submission_short',
48 = render :partial => 'submission_short',
49 :locals => {submission: @submission, problem_name: @problem.name, problem_id: @problem.id }
49 :locals => {submission: @submission, problem_name: @problem.name, problem_id: @problem.id }
50
50
51 .modal.fade#compiler{tabindex: -1,role: 'dialog'}
51 .modal.fade#compiler{tabindex: -1,role: 'dialog'}
52 .modal-dialog.modal-lg{role:'document'}
52 .modal-dialog.modal-lg{role:'document'}
53 .modal-content
53 .modal-content
54 .modal-header
54 .modal-header
55 %button.close{type: 'button', data: {dismissed: :modal}, aria: {label: 'close'}}
55 %button.close{type: 'button', data: {dismissed: :modal}, aria: {label: 'close'}}
56 %span{aria: {hidden: 'true'}, data: {dismiss: 'modal'}} &times;
56 %span{aria: {hidden: 'true'}, data: {dismiss: 'modal'}} &times;
57 %h4 Compiler message
57 %h4 Compiler message
58 .modal-body
58 .modal-body
59 %pre#compiler_msg
59 %pre#compiler_msg
60 - if @submission
60 - if @submission
61 = @submission.compiler_message
61 = @submission.compiler_message
62 .modal-footer
62 .modal-footer
63 %button.btn.btn-default{type: 'button', data: {dismiss: 'modal'}} Close
63 %button.btn.btn-default{type: 'button', data: {dismiss: 'modal'}} Close
64
64
65 :javascript
65 :javascript
66 $(document).ready(function() {
66 $(document).ready(function() {
67 e = ace.edit("editor")
67 e = ace.edit("editor")
68 e.setValue($("#text_sourcecode").val());
68 e.setValue($("#text_sourcecode").val());
69 e.gotoLine(1);
69 e.gotoLine(1);
70 $("#language_id").trigger('change');
70 $("#language_id").trigger('change');
71
71
72 $("#load_file").on('change',function(evt) {
72 $("#load_file").on('change',function(evt) {
73 var file = evt.target.files[0];
73 var file = evt.target.files[0];
74 var reader = new FileReader();
74 var reader = new FileReader();
75 reader.onload = function(theFile) {
75 reader.onload = function(theFile) {
76 var e = ace.edit("editor")
76 var e = ace.edit("editor")
77 e.setValue(theFile.target.result);
77 e.setValue(theFile.target.result);
78 e.gotoLine(1);
78 e.gotoLine(1);
79 };
79 };
80 reader.readAsText(file)
80 reader.readAsText(file)
81 });
81 });
82
82
83 //brython();
83 //brython();
84 });
84 });
85
85
86
86
87
87
88
88
You need to be logged in to leave comments. Login now