<ul id="myMenu-page" class="contextMenu">
  <li class="edit"><a href="#add_subpage">Dodaj podstronę</a></li>
  <li class="edit"><a href="#edit">Edytuj stronę</a></li>
  <li class="delete"><a href="#delete">Usuń stronę</a></li>
  <li class="edit"><a href="#show_articles">Pokaż artykuły</a></li>
  <li class="quit separator"><a href="#cancel">Anuluj</a></li>
</ul>

<ul id="myMenu-menu" class="contextMenu">
  <li class="edit"><a href="#edit_menu">Edytuj menu</a></li>
  <li class="edit"><a href="#delete_menu">Usuń menu</a></li>
  <li class="edit"><a href="#add_page">Dodaj stronę</a></li>
  <li class="quit separator"><a href="#cancel">Anuluj</a></li>
</ul>

<div class="action-icons">
  <a class="button button_add" href="./?rw=add_menu">Dodaj menu</a>
</div>

<div class="edit-row">
  <? if ( is_array( $this -> _menu ) ):?>
    <? foreach ( $this -> _menu as $menu ):?>
      <div class="menu_sortable">    
        <ol class="sortable" id="sortable_<?= $menu['id'];?>">
          <li id="list_<?= $menu['id'];?>" class="menu_<?= $menu['id'];?>" menu="<?= $menu['id'];?>">
            <div class="context_0 content content_menu" <? if ( !$menu['enabled'] ) echo 'style="color: #cc0000;"';?>>
              <span class="disclose"><span></span></span>
              Menu: <b><?= $menu['name'];?></b>
            </div>
            <?= \admin\view\Pages::drawSubpages( \admin\factory\Pages::getPages( $menu['id'] ) );?>
          </li>
        </ol>
      </div>
    <? endforeach;?>
  <? endif;?>
</div>
<script type="text/javascript">
  var parent_id = 0;
  var menu_id   = 0;
  
  $( document ).ready( function() {    
    $('ol.sortable').nestedSortable({
			forcePlaceholderSize: true,
			handle: 'div',
			helper:	'clone',
			items: 'li',
			opacity: .6,
			placeholder: 'placeholder',
			revert: 250,
			tabSize: 25,
			tolerance: 'pointer',
			toleranceElement: '> div',
			maxLevels: 3,
			isTree: true,
			expandOnHover: 700,
      saveAfterDrag: true
		});

		$('.disclose').on('click', function() {
			$(this).closest('li').toggleClass('mjs-nestedSortable-collapsed').toggleClass('mjs-nestedSortable-expanded');
		});

    $( ".content_page, .content_menu" ).mousedown(function(e) {
      if (e.which === 3 || e.which == 1 ) {
        parent_id = $( this ).parent( 'li' ).attr( 'idk' );
        menu_id   = $( this ).parent( 'li' ).attr( 'menu' );
      }
    });

    $( '.context_0' ).contextMenu( { menu: "myMenu-menu" }, function( action ) {      
      switch( action ) {
        case 'add_page':
          document.location.href='./?rw=add&parent_id=0&menu_id=' + menu_id;
        break;
        case 'edit_menu':
          document.location.href='./?rw=edit_menu&id=' + menu_id;
        break;
        case 'delete_menu':
          $.prompt( "Na pewno chcesz usunąć wybrane menu?", {
            title: "Potwierdź?",
            buttons: { "Tak": true, "Nie": false },
            submit: function(e,v,m,f){
              if ( v == true )
                document.location.href='./?rw=del_menu&id=' + menu_id;
            }
          });
        break;
        case 'cancel': break;
      }
    });    

    $( '.content_page' ).contextMenu( { menu: "myMenu-page" }, function( action ) {  
      switch( action ) {
        case 'add_subpage':
          document.location.href='./?rw=add&parent_id=' + parent_id + '&menu_id=' + menu_id;
        break;
        case 'edit':
          document.location.href='./?rw=edit&id=' + parent_id + '&menu_id=' + menu_id;
        break;
        case 'show_articles':
          document.location.href='./?rw=article_list&id=' + parent_id;
        break;
        case 'delete':
          $.prompt( "Na pewno chcesz usunąć wybraną stronę?", {
            title: "Potwierdź?",
            buttons: { "Tak": true, "Nie": false },
            submit: function(e,v,m,f){
              if ( v == true )
                document.location.href='./?rw=del&id=' + parent_id;
            }
          });
        break;
        case 'cancel': break;
      }
    });
            
    $( '.disclose' ).mousedown(function(e) {
      if ( e.which === 1 ) {
        if ( $( this ).parent( 'div' ).hasClass( 'content_menu' ) ) 
          xajax_saveMenuCookie( $( this ).parent( 'div' ).parent( 'li' ).attr( 'menu' ) );
        else
          xajax_savePagesCookie( $( this ).parent( 'div' ).parent( 'li' ).attr( 'id' ) );
      }
    });
    
    <?
      $array = unserialize( $_COOKIE[ 'pages_definition' ] );
      if ( is_array( $array ) ): foreach ( $array as $key => $val ):
        if ( $val ):
          ?>$( '.<?= $key;?>' ).children( 'div' ).children( 'span.disclose' ).click();<?
        endif;
      endforeach; endif;
      
      $array = unserialize( $_COOKIE[ 'menu_definition' ] );
      if ( is_array( $array ) ): foreach ( $array as $key => $val ):
        if ( $val ):
          ?>$( '.menu_<?= $key;?>' ).children( 'div' ).children( 'span.disclose' ).click();<?
        endif;
      endforeach; endif;
    ?>
  });
  
  function saveChanges( ) {
    arraied = $( '#sortable_' + menu_id ).nestedSortable( 'toArray', { startDepthCount: 0 } );
    $.prompt( 'Trwa zapisywanie...', { title: 'Proszę czekać' } );
    xajax_savePageOrder( arraied, menu_id );
  }
</script>