<?php
/*
 * Template Name: Experience by Companies
 */
 
/**
 *
 *
 * The template for displaying all single posts and attachments
 *
 * @package WordPress
 * @subpackage Twenty_Sixteen
 * @since Twenty Sixteen 1.0
 */
get_header(); ?>

   <!--Page Title & Details-->
	<div class="post-header-title">
		<h1 id="page-title">Experience</h1>
		<h2 id="page-subtitle">by company</h2>
		<?php while (have_posts()) : the_post(); ?>
			<div class="entry-content tile" id="taxonomy-description">
			<?php the_content() ?>
			</div>
			<div class="entry-content tile" id="settings">
            <h3 class="subheading">Settings</h3>
            <form action="/experience-by-companies" id="settings" method="GET">
               <input class="checkbox" type="checkbox" id="toplevel" value="toplevel" checked="checked">
               <label for="toplevel">Display only top-level companies</label>
               <br>
               <fieldset>
                  <legend>Display companies with:</legend>
                  <div class="controlgroup" id="typestodisplay">
                     <label for="jobs">Jobs <span class="dashicons dashicons-hammer"></span></label>
                     <input type="checkbox" name="jobs" id="jobs" checked="checked">
                     <label for="posts">Blog Posts <span class="dashicons dashicons-admin-post"></span></label>
                     <input type="checkbox" name="posts" id="posts">
                     <br><br><br>
                     <label for="websites">Websites <span class="dashicons dashicons-schedule"></span></label>
                     <input type="checkbox" name="websites" id="websites">
                     <label for="programs">Programs <span class="dashicons dashicons-desktop"></span></label>
                     <input type="checkbox" name="programs" id="programs">
                     <label for="writings">Writings <span class="dashicons dashicons-format-aside"></span></label>
                     <input type="checkbox" name="writings" id="writings">
                     <label for="videos">Videos <span class="dashicons dashicons-video-alt"></span></label>
                     <input type="checkbox" name="videos" id="videos">
                     <label for="other">Other <span class="dashicons dashicons-archive"></span></label>
                     <input type="checkbox" name="other" id="other">
                     <br><br><br>
                     <label for="qualifications">Qualifications <span class="dashicons dashicons-id"></span></label>
                     <input type="checkbox" name="qualifications" id="qualifications">
                     <label for="awards">Awards <span class="dashicons dashicons-awards"></span></label>
                     <input type="checkbox" name="awards" id="awards">
                  </div>
               </fieldset>
               <br>
               <input class="ui-button ui-widget ui-corner-all" id="refresh" type="submit" value="Refresh">
            </form>
			</div>
		<?php endwhile; ?>
	</div>
	
   <!--Company Grid-->
	<div class="row" id="companies-grid">
      <img class="loading" src="/wp-content/uploads/2016/12/ajax-loader.gif">
	</div>
   
   <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">  
   <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
   <script type="text/javascript">
      // Populates the companies grid.
      jQuery(document).ready(function($) {
         // Sets up jQueryUI elements.
         $('input:checkbox').checkboxradio();
         $('.controlgroup').controlgroup();
         $('.refresh').button();
         
         // Displays the initial companies grid.
         displayCompanies();
         
         $('#refresh').click(function(event) {
            event.preventDefault();
            displayCompanies();
         });
         
         function displayCompanies() {
            $('#companies-grid').html('<img class="loading" src="/wp-content/uploads/2016/12/ajax-loader.gif">');
            
            var settings = {
               'action': 'display_companies',
               'toplevel': $('#toplevel').is(':checked'),
               'job': $('#jobs').is(':checked'),
               'post': $('#posts').is(':checked'),
               'website': $('#websites').is(':checked'),
               'program': $('#programs').is(':checked'),
               'writing': $('#writings').is(':checked'),
               'video': $('#videos').is(':checked'),
               'other': $('#other').is(':checked'),
               'qualification': $('#qualifications').is(':checked'),
               'award': $('#awards').is(':checked'),
            };
            
            $.post("/wp-admin/admin-ajax.php", settings, function(response) {
               $('#companies-grid').html(response);
            }); 
         }
      });
   </script>
<?php //get_sidebar(); ?>
<?php get_footer(); ?>