CC-6137 - datatables is the devil

airtime_mvc/public/css/dashboard.css

@@ -20,6 +20,14 @@
 
     background-color: #242424;
 }
+@media screen and (max-width: 1700px) {
+    #library_display_info {
+        display: none;
+    }
+    #library_display_length {
+        float: left;
+    }
+}
 
 @media screen and (max-width: 1600px) {
     #library_display_wrapper button:not(.dropdown-toggle):not(.btn-new) > span,
@@ -34,6 +42,13 @@
     }
 }
 
+@media screen and (max-width: 1260px) {
+    #library_display_length > label {
+        /* Hacky, but datatables dumps the select inside the label for some reason... */
+        font-size: 0 !important;
+    }
+}
+
 @media screen and (max-width: 1200px) {
     .wrapper {
         -webkit-flex-flow: column !important;
@@ -84,11 +99,11 @@
     padding: 0;
 }
 
-#library_content .dataTables_length {
+#library_display_length {
-    padding: 5px;
+    padding: 6px;
 }
 
-#library_content .dataTables_length label {
+#library_display_length label {
     color: #efefef;
     line-height: 26px;
     font-weight: normal;
@@ -625,7 +640,7 @@ div.ColVis_collectionBackground {
 }
 
 .ColVis.TableTools {
-    margin: 5px 5px 0 0;
+    margin: 6px 6px 0 0;
 }
 
 .ColVis.TableTools > button {
@@ -648,7 +663,7 @@ div.ColVis_collectionBackground {
 
 .fg-toolbar .btn-toolbar {
     margin: 0;
-    padding: 5px;
+    padding: 6px;
 }
 /* ~~~~~~~~~~~~~~~~ */
 
@@ -684,11 +699,6 @@ th.library_checkbox {
     position: fixed !important;
 }
 
-/* Since the z-index gets applied dynamically */
-/*#ui-datepicker-div {*/
-    /*z-index: 1000 !important;*/
-/*}*/
-
 .datatable .ui-state-highlight, .spl_sortable .ui-state-highlight {
     background: rgba(255, 93, 26, .6);
     border: none;
@@ -696,8 +706,13 @@ th.library_checkbox {
 
 .dataTables_scrolling {
     position: absolute;
-    bottom: 37px; /* 36 px is the size of the header/footer + 1px because there's no internal border */
+    bottom: 37px;
-    top: 37px;
+    top: 38px;
     left: 0;
     right: 0;
 }
+
+.DTCR_pointer {
+    background-color: #FF5D1A !important;
+    height: 38px !important;
+}

airtime_mvc/public/css/styles.css

@@ -67,7 +67,8 @@ select {
     height: 7px;
 }
 
-::-webkit-scrollbar-track {
+::-webkit-scrollbar-track,
+::-webkit-scrollbar-corner {
     background: transparent none;
 }
 
@@ -83,10 +84,6 @@ select {
     -webkit-box-shadow: inset 0 0 3px rgba(0,0,0,0.75);
 }
 
-::-webkit-scrollbar-corner {
-    background-color: #000;
-}
-
 .wrapper_panel::-webkit-scrollbar-corner {
     background-color: #242424;
 }
@@ -842,18 +839,17 @@ dl.inline-list dd {
     color: #ccc;
 }
 
-#recent_uploads_table_wrapper .datatable tr td {
-    overflow: hidden;
-    text-overflow: ellipsis;
-}
-
 .datatable tr, .datatable td,
-.dataTable tr, .dataTable td
+.dataTable tr, .dataTable td {
-{
     border: none;
     border-spacing: 0;
 }
 
+#recent_uploads_table tr, #recent_uploads_table td {
+    white-space: nowrap;
+    overflow: hidden;
+    max-width: 200px;
+}
 
 .odd {
     background-color: #282828;
@@ -923,7 +919,7 @@ dl.inline-list dd {
 }
 
 .dataTables_length {
-    float:right;
+    float:left;
     margin:0;
     
 }
@@ -3873,9 +3869,8 @@ li .ui-state-hover {
     -webkit-flex-flow: column;
     flex-flow: column;
 
-    /* Account for the left pane */
     flex: 6 auto;
-    min-width: 500px;
+    min-width: 505px;
 }
 
 .outer-datatable-wrapper {

airtime_mvc/public/js/airtime/library/events/library_showbuilder.js

@@ -133,7 +133,7 @@ var AIRTIME = (function(AIRTIME) {
 
                         return container;
                     },
-                    cursor: 'pointer',
+                    cursor: 'move',
                     //cursorAt: {
                     //    top: 30,
                     //    right: 10
@@ -173,7 +173,7 @@ var AIRTIME = (function(AIRTIME) {
 
                         return container;
                     },
-                    cursor: 'pointer',
+                    cursor: 'move',
                     //cursorAt: {
                     //    top: 30,
                     //    right: 10

airtime_mvc/public/js/airtime/library/library.js

@@ -553,6 +553,12 @@ var AIRTIME = (function(AIRTIME) {
                     return getDatatablesStrings({
                         "sEmptyTable": $.i18n._(""),
                         "sZeroRecords": $.i18n._("No matching results found.")
+                        //"oPaginate": {
+                        //    "sFirst":    "<<",
+                        //    "sLast":     ">>",
+                        //    "sNext":     ">",
+                        //    "sPrevious": "<"
+                        //}
                     });
                     break;
             }
@@ -612,7 +618,7 @@ var AIRTIME = (function(AIRTIME) {
                 /* Upload Time */     { "sTitle" : $.i18n._("Uploaded")           , "mDataProp" : "utime"        , "bVisible"    : false                 , "sClass"      : "library_upload_time"   , "sWidth" : "155px"        },
                 /* Website */         { "sTitle" : $.i18n._("Website")            , "mDataProp" : "info_url"     , "bVisible"    : false                 , "sClass"      : "library_url"           , "sWidth" : "150px"        },
                 /* Year */            { "sTitle" : $.i18n._("Year")               , "mDataProp" : "year"         , "bVisible"    : false                 , "sClass"      : "library_year"          , "sWidth" : "60px"         },
-                /* Context Menu */    { "sTitle" : ""                             , "mDataProp" : "options"      , "bSortable"   : false                 , "bSearchable" : false                   , "sWidth" : "16px", "sClass" : "library_actions" }
+                /* Context Menu */    { "sTitle" : ""                             , "mDataProp" : "options"      , "bSortable"   : false                 , "bSearchable" : false                   , "sWidth" : "20px", "sClass" : "library_actions" }
             ],
 
             "bProcessing": true,
@@ -793,8 +799,8 @@ var AIRTIME = (function(AIRTIME) {
             "bAutoWidth": false,
             "oLanguage": getLibraryDatatableStrings(),
 
-            // R = ColReorder, C = ColVis
+            // z = ColResize, R = ColReorder, C = ColVis
-            "sDom": 'Rf<"dt-process-rel"r><"H"<"library_toolbar"C>><"dataTables_scrolling"t<"#library_empty"<"#library_empty_image"><"#library_empty_text">>><"F"ilp>>',
+            "sDom": 'Rf<"dt-process-rel"r><"H"<"library_toolbar"C>><"dataTables_scrolling"t<"#library_empty"<"#library_empty_image"><"#library_empty_text">>><"F"lip>>',
 
             "oColVis": {
                 "sAlign": "right",

airtime_mvc/public/js/airtime/library/plupload.js

@@ -17,7 +17,7 @@ $(document).ready(function () {
     Dropzone.options.addMediaDropzone = {
         url: '/rest/media',
         //clickable: false,
-        acceptedFiles: acceptedMimeTypes.join() + ",.flac",
+        acceptedFiles: acceptedMimeTypes.join(),
         addRemoveLinks: true,
         dictRemoveFile: $.i18n._("Remove"),
         init: function () {
@@ -232,6 +232,23 @@ $(document).ready(function () {
                         getUsabilityHint();
                     }
                 });
+            },
+            "fnCreatedRow": function(nRow) {
+                $(nRow).find("td").hover(
+                    function () {
+                        var sw = $(this)[0].scrollWidth, iw = $(this).innerWidth();
+                        if (sw > iw) {
+                            $(this).stop().animate({
+                                textIndent: "-" + (sw + 2 - iw) + "px"
+                            }, sw * 8);
+                        }
+                    },
+                    function () {
+                        $(this).stop().animate({
+                            textIndent: "0"
+                        }, 500);
+                    }
+                );
             }
         });
 
@@ -256,15 +273,15 @@ $(document).ready(function () {
 
     $("#upload_status_all").click(function () {
         self.uploadFilter = "all";
-        self.recentUploadsTable.fnDraw();
+        self.recentUploadsTable.fnPageChange(0).fnDraw();
     });
     $("#upload_status_pending").click(function () {
         self.uploadFilter = "pending";
-        self.recentUploadsTable.fnDraw();
+        self.recentUploadsTable.fnPageChange(0).fnDraw();
     });
     $("#upload_status_failed").click(function () {
         self.uploadFilter = "failed";
-        self.recentUploadsTable.fnDraw();
+        self.recentUploadsTable.fnPageChange(0).fnDraw();
     });
 
     //Create the recent uploads table.

airtime_mvc/public/js/airtime/schedule/add-show.js

@@ -690,7 +690,7 @@ function setAddShowEvents(form) {
                     data: '',
                     type: 'DELETE',
                     success: function() {
-                        $("#add_show_logo_current").prop("src", "")
+                        $("#add_show_logo_current").prop("src", "");
                         $("[id^=add_show_logo_current]").hide();
                     }
                 });