-
-
Save Nicola1971/f4a4febe3b7392e1ed7f9415d3da07e1 to your computer and use it in GitHub Desktop.
Elements Tab in Tree
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// OnManagerTreePrerender,OnManagerTreeRender | |
// Autor: Dmi3yy | |
// Version: 0.2 | |
// 2016-10-11 added expand all when focus on search | |
// 2016-10-11 added category accordion | |
// 2016-10-10 added live search/filtering | |
// 2016-10-06 added configuration option to use icons or not | |
// 2016-10-05 tabs have icons instead of text shortcut now | |
// 2016-10-01 modified by Piotr Matysiak (pmfx) to respect MODX roles (hasPermission) | |
// Plugin configuration: | |
/* | |
{ | |
"useIcons": [ | |
{ | |
"label": "Use icons in tabs", | |
"type": "list", | |
"value": "yes", | |
"options": "yes,no", | |
"default": "yes", | |
"desc": "Icons available in MODX version 1.1.1 or newer" | |
} | |
] | |
} | |
*/ | |
$e = &$modx->Event; | |
if($e->name == 'OnManagerTreePrerender'){ | |
if ($useIcons=='yes') { | |
$tabPadding = '10px'; | |
} | |
else { | |
$tabPadding = '9px'; | |
} | |
$output = ' | |
<style> | |
#treePane .tab-page ul { | |
margin: 0; | |
margin-bottom: 5px; | |
padding: 0; | |
} | |
#treePane .tab-page ul li { | |
list-style: none; | |
padding-left: 10px; | |
} | |
#treePane .tab-page ul li li { | |
list-style: none; | |
padding-left: 5px; | |
line-height: 1.6; | |
} | |
#treePane .tab-page ul li a { | |
text-decoration: none; | |
} | |
#treePane .tab-page ul li a:hover { | |
text-decoration: underline; | |
} | |
#treePane .tab { | |
padding-left: 10px; | |
padding-right: 10px; | |
} | |
#treePane .tab.selected { | |
padding-bottom: 6px; | |
} | |
#treePane .tab-row .tab span { | |
font-size: 14px; | |
} | |
#tabDoc { | |
overflow: hidden; | |
} | |
.ext-ico {text-decoration:none!important;color:#97D19C!important;} | |
ul > li > strong > a.catname | |
{color: #444;} | |
.fade { | |
opacity: 0; | |
-webkit-transition: opacity .15s linear; | |
-o-transition: opacity .15s linear; | |
transition: opacity .15s linear; | |
} | |
.fade.in { | |
opacity: 1; | |
} | |
.collapse { | |
display: none; | |
} | |
.collapse.in { | |
display: block; | |
} | |
tr.collapse.in { | |
display: table-row; | |
} | |
tbody.collapse.in { | |
display: table-row-group; | |
} | |
.collapsing { | |
position: relative; | |
height: 0; | |
overflow: hidden; | |
-webkit-transition-timing-function: ease; | |
-o-transition-timing-function: ease; | |
transition-timing-function: ease; | |
-webkit-transition-duration: .35s; | |
-o-transition-duration: .35s; | |
transition-duration: .35s; | |
-webkit-transition-property: height; | |
-o-transition-property: height; | |
transition-property: height; | |
} | |
.panel-title a{ | |
padding-left: 15px; | |
color: #444; | |
font-weight: bold; | |
} | |
.panel-title > a::before { | |
content: "\f105"; /* fa-angle-right */ | |
font-family: "FontAwesome"; | |
position: absolute; | |
left: 15px; | |
} | |
.panel-title > a[aria-expanded="true"]::before { | |
content: "\f107"; /* fa-angle-down */ | |
} | |
.panel-title > a[aria-expanded="true"] { | |
color: #657587; | |
} | |
li.eltree { | |
margin-left: 5px; | |
} | |
li.eltree:before { | |
font-family: FontAwesome; | |
padding:0 5px 0 0; | |
margin-right:2px; | |
color: #657587; | |
} | |
#tabTemp li.eltree:before {content: "\f1ea";} | |
#tabCH li.eltree:before {content: "\f009";} | |
#tabSN li.eltree:before {content: "\f121";} | |
#tabTV li.eltree:before {content: "\f022";} | |
#tabPL li.eltree:before {content: "\f1e6";} | |
</style> | |
<div class="tab-pane" id="treePane" style="border:0;"> | |
<script type="text/javascript" src="media/script/tabpane.js"></script> | |
<script src="media/script/bootstrap/js/bootstrap.min.js"></script> | |
<script type="text/javascript" src="media/script/jquery.quicksearch.js"></script> | |
<script type="text/javascript"> | |
treePane = new WebFXTabPane(document.getElementById( "treePane" ),true); | |
</script> | |
<div class="tab-page" id="tabDoc" style="padding-left:0; padding-right:0;"> | |
<h2 class="tab">Site Tree</h2> | |
<script type="text/javascript">treePane.addTabPage( document.getElementById( "tabDoc" ) );</script> | |
'; | |
$e->output($output); | |
} | |
if ( $modx->hasPermission('edit_template') || $modx->hasPermission('edit_snippet') || $modx->hasPermission('edit_chunk') || $modx->hasPermission('edit_plugin') ) { | |
if($e->name == 'OnManagerTreeRender'){ | |
if ($useIcons=='yes') { | |
$tabLabel_template = '<i class="fa fa-newspaper-o"></i>'; | |
$tabLabel_tv = '<i class="fa fa-list-alt"></i>'; | |
$tabLabel_chunk = '<i class="fa fa-th-large"></i>'; | |
$tabLabel_snippet = '<i class="fa fa-code"></i>'; | |
$tabLabel_plugin = '<i class="fa fa-plug"></i>'; | |
$tabLabel_refresh = '<i class="fa fa-refresh"></i>'; | |
} | |
else { | |
$tabLabel_template = 'TPL'; | |
$tabLabel_tv = 'TV'; | |
$tabLabel_chunk = 'CH'; | |
$tabLabel_snippet = 'SN'; | |
$tabLabel_plugin = 'PL'; | |
$tabLabel_refresh = 'Refresh'; | |
} | |
//global $modx; | |
$tablePre = $modx->db->config['dbase'] . '.`' . $modx->db->config['table_prefix']; | |
function createResourceList($resourceTable,$action,$tablePre,$nameField = 'name') { | |
global $modx, $_lang; | |
$output = ' | |
<form class="filterElements-form" style="margin-top: 0;"> | |
<input class="form-control" type="text" placeholder="Type here to filter list" id="tree_'.$resourceTable.'_search"> | |
</form>'; | |
$output .= '<div class="panel-group"><div class="panel panel-default" id="tree_'.$resourceTable.'">'; | |
$pluginsql = $resourceTable == 'site_plugins' ? $tablePre.$resourceTable.'`.disabled, ' : ''; | |
$tvsql = $resourceTable == 'site_tmplvars' ? $tablePre.$resourceTable.'`.caption, ' : ''; | |
//$orderby = $resourceTable == 'site_plugins' ? '6,2' : '5,1'; | |
if ($resourceTable == 'site_plugins' || $resourceTable == 'site_tmplvars') { | |
$orderby= '6,2'; | |
} | |
else{ | |
$orderby= '5,1'; | |
} | |
$sql = 'SELECT '.$pluginsql.$tvsql.$tablePre.$resourceTable.'`.'.$nameField.' as name, '.$tablePre.$resourceTable.'`.id, '.$tablePre.$resourceTable.'`.description, '.$tablePre.$resourceTable.'`.locked, if(isnull('.$tablePre.'categories`.category),\''.$_lang['no_category'].'\','.$tablePre.'categories`.category) as category, '.$tablePre.'categories`.id as catid FROM '.$tablePre.$resourceTable.'` left join '.$tablePre.'categories` on '.$tablePre.$resourceTable.'`.category = '.$tablePre.'categories`.id ORDER BY '.$orderby; | |
$rs = $modx->db->query($sql); | |
$limit = $modx->db->getRecordCount($rs); | |
if($limit<1){ | |
echo $_lang['no_results']; | |
} | |
$preCat = ''; | |
$insideUl = 0; | |
for($i=0; $i<$limit; $i++) { | |
$row = $modx->db->getRow($rs); | |
$row['category'] = stripslashes($row['category']); //pixelchutes | |
if ($preCat !== $row['category']) { | |
$output .= $insideUl? '</div>': ''; | |
$output .= '<div class="panel-heading"><span class="panel-title"><a class="accordion-toggle" href="#collapse'.$resourceTable.$row['catid'].'" data-toggle="collapse" data-parent="#accordion"> '.$row['category'].'</a></span></div><div class="panel-collapse collapse '.$resourceTable.'" id="collapse'.$resourceTable.$row['catid'].'"><ul>'; | |
$insideUl = 1; | |
} | |
if ($resourceTable == 'site_plugins') $class = $row['disabled'] ? ' class="disabledPlugin"' : ''; | |
$output .= '<li class="eltree"><span'.$class.'><a href="index.php?id='.$row['id'].'&a='.$action.'" target="main"><span class="elementname">'.$row['name'].'</span><small>(' . $row['id'] . ')</small></a> | |
<a class="ext-ico" href="#" title="Edit in new window" onclick="window.open(\'index.php?id='.$row['id'].'&a='.$action.'\',\'gener\',\'width=800,height=600,top=\'+((screen.height-600)/2)+\',left=\'+((screen.width-800)/2)+\',toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=yes,resizable=no\')"> <small><i class="fa fa-external-link" aria-hidden="true"></i></small></a>'.($modx_textdir ? '‏' : '').'</span>'; | |
/* | |
//@TODO: add description as title to link | |
if ($resourceTable == 'site_tmplvars') { | |
$output .= !empty($row['description']) ? ' - '.$row['caption'].' <small> ('.$row['description'].')</small>' : ' - '.$row['caption']; | |
}else{ | |
$output .= !empty($row['description']) ? ' - '.$row['description'] : '' ; | |
}*/ | |
$output .= $row['locked'] ? ' <em>('.$_lang['locked'].')</em>' : "" ; | |
$output .= '</li>'; | |
$preCat = $row['category']; | |
} | |
$output .= $insideUl? '</ul></div></div>': ''; | |
$output .= '</div>'; | |
$output .= ' | |
<script> | |
jQuery(\'#tree_'.$resourceTable.'_search\').quicksearch(\'#tree_'.$resourceTable.' ul li\', { | |
selector: \'.elementname\' | |
}); | |
jQuery(\'#tree_'.$resourceTable.'_search\').on(\'click\', function () { | |
jQuery(\'.'.$resourceTable.'\').collapse(\'toggle\'); | |
}); | |
</script>'; | |
return $output; | |
} | |
$temp = createResourceList('site_templates',16,$tablePre,'templatename'); | |
$tv = createResourceList('site_tmplvars',301,$tablePre); | |
$chunk = createResourceList('site_htmlsnippets',78,$tablePre); | |
$snippet = createResourceList('site_snippets',22,$tablePre); | |
$plugin = createResourceList('site_plugins',102,$tablePre); | |
if ( $modx->hasPermission('edit_template') || $modx->hasPermission('edit_snippet') || $modx->hasPermission('edit_chunk') || $modx->hasPermission('edit_plugin') ) { | |
$output = '</div>'; | |
} | |
if ($modx->hasPermission('edit_template')) { | |
$output .= ' | |
<div class="tab-page" id="tabTemp" style="padding-left:0; padding-right:0;"> | |
<h2 class="tab" title="Templates">'.$tabLabel_template.'</h2> | |
<script type="text/javascript">treePane.addTabPage( document.getElementById( "tabTemp" ) );</script> | |
'.$temp.' | |
<br/> | |
<ul class="actionButtons"> | |
<li><a href="index.php?a=19" target="main">New Template</a></li> | |
<li><a href="javascript:location.reload();" title="Click here if element was added or deleted to refresh the list.">'.$tabLabel_refresh.'</a></li> | |
</ul> | |
</div> | |
<div class="tab-page" id="tabTV" style="padding-left:0; padding-right:0;"> | |
<h2 class="tab" title="Template Variables">'.$tabLabel_tv.'</h2> | |
<script type="text/javascript">treePane.addTabPage( document.getElementById( "tabTV" ) );</script> | |
'.$tv.' | |
<br/> | |
<ul class="actionButtons"> | |
<li><a href="index.php?a=300" target="main">New TV</a></li> | |
<li><a href="javascript:location.reload();" title="Click here if element was added or deleted to refresh the list.">'.$tabLabel_refresh.'</a></li> | |
</ul> | |
</div> | |
'; | |
} | |
if ($modx->hasPermission('edit_chunk')) { | |
$output .= ' | |
<div class="tab-page" id="tabCH" style="padding-left:0; padding-right:0;"> | |
<h2 class="tab" title="Chunks">'.$tabLabel_chunk.'</h2> | |
<script type="text/javascript">treePane.addTabPage( document.getElementById( "tabCH" ) );</script> | |
'.$chunk.' | |
<br/> | |
<ul class="actionButtons"> | |
<li><a href="index.php?a=77" target="main">New Chunk</a></li> | |
<li><a href="javascript:location.reload();" title="Click here if element was added or deleted to refresh the list.">'.$tabLabel_refresh.'</a></li> | |
</ul> | |
</div> | |
'; | |
} | |
if ($modx->hasPermission('edit_snippet')) { | |
$output .= ' | |
<div class="tab-page" id="tabSN" style="padding-left:0; padding-right:0;"> | |
<h2 class="tab" title="Snippets">'.$tabLabel_snippet.'</h2> | |
<script type="text/javascript">treePane.addTabPage( document.getElementById( "tabSN" ) );</script> | |
'.$snippet.' | |
<br/> | |
<ul class="actionButtons"> | |
<li><a href="index.php?a=23" target="main">New Snippet</a></li> | |
<li><a href="javascript:location.reload();" title="Click here if element was added or deleted to refresh the list.">'.$tabLabel_refresh.'</a></li> | |
</ul> | |
</div> | |
'; | |
} | |
if ($modx->hasPermission('edit_plugin')) { | |
$output .= ' | |
<div class="tab-page" id="tabPL" style="padding-left:0; padding-right:0;"> | |
<h2 class="tab" title="Plugins">'.$tabLabel_plugin.'</h2> | |
<script type="text/javascript">treePane.addTabPage( document.getElementById( "tabPL" ) );</script> | |
'.$plugin.' | |
<br/> | |
<ul class="actionButtons"> | |
<li><a href="index.php?a=101" target="main">New Plugin</a></li> | |
<li><a href="javascript:location.reload();" title="Click here if element was enabled/disabled/added/deleted to refresh the list.">'.$tabLabel_refresh.'</a></li> | |
</ul> | |
</div> | |
'; | |
} | |
if ($modx->hasPermission('edit_template') || $modx->hasPermission('edit_snippet') || $modx->hasPermission('edit_chunk') || $modx->hasPermission('edit_plugin') ) { | |
$output .= '</div>'; | |
$e->output($output); | |
} | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment