From e152b3a271be645c7b7f9b51b0ff196716c7f0d8 Mon Sep 17 00:00:00 2001 From: Evandro Junior Date: Mon, 30 Mar 2015 17:02:29 -0300 Subject: [PATCH] Enables fullscreen view for article view and edit --- app/helpers/application_helper.rb | 22 ++++++++++++++++++++++ app/helpers/tinymce_helper.rb | 2 +- app/views/content_viewer/_article_toolbar.html.erb | 1 + public/designs/icons/tango/style.css | 1 + public/javascripts/application.js | 39 +++++++++++++++++++++++++++++++++++++++ public/stylesheets/application.css | 16 ++++++++++++++++ test/unit/application_helper_test.rb | 7 +++++++ 7 files changed, 87 insertions(+), 1 deletion(-) diff --git a/app/helpers/application_helper.rb b/app/helpers/application_helper.rb index 7820f5b..64ee933 100644 --- a/app/helpers/application_helper.rb +++ b/app/helpers/application_helper.rb @@ -1498,4 +1498,26 @@ module ApplicationHelper text_field(object_name, method, options.merge(:class => 'colorpicker_field')) end + def fullscreen_buttons(itemId) + content=" + + " + content+=content_tag('a', content_tag('span',_("Full screen")), + { :id=>"fullscreen-btn", + :onClick=>"toggle_fullwidth('#{itemId}')", + :class=>"button with-text icon-fullscreen", + :href=>"#", + :title=>_("Go to full screen mode") + }) + + content+=content_tag('a', content_tag('span',_("Exit full screen")), + { :style=>"display: none;", + :id=>"exit-fullscreen-btn", + :onClick=>"toggle_fullwidth('#{itemId}')", + :class=>"button with-text icon-fullscreen", + :href=>"#", + :title=>_("Exit full screen mode") + }) + end + end diff --git a/app/helpers/tinymce_helper.rb b/app/helpers/tinymce_helper.rb index 725f9ba..73d01eb 100644 --- a/app/helpers/tinymce_helper.rb +++ b/app/helpers/tinymce_helper.rb @@ -20,7 +20,7 @@ module TinymceHelper :image_advtab => true, :language => tinymce_language - options[:toolbar1] = "insertfile undo redo | copy paste | bold italic underline | styleselect fontsizeselect | forecolor backcolor | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image" + options[:toolbar1] = "fullscreen | insertfile undo redo | copy paste | bold italic underline | styleselect fontsizeselect | forecolor backcolor | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image" if options[:mode] == 'simple' options[:menubar] = false else diff --git a/app/views/content_viewer/_article_toolbar.html.erb b/app/views/content_viewer/_article_toolbar.html.erb index be22603..bf4f50f 100644 --- a/app/views/content_viewer/_article_toolbar.html.erb +++ b/app/views/content_viewer/_article_toolbar.html.erb @@ -1,6 +1,7 @@ >
+ <%= fullscreen_buttons('#article') %> <% if @page.allow_edit?(user) && !remove_content_button(:edit, @page) %> <% content = content_tag('span', label_for_edit_article(@page)) %> diff --git a/public/designs/icons/tango/style.css b/public/designs/icons/tango/style.css index df3a88b..fc883bb 100644 --- a/public/designs/icons/tango/style.css +++ b/public/designs/icons/tango/style.css @@ -114,6 +114,7 @@ .icon-set-admin-role { background-image: url(mod/16x16/apps/user.png) } .icon-reset-admin-role { background-image: url(../../../images/icons-app/person-icon.png) } .icon-clock { background-image: url(Tango/16x16/actions/appointment.png) } +.icon-fullscreen { background-image: url(Tango/16x16/actions/view-fullscreen.png) } /******************LARGE ICONS********************/ .image-gallery-item .folder { background-image: url(mod/96x96/places/folder.png) } diff --git a/public/javascripts/application.js b/public/javascripts/application.js index 59957cd..b7e6890 100644 --- a/public/javascripts/application.js +++ b/public/javascripts/application.js @@ -1165,3 +1165,42 @@ function add_new_file_fields() { } window.isHidden = function isHidden() { return (typeof(document.hidden) != 'undefined') ? document.hidden : !document.hasFocus() }; + +function getQueryParams(qs) { + qs = qs.split("+").join(" "); + var params = {}, + tokens, + re = /[?&]?([^=]+)=([^&]*)/g; + while (tokens = re.exec(qs)) { + params[decodeURIComponent(tokens[1])] + = decodeURIComponent(tokens[2]); + } + return params; +} + +var fullwidth=false; +function toggle_fullwidth(itemId){ + if(fullwidth){ + jQuery(itemId).removeClass("fullwidth"); + jQuery("#fullscreen-btn").show() + jQuery("#exit-fullscreen-btn").hide() + fullwidth = false; + } + else{ + jQuery(itemId).addClass("fullwidth"); + jQuery("#exit-fullscreen-btn").show() + jQuery("#fullscreen-btn").hide() + fullwidth = true; + } + jQuery(window).trigger("toggleFullwidth", fullwidth); +} + +function fullscreenPageLoad(itemId){ + jQuery(document).ready(function(){ + var $_GET = getQueryParams(document.location.search); + if ($_GET['fullscreen']==1){ + toggle_fullwidth(itemId); + } + }); +} + diff --git a/public/stylesheets/application.css b/public/stylesheets/application.css index 820900c..629096d 100644 --- a/public/stylesheets/application.css +++ b/public/stylesheets/application.css @@ -6971,3 +6971,19 @@ li.profile-activity-item.upload_image .activity-gallery-images-count-1 img { body .ui-widget-overlay { background: #000; } + +.fullwidth{ + position: fixed !important; + left: 0 !important; + top: 0 !important; + background: white !important; + width: 97% !important; + width: 100% !important; + z-index: 999 !important; + padding: 2em !important; + bottom:0 !important; + overflow: auto !important; + -webkit-box-sizing: border-box !important; + -moz-box-sizing: border-box !important; + box-sizing: border-box !important; +} diff --git a/test/unit/application_helper_test.rb b/test/unit/application_helper_test.rb index 398225b..a3661e6 100644 --- a/test/unit/application_helper_test.rb +++ b/test/unit/application_helper_test.rb @@ -1002,6 +1002,13 @@ class ApplicationHelperTest < ActionView::TestCase assert_equal file, from_theme_include('atheme', 'afile')[:file] # exists? = true end + should 'enable fullscreen buttons' do + html = fullscreen_buttons("#article") + assert html.include?("") + assert html.include?("class=\"button with-text icon-fullscreen\"") + assert html.include?("onClick=\"toggle_fullwidth('#article')\"") + end + protected include NoosferoTestHelper -- libgit2 0.21.2