Update Turbolinks, load additional assets only on request, fix JS

Signed-off-by: Sebastian Serth <Sebastian.Serth@student.hpi.de>

app/assets/javascripts/application.js

@@ -11,11 +11,10 @@
 // about supported directives.
 //
 //= require jquery
-//= require jquery.turbolinks
 //= require jquery_ujs
+//= require turbolinks
 //= require bootstrap_pagedown
 //= require d3
-//= require turbolinks
 //
 // lib/assets
 //= require flash
@@ -29,5 +28,4 @@
 //= require chosen.jquery.min
 //= require jquery-ui.min
 //= require underscore.min
-//= require vis.min
 //= require_tree .

app/assets/javascripts/bootstrap-dropdown-submenu.js

@@ -1,4 +1,4 @@
-$(document).ready(function () {
+$(document).on('turbolinks:load', function() {
 
   var subMenusSelector = 'ul.dropdown-menu [data-toggle=dropdown]';
 

app/assets/javascripts/dashboard.js

@@ -1,4 +1,4 @@
-$(function() {
+$(document).on('turbolinks:load', function() {
   var CHART_START = window.vis ? vis.moment().add(-1, 'minute') : undefined;
   var DEFAULT_REFRESH_INTERVAL = 5000;
 
@@ -51,7 +51,7 @@ $(function() {
     } else {
       var jqxhr = $.ajax({
         dataType: 'json',
-        url: 'dashboard',
+        url: '/admin/dashboard',
         method: 'GET'
       });
       jqxhr.done(function(response) {

app/assets/javascripts/editor.js

@@ -1,4 +1,4 @@
-$(function() {
+$(document).on('turbolinks:load', function() {
 
   //Merge all editor components.
   $.extend(

app/assets/javascripts/error_templates.js

@@ -1,4 +1,4 @@
-$(function() {
+$(document).on('turbolinks:load', function() {
     if ($.isController('error_templates')) {
         $('#add-attribute').find('button').on('click', function () {
             $.ajax(location + '/attribute.json', {

app/assets/javascripts/execution_environments.js

@@ -1,4 +1,4 @@
-$(function() {
+$(document).on('turbolinks:load', function() {
   if ($.isController('execution_environments')) {
     if ($('.edit_execution_environment, .new_execution_environment').isPresent()) {
       new MarkdownEditor('#execution_environment_help');

app/assets/javascripts/exercise_collections.js.erb

@@ -1,4 +1,4 @@
-$(function() {
+$(document).on('turbolinks:load', function() {
   if ($.isController('exercise_collections')) {
     var dataElement = $('#data');
     var exerciseList = $('#exercise-list');

app/assets/javascripts/exercise_graphs.js

@@ -1,4 +1,4 @@
-$(function() {
+$(document).on('turbolinks:load', function() {
     // /exercises/38/statistics good for testing
 
     if ($.isController('exercises') && $('.graph-functions-2').isPresent()) {

app/assets/javascripts/exercises.js.erb

@@ -1,4 +1,4 @@
-$(function() {
+$(document).on('turbolinks:load', function() {
   // ruby part adds the relative_url_root, if it is set.
   var ACE_FILES_PATH = '<%= (defined?  Rails.application.config.relative_url_root) &&  Rails.application.config.relative_url_root != nil &&  Rails.application.config.relative_url_root != "" ?  Rails.application.config.relative_url_root : "" %>' + '/assets/ace/';
   var THEME = 'ace/theme/textmate';

app/assets/javascripts/external_users.js

@@ -1,4 +1,4 @@
-$(function() {
+$(document).on('turbolinks:load', function() {
   var grid = $('#tag-grid');
 
   if ($.isController('external_users') && grid.isPresent()) {

app/assets/javascripts/forms.js

@@ -1,4 +1,4 @@
-$(function() {
+$(document).on('turbolinks:load', function() {
   var CHOSEN_OPTIONS = {
     allow_single_deselect: true,
     disable_search_threshold: 5,

app/assets/javascripts/shell.js

@@ -1,4 +1,4 @@
-$(function() {
+$(document).on('turbolinks:load', function() {
   var ENTER_KEY_CODE = 13;
 
   var clearOutput = function() {

app/assets/javascripts/statistics_activity_history.js

@@ -1,4 +1,4 @@
-$(document).ready(function () {
+$(document).on('turbolinks:load', function() {
 
   function manageActivityHistory(prefix) {
     var containerId = prefix + '-activity-history';

app/assets/javascripts/statistics_graphs.js

@@ -1,4 +1,4 @@
-$(document).ready(function () {
+$(document).on('turbolinks:load', function() {
   if ($.isController('statistics') && $('.graph#user-activity').isPresent()) {
 
     function manageGraph(containerId, url, refreshAfter) {

app/assets/javascripts/submission_statistics.js

@@ -1,4 +1,4 @@
-$(function() {
+$(document).on('turbolinks:load', function() {
 
   var ACE_FILES_PATH = '/assets/ace/';
   var THEME = 'ace/theme/textmate';

app/assets/javascripts/working_time_graphs.js

@@ -1,4 +1,4 @@
-$(function() {
+$(document).on('turbolinks:load', function() {
     // http://localhost:3333/exercises/38/statistics good for testing
     // originally at--> localhost:3333/exercises/69/statistics
 
@@ -30,7 +30,7 @@ $(function() {
           var studentTime = minutes_array[i];
 
           for (var j = 0; j < studentTime; j++){
-              if (minutes_count[j] == undefined){
+              if (minutes_count[j] === undefined){
                   minutes_count[j] = 0;
               } else{
                   minutes_count[j] += 1;
@@ -173,23 +173,23 @@ $(function() {
       //}
 
       // DRAW THE SECOND GRAPH ------------------------------------------------------------------------------
-      //<script src="http://labratrevenge.com/d3-tip/javascripts/d3.tip.v0.6.3.js"></script>
       function draw_bar_graph() {
-          var group_incrament = 5;
-          var group_ranges = group_incrament; // just for the start
+          var number_of_bars = 40;
+          var group_increment = Math.ceil(maximum_minutes / number_of_bars); // range in minutes
+          var group_ranges = group_increment; // just for the start
           var minutes_array_for_bar = [];
 
           do {
               var section_value = 0;
               for (var i = 0; i < minutes_array.length; i++) {
-                  if ((minutes_array[i] < group_ranges) && (minutes_array[i] >= (group_ranges - group_incrament))) {
+                  if ((minutes_array[i] < group_ranges) && (minutes_array[i] >= (group_ranges - group_increment))) {
                       section_value++;
                   }
               }
               minutes_array_for_bar.push(section_value);
-              group_ranges += group_incrament;
+              group_ranges += group_increment;
           }
-          while (group_ranges < maximum_minutes + group_incrament);
+          while (group_ranges < maximum_minutes + group_increment);
 
           //console.log(minutes_array_for_bar); // this var used as the bars
           //minutes_array_for_bar = [39, 20, 28, 20, 39, 34, 26, 23, 16, 8];
@@ -199,30 +199,30 @@ $(function() {
 
 
           var width_ratio = .8;
+          if (getWidth()*width_ratio > 1000){
+              width_ratio = 1000/getWidth();
+          }
           var height_ratio = .7; // percent of height
 
           var margin = {top: 100, right: 20, bottom: 70, left: 70},//30,50
               width = (getWidth() * width_ratio) - margin.left - margin.right,
               height = (width * height_ratio) - margin.top - margin.bottom;
 
-          var x = d3.scale.ordinal()
-              .rangeRoundBands([0, width], .1);
+          var x = d3.scaleBand()
+              .range([0, width], .1);
 
           var y = d3.scaleLinear()
               .range([0,height-(margin.top + margin.bottom)]);
 
 
-          var xAxis = d3.svg.axis()
-              .scale(x)
-              .orient("bottom")
+          var xAxis = d3.axisBottom(x)
               .ticks(10);
 
 
-          var yAxis = d3.svg.axis()
-              .scale(d3.scaleLinear().domain([0,max_of_array]).range([height,0]))//y
-              .orient("left")
+          var yAxis = d3
+              .axisLeft(d3.scaleLinear().domain([0,max_of_array]).range([height,0]))//y
               .ticks(10)
-              .innerTickSize(-width);
+              .tickSizeInner(-width);
 
           var tip = d3.tip()
               .attr('class', 'd3-tip')
@@ -241,8 +241,8 @@ $(function() {
 
           x.domain(minutes_array_for_bar.map(function (d, i) {
               i++;
-              var high_side = i * group_incrament;
-              var low_side = high_side - group_incrament;
+              var high_side = i * group_increment;
+              var low_side = high_side - group_increment;
               return (low_side+"-"+high_side);
           }));
 
@@ -253,7 +253,14 @@ $(function() {
           svg.append("g")
               .attr("class", "x axis")
               .attr("transform", "translate(0," + height + ")")
-              .call(xAxis);
+              .call(xAxis)
+              .selectAll("text")
+              .style("text-anchor", "end")
+              .attr("dx", "-.8em")
+              .attr("dy", ".15em")
+              .attr("transform", function(d) {
+                  return "rotate(-45)"
+              });
 
           svg.append("g")
               .attr("class", "y axis")
@@ -278,7 +285,7 @@ $(function() {
               .attr("text-anchor", "middle")
               .attr("x", width / 2)
               .attr("y", height)
-              .attr("dy", ((height / 20) + 20) + 'px')
+              .attr("dy", ((height / 20) + 40) + 'px')
               .text("Working Time (Minutes)")
               .style('font-size', 14);
 
@@ -291,10 +298,10 @@ $(function() {
               .data(minutes_array_for_bar)
               .enter().append("rect")
               .attr("class", "bar")
-              .attr("x", function(d,i) {    var bar_incriment = width/ minutes_array_for_bar.length;
-                                            var bar_x = i * bar_incriment;
+              .attr("x", function(d,i) {    var bar_increment = width / minutes_array_for_bar.length;
+                                            var bar_x = i * bar_increment;
                                             return (bar_x)})
-              .attr("width", x.rangeBand())
+              .attr("width", x.bandwidth())
               .attr("y", function(d) { return height - y(d); })
               .attr("height", function(d) { return y(d); })
               .on('mouseover', tip.show)
@@ -311,7 +318,7 @@ $(function() {
               .style('text-decoration', 'underline');
 
       }
-      // draw_bar_graph();
+      draw_bar_graph();
   }
 
 });

app/assets/stylesheets/application.css

@@ -23,6 +23,5 @@
  *= require jquery-ui.min
  *= require jquery-ui.structure.min
  *= require style.min
- *= require vis.min
  *= require_tree .
 */

app/views/admin/dashboard/show.html.slim

@@ -1,3 +1,10 @@
+- content_for :head do
+  // Force a full page reload, see https://github.com/turbolinks/turbolinks/issues/326.
+     Otherwise, the global variable `vis` might be uninitialized in the assets (race condition)
+  meta name='turbolinks-visit-control' content='reload'
+  = javascript_include_tag(asset_path('vis.min.js', type: :javascript))
+  = stylesheet_link_tag(asset_path('vis.min.css', type: :stylesheet))
+
 h1 = t('breadcrumbs.dashboard.show')
 
 h2 Version

app/views/application/_navigation.html.slim

@@ -6,7 +6,7 @@
         span.caret
       ul.dropdown-menu role='menu'
         - if current_user.admin?
-          li = link_to(t('breadcrumbs.dashboard.show'), admin_dashboard_path)
+          li = link_to(t('breadcrumbs.dashboard.show'), admin_dashboard_path, 'data-turbolinks' => "false")
           li = link_to(t('breadcrumbs.statistics.show'), statistics_path)
           li.divider
         = render('navigation_submenu', title: t('activerecord.models.exercise.other'),

app/views/execution_environments/statistics.html.slim

@@ -14,7 +14,7 @@ h1 = @execution_environment
         - if wts then average_time = wts["average_time"] else 0
         - if wts then stddev_time = wts["stddev_time"] else 0
         tr
-          td = link_to exercise.title, controller: "exercises", action: "statistics", id: exercise.id
+          td = link_to exercise.title, controller: "exercises", action: "statistics", id: exercise.id, 'data-turbolinks' => "false"
           td = us["users"]
           td = us["average_score"].to_f.round(4)
           td = us["maximum_score"].to_f.round(2)

app/views/exercise_collections/_form.html.slim

@@ -23,7 +23,7 @@
             td
               span.fa.fa-bars
             td = item.exercise.title
-            td = link_to(t('shared.show'), item.exercise)
+            td = link_to(t('shared.show'), item.exercise, 'data-turbolinks' => "false")
             td
               a.remove-exercise href='#' = t('shared.destroy')
   .hidden

app/views/exercise_collections/show.html.slim

@@ -25,4 +25,4 @@ h4 = t('activerecord.attributes.exercise_collections.exercises')
           td = link_to(exercise.title, exercise)
           td = link_to_if(exercise.execution_environment && policy(exercise.execution_environment).show?, exercise.execution_environment, exercise.execution_environment)
           td = exercise.user.name
-          td = link_to(t('shared.statistics'), statistics_exercise_path(exercise))
+          td = link_to(t('shared.statistics'), statistics_exercise_path(exercise), 'data-turbolinks' => "false")

app/views/exercises/index.html.slim

@@ -36,7 +36,7 @@ h1 = Exercise.model_name.human(count: 2)
           td.public data-value=exercise.public? = symbol_for(exercise.public?)
           td = link_to(t('shared.edit'), edit_exercise_path(exercise)) if policy(exercise).edit?
           td = link_to(t('.implement'), implement_exercise_path(exercise)) if policy(exercise).implement?
-          td = link_to(t('shared.statistics'), statistics_exercise_path(exercise)) if policy(exercise).statistics?
+          td = link_to(t('shared.statistics'), statistics_exercise_path(exercise), 'data-turbolinks' => "false") if policy(exercise).statistics?
 
           td
             .btn-group
@@ -44,7 +44,7 @@ h1 = Exercise.model_name.human(count: 2)
               span.caret
               span.sr-only Toggle Dropdown
               ul.dropdown-menu.pull-right role="menu"
-                li = link_to(t('shared.show'), exercise) if policy(exercise).show?
+                li = link_to(t('shared.show'), exercise, 'data-turbolinks' => "false") if policy(exercise).show?
                 li = link_to(t('activerecord.models.user_exercise_feedback.other'), feedback_exercise_path(exercise)) if policy(exercise).feedback?
                 li = link_to(t('shared.destroy'), exercise, data: {confirm: t('shared.confirm_destroy')}, method: :delete) if policy(exercise).destroy?
                 li = link_to(t('.clone'), clone_exercise_path(exercise), data: {confirm: t('shared.confirm_destroy')}, method: :post) if policy(exercise).clone?

app/views/exercises/show.html.slim

@@ -1,6 +1,9 @@
 - content_for :head do
-  = javascript_include_tag('http://cdnjs.cloudflare.com/ajax/libs/highlight.js/8.4/highlight.min.js')
-  = stylesheet_link_tag('http://cdnjs.cloudflare.com/ajax/libs/highlight.js/8.4/styles/default.min.css')
+  // Force a full page reload, see https://github.com/turbolinks/turbolinks/issues/326.
+     Otherwise, code might not be highlighted correctly (race condition)
+  meta name='turbolinks-visit-control' content='reload'
+  = javascript_include_tag(asset_path('highlight.min.js', type: :javascript))
+  = stylesheet_link_tag(asset_path('highlight-default.css', type: :stylesheet))
 
 h1
   = @exercise

app/views/exercises/statistics.html.slim

@@ -1,4 +1,8 @@
-script src="http://labratrevenge.com/d3-tip/javascripts/d3.tip.v0.6.3.js"
+- content_for :head do
+  // Force a full page reload, see https://github.com/turbolinks/turbolinks/issues/326.
+     Otherwise, code might not be highlighted correctly (race condition)
+  meta name='turbolinks-visit-control' content='reload'
+  = javascript_include_tag(asset_path('d3-tip.js', type: :javascript))
 h1 = @exercise
 
 = row(label: '.participants', value: @exercise.users.distinct.count)
@@ -32,8 +36,8 @@ h1 = @exercise
     .graph-functions
     div#chart_1
     hr
-    /div#chart_2
-    /hr
+    div#chart_2
+    hr
   .table-responsive
     table.table.table-striped.sortable
       thead

app/views/proxy_exercises/index.html.slim

@@ -27,7 +27,7 @@ h1 = ProxyExercise.model_name.human(count: 2)
               span.caret
               span.sr-only Toggle Dropdown
               ul.dropdown-menu.pull-right role="menu"
-                li = link_to(t('shared.show'), proxy_exercise) if policy(proxy_exercise).show?
+                li = link_to(t('shared.show'), proxy_exercise, 'data-turbolinks' => "false") if policy(proxy_exercise).show?
                 li = link_to(t('shared.destroy'), proxy_exercise, data: {confirm: t('shared.confirm_destroy')}, method: :delete) if policy(proxy_exercise).destroy?
                 li = link_to(t('.clone'), clone_proxy_exercise_path(proxy_exercise), data: {confirm: t('shared.confirm_destroy')}, method: :post) if policy(proxy_exercise).clone?
 

app/views/proxy_exercises/show.html.slim

@@ -1,6 +1,9 @@
 - content_for :head do
-  = javascript_include_tag('http://cdnjs.cloudflare.com/ajax/libs/highlight.js/8.4/highlight.min.js')
-  = stylesheet_link_tag('http://cdnjs.cloudflare.com/ajax/libs/highlight.js/8.4/styles/default.min.css')
+  // Force a full page reload, see https://github.com/turbolinks/turbolinks/issues/326.
+     Otherwise, code might not be highlighted correctly (race condition)
+  meta name='turbolinks-visit-control' content='reload'
+  = javascript_include_tag(asset_path('highlight.min.js', type: :javascript))
+  = stylesheet_link_tag(asset_path('highlight-default.css', type: :stylesheet))
 
 h1
   = @proxy_exercise.title

app/views/statistics/activity_history.html.slim

@@ -1,3 +1,10 @@
+- content_for :head do
+  // Force a full page reload, see https://github.com/turbolinks/turbolinks/issues/326.
+     Otherwise, the global variable `vis` might be uninitialized in the assets (race condition)
+  meta name='turbolinks-visit-control' content='reload'
+  = javascript_include_tag(asset_path('vis.min.js', type: :javascript))
+  = stylesheet_link_tag(asset_path('vis.min.css', type: :stylesheet))
+
 .group
   .title
     h1 = t("statistics.graphs.#{resource}_activity")

app/views/statistics/graphs.html.slim

@@ -1,3 +1,10 @@
+- content_for :head do
+  // Force a full page reload, see https://github.com/turbolinks/turbolinks/issues/326.
+     Otherwise, the global variable `vis` might be uninitialized in the assets (race condition)
+  meta name='turbolinks-visit-control' content='reload'
+  = javascript_include_tag(asset_path('vis.min.js', type: :javascript))
+  = stylesheet_link_tag(asset_path('vis.min.css', type: :stylesheet))
+
 .group
   .title
     h1 = t('.user_activity')

app/views/submissions/index.html.slim

@@ -6,7 +6,7 @@ h1 = Submission.model_name.human(count: 2)
     = f.collection_select(:exercise_id_eq, Exercise.with_submissions, :id, :title, class: 'form-control', prompt: t('activerecord.attributes.submission.exercise'))
   .form-group
     = f.label(:cause_eq, t('activerecord.attributes.submission.cause'), class: 'sr-only')
-    = f.select(:cause_eq, Submission.all.map(&:cause).uniq.sort, class: 'form-control', prompt: t('activerecord.attributes.submission.cause'))
+    = f.select(:cause_eq, Submission.select(:cause).distinct.map(&:cause).sort, class: 'form-control', prompt: t('activerecord.attributes.submission.cause'))
 
 .table-responsive
   table.table