diff --git a/app/assets/javascripts/landing.js b/app/assets/javascripts/landing.js index 01edbc9d..73be73e8 100644 --- a/app/assets/javascripts/landing.js +++ b/app/assets/javascripts/landing.js @@ -15,7 +15,7 @@ var init = function() { Meeting.clear(); - // setup click handlers + // setup event handlers $('.center-panel-wrapper').on ('click', '.meeting-join', function (event) { var name = $('.meeting-user-name').val(); Meeting.getInstance().setName(name); @@ -54,11 +54,49 @@ $('.center-panel-wrapper').on ('click', '.meeting-url-copy', function (event) { meetingURLInput = $('.meeting-url'); + + // copy URL meetingURLInput.select(); - document.execCommand("copy"); - meetingURLInput.blur(); + try { + var success = document.execCommand("copy"); + if (success) { + meetingURLInput.blur(); + $(this).trigger('hint', [$(this).data('copied-hint')]); + } else { + $(this).trigger('hint', [$(this).data('copy-error')]); + } + } catch (err) { + $(this).trigger('hint', [$(this).data('copy-error')]); + } }); + $('.center-panel-wrapper').on('hint', '.meeting-url-copy', function (event, msg) { + $(this).focus(); + $(this).attr('title', msg) + .tooltip('fixTitle') + .tooltip('show') + .attr('title', $(this).data('copy-hint')) + .tooltip('fixTitle'); + }); + + $('.center-panel-wrapper').on('mouseleave', '.meeting-url-copy', function (event, msg) { + $(this).blur(); + }); + + $('.center-panel-wrapper').on('focus', '.meeting-url', function (event, msg) { + $(this).select(); + }); + + // only allow ctrl-c to work + $('.center-panel-wrapper').on('keydown', '.meeting-url', function (event, msg) { + if(!event.ctrlKey) { + event.preventDefault(); + } + }); + + // enable tooltips + $('[data-toggle="tooltip"]').tooltip() + // enable popovers var options = { selector: '.has-popover', @@ -73,7 +111,7 @@ }; $('#recordings').popover(options); - // focus user + // focus name input or join button if ($('.meeting-user-name').is(':visible')) { $('.meeting-user-name').focus(); } else { diff --git a/app/assets/stylesheets/landing.scss b/app/assets/stylesheets/landing.scss index f53a86ef..4fbbd5b1 100644 --- a/app/assets/stylesheets/landing.scss +++ b/app/assets/stylesheets/landing.scss @@ -2,11 +2,20 @@ // They will automatically be included in application.css. // You can use Sass (SCSS) here: http://sass-lang.com/ -.join-form { - width: 100%; +.center-panel-wrapper { + .join-form { + width: 100%; + } + + .meeting-url-wrapper { + .meeting-url { + cursor: default; + } + } } .rooms { + .table-wrapper { padding: 40px 50px 10px 50px; @@ -18,4 +27,5 @@ } } } + } diff --git a/app/views/shared/_meeting_url.html.erb b/app/views/shared/_meeting_url.html.erb index 2a2c44cf..ff15f091 100644 --- a/app/views/shared/_meeting_url.html.erb +++ b/app/views/shared/_meeting_url.html.erb @@ -1,13 +1,15 @@