Auto-Form Help?

[Texas]

Could someone look at this plugin for me. I rewrote it a week ago and tested it, I thought It worked in all of the browsers. But today I went back and figured out that it only worked in FF O.o

The plugin is a three box table that slides up and down and uses localStorage (cookies if the browser doesn't support it) to remember whether the box is hidden or shown. The problem with it is that in Chrome and IE it will slide up, but it won't slide down, it just gets stuck as hidden.

Thanks to anyone that looks into this.



Here is the raw JS if you want to just look at that.


if (yootil.page.board.id(proboards.plugin.get('three_box_table').settings.which_boards) || proboards.plugin.get('three_box_table').settings.display=="1" ) {
    $('#the_table').css("display","")
}

function getCookie(c_name)
{
var i,x,y,ARRcookies=document.cookie.split(";");
for (i=0;i<ARRcookies.length;i++)
  {
  x=ARRcookies[i].substr(0,ARRcookies[i].indexOf("="));
  y=ARRcookies[i].substr(ARRcookies[i].indexOf("=")+1);
  x=x.replace(/^\s+|\s+$/g,"");
  if (x==c_name)
    {
    return unescape(y);
    }
  }
}

function setCookie(c_name,value,exdays)
{
var exdate=new Date();
exdate.setDate(exdate.getDate() + exdays);
var c_value=escape(value) + ((exdays==null) ? "" : "; expires="+exdate.toUTCString());
document.cookie=c_name + "=" + c_value;
} //taken from w3schools.com

function hiderFunction() {
if(localStorage.sliderTable!="slidden" || localStorage.slider==null && getCookie("sliderTable")!="slidden") {
$(function(){
   $(".the_table_main").slideUp();
});
if(typeof(Storage)!=="undefined" && getCookie("sliderTable")!="open")
  {
     localStorage.sliderTable="slidden";
  }
  else { setCookie("sliderTable","slidden",1000); }
}
else {
$(function(){
   $('.the_table_main').slideDown();
});
if(typeof(Storage)!=="undefined"){
localStorage.sliderTable="open";
}
else { setCookie("sliderTable","unslidden",1000); }
}
}

if(localStorage.sliderTable=="slidden" || getCookie("sliderTable")=="slidden")
   {
      $(function(){
         $('.the_table_main').hide();
      });
   }


And the HTML



<table id="the_table" width="$[plugin.settings.the_table_width]" style="display:none">
    <tr>
        <td colspan="3"  id="the_table_title" onclick="hiderFunction()">
                $[plugin.settings.the_table_title]
        </td>
    </tr>
    <tr>
        <td class="the_table_box_title">
            $[plugin.settings.the_table_box1_title]
        </td>
        <td class="the_table_box_title">
            $[plugin.settings.the_table_box2_title]
        </td>
        <td class="the_table_box_title">
            $[plugin.settings.the_table_box3_title]
        </td>
    </tr>
    <tr>
        <td class="the_table_main">
                $[plugin.settings.the_table_box1_content]
        </td>
        <td class="the_table_main">
                $[plugin.settings.the_table_box2_content]
        </td>
        <td class="the_table_main">
                $[plugin.settings.the_table_box3_content]
        </td>
    </tr>
</table>
<br />



<style>
    #the_table { align: center; margin: auto; }
    #the_table_title { background-color: #$[plugin.settings.the_table_title_color]; background-image: url('$[plugin.settings.the_table_title_img]'); text-align: center; border: $[plugin.settings.the_table_border_width] $[plugin.settings.the_table_border_type] #$[plugin.settings.the_table_border_color]; cursor: pointer; }
    .the_table_box_title { background-color: #$[plugin.settings.the_table_box_title_color]; background-image: url('$[plugin.settings.the_table_box_title_img]'); text-align: center; border-bottom: $[plugin.settings.the_table_border_width] $[plugin.settings.the_table_border_type] #$[plugin.settings.the_table_border_color]; border-left: $[plugin.settings.the_table_border_width] $[plugin.settings.the_table_border_type] #$[plugin.settings.the_table_border_color]; border-right: $[plugin.settings.the_table_border_width] $[plugin.settings.the_table_border_type] #$[plugin.settings.the_table_border_color]; }
    .the_table_main { background-color: #$[plugin.settings.the_table_box_color]; background-image: url('$[plugin.settings.the_table_box_img]'); text-align: center; height: $[plugin.settings.the_table_box_height]; border: $[plugin.settings.the_table_border_width] $[plugin.settings.the_table_border_type] #$[plugin.settings.the_table_border_color]; }
</style>

[Peter]

Drop the cookie stuff, it's not needed.


function show_hide_table(event){
   var value = yootil.storage.get("sliderTable", false, true);
   
   if(!event){
      $(".the_table_main")[((value && value == "slidden")? "hide" : "show")]();
      $("#the_table").show();
      return;
   }
   
   if(value && value == "slidden"){
      yootil.storage.remove("sliderTable", true);
      $(".the_table_main").slideDown();
   } else {
      yootil.storage.set("sliderTable", "slidden", false, true);
      $(".the_table_main").slideUp();
   }
}

$(function(){   
   if($.inArray(yootil.page.board.id(), proboards.plugin.get('three_box_table').settings.which_boards) > -1 || proboards.plugin.get('three_box_table').settings.display=="1"){
      show_hide_table();
      
      $("#the_table_title").click(show_hide_table);
   }
});

[Texas]

What if the user is using IE 7 or ealier? Won't the local storage not work?

[Peter]

You are using Yootil, it supports IE 7+

[Texas]

Okay, thought that might've been the case but just wanted to check.

[Texas]

Okay, different code now, I've just been asking so many questions I didn't want to start another thread.

<script>
{foreach $[plugin.settings.user_groups]}
var groupName = "$[plugin.settings.user_groups.group_name]";
var userGroup = sessionStorage.group_id;
if(typeof(Storage)!=="undefined"){
if(location.href.match(proboards.data('user').url)) {
$(function(){
   var grp = new RegExp(groupName, 'g')
   if($(".name_and_group")[0].innerHTML.match(grp)){
       sessionStorage.group_id=groupName;
       alert("this worked");
   }
});
}
}
{/foreach}
</script>

This code scans the profile page for the users group. I have used an auto-form so the user can put multiple names in but it doesn't work properly. The way it works is the admin puts in all the user groups into the code, and then when the user views there profile, it gives them some sessionStorage with there userGroup in it. The problem is when I use the auto form, it doesn't work correctly. Instead if looping through three times, it only works on the last name. So if you put three usergroups Admin, g-mod, and mod in that order, then it only works if the person is a mod. Anyone have any idea what I should do?

[Texas]

bump

[Wormopolis]

they are adding user.group to pb_data, so you should hold off.