Display only first video on course page, with a button to show more.

diff --git a/teleforma/static/teleforma/css/teleforma.css b/teleforma/static/teleforma/css/teleforma.css
index 1b9ff494f674fa5e401bbe51d780316f67988daa..f9b6a063c4d9cad6729c599b876d757af57c9a00 100644 (file)
--- a/teleforma/static/teleforma/css/teleforma.css
+++ b/teleforma/static/teleforma/css/teleforma.css
@@ -1157,10 +1157,16 @@ a.image-link {
     padding:4px 8px 4px 26px; /*top right bottom left - last value depends on the icon size (default=16)*/
 }
 
+table.listing tbody td.show_more_videos {
+    text-align:center;
+    padding: 1.5em 0em;
+}
+
 .button,  .button:visited, .button:hover{
     font-weight: bold;
     border:  1px solid #e1e1e1;
     white-space:nowrap;
+    cursor: pointer;
     /*    border-top:  1px solid #e1e1e1 !important;
         border-left:  1px solid #e1e1e1 !important;
         border-right:  1px solid #e1e1e1 !important;

diff --git a/teleforma/static/teleforma/js/application.js b/teleforma/static/teleforma/js/application.js
index c4e7867803ea7a02cef8a9adaf732d2ae211efe3..9fdcd275b38ae23849c1bf63df54359679efa9f5 100644 (file)
--- a/teleforma/static/teleforma/js/application.js
+++ b/teleforma/static/teleforma/js/application.js
@@ -40,4 +40,21 @@ $(document).ready(function(){
          })
      }
      $('.tabs').tabs();
+
+     // add a "read more" button after first video and hide others vidéos by default
+     $('.course_content.content_video table.listing').each(function(){
+        var $this = $(this);
+        $this.find('tr:not(:first)').hide();
+        // debugger;
+        var colspan = $(this).find('tr:first td').length
+        var buttonRow = $('<tr><td class="show_more_videos" colspan="'+colspan+'"></td></tr>')
+        var button = $('<a class="component_icon button icon_next">Voir les vidéos plus anciennes</a>').bind('click', function(){
+            $this.find('tr:not(:first)').show('fast');
+            buttonRow.hide();
+        });
+        // $this.find('tr:first').appendAfter(buttonRow);
+        $this.find('tr:not(:first)').hide();
+        buttonRow.find('td').append(button)
+        buttonRow.insertAfter($this.find('tr:first'))
+     })
 });
\ No newline at end of file