The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.

Widgets position

2 posters

The forum of the forums :: Miscellaneous :: Garbage

Go down

In progress Widgets position

Post by micho October 1st 2020, 9:13 pm

Technical Details


Forum version : #phpBB2
Position : Founder
Concerned browser(s) : Google Chrome
Who the problem concerns : All members
When the problem appeared : All the time
Forum link : ( link is hidden, you must reply to see )

Description of problem

Hi guys!

I managed to put my widgets in a bootstrap sidebar and it works perfectly. My only struggle is that I would like to give my users the chance to decide if they want to have the sidebar opened or closed all the time. Now it closes every time the forum is refreshed.
I've done some research and I found couple of solutions which were using cookies but as I am still pretty incompetent in java matter, I haven't succeed with any of them.

Here is the java code of the menu:
Code:
$(document).ready(function(){$('.menuonclick').on('click',function(){$('.menuall, .menuonclick').toggleClass('opened')})});

Any help would be much appreciated!

Thanks a lot! Smile
micho
micho
New Member

Posts : 4
Reputation : 1
Language : english

Back to top Go down

In progress Re: Widgets position

Post by levy October 3rd 2020, 11:27 pm

Hello @micho and Welcome to Forumotion Very Happy

Can you show us the HTML to your widget if possible, I'd like to make some minor changes to it and if possible, can we have the forum adress as well? It might be easier to change them there.

Also, I see that you use the .toggleClass which isn't needed and it might be the problem that you have. I'll leave a code below and some simple understanding of it.


Code:
$(document).ready(function() {
    $('#element').on('click', function(e) {
        $('.dropdown').toggle();
    });
});

now, to make this work, you can incorporate a simple ID for example
Code:
<a href="#" id="element">Press</a>
and to make the class that we trigger as well. note that we will use a style as well for it, to make it hidden from first. I think it can be reversed as well, most of my toggles are from hidden to shown, not Shown to Hidden but I think it can work as well

Code:

<a href="#" id="element">Press</a>
<div class="dropdown" style="display:none;">Text to be shown / hidden</div>

If you have any questions, please let me know and I will try at my best to help
levy
levy
Hyperactive

Male Posts : 2631
Reputation : 350
Language : English, Romanian
Location : Romania

https://portofolio.goodforum.net/

skouliki and TonnyKamper like this post

Back to top Go down

In progress Re: Widgets position

Post by micho October 4th 2020, 3:05 pm

Hi @levy!

Thank you very much for your time, kind reply and the warm welcoming.

I've tested your code but it does the same as the one I posted in my previous post Very Happy If I click on Press, the sidebar with the widgets is appearing but when I refresh the forum it disappears again. Ergo the opened status of the sidebar is not remembered.

The link of my forum is in the first post and please, find the HTML of my widgets below:
Code:
<body class="custhead header" background="{T_BODY_BACKGROUND}" bgcolor="{T_BODY_BGCOLOR}" text="{T_BODY_TEXT}" link="{T_BODY_LINK}"
     vlink="{T_BODY_VLINK}"><div class="menuonclick">sidebar</div><div class="menuall"><div class="mcontents abiscroll">
            <div id="{ID_LEFT}">
                           <!-- BEGIN giefmod_index1 -->
                           {giefmod_index1.MODVAR}
                           <!-- BEGIN saut -->
                           <div style="height:{SPACE_ROW}px"></div>
                           <!-- END saut -->
                           <!-- END giefmod_index1 -->
                        </div>
            </div>
            </div>

Thank you once again! Smile
micho
micho
New Member

Posts : 4
Reputation : 1
Language : english

Back to top Go down

In progress Re: Widgets position

Post by micho October 10th 2020, 8:58 am

Hey guys,

I am still interested in the solution. I've done a bit more research and I found this code on the french support forum.
Code:
$(function() {
                  var c = $("#left,#right"), d, e = function(a) {
                    var a = a.direct ? 0 : 1E3, b = $(this).data("side");
                    window.localStorage && localStorage[("none" == $("#" + b).css("display") ? "remove" : "set") + "Item"]("wid" + b, "1");
                    $("#" + b).stop(!0, !0).animate({width:"toggle", height:"toggle", opacity:"toggle"}, a);
                    $(this).toggleClass("isopened isclosed")
                  };
                  c.length && ($("#content-container").prepend(d = $('<div id="widget-arrows"><div style="clear:both"></div></div>')), c.each(function() {
                    $(this).find("script").remove();
                    var a = $(this).attr("id"), b = $('<div class="widget-arrow is' + a + ' isopened"></div>');
                    "right" == a && $("#content").prepend($("#right").css("padding", "0 10px")).css("margin-right", 0);
                    b.data("side", a).appendTo(d).click(e);
                    window.localStorage && "1" == localStorage.getItem("wid" + a) && b.trigger({type:"click", direct:!0})
                  }))
                });

I think it's doing what I need - using the local storage to remember if the widgets are opened or closed. The only difference is that my widgets are on the left side, within the body and not the content-container, and I want them to be closed by default.
Anyone can help me to add a "localstorage" part to my code? Smile
micho
micho
New Member

Posts : 4
Reputation : 1
Language : english

Back to top Go down

Back to top

- Similar topics

The forum of the forums :: Miscellaneous :: Garbage

 
Permissions in this forum:
You cannot reply to topics in this forum