!!!
html(lang="en")
	head
		title Feature Flags
		meta(http-equiv="X-UA-Compatible", content="IE=9; IE=8;")
		link(rel="stylesheet", href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css")
		link(rel="stylesheet", href="feature_flags/bootstrap-switch.css")

		script(src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js")
		script(src="feature_flags/bootstrap-switch.min.js")

	body
		.container
			.row
				.span10
					h3 Url Rules
					each rule in rules
						a(href="#{rule.url}") #{host}#{rule.url} 
						select(name="#{rule.url}")
							each level in levels
								if level === rule.level
									option(value="#{level}", selected) #{level}
								else
									option(value="#{level}") #{level}
						br
					h3 Locals
					each local in locals
						a(href="#{local.url}") #{host}#{local.url} 
						select(name="#{local.url}")
							each level in levels
								if level === local.level
									option(value="#{level}", selected) #{level}
								else
									option(value="#{level}") #{level}
						br
		script(type="text/javascript").
			// TODO: debounce
			$('select').on('change', function(e) {
				var $this = $(this);
				$.post('feature_flags/newLevel', {
						url: $this.attr('name'),
						level: $(this).find(':selected').text(),
						section: 'rule'
				}, function(data) {
					console.log(data);
				});
				console.log($(this).find(':selected').text());
			})

				//
					.make-switch
						input(type="checkbox")