Subversion Repositories web.active

Rev

Rev 11 | Go to most recent revision | Blame | Compare with Previous | Last modification | View Log | Download

<?php namespace ProcessWire;

// basic-page.php template file 
// See README.txt for more information

// build our main page-image2wbmp
if($page->pageimage) {
  // an image is present
  //$img = $page->pageimage->size(781, 867);
  $str_image = '<figure><img src="'.$page->pageimage->size(781,867)->url.'" alt="Image RLD Active picture missing"/></figure>';
} else { $str_image = '';} // set the default picture e.g logo


// header test on the page
//$main_text = ""; //$page->main_text;

// build the accordions
$accordion = '
          <div class="container mt-3">

            <div class="accordion" id="accordion">

              <div class="row">';
$i = 0;
$accordion1 =  '<div class="col-xl-6 col-lg-6 col-md-6 col-sm-12">';
$accordion2 =  '<div class="col-xl-6 col-lg-6 col-md-6 col-sm-12 pa-ing">';

foreach ($page->accordion as $acc) {

  $i++; //update the index, is the number of the accordion
  
  if ($i%2) {

    $accordion1 = $accordion1.'

                  <div class="card">

                    <div class="card-header" id="heading'.$i.'">

                      <h2 class="mb-0">

                        <button class="d-flex align-items-center justify-content-between btn btn-link collapsed" data-toggle="collapse" data-target="#collapse'.$i.'" aria-expanded="false" aria-controls="collapse'.$i.'">

                          '.$acc->headline.'

                          <span class="fa-stack fa-sm">

                            <i class="fa fa-circle fa-stack-2x"></i>

                            <i class="fa fa-arrow-down fa-stack-1x fa-inverse"></i>

                          </span>

                        </button>

                      </h2>

                    </div>

                    <div id="collapse'.$i.'" class="collapse" aria-labelledby="heading'.$i.'" data-parent="#accordion">

                      <div class="card-body text-left">

                        <p>'.$acc->body.'</p>

                      </div>

                    </div>

                  </div>

                  ';

  } else {                  



    $accordion2 = $accordion2.'

                  <div class="card">

                    <div class="card-header" id="heading'.$i.'">

                      <h2 class="mb-0">

                        <button class="d-flex align-items-center justify-content-between btn btn-link collapsed" data-toggle="collapse" data-target="#collapse'.$i.'" aria-expanded="false" aria-controls="collapse'.$i.'">

                          '.$acc->headline.'
                          <span class="fa-stack fa-sm">

                            <i class="fa fa-circle fa-stack-2x"></i>

                            <i class="fa fa-arrow-down fa-stack-1x fa-inverse"></i>

                          </span>

                        </button>

                      </h2>

                    </div>

                    <div id="collapse'.$i.'" class="collapse" aria-labelledby="heading'.$i.'" data-parent="#accordion">

                      <div class="card-body">

                        <p>'.$acc->body.'</p>

                      </div>

                    </div>

                  </div>

';

  }

  
}

//unset($acc); // break the reference with the last element

$accordion1 = $accordion1.'
                </div>';

$accordion2 = $accordion2.'
                </div>';
                
$accordion = $accordion.$accordion1.$accordion2.'                

              </div>

            </div>

          </div>  <!--
          <script>
            $(document).ready(function(){
              //alert("documwnt ready");
              // Add minus icon for collapse element which is open by default
              $(".collapse.show").each(function(){
                $(this).prev(".card-header").find(".fa").addClass("fa-arrow-up").removeClass("fa-arrow-down");
              });
              // Toggle plus minus icon on show hide of collapse element
              $(".collapse").on(\'show.bs.collapse\', function(){
                $(this).prev(".card-header").find(".fa").removeClass("fa-arrow-down").addClass("fa-arrow-up");
              }).on(\'hide.bs.collapse\', function(){
                $(this).prev(".card-header").find(".fa").removeClass("fa-arrow-up").addClass("fa-arrow-down");
              });
            });
          </script>    -->
            ';


// main content of the page
$content = '
      <!-- content_header -->
      <div id="content_header" class="content_header">
        <div class="container">
          <div class="row">
            <div class="col-xl-4 col-lg-4 col-md-4 col-sm-12">
              <div class="content_header_img">'.$str_image.'</div>
            </div>
            <div class="col-xl-8 col-lg-8 col-md-8 col-sm-12 pa-ing">
              <div class="content_header_text">
                <div class="content_header_text_box">
                  <h2>'.strtok($page->headline, " ").'<strong class="black">'.strstr($page->headline," ").'</strong></h2>
                  <p>'.$page->about.'</p>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <!-- end about -->
      
      <!-- basic_page -->
      <!-- <div id="basic_page" class="basic_page body_text"> -->
      <div id="basic_page" class="basic_page">
        <div class="container-fluid">
          <div class="row">
            <div class="col-sm-12">
              <p>'.$page->body.'</p>
              <p>'.$accordion.'</p>
              <p>'.$page->body2.'</p>
            </div>
          </div>
        </div>
      </div>
           ';