[addon] Page-list Tree for admin

[andy-man]

I've got a lot of sub-pages on my site, and you know, it's a headache to access them (even with FILTER)
So I wrote a simple script to add collapse/expand-functionality to page-list.

All you need to open admin/pages.php, find this line:

Code:

<?php get_template('footer'); ?>

And add this script right above it:

Code:

<style>
.pagetitle { position:relative; }
.l-1 .switch {left: 5px;}
.l-2 .switch {left: 25px;}
.l-3 .switch {left: 45px;}
.l-4 .switch {left: 65px;}
.switch {
  width: 15px;
  height: 15px;
  background: url('template/images/plus.png') no-repeat center center #182227;
  position: absolute;
  left: -15px;
  top:6px;
  border-radius:3px;
  cursor:pointer;
}
.switch:hover {background-color: #CF3805;}
.switch.on {background: url('template/images/minus.png') no-repeat center center #CF3805;}
</style>

<script>
$(document).ready(function(){
    $('#editpages tr').attr('rel',0).addClass('l-0');
    $('.pagetitle span').not('.showstatus').each(function(i,e){
        $tr = $(this).parent().parent();
        var level = $tr.find('.pagetitle span').not('.showstatus').size();
        $tr.attr('rel',level);
        $tr.attr('class','hidden l-'+level);
    });
    
    $('#editpages tr.hidden').each(function(i,e){
        if ( parseInt($(this).prev().attr('rel')) < parseInt($(this).attr('rel')) ) $(this).prev().find('.pagetitle').prepend('<div class="switch"></div>');
    });
    
    $('.pagetitle').on('click','.switch',function(){
        
        $tr = $(this).parent().parent();
        var lvl = parseInt($tr.attr('rel'));
        
        if ($(this).hasClass('on'))
        $tr.nextUntil('.l-'+lvl).addClass('hidden').find('.switch.on').removeClass('on');
        else
        $tr.nextUntil('.l-'+lvl,'.l-'+(lvl+1)).removeClass('hidden');
        
        $(this).toggleClass('on');
    });
});
</script>

Tested with GS 3.3.4

[Carlos]

Very nice.

And you can easily turn it into a plugin:

PHP Code:

<?php

$thisfile = basename(__FILE__, ".php");
register_plugin(
    $thisfile, 
    'Collapsable pages (Backend)',     
    '0.1',         
    'andy-man',
    'http://get-simple.info/forums/showthread.php?tid=7361', 
    'Adds collapse/expand-functionality to page-list',
    '',
    ''
);

add_action('footer', 'collapsable_pages');

function collapsable_pages() {
  if (basename($_SERVER['PHP_SELF']) == 'pages.php') {
?>
<style>
.pagetitle { position:relative; }
.l-1 .switch {left: 5px;}
.l-2 .switch {left: 25px;}
.l-3 .switch {left: 45px;}
.l-4 .switch {left: 65px;}
.switch {
  width: 15px;
  height: 15px;
  background: url('template/images/plus.png') no-repeat center center #182227;
  position: absolute;
  left: -15px;
  top:6px;
  border-radius:3px;
  cursor:pointer;
}
.switch:hover {background-color: #CF3805;}
.switch.on {background: url('template/images/minus.png') no-repeat center center #CF3805;}
</style>
<script>
$(document).ready(function(){
    $('#editpages tr').attr('rel',0).addClass('l-0');
    $('.pagetitle span').not('.showstatus').each(function(i,e){
        $tr = $(this).parent().parent();
        var level = $tr.find('.pagetitle span').not('.showstatus').size();
        $tr.attr('rel',level);
        $tr.attr('class','hidden l-'+level);
    });
    
    $('#editpages tr.hidden').each(function(i,e){
        if ( parseInt($(this).prev().attr('rel')) < parseInt($(this).attr('rel')) ) $(this).prev().find('.pagetitle').prepend('<div class="switch"></div>');
    });
    
    $('.pagetitle').on('click','.switch',function(){
        
        $tr = $(this).parent().parent();
        var lvl = parseInt($tr.attr('rel'));
        
        if ($(this).hasClass('on'))
        $tr.nextUntil('.l-'+lvl).addClass('hidden').find('.switch.on').removeClass('on');
        else
        $tr.nextUntil('.l-'+lvl,'.l-'+(lvl+1)).removeClass('hidden');
        
        $(this).toggleClass('on');
    });
});
</script>
<?php
  }
}
// end 


(Paste this into a text file, name it e.g. collapsable_pages.php, upload to /plugins and activate.

[datiswous]

This is great!

[Oleg06]

plugin works

[Tyblitz]

Does this add the same feature as I18n does? 

[datiswous]

Yes, it seams, although i18n has fold, unfold, default state -buttons