X-Git-Url: https://git.mxchange.org/?a=blobdiff_plain;ds=sidebyside;f=view%2Ftheme%2Ffrio%2Fjs%2Fmodal.js;h=1fd03ddfac54585fec7e0ba01eccf278152acc13;hb=471056e9898331d23b42bf6e7abdeeb1c4e746a1;hp=fcaaadcc7bdaf24315a4810aff4c2029d2a2408d;hpb=e2f8673076165c402782332b42ee744b1ffc7969;p=friendica.git diff --git a/view/theme/frio/js/modal.js b/view/theme/frio/js/modal.js index fcaaadcc7b..1fd03ddfac 100644 --- a/view/theme/frio/js/modal.js +++ b/view/theme/frio/js/modal.js @@ -8,9 +8,11 @@ $(document).ready(function(){ $(this).removeData('bs.modal'); $("#modal-title").empty(); $('#modal-body').empty(); - // remove the file browser from jot (else we would have problems - // with ajaxupload + // Remove the file browser from jot (else we would have problems + // with AjaxUpload $(".fbrowser").remove(); + // Remove the AjaxUpload element + $("[name=userfile]").parent().remove(); }); // Clear bs modal on close @@ -57,7 +59,7 @@ $(document).ready(function(){ }); // Jot nav menu. - $("body").on("click", "#jot-modal .jot-nav li a", function(e){ + $("body").on("click", "#jot-modal .jot-nav li .jot-nav-lnk", function(e){ e.preventDefault(); toggleJotNav(this); }); @@ -90,7 +92,11 @@ $(document).ready(function(){ }); // overwrite Dialog.show from main js to load the filebrowser into a bs modal -Dialog.show = function(url, title="") { +Dialog.show = function(url, title) { + if (typeof(title) === 'undefined') { + title = ""; + } + var modal = $('#modal').modal(); modal.find("#modal-header h4").html(title); modal @@ -158,13 +164,22 @@ Dialog._load = function(url) { */ function loadModalTitle() { // clear the text of the title - //$("#modal-title").empty(); + $("#modal-title").empty(); // hide the first element with the class "heading" of the modal body $("#modal-body .heading").first().hide(); + var title = ""; + // get the text of the first element with "heading" class - var title = $("#modal-body .heading").first().text(); + title = $("#modal-body .heading").first().text(); + + // for event modals we need some speacial handling + if($("#modal-body .event-wrapper .event-summary").length) { + title = ' '; + var eventsum = $("#modal-body .event-wrapper .event-summary").text(); + title = title + eventsum; + } // and append it to modal title if (title!=="") { @@ -195,6 +210,19 @@ function addToModal(url) { }); } +// Add a element (by it's id) to a bootstrap modal +function addElmToModal(id) { + var elm = $(id).html(); + var modal = $('#modal').modal(); + + modal + .find('#modal-body') + .append(elm) + .modal.show; + + loadModalTitle(); +} + // function to load the html from the edit post page into // the jot modal function editpost(url) { @@ -212,15 +240,15 @@ function editpost(url) { } var modal = $('#jot-modal').modal(); - url = url + " #profile-jot-form"; + url = url + " #jot-sections"; //var rand_num = random_digits(12); - $(".jot-nav #jot-perms-lnk").parent("li").hide(); + $(".jot-nav .jot-perms-lnk").parent("li").addClass("hidden"); - // For editpost we load the modal html form the edit page. So we would have two jot forms in + // For editpost we load the modal html of "jot-sections" of the edit page. So we would have two jot forms in // the page html. To avoid js conflicts we store the original jot in the variable jotcache. // After closing the modal original jot should be restored at its orginal position in the html structure. - jotcache = $("#jot-content > #profile-jot-form"); + jotcache = $("#jot-content > #jot-sections"); // remove the original Jot as long as the edit Jot is open jotcache.remove(); @@ -232,7 +260,7 @@ function editpost(url) { jotreset(); modal - .find('#jot-modal-body') + .find('#jot-modal-content') .load(url, function (responseText, textStatus) { if ( textStatus === 'success' || textStatus === 'notmodified') @@ -258,7 +286,7 @@ function jotreset() { // We need this to prevent that the modal displays old content $('body').on('hidden.bs.modal', '#jot-modal.edit-jot', function () { $(this).removeData('bs.modal'); - $(".jot-nav #jot-perms-lnk").parent("li").show(); + $(".jot-nav .jot-perms-lnk").parent("li").removeClass("hidden"); $("#profile-jot-form #jot-title-wrap").show(); $("#profile-jot-form #jot-category-wrap").show(); @@ -272,15 +300,58 @@ function jotreset() { // remove the "edit-jot" class so we can the standard behavior on close $("#jot-modal.edit-jot").removeClass("edit-jot"); - $("#jot-modal-body").empty(); + $("#jot-modal-content").empty(); }); } // Give the active "jot-nav" list element the class "active" function toggleJotNav (elm) { - // select all li of jot-nav and remove the active class - $(elm).closest(".jot-nav").children("li").removeClass("active"); - // add the active class to the parent of the link which was selected + // Get the ID of the tab panel which should be activated + var tabpanel = elm.getAttribute("aria-controls"); + var cls = hasClass(elm, "jot-nav-lnk-mobile"); + + // Select all li of jot-nav and remove the active class + $(elm).parent("li").siblings("li").removeClass("active"); + // Add the active class to the parent of the link which was selected $(elm).parent("li").addClass("active"); + + // Minimize all tab content wrapper and activate only the selected + // tab panel + $('#jot-modal [role=tabpanel]').addClass("minimize").attr("aria-hidden" ,"true"); + $('#jot-modal #' + tabpanel).removeClass("minimize").attr("aria-hidden" ,"false"); + + // Set the aria-selected states + $("#jot-modal .nav-tabs .jot-nav-lnk").attr("aria-selected", "false"); + elm.setAttribute("aria-selected", "true"); + + // For some some tab panels we need to execute other js functions + if (tabpanel === "jot-preview-content") { + preview_post(); + } else if (tabpanel === "jot-fbrowser-wrapper") { + $(function() { + Dialog.showJot(); + }); + } + + // If element is a mobile dropdown nav menu we need to change the botton text + if (cls) { + toggleDropdownText(elm); + } } +// Wall Message needs a special handling because in some cases +// it redirects you to your own server. In such cases we can't +// load it into a modal +function openWallMessage(url) { + // split the the url in its parts + var parts = parseUrl(url); + + // If the host isn't the same we can't load it in a modal. + // So we will go to to the url directly + if( ("host" in parts) && (parts.host !== window.location.host)) { + window.location.href = url; + } else { + // otherwise load the wall message into a modal + addToModal(url); + } +}