From 81f4d0d36358e61ebf48e896050b4d362ab170a4 Mon Sep 17 00:00:00 2001 From: Marcin Kulik Date: Wed, 14 Oct 2015 11:22:48 +0200 Subject: [PATCH] Include link sharing in share modal --- app/assets/stylesheets/asciicasts.sass | 2 +- app/views/asciicasts/_embed.html.slim | 27 ------------- app/views/asciicasts/_share.html.slim | 52 +++++++++++++++++++++++--- app/views/asciicasts/show.html.slim | 11 ++---- spec/features/asciicast_spec.rb | 4 +- 5 files changed, 53 insertions(+), 43 deletions(-) delete mode 100644 app/views/asciicasts/_embed.html.slim diff --git a/app/assets/stylesheets/asciicasts.sass b/app/assets/stylesheets/asciicasts.sass index 2260418..a81cfc5 100644 --- a/app/assets/stylesheets/asciicasts.sass +++ b/app/assets/stylesheets/asciicasts.sass @@ -91,7 +91,7 @@ h2 font-size: 20px - .embed-modal + .share-modal max-width: 900px width: initial diff --git a/app/views/asciicasts/_embed.html.slim b/app/views/asciicasts/_embed.html.slim deleted file mode 100644 index 6d060aa..0000000 --- a/app/views/asciicasts/_embed.html.slim +++ /dev/null @@ -1,27 +0,0 @@ -.modal.fade id="embed-modal" tabindex="-1" role="dialog" - .modal-dialog.embed-modal - .modal-content - .modal-header - button type="button" class="close" data-dismiss="modal" - span × - h4.modal-title id="myModalLabel" Embed this asciicast - .modal-body - h2 Image link - p Use snippets below to display a screenshot linking to this asciicast. Useful in places where scripts are not allowed (e.g. in a project's README file). - p - span HTML: - br - input[type="text" value=embed_html_link(page.asciicast) data-behavior="auto-select" readonly] - p - span Markdown: - br - input[type="text" value=embed_markdown_link(page.asciicast) data-behavior="auto-select" readonly] - - h2 Player - - p If you're embedding on your own page or on a site which permits script tags, - you can use the full player widget: - p - input[type="text" value=embed_script(page.asciicast) data-behavior="auto-select" readonly] - p Paste the above script tag where you want the player to be displayed on your page. - p See the #{link_to 'embedding docs', docs_path(:embedding)} for additional options. diff --git a/app/views/asciicasts/_share.html.slim b/app/views/asciicasts/_share.html.slim index add2165..ffc83b7 100644 --- a/app/views/asciicasts/_share.html.slim +++ b/app/views/asciicasts/_share.html.slim @@ -1,7 +1,47 @@ -h1 Share +.modal.fade id="share-modal" tabindex="-1" role="dialog" + .modal-dialog.share-modal + .modal-content + .modal-header + button type="button" class="close" data-dismiss="modal" + span × + h4.modal-title id="myModalLabel" Share this recording + .modal-body + .row + .col-md-6 + h2 Link + p + input[type="text" value=asciicast_url(page.asciicast) data-behavior="auto-select" readonly] + br + span + ' Append + code + ' ?t=30 + ' to start the playback at 30s, + code + ' ?t=3:20 + ' to start the playback at 3m 20s. -ul.delimited - li - ' Embed on your page - input[type="text" class="embed-script" value=@asciicast.embed_script data-behavior="auto-select" readonly] - span See the #{link_to 'embedding docs', docs_path(:embedding)} for options + .col-md-6 + h2 Social + div + = render 'shared/add_this', title: page.asciicast_title, url: asciicast_url(page.asciicast), big: true + + h2 Embed image link + p Use snippets below to display a screenshot linking to this recording. Useful in places where scripts are not allowed (e.g. in a project's README file). + p + span HTML: + br + input[type="text" value=embed_html_link(page.asciicast) data-behavior="auto-select" readonly] + p + span Markdown: + br + input[type="text" value=embed_markdown_link(page.asciicast) data-behavior="auto-select" readonly] + + h2 Embed the player + + p If you're embedding on your own page or on a site which permits script tags, + you can use the full player widget: + p + input[type="text" value=embed_script(page.asciicast) data-behavior="auto-select" readonly] + p Paste the above script tag where you want the player to be displayed on your page. + p See the #{link_to 'embedding docs', docs_path(:embedding)} for additional options. diff --git a/app/views/asciicasts/show.html.slim b/app/views/asciicasts/show.html.slim index 1559478..0211e60 100644 --- a/app/views/asciicasts/show.html.slim +++ b/app/views/asciicasts/show.html.slim @@ -4,7 +4,7 @@ = render 'alternate_links', page: page .asciicast-page - = render 'embed', page: page + = render 'share', page: page section.cinema .container @@ -13,7 +13,7 @@ section.even.info .container .row - .col-md-8.col-xs-8 + .col-md-12.col-xs-12 span.author-avatar = page.author_img_link h2 = page.asciicast_title @@ -23,9 +23,6 @@ = render 'featured_label' small by #{page.author_link} #{time_ago_tag page.asciicast_created_at} - .col-md-4.col-xs-4.text-right - = render 'shared/add_this', title: page.asciicast_title, url: asciicast_url(page.asciicast) - section.odd.meta .container .row @@ -79,9 +76,9 @@ ul.meta-list.actions-list li - span.glyphicon.glyphicon-link + span.glyphicon.glyphicon-share-alt ' - a href="#" id="embed-link" data-toggle="modal" data-target="#embed-modal" Embed + a href="#" id="share-link" data-toggle="modal" data-target="#share-modal" Share - if page.show_description? section.odd.description diff --git a/spec/features/asciicast_spec.rb b/spec/features/asciicast_spec.rb index 951bdc1..ee7d0a9 100644 --- a/spec/features/asciicast_spec.rb +++ b/spec/features/asciicast_spec.rb @@ -11,7 +11,7 @@ feature "Asciicast page", :js => true do expect(page).to have_content('the title') expect(page).to have_link('aaron') - expect(page).to have_link('Embed') + expect(page).to have_link('Share') expect(page).to have_selector('.cinema .play-button') end @@ -22,7 +22,7 @@ feature "Asciicast page", :js => true do expect(page).to have_content('the title') expect(page).to have_link('aaron') - expect(page).to have_link('Embed') + expect(page).to have_link('Share') expect(page).to have_selector('.cinema .play-button') end