Mercurial > browser-couch

comparison js/tutorial.js @ 78:17ce8b6be452

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Added a 'now you try' section and a 'where to go from here' section to the tutorial.
author Atul Varma <varmaa@toolness.com>
date Mon, 20 Apr 2009 14:30:27 -0700
parents 9a771b8a1702
children 86158b61b732
comparison
equal deleted inserted replaced
77:5d413eab9aab 78:17ce8b6be452
13 13
14 // Get the width of a single monospaced character of code. 14 // Get the width of a single monospaced character of code.
15 var oneCodeCharacter = $('<span class="example-code">M</span>'); 15 var oneCodeCharacter = $('<span class="example-code">M</span>');
16 $(document.body).append(oneCodeCharacter); 16 $(document.body).append(oneCodeCharacter);
17 var charWidth = oneCodeCharacter.width(); 17 var charWidth = oneCodeCharacter.width();
18 var charHeight = oneCodeCharacter.height();
19 var columnWidth = charWidth * CHARS_PER_ROW;
18 $(oneCodeCharacter).remove(); 20 $(oneCodeCharacter).remove();
19 21
20 // Set the width of the content to be the maximum number of 22 // Set the width of the content to be the maximum number of
21 // characters of code that can fit on a line. 23 // characters of code that can fit on a line.
22 $('#content').css({width: charWidth * CHARS_PER_ROW}); 24 $('#content').width(columnWidth);
25
26 // Set up the code editor.
27 $('.try-code').width(columnWidth);
28 var tryCodeLines = $('.try-code').text().split('\n').length + 1;
29 $('.try-code').height(charHeight * tryCodeLines);
30
31 function executeTryCode() {
32 $('#try-my-view').text('');
33 var code = $('.try-code').val();
34 eval(code);
35 eval('tryMyView();');
36 }
37
38 $('.try-code').blur(executeTryCode);
23 $('#content').fadeIn(); 39 $('#content').fadeIn();
24 40
25 // Iterate through all the code snippets and trim them. 41 // Iterate through all the code snippets and trim them.
26 var allCode = ''; 42 var allCode = '';
27 $('.example-code').each( 43 $('.example-code').each(
28 function() { 44 function() {
29 var code = $(this).text(); 45 var code = $(this).val() || $(this).text();
30 allCode += code; 46 allCode += code;
31 $(this).text(jQuery.trim(code)); 47 $(this).text(jQuery.trim(code));
32 }); 48 });
33 49
34 // Now execute all the code snippets. 50 // Now execute all the code snippets.