static/tour.js - tour - Git at Google

 /* Copyright 2012 The Go Authors.  All rights reserved.
  * Use of this source code is governed by a BSD-style
  * license that can be found in the LICENSE file.
  */
 (function() {
 "use strict";

 var slides, editor, $editor, $output;
 var slide = null;
 var slidenum = 0;

 function init() {
 	if (tourMode === 'local') {
 		$('.appengineMode').remove();
 	} else {
 		$('.localMode').remove();
 	}

 	var $tocdiv = $('<div id="toc" />').insertBefore('#slides').hide();
 	$tocdiv.append($('<h2>Table of Contents</h2>'));
 	var $toc = $('<ol />').appendTo($tocdiv);
 	$("#tocbtn").click(toggleToc);

 	slides = $("div.slide");
 	slides.each(function(i, slide) {
 		var $s = $(slide).hide();

 		var $h2 = $s.find("h2").first();
 		var $nav;
 		if ($h2.length > 0) {
 			$("<div/>").addClass("clear").insertAfter($h2);
 			$nav = $("<div/>").addClass("nav");
 			if (i > 0) {
 				$nav.append($("<a>◀</a>").click(function() {
 					show(i-1);
 					return false;
 				}).attr("href", "#"+(i)).attr("title", "Previous"));
 			} else {
 				$nav.append($("<span>◀</span>"));
 			}
 			if (i+1 < slides.length) {
 				$nav.append($("<a>▶</a>").click(function() {
 					show(i+1);
 					return false;
 				}).attr("href", "#"+(i+2)).attr("title", "Next"));
 			} else {
 				$nav.append($("<span>▶</span>"));
 			}
 			$nav.insertBefore($h2);

 			var thisI = i;
 			var $entry = $("<a />").text($h2.text()).click(function() {
 				show(thisI);
 			}).attr('href', '#'+(i+1));
 			$toc.append($entry);
 			$entry.wrap('<li />');

 		}
 	});

 	// set up playground editor
 	editor = CodeMirror.fromTextArea(document.getElementById('editor'), {
 		theme: "plain",
 		matchBrackets: true,
 		indentUnit: 8,
 		tabSize: 8,
 		indentWithTabs: true,
 		mode: "text/x-go",
 		lineNumbers: true,
 		extraKeys: {
 			"Shift-Enter": function() {
 				run();
 			}
 		}
 	});
 	$editor = $(editor.getWrapperElement()).attr('id', 'code');
 	$output = $('#output');

 	$('#more').click(function() {
 		$('.controls').toggleClass('expanded');
 		return false;
 	});
 	$('html').click(function() {
 		$('.controls').removeClass('expanded');
 	});

 	$('#run').click(function() {
 		run();
 		$('.controls').removeClass('expanded');
 		return false;
 	});

 	$('#reset').click(function() {
 		reset();
 		$('.controls').removeClass('expanded');
 		return false;
 	});

 	$('#kill').click(function() {
 		kill();
 		$('.controls').removeClass('expanded');
 		return false;
 	});

 	$('#format').click(function() {
 		format();
 		$('.controls').removeClass('expanded');
 		return false;
 	});

 	$('#togglesyntax').click(function() {
 		if (editor.getOption('theme') === 'default') {
 			editor.setOption('theme', 'plain');
 			$('#togglesyntax').text('Syntax-Highlighting: off');
 		} else {
 			editor.setOption('theme', 'default');
 			$('#togglesyntax').text('Syntax-Highlighting: on');
 		}
 		setcookie('theme', editor.getOption('theme'), 14);
 		$('.controls').removeClass('expanded');
 		return false;
 	});

 	$('#togglelineno').click(function() {
 		if (editor.getOption('lineNumbers')) {
 			editor.setOption('lineNumbers', false);
 			$('#togglelineno').text('Line-Numbers: off');
 		} else {
 			editor.setOption('lineNumbers', true);
 			$('#togglelineno').text('Line-Numbers: on');
 		}
 		setcookie('lineno', editor.getOption('lineNumbers'), 14);
 		$('.controls').removeClass('expanded');
 		return false;
 	});

 	if (getcookie('lineno') != ""+editor.getOption('lineNumbers')) {
 		$('#togglelineno').trigger('click');
 	}

 	if (getcookie('theme') != ""+editor.getOption('theme')) {
 		$('#togglesyntax').trigger('click');
 	}
 }

 function toggleToc() {
 	if ($('#toc').is(':visible')) {
 		show(slidenum);
 	} else {
 		$('#slides, #workspace, #slidenum').hide();
 		$('#toc').show();
 	}
 	return false;
 }

 function show(i) {
 	if(i < 0 || i >= slides.length) {
 		return;
 	}

 	// if a slide is already onscreen, hide it and store its code
 	if(slide !== null) {
 		var $oldSlide = $(slide).hide();
 		if (!$oldSlide.hasClass("nocode")) {
 			save(slidenum);
 		}
 	}

 	$('#toc').hide();
 	$('#slidenum, #slides').show();

 	// switch to new slide
 	slidenum = i;
 	$("#slidenum").text(i+1);
 	slide = slides[i];
 	var $s = $(slide).show();

 	// load stored code, or hide code box
 	if ($s.hasClass("nocode")) {
 		$('#workspace').hide();
 	} else {
 		$('#workspace').show();
 		$output.empty();
 		editor.setValue(load(i) || $s.find('pre.source').text());
 		editor.focus();
 	}

 	// update url fragment
 	var url = location.href;
 	var j = url.indexOf("#");
 	if(j >= 0) {
 		url = url.substr(0, j);
 	}
 	url += "#" + (slidenum+1).toString();
 	location.href = url;
 }

 function reset() {
 	editor.setValue($(slide).find('pre.source').text());
 	save(slidenum);
 }

 function save(page) {
 	// TODO: store editor.getValue() using localStorage or something similar
 	return false;
 }

 function load(page) {
 	// TODO: retrieve a previously stored code snippet from localStorage
 	return false;
 }

 function urlSlideNumber(url) {
 	var i = url.indexOf("#");
 	if(i < 0) {
 		return 0;
 	}
 	var frag = decodeURIComponent(url.substr(i+1));
 	if(/^\d+$/.test(frag)) {
 		i = parseInt(frag, 10);
 		if(i-1 < 0 || i-1 >= slides.length) {
 			return 0;
 		}
 		return i-1;
 	}
 	return 0;
 }

 function pageUpDown(event) {
 	var e = window.event || event;
 	if (e.keyCode === 33) { // page up
 		e.preventDefault();
 		show(slidenum-1);
 		return false;
 	}
 	if (e.keyCode === 34) { // page down
 		e.preventDefault();
 		show(slidenum+1);
 		return false;
 	}
 	return true;
 }

 $(document).ready(function() {
 	init();
 	if (location.href.indexOf('#') < 0) {
 		show(0);
 	} else {
 		show(urlSlideNumber(location.href));
 	}
 	document.onkeydown = pageUpDown;
 });

 $(window).unload(function() {
 	save(slidenum);
 });


 var seq = 0;

 function run() {
 	seq++;
 	var cur = seq;
 	$output.html('<div class="loading">Waiting for remote server...</div>');
 	$.ajax("/compile", {
 		data: {"body": editor.getValue()},
 		type: "POST",
 		dataType: "json",
 		success: function(data) {
 			if (seq !== cur) {
 				return;
 			}
 			$output.empty();
 			if (data.compile_errors) {
 				$('<pre class="error" />').text(data.compile_errors).appendTo($output);
 				highlightErrors(data.compile_errors);
 			}
 			if (/^IMAGE:/.exec(data.output)) {
 				var img = $('<img />').attr('src',
 					'data:image/png;base64,' + data.output.substr(6));
 				$output.empty().append(img);
 				return;
 			}
 			$('<pre />').text(data.output).appendTo($output);
 		},
 		error: function() {
 			$output.empty();
 			$('<pre class="error" />').text("Error communicating with remote server.").appendTo($output);
 		}
 	});
 }

 function format() {
 	seq++;
 	var cur = seq;
 	$output.html('<div class="loading">Waiting for remote server...</div>');
 	$.ajax("/fmt", {
 		data: {"body": editor.getValue()},
 		type: "POST",
 		dataType: "json",
 		success: function(data) {
 			if (seq !== cur) {
 				return;
 			}
 			$output.empty();
 			if (data.Error) {
 				$('<pre class="error" />').text(data.Error).appendTo($output);
 				highlightErrors(data.Error);
 			} else {
 				editor.setValue(data.Body);
 			}
 		},
 		error: function() {
 			$('<pre class="error" />').text("Error communicating with remote server.").appendTo($output);
 		}
 	});
 }

 function kill() {
 	$.ajax("/kill");
 }

 function highlightErrors(text) {
 	if (!editor || !text) {
 		return;
 	}
 	var errorRe = /[a-z0-9]+\.go:([0-9]+):/g;
 	var result;
 	while ((result = errorRe.exec(text)) !== null) {
 		var line = result[1]*1-1;
 		editor.setLineClass(line, null, 'errLine');
 	}
 	editor.setOption('onChange', function() {
 		for (var i = 0; i < editor.lineCount(); i++) {
 			editor.setLineClass(i, null, null);
 		}
 		editor.setOption('onChange', null);
 	});
 }

 function getcookie(name) {
 	if (document.cookie.length > 0) {
 		var start = document.cookie.indexOf(name + '=');
 		if (start >= 0) {
 			start += name.length + 1;
 			var end = document.cookie.indexOf(';', start);
 			if (end < 0) {
 				end = document.cookie.length;
 			}
 			return decodeURIComponent(document.cookie.substring(start, end));
 		}
 	}
 	return null;
 }

 function setcookie(name, value, expire) {
 	var expdate = new Date();
 	expdate.setDate(expdate.getDate() + expire);
 	document.cookie = name + '=' + encodeURIComponent(value) +
 		((expire === undefined) ? '' : ';expires=' + expdate.toGMTString());
 }

 }());
	/* Copyright 2012 The Go Authors. All rights reserved.
	* Use of this source code is governed by a BSD-style
	* license that can be found in the LICENSE file.
	*/
	(function() {
	"use strict";

	var slides, editor, $editor, $output;
	var slide = null;
	var slidenum = 0;

	function init() {
	if (tourMode === 'local') {
	$('.appengineMode').remove();
	} else {
	$('.localMode').remove();
	}

	var $tocdiv = $('<div id="toc" />').insertBefore('#slides').hide();
	$tocdiv.append($('<h2>Table of Contents</h2>'));
	var $toc = $('<ol />').appendTo($tocdiv);
	$("#tocbtn").click(toggleToc);

	slides = $("div.slide");
	slides.each(function(i, slide) {
	var $s = $(slide).hide();

	var $h2 = $s.find("h2").first();
	var $nav;
	if ($h2.length > 0) {
	$("<div/>").addClass("clear").insertAfter($h2);
	$nav = $("<div/>").addClass("nav");
	if (i > 0) {
	$nav.append($("<a>◀</a>").click(function() {
	show(i-1);
	return false;
	}).attr("href", "#"+(i)).attr("title", "Previous"));
	} else {
	$nav.append($("<span>◀</span>"));
	}
	if (i+1 < slides.length) {
	$nav.append($("<a>▶</a>").click(function() {
	show(i+1);
	return false;
	}).attr("href", "#"+(i+2)).attr("title", "Next"));
	} else {
	$nav.append($("<span>▶</span>"));
	}
	$nav.insertBefore($h2);

	var thisI = i;
	var $entry = $("<a />").text($h2.text()).click(function() {
	show(thisI);
	}).attr('href', '#'+(i+1));
	$toc.append($entry);
	$entry.wrap('<li />');

	}
	});

	// set up playground editor
	editor = CodeMirror.fromTextArea(document.getElementById('editor'), {
	theme: "plain",
	matchBrackets: true,
	indentUnit: 8,
	tabSize: 8,
	indentWithTabs: true,
	mode: "text/x-go",
	lineNumbers: true,
	extraKeys: {
	"Shift-Enter": function() {
	run();
	}
	}
	});
	$editor = $(editor.getWrapperElement()).attr('id', 'code');
	$output = $('#output');

	$('#more').click(function() {
	$('.controls').toggleClass('expanded');
	return false;
	});
	$('html').click(function() {
	$('.controls').removeClass('expanded');
	});

	$('#run').click(function() {
	run();
	$('.controls').removeClass('expanded');
	return false;
	});

	$('#reset').click(function() {
	reset();
	$('.controls').removeClass('expanded');
	return false;
	});

	$('#kill').click(function() {
	kill();
	$('.controls').removeClass('expanded');
	return false;
	});

	$('#format').click(function() {
	format();
	$('.controls').removeClass('expanded');
	return false;
	});

	$('#togglesyntax').click(function() {
	if (editor.getOption('theme') === 'default') {
	editor.setOption('theme', 'plain');
	$('#togglesyntax').text('Syntax-Highlighting: off');
	} else {
	editor.setOption('theme', 'default');
	$('#togglesyntax').text('Syntax-Highlighting: on');
	}
	setcookie('theme', editor.getOption('theme'), 14);
	$('.controls').removeClass('expanded');
	return false;
	});

	$('#togglelineno').click(function() {
	if (editor.getOption('lineNumbers')) {
	editor.setOption('lineNumbers', false);
	$('#togglelineno').text('Line-Numbers: off');
	} else {
	editor.setOption('lineNumbers', true);
	$('#togglelineno').text('Line-Numbers: on');
	}
	setcookie('lineno', editor.getOption('lineNumbers'), 14);
	$('.controls').removeClass('expanded');
	return false;
	});

	if (getcookie('lineno') != ""+editor.getOption('lineNumbers')) {
	$('#togglelineno').trigger('click');
	}

	if (getcookie('theme') != ""+editor.getOption('theme')) {
	$('#togglesyntax').trigger('click');
	}
	}

	function toggleToc() {
	if ($('#toc').is(':visible')) {
	show(slidenum);
	} else {
	$('#slides, #workspace, #slidenum').hide();
	$('#toc').show();
	}
	return false;
	}

	function show(i) {
	if(i < 0 \|\| i >= slides.length) {
	return;
	}

	// if a slide is already onscreen, hide it and store its code
	if(slide !== null) {
	var $oldSlide = $(slide).hide();
	if (!$oldSlide.hasClass("nocode")) {
	save(slidenum);
	}
	}

	$('#toc').hide();
	$('#slidenum, #slides').show();

	// switch to new slide
	slidenum = i;
	$("#slidenum").text(i+1);
	slide = slides[i];
	var $s = $(slide).show();

	// load stored code, or hide code box
	if ($s.hasClass("nocode")) {
	$('#workspace').hide();
	} else {
	$('#workspace').show();
	$output.empty();
	editor.setValue(load(i) \|\| $s.find('pre.source').text());
	editor.focus();
	}

	// update url fragment
	var url = location.href;
	var j = url.indexOf("#");
	if(j >= 0) {
	url = url.substr(0, j);
	}
	url += "#" + (slidenum+1).toString();
	location.href = url;
	}

	function reset() {
	editor.setValue($(slide).find('pre.source').text());
	save(slidenum);
	}

	function save(page) {
	// TODO: store editor.getValue() using localStorage or something similar
	return false;
	}

	function load(page) {
	// TODO: retrieve a previously stored code snippet from localStorage
	return false;
	}

	function urlSlideNumber(url) {
	var i = url.indexOf("#");
	if(i < 0) {
	return 0;
	}
	var frag = decodeURIComponent(url.substr(i+1));
	if(/^\d+$/.test(frag)) {
	i = parseInt(frag, 10);
	if(i-1 < 0 \|\| i-1 >= slides.length) {
	return 0;
	}
	return i-1;
	}
	return 0;
	}

	function pageUpDown(event) {
	var e = window.event \|\| event;
	if (e.keyCode === 33) { // page up
	e.preventDefault();
	show(slidenum-1);
	return false;
	}
	if (e.keyCode === 34) { // page down
	e.preventDefault();
	show(slidenum+1);
	return false;
	}
	return true;
	}

	$(document).ready(function() {
	init();
	if (location.href.indexOf('#') < 0) {
	show(0);
	} else {
	show(urlSlideNumber(location.href));
	}
	document.onkeydown = pageUpDown;
	});

	$(window).unload(function() {
	save(slidenum);
	});


	var seq = 0;

	function run() {
	seq++;
	var cur = seq;
	$output.html('<div class="loading">Waiting for remote server...</div>');
	$.ajax("/compile", {
	data: {"body": editor.getValue()},
	type: "POST",
	dataType: "json",
	success: function(data) {
	if (seq !== cur) {
	return;
	}
	$output.empty();
	if (data.compile_errors) {
	$('<pre class="error" />').text(data.compile_errors).appendTo($output);
	highlightErrors(data.compile_errors);
	}
	if (/^IMAGE:/.exec(data.output)) {
	var img = $('<img />').attr('src',
	'data:image/png;base64,' + data.output.substr(6));
	$output.empty().append(img);
	return;
	}
	$('<pre />').text(data.output).appendTo($output);
	},
	error: function() {
	$output.empty();
	$('<pre class="error" />').text("Error communicating with remote server.").appendTo($output);
	}
	});
	}

	function format() {
	seq++;
	var cur = seq;
	$output.html('<div class="loading">Waiting for remote server...</div>');
	$.ajax("/fmt", {
	data: {"body": editor.getValue()},
	type: "POST",
	dataType: "json",
	success: function(data) {
	if (seq !== cur) {
	return;
	}
	$output.empty();
	if (data.Error) {
	$('<pre class="error" />').text(data.Error).appendTo($output);
	highlightErrors(data.Error);
	} else {
	editor.setValue(data.Body);
	}
	},
	error: function() {
	$('<pre class="error" />').text("Error communicating with remote server.").appendTo($output);
	}
	});
	}

	function kill() {
	$.ajax("/kill");
	}

	function highlightErrors(text) {
	if (!editor \|\| !text) {
	return;
	}
	var errorRe = /[a-z0-9]+\.go:([0-9]+):/g;
	var result;
	while ((result = errorRe.exec(text)) !== null) {
	var line = result[1]*1-1;
	editor.setLineClass(line, null, 'errLine');
	}
	editor.setOption('onChange', function() {
	for (var i = 0; i < editor.lineCount(); i++) {
	editor.setLineClass(i, null, null);
	}
	editor.setOption('onChange', null);
	});
	}

	function getcookie(name) {
	if (document.cookie.length > 0) {
	var start = document.cookie.indexOf(name + '=');
	if (start >= 0) {
	start += name.length + 1;
	var end = document.cookie.indexOf(';', start);
	if (end < 0) {
	end = document.cookie.length;
	}
	return decodeURIComponent(document.cookie.substring(start, end));
	}
	}
	return null;
	}

	function setcookie(name, value, expire) {
	var expdate = new Date();
	expdate.setDate(expdate.getDate() + expire);
	document.cookie = name + '=' + encodeURIComponent(value) +
	((expire === undefined) ? '' : ';expires=' + expdate.toGMTString());
	}

	}());