@extends('layouts.app')

@section('content')
  <div id="about_popup">
    <div id="about_modale">
      <span class="xoo-el-icon-cancel-circle" aria-hidden="true" onclick="closeAboutPopup()"></span>
      <div id="about_title">
        À propos
      </div>
      <div id="about_content">
        <?php echo apply_filters('the_content', get_post(9962)->post_content) ?>
      </div>
    </div>
  </div>

  <div id="content_search_tag" style="display: none;"><?php echo apply_filters('the_content', get_post(13943)->post_content) ?></div>
  <div id="content_login_popup" style="display: none;"><?php echo apply_filters('the_content', get_post(9960)->post_content) ?></div>
  <div id="content_privacy" style="display: none;"><?php echo apply_filters('the_content', get_post(3)->post_content) ?></div>

  <div class="fixed left-0 w-8 flex flex-col-reverse z-1" id="timeline_container"></div>

  <svg class="fixed left-0 h-4 w-10 mt-[-4px] fill-jlg-white cursor-grab active:cursor-grabbing" id="cursor">
    <polygon points="32,4 32,6 40,10 40,0" />
    <rect width="32" height="2" y="4" />
  </svg>


  <table class="w-full bg-jlg-dark-blue flex justify-center mt-[70px] z-0 pl-10 lg:pl-[10px] pr-[96px] lg:pr-0">
    <thead>
      <tr class="border-jlg-white border-b h-64 top-0 w-full lg:w-2/3 fixed z-0 flex items-stretch justify-around text-left uppercase bg-jlg-dark-blue  pr-[130px] lg:pr-0">
        <th class="flex items-end justify-start"></th>
        <th class="flex items-end justify-start pb-4">Images</th>
        <th class="flex items-end justify-start pb-4">Voix Off et In</th>
        <th class="flex items-end justify-start pb-4">Bande Son</th>
        <th class="flex items-end justify-start pb-4">Écrits</th>
      </tr>
    </thead>
    <tbody class="w-full mb-48 lg:w-2/3 block bg-jlg-dark-blue">
      <?php
          
        $args = array(
          'post_type' => 'post',
          'posts_per_page' => -1,
          'meta_key' => 'index',
          'meta_type' => 'NUMERIC',
          'orderby' => 'meta_value',
          'order' => 'ASC'
        );
        $query = new WP_Query($args);
        if ($query->have_posts()) :

          while ($query->have_posts()) : $query->the_post();
            if (get_post_meta(get_the_ID(), 'isMainPart', true)) { ?>
              <tr class="border-jlg-white border-b font-authentic-90 uppercase w-full flex flex-row py-6 isMainPart">
                <td class="pl-0 flex">
                  <div class="w-2 h-5 bg-jlg-white mr-3"></div>
                  <div>{{ get_post_meta(get_the_ID(), 'isMainPart', true) }}</div>
                </td>
              </tr>
            <?php } elseif (get_post_meta(get_the_ID(), 'isSubPart', true)) { ?>
              <tr class="border-jlg-white border-b font-authentic-90 w-full flex flex-row py-6 isSubPart">
                <td class="pl-0 flex">
                  <div class="w-2 h-5 bg-jlg-white mr-3"></div>
                  <div>{{ get_post_meta(get_the_ID(), 'isSubPart', true) }}</div>
                </td>
              </tr>
            <?php } else {
              $contenu = wpautop(get_the_content());
              $infosArray = explode("---", $contenu); // Divise le contenu en fonction des séparateurs

              // Initialisez des variables pour stocker les informations
              $images = isset($infosArray[1]) ? $infosArray[1] : '';
              $images = substr($images, 0, -21);
              $voixOffIn = isset($infosArray[2]) ? $infosArray[2] : '';
              $voixOffIn = substr($voixOffIn, 0, -16);
              $bandeson = isset($infosArray[3]) ? $infosArray[3] : '';
              $bandeson = substr($bandeson, 0, -14);
              $ecrits = isset($infosArray[4]) ? $infosArray[4] : '';
          
              //lien pour le crayon
              $edit_link = site_url('/wp-admin/admin.php?page=rvy-revisions&post=' . get_the_ID() . '&action=revise');

      ?> 
              <tr class="border-jlg-light-white border-b font-authentic-60 w-full flex flex-row py-6 isContentPart">
                <td class="block text-sm pl-0 pr-6">{{ the_title()}}</td>
                <td class="block pl-0 pr-6"><?php echo $images; ?></td>
                <td class="block pl-0 pr-6"><?php echo $voixOffIn; ?></td>
                <td class="block pl-0 pr-6"><?php echo $bandeson; ?></td>
                <td class="block pl-0 pr-6"><?php echo $ecrits; ?></td>
                <td class="block text-sm pl-0 pr-6">
                  <?php if(is_user_logged_in()){ 
                    echo '<a title="Contribution" href="' . esc_url( $edit_link ) . '" class="edit-button">'; ?>
                    <img src="<?= get_template_directory_uri(); ?>/resources/assets/icons/pen_icon.svg" alt="icon pen" /></a>
                  <?php } elseif (!is_user_logged_in()) { 
                    echo '<img src="' . get_template_directory_uri() . '/resources/assets/icons/pen_icon.svg" alt="icon pen" />';
                    echo do_shortcode('[xoo_el_action type="login" text="Connexion" redirect_to="' . $edit_link . '"]');
                  }?>
                </td>
              </tr>
      <?php }
           // endif;
          endwhile;
        
        endif;
        wp_reset_postdata();
      ?>
    </tbody>
  </table>



  @if (! have_posts())
    <x-alert type="warning">
      {!! __('Sorry, no results were found.', 'sage') !!}
    </x-alert>

    {!! get_search_form(false) !!}
  @endif


@endsection