var help = {}

help.init = function(){
	help.bind()
}

help.bind = function(){
	$(window).on("scroll DOMMouseScroll mousewheel", function(){ scrolling = true })
	$("#show-commands").click(function(){ $("#tutorial").hide(); $("#commands").toggle() })
	$("#show-tutorial").click(function(){ $("#commands").hide(); $("#tutorial").toggle() })
	$("#commands .close").click(function(){ $("#commands").toggle() })
	$("#tutorial .close").click(function(){ $("#tutorial").toggle() })
	$("#commands,#tutorial").draggable({
		start: drag_start,
		stop: drag_stop
	})
	$("#commands,#tutorial").disableSelection();
	
	$("#examples").change(function(){ 
		help.load_example($(this).val())
		$("#toggle-images").trigger("click")
	})

  if ('EXAMPLE_SHADERS' in window) {
  	help.examples = {}
    window.EXAMPLE_SHADERS.forEach(function(s){
    	help.examples[ s.name ] = s.shader
			var $option = $("<option value='" + s.name +"'>" + s.name + "</option>")
			$("#examples").append($option)
    })
  }
}

help.examples = {}

help.load_example = function(name){
	var s = help.examples[name]
	$("#shader").html(s)
	new_shader({ name: name, shader: s })
}

function drag_start(){ dragging = true; $(this).addClass("dragging") }
function drag_stop(){ dragging = false; $(".dragging").removeClass("dragging") }

function status(s){ $(".status").html(s); console.log(s) }
function quiet_status(s){ $(".status").html(s) }