<commit_before>// Need to make sure all the tests here are valid.

// BUTTON FUNCTION TEMPLATE
// buttonFunction: function() {
// 	var commandToRun = 'cd ' + currentDirectory// + '; git status';
// 	ipcRenderer.send('command-to-run', commandToRun);
// 	ipcRenderer.once('terminal-output', function(event, arg) {
// 		// Insert test
// 		ipcRenderer.send('test-result-1', false); // Replace false with Boolean
// 	})
// },
// errorMessage: "Oops! It looks like X IS WRONG, or you aren't inside the 'new-project' directory. Try again and then click the button above."

// Import React so we can use JSX. (For some reason, we don't have to import ipcRenderer.)
import React from 'react';

var currentDirectory;

// Export an array. Alternatively, we could use a linked list.
var slides = [
	{
		lessonText:
			<div>
				<h2>Welcome!</h2>
				<p>If you're learning to code, chances are you've heard about something called Git. Git can be intimidating for beginners - but it doesn't have to be!</p>
				<p>In this lesson, you'll...</p>
				<ul>
					<li>Set up Git</li>
					<li>Set up a project</li>
					<li>Learn some basic Git commands that you can use to track your new project</li>
					<li>Learn a bit about GitHub, a popular website that uses Git</li>
				</ul>
				<p>Don't worry - we'll walk you through each step. Ready to get started?</p>
			</div>,
		buttonText: "Yes - let's do this!",
		buttonFunction: function() {
			// Start listening for updates to currentDirectory
			ipcRenderer.on('curr-dir', function(event, arg) {
					currentDirectory = arg;
			});
			ipcRenderer.send('test-result-1', true);
		}

	}, {
		lessonText:
			<div>
				<h2>Step 1: Set up Git</h2>
				<h3>Meet the terminal</h3>
				<p>For this step, we'll use the <strong>terminal</strong>, which lets you and your Mac communicate using just text.</p>
				<p>Software developers use their terminals every day, but no need to worry if this tool is new to you. We've embedded a terminal in this app to help you learn the ropes - it's the black box to the right.</p>
			</div>,
		buttonText: 'Got it!'

	}, {
		lessonText:
			<div>
				<h2>Step 1: Set up Git</h2>
				<h3>Check your version</h3>
				<p>To check whether your computer already has Git installed, type <code>git --version</code> and then click Enter.</p>
				<p>If you see a version number - like <code>git version 2.6.4</code> - you have Git installed, and you're ready for step two.</p>
				<p>If not, you can download Git from <a href='http://git-scm.com/downloads'>git-scm.com/downloads</a>. Then follow the directions at the top of this page to confirm that Git is installed correctly.</p>
			</div>,
		buttonText: "OK - I'm ready for step two!",
		buttonFunction: function() { // Check whether the user has installed Git
			// Send a command to the terminal via main.js.
			ipcRenderer.send('command-to-run', 'git --version');
			// Listen for the terminal's response.
			ipcRenderer.once('terminal-output', function(event, arg) {
				// Upon receiving the response, send a Boolean to main.js. If terminal-output contains the text 'git version', the user passed. If not, the user did not pass.
				ipcRenderer.send('test-result-1', arg.indexOf('git version') > -1);
			});
		},
		errorMessage: "Oops! It looks like you haven't installed Git. Try again and then click the button above."

	// I'll need to edit "you'll see"
	}, {
		lessonText:
			<div>
				<h2>Step 2: Set up a project</h2>
				<h3>Make a directory</h3>
				<p>OK, let's take a quick break from Git to set up our project.</p>
				<p>In the past, you've probably used the Finder or a program like Microsoft Word to create new folders and files. For this lesson, we'll use the terminal.</p>
				<p>Ready? Type <code>mkdir new-project</code> and then click Enter.</p>
				<p>Above the terminal, you'll see a visualization of what happens when you type this command.
				</p>
			</div>,
		buttonText: 'I typed, I saw, I conquered.',
		buttonFunction: function() { // Check whether the user has created new-project
			var commandToRun = 'cd ' + currentDirectory + '; cd new-project'; // If I'm doing this all the time, how can I make my code DRY?
			ipcRenderer.send('command-to-run', commandToRun); // need to replace '~/Desktop' with the user's current directory.
			ipcRenderer.once('terminal-output', function(event, arg) {
			// If we can't cd into new-project, the terminal will create an error, and arg will be a string starting with 'Error.' In this case, the user should fail the test, so we'll return a falsy value: zero. Otherwise, the user should pass.
				ipcRenderer.send('test-result-1', arg.indexOf('Error'));
			})

		},
		errorMessage: "Oops! It looks like you haven't created a new directory called 'new-project'. Try again and then click the button above."

	}, {
		lessonText:
			<div>
				<h2>Step 2: Set up a project</h2>
				<h3>Navigate to your new directory</h3>
				<p>As you just saw, you just created a new folder called "my-project." (The "mkdir" command is short for "make directory," and "directory" is just a fancy word for folder.)</p>
				<p>Now type <code>cd new-project</code> and click Enter to navigate to your new directory. (The "cd" command is short for "change directory.") This is where you'll  store all the files for your project.
				</p>
			</div>,
		buttonText: 'Got it!',
		// buttonFunction: function() {
		// 	// I want to see which directory the user is in. Simply running pwd won't work.
		// 	ipcRenderer.once('terminal-output', function(event, arg) {
		// 		console.log('result of pwd', arg);
		// 	})
		// },
		errorMessage: "Oops! It looks like you haven't navigated into the 'new-project' directory. Try again and then click the button above."

	}, {
		lessonText:
			<div>
				<h2>Step 2: Set up a project</h2>
				<h3>Create a file</h3>
				<p>Now let's add a file to your folder.</p>
				<p>In the terminal, type <code>touch new-file.txt</code> and click Enter.</p>
				<p>Notice that we haven't been typing the word "git" in the commands we're using to create directories and files and to navigate through them. That's because these commands aren't specific to Git - but we'll get back to Git now!</p>
			</div>,
		buttonText: "OK, I'm ready for step three!",
		buttonFunction: function() {
			// For testing only
			// currentDirectory = '~/Desktop/new-project';
			// console.log('Check whether the user has created new-file.txt');
			var commandToRun = 'cd ' + currentDirectory + '; ls';
			ipcRenderer.send('command-to-run', commandToRun);
			ipcRenderer.once('terminal-output', function(event, arg) {
			// If the terminal-output contains 'new-file.txt', the user should pass.<commit_msg>Test for cd command works<commit_after>// Need to make sure all the tests here are valid.

// BUTTON FUNCTION TEMPLATE
// buttonFunction: function() {
//  // Check whether X
// 	var commandToRun; // Define
// 	// Send a command to the terminal via main.js.
// 	ipcRenderer.send('command-to-run', commandToRun);
//  // Listen for the terminal's response.
// 	ipcRenderer.once('terminal-output', function(event, arg) {
// 		// Upon receiving the response, run a test and send the result (a Boolean) to main.js.
// 		ipcRenderer.send('test-result-1', false); // Replace false with Boolean
// 	})
// },
// errorMessage: "Oops! It looks like X IS WRONG, or you aren't inside the 'new-project' directory. Try again and then click the button above."

// Import React so we can use JSX. (For some reason, we don't have to import ipcRenderer. I believe that's because gulpfile.js, which 'imports' Dashboard.js, has access to ipcRenderer.)
import React from 'react';

var currentDirectory;

// Export an array. Alternatively, we could use a linked list.
var slides = [
	{
		lessonText:
			<div>
				<h2>Welcome!</h2>
				<p>If you're learning to code, chances are you've heard about something called Git. Git can be intimidating for beginners - but it doesn't have to be!</p>
				<p>In this lesson, you'll...</p>
				<ul>
					<li>Set up Git</li>
					<li>Set up a project</li>
					<li>Learn some basic Git commands that you can use to track your new project</li>
					<li>Learn a bit about GitHub, a popular website that uses Git</li>
				</ul>
				<p>Don't worry - we'll walk you through each step. Ready to get started?</p>
			</div>,
		buttonText: "Yes - let's do this!",
		buttonFunction: function() {
			// Start listening for updates to currentDirectory
			ipcRenderer.on('curr-dir', function(event, arg) {
					currentDirectory = arg;
			});
			ipcRenderer.send('test-result-1', true);
		}

	}, {
		lessonText:
			<div>
				<h2>Step 1: Set up Git</h2>
				<h3>Meet the terminal</h3>
				<p>For this step, we'll use the <strong>terminal</strong>, which lets you and your Mac communicate using just text.</p>
				<p>Software developers use their terminals every day, but no need to worry if this tool is new to you. We've embedded a terminal in this app to help you learn the ropes - it's the black box to the right.</p>
			</div>,
		buttonText: 'Got it!'

	}, {
		lessonText:
			<div>
				<h2>Step 1: Set up Git</h2>
				<h3>Check your version</h3>
				<p>To check whether your computer already has Git installed, type <code>git --version</code> and then click Enter.</p>
				<p>If you see a version number - like <code>git version 2.6.4</code> - you have Git installed, and you're ready for step two.</p>
				<p>If not, you can download Git from <a href='http://git-scm.com/downloads'>git-scm.com/downloads</a>. Then follow the directions at the top of this page to confirm that Git is installed correctly.</p>
			</div>,
		buttonText: "OK - I'm ready for step two!",
		buttonFunction: function() {
			// Check whether the user has installed Git
			ipcRenderer.send('command-to-run', 'git --version');
			ipcRenderer.once('terminal-output', function(event, arg) {
				// If terminal-output contains the text 'git version', the user should pass. If not, the user shouldn't.
				ipcRenderer.send('test-result-1', arg.indexOf('git version') > -1);
			});
		},
		errorMessage: "Oops! It looks like you haven't installed Git. Try again and then click the button above."

	// Does the user actually see the visualization mentioned below?
	}, {
		lessonText:
			<div>
				<h2>Step 2: Set up a project</h2>
				<h3>Make a directory</h3>
				<p>OK, let's take a quick break from Git to set up our project.</p>
				<p>In the past, you've probably used the Finder or a program like Microsoft Word to create new folders and files. For this lesson, we'll use the terminal.</p>
				<p>Ready? Type <code>mkdir new-project</code> and then click Enter.</p>
				<p>Above the terminal, you'll see a visualization of what happens when you type this command.
				</p>
			</div>,
		buttonText: 'I typed, I saw, I conquered.',
		buttonFunction: function() {
			// Check whether the user has created new-project
			// BUG: If we don't know the user's currentDirectory yet, this test will return a false negative.
			var commandToRun = 'cd ' + currentDirectory + '; cd new-project';
			ipcRenderer.send('command-to-run', commandToRun);
			ipcRenderer.once('terminal-output', function(event, arg) {
			// If we can't cd into new-project, the terminal will create an error, and arg will be a string starting with 'Error.' In this case, the user should fail the test, so we'll return a falsy value: zero. Otherwise, the user should pass.
				ipcRenderer.send('test-result-1', arg.indexOf('Error'));
			})
		},
		errorMessage: "Oops! It looks like you haven't created a new directory called 'new-project'. Try again and then click the button above."

	}, {
		lessonText:
			<div>
				<h2>Step 2: Set up a project</h2>
				<h3>Navigate to your new directory</h3>
				<p>As you just saw, you just created a new folder called "my-project." (The "mkdir" command is short for "make directory," and "directory" is just a fancy word for folder.)</p>
				<p>Now type <code>cd new-project</code> and click Enter to navigate to your new directory. (The "cd" command is short for "change directory.") This is where you'll  store all the files for your project.
				</p>
			</div>,//' REMOVE ME
		buttonText: 'Got it!',
		buttonFunction: function() {
			// Check whether the user has navigated into new-project. If so, currentDirectory will end with 'new-project'
			var endOfCurrentPath = currentDirectory.slice(-11);
			// console.log('endOfCurrentPath:', endOfCurrentPath);
			ipcRenderer.send('test-result-1', endOfCurrentPath === 'new-project');
		},
		errorMessage: "Oops! It looks like you haven't navigated into the 'new-project' directory. Try again and then click the button above."

	}, {
		lessonText:
			<div>
				<h2>Step 2: Set up a project</h2>
				<h3>Create a file</h3>
				<p>Now let's add a file to your folder.</p>
				<p>In the terminal, type <code>touch new-file.txt</code> and click Enter.</p>
				<p>Notice that we haven't been typing the word "git" in the commands we're using to create directories and files and to navigate through them. That's because these commands aren't specific to Git - but we'll get back to Git now!</p>
			</div>,
		buttonText: "OK, I'm ready for step three!",
		buttonFunction: function() {
			// For testing only
			// currentDirectory = '~/Desktop/new-project';
			// console.log('Check whether the user has created new-file.txt');
			var commandToRun = 'cd ' + currentDirectory + '; ls';
			ipcRenderer.send('command-to-run', commandToRun);
			ipcRenderer.once('terminal-output', function(event, arg) {
			// If the terminal-output contains 'new-file.txt', the user should pass.
{'fraction_non_alphanumeric': 0.12465884782769049, 'fraction_numerical': 0.005384672125101423, 'mean_word_length': 3.351091142490372, 'pattern_counts': {'":': 0, '<': 187, '<?xml version=': 0, '>': 189, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 6, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3079901', 'n_tokens_mistral': 4728, 'n_tokens_neox': 4113, 'n_words': 1705}