<script src="https://npmcdn.com/isotope-layout@3.0/dist/isotope.pkgd.js"></script>

<script type="text/javascript">
	AJS.toInit(function(){
		
		  AJS.$('a[href*="$"]').hide();
		
	});
</script>


 
<script> 
 
$(function(){
// quick search regex
var qsRegex;
var buttonFilter;
// init Isotope
var $grid = $('.grid').isotope({
  itemSelector: '.element-item',
   layoutMode: 'fitRows',
fitRows: {
  gutter: 50,
  
},
 
masonry: {
  columnWidth: 50,
  gutter: 10
},
  filter: function() {
    var $this = $(this);
    var searchResult = qsRegex ? $this.text().match( qsRegex ) : true;
    var buttonResult = buttonFilter ? $this.is( buttonFilter ) : true;
    return searchResult && buttonResult;
  }
});
$('#filters').on( 'click', 'button', function() {
  buttonFilter = $( this ).attr('data-filter');
  $grid.isotope();
});
// use value of search field to filter
var $quicksearch = $('#quicksearch').keyup( debounce( function() {
  qsRegex = new RegExp( $quicksearch.val(), 'gi' );
  $grid.isotope();
}) );

  // change is-checked class on buttons
$('.button-group').each( function( i, buttonGroup ) {
  var $buttonGroup = $( buttonGroup );
  $buttonGroup.on( 'click', 'button', function() {
    $buttonGroup.find('.is-checked').removeClass('is-checked');
    $( this ).addClass('is-checked');
  });
});
  
// debounce so filtering doesn't happen every millisecond
function debounce( fn, threshold ) {
  var timeout;
  return function debounced() {
    if ( timeout ) {
      clearTimeout( timeout );
    }
    function delayed() {
      fn();
      timeout = null;
    }
    setTimeout( delayed, threshold || 100 );
  };
}




 
});


</script> 

<div>
<p>Midlands3Cities works closely with a range of creative industry partners to develop placement and other collaborative activities that benefit both our research students and partner organisations.</p>
<p>

If you would like to discuss collaboration and placement opportunities please contact <a href="mailto:placements@midlands3cities.ac.uk">placements@midlands3cities.ac.uk </a>

For information about how to set up a placement opportunity with one of our partners go to <a href="https://vpp.midlands3cities.ac.uk/display/SR/Placements+Guidance+and+Process">the placements pages.</a>
</p>

</div>
 
<div id="filterBox">
 
<p id="partners-search"><input type="text" id="quicksearch" placeholder="Search" /></p>
<div id="filters" class="button-group">
   <span class="filter-title">Filter by location:</span>
  <button class="button is-checked" data-filter="*">show all</button>
  <button class="button" data-filter=".Nottingham">Nottingham</button>
  <button class="button" data-filter=".Leicester">Leicester</button>
  <button class="button" data-filter=".Birmingham">Birmingham</button>
  <button class="button" data-filter=".London">London</button>
<button class="button" data-filter=":not(.Nottingham, .London, .Birmingham, .Leicester)">Other</button>

</div>
</div>

<div class="grid" id="partners">

</div>