<!-- BEGIN component.name %] -->
    [%
        category_ids = []; # for showhide_screens() function
        FOREACH entry IN screen_categories;
            NEXT UNLESS entry.is_active.match('yes');
            category_ids.push(entry.id);
        END;
    %]
    
	<script language="javascript" type="text/javascript">
	<!--
		function showhide_screens(f,v) {
			var t = f.screen_id;
            var categoryIds = [ [% category_ids.join(',') %] ];

			// does value of 'v' match any of categoryIds array:
			match = jQuery.grep(categoryIds, function (a) { return a == v; }); // alert(match);

			if (match.length) { // ie contains the value of category_id
				t.style.visibility='visible';
			}
			else {
				t.style.visibility='hidden';
			}			
		}

		// use addLoadEvent function in common.js for onload:
		addLoadEvent(
			function() { 
				document.initialScreen.screen_id.style.visibility='hidden';
			}
		);

		// screen_category onChange event for screen_id select menu
		$(document).ready(function () {
			$('#screen_category').change( function() {
				$('#screen_name').load('[% app_url %]/screen/screen_terms', {
					category_id: $('#screen_category').val()	
				})
			})
		});		
	-->
	</script>
<!-- END component.name %] -->
