diff --git a/app/assets/images/loading-indicator.gif b/app/assets/images/loading-indicator.gif new file mode 100644 index 00000000..f2a1bc0c Binary files /dev/null and b/app/assets/images/loading-indicator.gif differ diff --git a/app/assets/javascripts/channels/recording_update.js b/app/assets/javascripts/channels/recording_update.js index 51c9d842..3beec545 100644 --- a/app/assets/javascripts/channels/recording_update.js +++ b/app/assets/javascripts/channels/recording_update.js @@ -7,17 +7,20 @@ }, { received: function(data) { - var table = $("#recordings").DataTable(); + var recordings = Recordings.getInstance(); + var table = recordings.table.api() var row = table.row("#"+data.record_id); if (data.action === 'update') { var rowData = row.data(); rowData.published = data.published - table.row("#"+data.record_id).data(rowData).draw(); + table.row("#"+data.record_id).data(rowData); + recordings.draw(); var published = (data.published) ? 'published' : 'unpublished'; showAlert(I18n['recording_'+published], 4000); } else if (data.action === 'delete') { - row.remove().draw(); + row.remove(); + recordings.draw(); showAlert(I18n.recording_deleted, 4000); } diff --git a/app/assets/javascripts/recordings.coffee b/app/assets/javascripts/recordings.coffee index 38426681..1e4938c6 100644 --- a/app/assets/javascripts/recordings.coffee +++ b/app/assets/javascripts/recordings.coffee @@ -9,18 +9,20 @@ class @Recordings data: [], rowId: 'id', paging: false, - searching: false, + dom: 't', info: false, order: [[ 0, "desc" ]], language: { - emptyTable: " " + emptyTable: I18n.no_recordings, + zeroRecords: I18n.no_recordings }, columns: [ { data: "start_time" }, - { data: "previews" }, + { data: "previews", orderable: false }, { data: "duration" }, - { data: "playbacks" }, - { data: "id" } + { data: "playbacks", orderable: false }, + { data: "published", visible: false }, + { data: "id", orderable: false } ], columnDefs: [ { @@ -38,8 +40,9 @@ class @Recordings render: (data, type, row) -> if type == 'display' str = '' - for d in data - str += ''+d.alt+' ' + if row.published + for d in data + str += ''+d.alt+' ' return str return data }, @@ -50,7 +53,7 @@ class @Recordings str = '' if row.published for d in data - str += ''+d.type_i18n+' ' + str += ''+d.type_i18n+' ' return str return data }, @@ -61,7 +64,7 @@ class @Recordings roomName = Meeting.getInstance().getId() published = row.published icon = getPublishClass(published) - publishText = if published then 'publish' else 'unpublish' + publishText = if published then 'unpublish' else 'publish' recordingActions = $('.hidden-elements').find('.recording-actions') recordingActions.find('.recording-update > i') .removeClass() @@ -74,6 +77,13 @@ class @Recordings } ] }) + options = { + selector: '.delete-tooltip', + container: 'body', + placement: 'bottom', + title: I18n.delete_recording + }; + $('#recordings').tooltip(options); # Gets the current instance or creates a new one @getInstance: -> @@ -88,12 +98,17 @@ class @Recordings @initialized: -> return $.fn.DataTable.isDataTable('#recordings') && _recordingsInstance + draw: -> + if !@isOwner() + @table.api().columns(4).search('true') + @table.api().columns.adjust().draw() + # refresh the recordings from the server refresh: -> - _this = this table_api = this.table.api() - $.get "/rooms/"+Meeting.getInstance().getId()+"/recordings", (data) -> - if !data.is_owner + $.get "/rooms/"+Meeting.getInstance().getId()+"/recordings", (data) => + @setOwner(data.is_owner) + if !@owner table_api.column(-1).visible(false) for recording in data.recordings totalMinutes = Math.round((new Date(recording.end_time) - new Date(recording.start_time)) / 1000 / 60) @@ -102,7 +117,7 @@ class @Recordings return new Date(b.start_time) - new Date(a.start_time) table_api.clear() table_api.rows.add(data.recordings) - table_api.columns.adjust().draw() + @draw() # setup click handlers for the action buttons setupActionHandlers: -> @@ -138,3 +153,9 @@ class @Recordings ).fail((data) -> btn.prop('disabled', false) ) + + isOwner: -> + @owner + + setOwner: (owner) -> + @owner = owner diff --git a/app/assets/stylesheets/landing.scss b/app/assets/stylesheets/landing.scss index 4fbbd5b1..f93d71b8 100644 --- a/app/assets/stylesheets/landing.scss +++ b/app/assets/stylesheets/landing.scss @@ -2,18 +2,6 @@ // They will automatically be included in application.css. // You can use Sass (SCSS) here: http://sass-lang.com/ -.center-panel-wrapper { - .join-form { - width: 100%; - } - - .meeting-url-wrapper { - .meeting-url { - cursor: default; - } - } -} - .rooms { .table-wrapper { @@ -25,6 +13,9 @@ content: none; //removes the sort icon in table header } } + .dataTables_empty { + text-align: center; + } } } diff --git a/app/assets/stylesheets/shared.scss b/app/assets/stylesheets/shared.scss index 77628fe2..a243f9c9 100644 --- a/app/assets/stylesheets/shared.scss +++ b/app/assets/stylesheets/shared.scss @@ -7,17 +7,17 @@ html, body { width: 100%; height: 100%; + background: #ffffff; } .app-background { - background: #4dc0a2; - background: -moz-linear-gradient(top, #4dc0a2 0%, #4dc0a2 35%, #ffffff 35%, #ffffff 100%); - background: -webkit-gradient(left top, left bottom, color-stop(0%, #4dc0a2), color-stop(35%, #4dc0a2), color-stop(35%, #ffffff), color-stop(100%, #ffffff)); - background: -webkit-linear-gradient(top, #4dc0a2 0%, #4dc0a2 35%, #ffffff 35%, #ffffff 100%); - background: -o-linear-gradient(top, #4dc0a2 0%, #4dc0a2 35%, #ffffff 35%, #ffffff 100%); - background: -ms-linear-gradient(top, #4dc0a2 0%, #4dc0a2 35%, #ffffff 35%, #ffffff 100%); - background: linear-gradient(to bottom, #4dc0a2 0%, #4dc0a2 35%, #ffffff 35%, #ffffff 100%); - filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4dc0a2', endColorstr='#ffffff', GradientType=0 ); + background: #ffffff; + background: -moz-linear-gradient(top, #4dc0a2 0%, #4dc0a2 350px, #ffffff 350px, #ffffff 100%); + background: -webkit-gradient(left top, left bottom, color-stop(0%, #4dc0a2), color-stop(350px, #4dc0a2), color-stop(350px, #ffffff), color-stop(100%, #ffffff)); + background: -webkit-linear-gradient(top, #4dc0a2 0%, #4dc0a2 350px, #ffffff 350px, #ffffff 100%); + background: -o-linear-gradient(top, #4dc0a2 0%, #4dc0a2 350px, #ffffff 350px, #ffffff 100%); + background: -ms-linear-gradient(top, #4dc0a2 0%, #4dc0a2 350px, #ffffff 350px, #ffffff 100%); + background: linear-gradient(to bottom, #4dc0a2 0%, #4dc0a2 350px, #ffffff 350px, #ffffff 100%); } #alerts { @@ -52,7 +52,10 @@ html, body { float: none; } .center-panel-size { - width: 650px; + max-width: 900px + } + .center-panel-conent-size { + max-width: 800px; } .input-spacing { @@ -71,4 +74,26 @@ html, body { .title-wrapper { margin-bottom: 30px; } + + .join-form-wrapper { + .center-block { + max-width: 400px; + } + .join-form { + width: 100%; + } + .btn { + width: initial; + } + } + + .meeting-url-wrapper { + .meeting-url { + cursor: default; + } + } + + .loading-wrapper { + text-align: center; + } } diff --git a/app/views/landing/_rooms_center_panel.html.erb b/app/views/landing/_rooms_center_panel.html.erb index f805d6b3..a978897f 100644 --- a/app/views/landing/_rooms_center_panel.html.erb +++ b/app/views/landing/_rooms_center_panel.html.erb @@ -11,14 +11,12 @@ <% end %> <%= render layout: 'shared/center_panel' do %> -
+
<% if admin? %> <%= render 'shared/meeting_url', hidden: false %> <% else %> <%= render 'shared/meeting_url', hidden: true %> <% end %> -
- <%= render 'shared/join_form' %> -
+ <%= render 'shared/join_form' %>
<% end %> diff --git a/app/views/landing/meetings.html.erb b/app/views/landing/meetings.html.erb index 0eb74733..7f157f22 100644 --- a/app/views/landing/meetings.html.erb +++ b/app/views/landing/meetings.html.erb @@ -24,7 +24,7 @@
<%= render layout: 'shared/center_panel' do %> -
+
<%= render 'shared/meeting_url', hidden: false %> <%= render 'shared/join_form' %>
diff --git a/app/views/landing/rooms.html.erb b/app/views/landing/rooms.html.erb index 4effe1a6..6c82ba3a 100644 --- a/app/views/landing/rooms.html.erb +++ b/app/views/landing/rooms.html.erb @@ -14,13 +14,13 @@
-

<%= t('past_recordings') %>

+
<%= t('date_recorded') %> <%= t('thumbnails') %> <%= t('duration') %> <%= t('views') %>published <%= t('actions') %>
@@ -49,8 +49,8 @@ - +
diff --git a/app/views/landing/wait_for_moderator.html.erb b/app/views/landing/wait_for_moderator.html.erb index ab720cbb..91641566 100644 --- a/app/views/landing/wait_for_moderator.html.erb +++ b/app/views/landing/wait_for_moderator.html.erb @@ -5,7 +5,11 @@ <%= t('wait_for_mod_explanation') %> + <% end %> <%= render layout: 'shared/center_panel' do %> +
+ <%= image_tag "loading-indicator.gif", :alt => "" %> +
<% end %> diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb index 152c8571..6acd914f 100644 --- a/app/views/layouts/application.html.erb +++ b/app/views/layouts/application.html.erb @@ -4,6 +4,7 @@ Greenlight <%= csrf_meta_tags %> <%= action_cable_meta_tag %> + <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %> <%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %> @@ -21,14 +22,19 @@