Merge branch 'master' into rt/comments

Conflicts:
	app/views/exercises/_editor_file_tree.html.slim

app/assets/javascripts/editor.js

@@ -991,14 +991,19 @@ $(function() {
           requestorid: user_id,
           exerciseid: exercise_id,
           fileid: file_id,
-          "requested_at(1i)": 2015,
+          "requested_at(1i)": 2015, // these are the timestamp values that the request handler demands
-          "requested_at(2i)":3,
+          "requested_at(2i)":3, // they could be random here, because the timestamp is updated on serverside anyway
           "requested_at(3i)":27,
           "requested_at(4i)":17,
           "requested_at(5i)":06
         }
       }
+    }).done(function() {
+      hideSpinner()
+      $.flash.success({ text: 'Request for comments sent!' })
     })
+
+    showSpinner($('#request-for-comments'))
   }
 
     var initializeCodePilot = function() {

app/views/exercises/_editor_file_tree.html.slim

@@ -2,9 +2,9 @@
 
 hr
 
-= render('editor_button', classes: 'btn-block btn-primary btn-xs', data: {:'data-cause' => 'file'}, icon: 'fa fa-plus', id: 'create-file', label: t('exercises.editor.create_file'))
+= render('editor_button', classes: 'btn-block btn-primary btn-sm', data: {:'data-cause' => 'file'}, icon: 'fa fa-plus', id: 'create-file', label: t('exercises.editor.create_file'))
-= render('editor_button', classes: 'btn-block btn-warning btn-xs', data: {:'data-cause' => 'file', :'data-message-confirm' => t('shared.confirm_destroy')}, icon: 'fa fa-times', id: 'destroy-file', label: t('exercises.editor.destroy_file'))
+= render('editor_button', classes: 'btn-block btn-warning btn-sm', data: {:'data-cause' => 'file', :'data-message-confirm' => t('shared.confirm_destroy')}, icon: 'fa fa-times', id: 'destroy-file', label: t('exercises.editor.destroy_file'))
-= render('editor_button', classes: 'btn-block btn-primary btn-xs', icon: 'fa fa-download', id: 'download', label: t('exercises.editor.download'))
+= render('editor_button', classes: 'btn-block btn-primary btn-sm', icon: 'fa fa-download', id: 'download', label: t('exercises.editor.download'))
-= render('editor_button', classes: 'btn-block btn-primary btn-xs', icon: 'fa fa-bullhorn', id: 'request-for-comments', label: 'Request comments')
+= render('editor_button', classes: 'btn-block btn-primary btn-sm', icon: 'fa fa-bullhorn', id: 'request-for-comments', label: t('exercises.editor.requestComments'))
 
 = render('shared/modal', id: 'modal-file', template: 'code_ocean/files/_form', title: t('exercises.editor.create_file'))

app/views/request_for_comments/index.html.erb

@@ -9,4 +9,4 @@
       </p>
     </a>
   <% end %>
-</div>
+</div>

app/views/request_for_comments/show.html.erb

@@ -4,18 +4,8 @@
     <%= InternalUser.find(@request_for_comment.requestorid) %> | <%= @request_for_comment.requested_at %>
   </p>
 </div>
-
+<!--
-<form class="form-inline">
+-->
-  <div class="form-group">
-    <p style='display:inline-block'><%= t('exercises.implement.comment.line') %></p>
-    <input type="number" class="form-control" id="lineInput" placeholder="1" required>
-  </div>
-  <div class="form-group">
-    <p style='display:inline-block'><%= t('exercises.implement.comment.a_comment') %></p>
-    <input type="text" class="form-control" id="commentInput" placeholder="I'd suggest a variable here" required>
-  </div>
-  <button id='submitComment' type="submit" class="btn btn-default"><%= t('exercises.implement.comment.addComment') %>!</button>
-</form>
 
 <div id='commentitor' class='editor' data-read-only='true' data-file-id='<%=@request_for_comment.fileid%>'>
   <%= CodeOcean::File.find(@request_for_comment.fileid).content %>
@@ -26,12 +16,24 @@
     var commentitor = $('#commentitor');
     var userid = commentitor.data('user-id');
     var fileid = commentitor.data('file-id');
-    var lineInput = $('#lineInput');
+
-    var commentInput = $('#commentInput');
+    var inputHtml = ''
+    //inputHtml += '<form class="form">'
+    //inputHtml +=   '<div class="form-group">'
+    //inputHtml +=    '<p style="display:inline-block"><%= t("exercises.implement.comment.line") %></p>'
+    //inputHtml +=    '<input type="number" class="form-control" id="lineInput" placeholder="1" required>'
+    //inputHtml +=  '</div>'
+    inputHtml +=  '<div class="input-group">'
+    //inputHtml +=    '<p style="display:inline-block"><%= t("exercises.implement.comment.a_comment") %></p>'
+    inputHtml +=    '<input type="text" class="form-control" id="commentInput" placeholder="I\'d suggest a variable here" required>'
+    inputHtml +=    '<span class="input-group-btn"><button id="submitComment" class="btn btn-default"><%= t("exercises.implement.comment.addComment") %>!</button></span>'
+    inputHtml +=  '</div>'
+    //inputHtml +='</form>'
+
+
     commentitor = ace.edit(commentitor[0]);
     commentitor.setReadOnly(true);
 
-    $('#submitComment').click(addComment);
     setAnnotations();
 
     function setAnnotations() {
@@ -47,18 +49,34 @@
       });
 
       jqrequest.done(function(response){
+        //data-container=".ui-front" on gutter cell
         $.each(response, function(index, comment) {
           comment.className = "code-ocean_comment"
           comment.text = comment.username + ": " + comment.text
         })
 
         commentitor.getSession().setAnnotations(response)
+
+        //$('.ace_gutter-layer').data('container', '.ui-front')
+        $('.ace_gutter-cell').popover({
+          title: 'Add a comment',
+          html: true,
+          content: inputHtml,
+          position: 'right',
+          trigger: 'focus click'
+        }).on('shown.bs.popover', function() {
+          $('#commentInput').focus()
+          $('#submitComment').click(addComment);
+          console.log($(this).text())
+          $('#commentInput').data('line', $(this).text())
+        })
       })
     }
 
     function addComment() {
-      var line = lineInput.val()
+      var commentInput = $('#commentInput');
       var comment = commentInput.val()
+      var line = $('#commentInput').data('line')
 
       if (line == '' || comment == '') {
         return
@@ -66,8 +84,7 @@
         line = parseInt(line) - 1
       }
 
-
+      $.ajax({
-      var jqxhr = $.ajax({
         data: {
           comment: {
             user_id: userid,
@@ -80,10 +97,13 @@
         dataType: 'json',
         method: 'POST',
         url:  "/comments"
-      })
+      }).done(setAnnotations)
 
-      jqxhr.done(setAnnotations)
+      $('.ace_gutter-cell').popover('hide')
-      lineInput.val(''); commentInput.val('');
     }
   //})()
-</script>
+</script>
+<style>
+  #commentitor, .ace_gutter, .ace_gutter-layer { overflow: visible }
+  .popover { width: 400px; max-width: none; }
+</style>

config/locales/de.yml

@@ -175,6 +175,7 @@ de:
       run: Ausführen
       run_failure: Bei der Ausführung Ihres Codes sind Fehler aufgetreten.
       run_success: Ihr Code wurde fehlerfrei ausgeführt.
+      requestComments: Rückmeldung erbitten
       save: Speichern
       score: Bewerten
       start_over: Von vorne anfangen

config/locales/en.yml

@@ -175,6 +175,7 @@ en:
       run: Run
       run_failure: Your code ran with errors.
       run_success: Your code ran without errors.
+      requestComments: Request comments
       save: Save
       score: Score
       start_over: Start over