Merge pull request #48 from zach-chai/minor_redesign

Minor redesign

app/assets/javascripts/landing.js

@@ -132,7 +132,6 @@
   };
 
   var initIndex = function() {
-
     $('.generate-link').click (function (e) {
       e.preventDefault();
       var newId = Math.trunc(Math.random() * 1000000000);
@@ -140,11 +139,11 @@
       $('.meeting-url').val(Meeting.buildMeetingURL());
     });
 
-    if (meetingId = $(".page-wrapper.meetings").data('id')) {
-      $('.meeting-url').val(Meeting.getInstance().getURL());
-    } else {
     $('.generate-link').click();
-    }
+  };
+
+  var initMeetings = function() {
+    $('.meeting-url').val(Meeting.getInstance().getURL());
   };
 
   var initRooms = function() {
@@ -157,8 +156,10 @@
   $(document).on("turbolinks:load", function() {
     if ($("body[data-controller=landing]").get(0)) {
       init();
-      if ($("body[data-action=meetings]").get(0)) {
+      if ($("body[data-action=index]").get(0)) {
         initIndex();
+      } else if ($("body[data-action=meetings]").get(0)) {
+        initMeetings();
       } else if ($("body[data-action=rooms]").get(0)) {
         initRooms();
       }

app/assets/javascripts/recordings.coffee

@@ -63,12 +63,14 @@ class @Recordings
             if type == 'display'
               roomName = Meeting.getInstance().getId()
               published = row.published
-              icon = getPublishClass(published)
               publishText = if published then 'unpublish' else 'publish'
               recordingActions = $('.hidden-elements').find('.recording-actions')
-              recordingActions.find('.recording-update > i')
+              recordingActions.find('.recording-update > i.default')
-                .removeClass()
+                .removeClass(PUBLISHED_CLASSES.join(' '))
-                .addClass('fa '+icon)
+                .addClass(getPublishClass(published))
+              recordingActions.find('.recording-update > i.hover')
+                .removeClass(PUBLISHED_CLASSES.join(' '))
+                .addClass(getPublishClass(!published))
               recordingActions.find('.recording-update')
                 .attr('data-published', published)
                 .attr('title', I18n[publishText+'_recording'])

app/assets/stylesheets/landing.scss

@@ -16,6 +16,17 @@
       .dataTables_empty {
         text-align: center;
       }
+      .recording-update:hover > {
+        .default {
+          display: none;
+        }
+        .hover {
+          display: inline-block;
+        }
+      }
+      .fa.hover {
+        display: none;
+      }
     }
   }
 

app/assets/stylesheets/shared.scss

@@ -31,7 +31,7 @@ html, body {
 
 .header {
   padding: 20px 40px;
-
+  margin-bottom: 160px;
   .logo {
     max-width: 150px;
     max-height: 50px;
@@ -42,11 +42,6 @@ html, body {
   padding: 20px;
 }
 
-.page-header {
-  margin-top: 100px;
-  border: 0;
-}
-
 .center-panel {
   .center-block {
     float: none;

app/controllers/landing_controller.rb

@@ -2,6 +2,9 @@ class LandingController < ApplicationController
   include BbbApi
 
   def index
+  end
+
+  def resource
     if params[:resource] == 'meetings'
       render_meeting
     elsif params[:resource] == 'rooms'

app/controllers/sessions_controller.rb

@@ -2,7 +2,7 @@ class SessionsController < ApplicationController
   def create
     @user = User.from_omniauth(request.env['omniauth.auth'])
     session[:user_id] = @user.id
-    redirect_to controller: 'landing', action: 'index', id: @user.encrypted_id, resource: 'rooms'
+    redirect_to @user.room_url
   rescue => e
     logger.error "Error authenticating via omniauth: #{e}"
     redirect_to root_path

app/views/landing/index.html.erb

@@ -0,0 +1,20 @@
+<% content_for :title do %>
+  <div class="title">
+    <h2><%= t('create_session') %></h2>
+  </div>
+<% end %>
+
+<div class="page-wrapper meetings">
+  <div class="container-fluid">
+
+    <div class="center-panel-wrapper">
+      <%= render layout: 'shared/center_panel' do %>
+        <div class="center-block center-panel-conent-size col-xs-12">
+          <%= render 'shared/meeting_url', hidden: false %>
+          <%= render 'shared/join_form' %>
+        </div>
+      <% end %>
+    </div>
+
+  </div>
+</div>

app/views/landing/meetings.html.erb

@@ -1,31 +1,28 @@
 <% content_for :title do %>
   <div class="title">
-    <%= t('hi_all') %>
+    <h2><%= t('join_session_id', id: @meeting_id) %></h2>
   </div>
-  <small>
-    <%= t('session_url_explanation') %>
-  </small>
 <% end %>
 
-<% if !@meeting_id %>
+<% content_for :footer do %>
-  <% content_for :footer do %>
   <div class="panel-footer">
     <div class="text-center">
-        <%= t('refresh_html') %>
+      <% if current_user %>
-      </div>
+        <%= link_to t('return_to_room'), current_user.room_url %>
-    </div>
+      <% else %>
+        <%= link_to t('create_your_session'), root_path %>
       <% end %>
+    </div>
+  </div>
 <% end %>
 
 <div class="page-wrapper meetings" data-id="<%= @meeting_id %>">
   <div class="container-fluid">
 
-    <%= render 'shared/title', title: t('start_new_session') %>
-
     <div class="center-panel-wrapper">
       <%= render layout: 'shared/center_panel' do %>
         <div class="center-block center-panel-conent-size col-xs-12">
-          <%= render 'shared/meeting_url', hidden: false %>
+          <%= render 'shared/meeting_url', hidden: true %>
           <%= render 'shared/join_form' %>
         </div>
       <% end %>

app/views/landing/rooms.html.erb

@@ -7,8 +7,6 @@
 <div class="page-wrapper rooms" data-id="<%= @user.encrypted_id %>">
   <div class="container-fluid">
 
-    <%= render 'shared/title', title: page_title %>
-
     <div class="center-panel-wrapper">
       <%= render 'rooms_center_panel' %>
     </div>
@@ -47,7 +45,8 @@
   </div>
   <div class="recording-actions">
     <button type="button" class="btn btn-default recording-update bottom-tooltip" data-published="">
-        <i class="fa" aria-hidden="true"></i>
+        <i class="fa default" aria-hidden="true"></i>
+        <i class="fa hover" aria-hidden="true"></i>
     </button>
     <a tabindex="0" role="button" class="btn btn-default has-popover delete-tooltip"
       data-placement="top">

app/views/layouts/application.html.erb

@@ -56,7 +56,7 @@
 
     <!-- Footer -->
     <div class='footer text-center'>
-      <%= t('powered_bigbluebutton') %>
+      <%= t('powered_bigbluebutton_html', link: link_to('BigBlueButton', 'http://bigbluebutton.org/', target: "_blank")) %>
     </div>
     <!-- End of Footer -->
   </body>

app/views/shared/_meeting_url.html.erb

@@ -2,6 +2,13 @@
   <div class="input-group">
     <input type="text" class="form-control meeting-url"/>
     <span class="input-group-btn">
+      <% if params[:action] == 'index' %>
+        <button type="button" class="btn btn-default generate-link has-tooltip"
+          title="<%= t('url_refresh_hint') %>"
+        >
+          <i class="fa fa-refresh" aria-hidden="true"></i>
+        </button>
+      <% end %>
       <button type="button" class="btn btn-default meeting-url-copy has-tooltip"
         title="<%= t('url_copy_explanation') %>"
         data-copied-hint="<%= t('copied') %>"

app/views/shared/_title.html.erb

@@ -1,7 +0,0 @@
-<div class="row">
-  <div class="page-header">
-    <h1 class="text-center">
-      <%= title %>
-    </h1>
-  </div>
-</div>

config/locales/en-us.yml

@@ -35,6 +35,8 @@ en-US:
     unpublish_recording: Hide recording
   copied: Copied
   copy_error: Use Ctrl-c to copy
+  create_session: Create a session
+  create_your_session: Create your own session
   date_recorded: Date
   duration: Duration
   end: End
@@ -44,6 +46,7 @@ en-US:
   hi_all: Hi Everyone
   join: Join
   join_session: Join the current session
+  join_session_id: Join %{id}
   join_session_user: Join %{name} session
   login: login
   logout: logout
@@ -51,14 +54,15 @@ en-US:
   no: No
   oauth_signup: Signup for customized sessions
   past_recordings: Past Recordings
-  powered_bigbluebutton: Powered by BigBlueButton
+  powered_bigbluebutton_html: Powered by %{link}
   presentation: Presentation
-  refresh_html: <a href="#" class="generate-link">Click refresh</a> to generate a new meeting URL
+  return_to_room: Return to your personal room
   session_url_explanation: The session will be taking place using the following URL
   start: Start
   start_new_session: Start a new session
   thumbnails: Thumbnails
   url_copy_explanation: Copy this URL to invite others to the meeting
+  url_refresh_hint: Generate a new meeting URL
   video: Video
   views: Views
   wait_for_mod_msg: Looks like you're the first one here...

config/routes.rb

@@ -11,7 +11,7 @@ Rails.application.routes.draw do
   # There are two resources [meetings|rooms]
   # meetings offer a landing page for NON authenticated users to create and join session in BigBlueButton
   # rooms offer a customized landing page for authenticated users to create and join session in BigBlueButton
-  get '/:resource/:id', to: 'landing#index', as: :resource
+  get '/:resource/:id', to: 'landing#resource', as: :resource
   get '/:resource/:id/join', to: 'bbb#join', as: :bbb_join, defaults: {format: 'json'}
   get '/:resource/:id/wait', to: 'landing#wait_for_moderator'
   get '/:resource/:id/session_status_refresh', to: 'landing#session_status_refresh'