<div class="edit-row">
  <form method='POST' action='./' id='formularz' enctype='multipart/form-data'>
  <input type='hidden' name='rw' value='<?= $this -> _rw;?>'>
  <? if ( $this -> _rw == 'save' ):?>
    <input type='hidden' id="idk" name='id' value='<?= $this -> _layout['id'];?>'>
  <? else:?>
    <input type='hidden' name='<?= base64_encode("time");?>' value='<?= base64_encode(date("Y-m-d H:i:s"));?>'>
  <? endif;?>
  <div id="slider-code">
    <ul class="pager">
      <li><a rel="0" class="pagenum" href="#"><span class="badge">1</span>Ustawienia podstawowe</a></li>
      <li><a rel="1" class="pagenum" href="#"><span class="badge">2</span>Wyświetlanie</a></li>
      <li><a rel="2" class="pagenum" href="#"><span class="badge">3</span>CSS</a></li>
      <li><a rel="3" class="pagenum" href="#"><span class="badge">4</span>Java Script</a></li>
    </ul>
    <a class="buttons prev tip" href="#" title="Wstecz">
      <img src="../../images/system/img-left.png" />
    </a>
    <div class="viewport">
      <ul class="overview">
        <li>
          <div class="slide-title">Ustawienia podstawowe</div>
          <div id="tabs" class="tabs-container">
            <div class="group">
              <label>Nazwa:</label>
              <div class="content">
                <input type='text' id='name' name='name' value='<?= $this -> secureHTML( $this -> _layout['name'] );?>'>
              </div>
            </div>
            <div class="group">
              <label>Domyślny:</label>
              <div class="content">
                <input type="radio" name="enabled" class="enabled" id="enabled_0" value='0' <? if ( !$this -> _layout['enabled'] ) echo 'checked="checked" '; ?>>
                nie
                <input type="radio" name="enabled" class="enabled" id="enabled_1" value='1' <? if ( $this -> _layout['enabled'] || $this -> _rw == 'add' ) echo 'checked="checked" '; ?>>
                tak
              </div>
            </div>
            <div class="group">
              <label>HTML:</label>
              <div class="content">
                <textarea name='html' class="text" id="html" cols="100" rows='50' style="width: 950px; height: 250px;"><?= $this -> secureHTML( $this -> _layout['html'] );?></textarea>
              </div>
              <div class="clearfix"></div>
            </div>
          </div>
        </li>
        <li>
          <div class="slide-title">Wyświetlanie</div>
          <div id="tabs" class="tabs-container">
            <div class="group" style="padding: 20px;">
              <?= \admin\view\Layouts::drawLayoutEditPages( $this -> _pages, 0 );?>
              <div class="clearfix"></div>
            </div>
            <div class="clearfix"></div>
          </div>
        </li>
        <li>
          <div class="slide-title">CSS</div>
          <div id="tabs" class="tabs-container">
            <div class="group">
              <label>CSS:</label>
              <div class="content">
                <textarea name='css' class="text" id="css" cols="100" rows='50' style="width: 950px; height: 250px;"><?= $this -> secureHTML( $this -> _layout['css'] );?></textarea>
              </div>
              <div class="clearfix"></div>
            </div>
          </div>
        </li>
        <li>
          <div class="slide-title">Java Script</div>
          <div id="tabs" class="tabs-container">
            <div class="group">
              <label>Java Script:</label>
              <div class="content">
                <textarea name='js' class="text" id="js" cols="100" rows='50' style="width: 950px; height: 250px;"><?= $this -> secureHTML( $this -> _layout['javascript'] );?></textarea>
              </div>
              <div class="clearfix"></div>
            </div>
          </div>
        </li>
      </ul>
    </div>
  </form>
</div>

<script type="text/javascript">
function saveLayout()
{
	var id      = $("#idk").val();
	var name    = $("#name").val();
	var enabled = $(".enabled:checked").val();
	var html    = $("#html").val();
	var css     = $("#css").val();
	var js      = $("#js").val();
	var pages   = '';
	$('input:checkbox:checked').each(
	function() {
	  if ( pages != '' )
		pages = pages + ':';
	  pages = pages + $(this).val();
	}
	);
  $.prompt( 'Trwa zapisywanie...' );
  xajax_saveLayout( id , name , enabled , html , css , js , pages );
}

  $( document ).ready( function() {
    
    $( '.toggle-pages' ).click( function() {
      if ( $( this ).hasClass( 'show' ) )
      {
        $( this ).removeClass( 'show' ).addClass( 'hide' );
        $( '.' + $( this ).attr( 'id' ) ).show();
      }
      else
      {
        $( this ).removeClass( 'hide' ).addClass( 'show' );
        $( '.' + $( this ).attr( 'id' ) ).hide();
      }
    })
    
    $( '.select-page' ).click( function() {
      var id = $( this ).attr( 'idk' );
      
      if ( $( '#page_' + id ).prop( 'checked' ) )
        $( '#page_' + id ).prop( "checked", false );
      else
        $( '#page_' + id ).prop( "checked", true );
    })
    
    $( '#slider-code' ).tinycarousel({
      pager: true
    });
  })
</script>