Skip to content

1st commit #13

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
LeviZ wants to merge 1 commit into
base: master
Choose a base branch
from
Open

1st commit #13

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
122 changes: 122 additions & 0 deletions Kate-Levi/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,122 @@
<html class="no-js">
Copy link

@litteredwitherrors litteredwitherrors Nov 9, 2014

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

In this document, please remove all unnecessary divs and blank lines.

<head>
<meta charset="utf-8">
<title>Where Are You Stuck?</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">

<link rel="stylesheet" href="normalize.min.css">
<link rel="stylesheet" href="style.css">
<script src="modernizr.custom.48296.js"></script>
</head>

<body>

<header>
<h1>Where Are You Stuck?</h1>
</header>
<div class="maincontent">
Copy link

@litteredwitherrors litteredwitherrors Nov 9, 2014

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Could we have used a more semantic tag here? well... everywhere.

<div class="form">
<form id="contact-form" action="/" method="post">
<h3>Who are you?</h3>
<h4>Be as specific as possible!</h4>
<div class="mainbox">
<div class="inside">
<div class="text">
<span class="cntct">Name: (required)</span>
Copy link

@litteredwitherrors litteredwitherrors Nov 9, 2014

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Needs to be a label. Please review. https://developer.mozilla.org/en-US/docs/Web/HTML/Element/label

</div>
<input id="name" placeholder="Please enter your name" type="text">
</div>

Copy link

@litteredwitherrors litteredwitherrors Nov 9, 2014

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Remove unnecessary lines like this one.

<div>
<div class="text">
<span class="cntct">Email: (required)</span>
</div>
<input id="email" placeholder="Please enter your email address" type="email">
</div>

<div>
<div class="text">
<span class="cntct">Class: (required)</span>
</div>
<input id="class" placeholder="Please enter your class name" type="tel">
</div>

<div>
<div class="text">
<span class="cntct">Phone: (required)</span>
</div>
<input id="number" placeholder="Please enter your number" type="tel">
</div>

<div class="buttons">
<button name="submit" type="submit" id="contact-submit">Send Information</button>
</div>
</div>
</form>
</div>


<div class="form">
Copy link

@litteredwitherrors litteredwitherrors Nov 9, 2014

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why do we need a form div if we already have a form?

<form id="contact-form" action="/" method="post">
<h3>Who are you?</h3>
<h4>Be as specific as possible!</h4>
<div class="mainbox">
<div class="inside">
<div class="text">
<span class="cntct">Name: (required)</span>
Copy link

@litteredwitherrors litteredwitherrors Nov 9, 2014

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is div madness! Also, a label is the proper use here. A span means nothing to an input.

</div>
<input id="name" placeholder="Please enter your name" type="text" </div>

<div>
<div class="text">
<span class="cntct">Email: (required)</span>
</div>
<input id="email" placeholder="Please enter your email address" type="email">
</div>

<div>
<div class="text">
<span class="cntct">Class: (required)</span>
</div>
<input id="class" placeholder="Please enter your class name" type="tel">
</div>

<div>
<div class="text">
<span class="cntct">Phone: (required)</span>
</div>
<input id="number" placeholder="Please enter your number" type="tel">
</div>

<div class="buttons">
<button name="submit" type="submit" id="contact-submit">Send Information</button>
</div>
</div>
</form>
</div>

</div>

<section class="imageupload">
<div class="screenshot">
<h4>Upload a screenshot</h4>
<input type="file" id="fileInput">
</div>

<div id="fileDisplayArea"></div>
</section>





<!-- Boilerplate -->

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="js/vendor/jquery-1.10.2.min.js"><\/script>')</script>


<script src="main.js"></script>
</body>
</html>
134 changes: 134 additions & 0 deletions Kate-Levi/main.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,134 @@
if (Modernizr.localstorage) {
// window.localStorage is available!
} else {
// no native support for HTML5 storage :(
// maybe try dojox.storage or a third-party solution
}






// $('#name').blur(function(){
// localStorage.setItem("name", $(this).val())
// });

// $('#email').blur(function(){
// localStorage.setItem("email", $(this).val())
// });

// $('#class').blur(function(){
// localStorage.setItem("class", $(this).val())
// });

// $('#number').blur(function(){
// localStorage.setItem("number", $(this).val())
// });

// $('#chapter').blur(function(){
// localStorage.setItem("chapter", $(this).val())
// });

// $('#heading').blur(function(){
// localStorage.setItem("heading", $(this).val())
// });

// $('#issue').blur(function(){
// localStorage.setItem("issue", $(this).val())
// });

// $('#goal').blur(function(){
// localStorage.setItem("goal", $(this).val())
// });


window.onload = function() {
var input1 = localStorage.getItem("name");
var input2 = localStorage.getItem("email");
var input3 = localStorage.getItem("class");
var input4 = localStorage.getItem("number");
var input5 = localStorage.getItem("chapter");
var input6 = localStorage.getItem("heading");
var input7 = localStorage.getItem("issues");
var input8 = localStorage.getItem("goal");

$("#name").val(input1);
$("#email").val(input2);
$("#class").val(input3);
$("#number").val(input4);
$("#chapter").val(input5);
$("#heading").val(input6);
$("#issues").val(input7);
$("#goal").val(input8);

}



//IMAGE FILE READER


window.onload = function() {


var input1 = localStorage.getItem("name");
var input2 = localStorage.getItem("email");
var input3 = localStorage.getItem("class");
var input4 = localStorage.getItem("number");
var input5 = localStorage.getItem("chapter");
var input6 = localStorage.getItem("heading");
var input7 = localStorage.getItem("issues");
var input8 = localStorage.getItem("goal");

$("#name").val(input1);
$("#email").val(input2);
$("#class").val(input3);
$("#number").val(input4);
$("#chapter").val(input5);
$("#heading").val(input6);
$("#issues").val(input7);
$("#goal").val(input8);

var fileInput = document.getElementById('fileInput');
var fileDisplayArea = document.getElementById('fileDisplayArea');

fileInput.addEventListener('change', function(e) {
var file = fileInput.files[0];
var imageType = /image.*/;

if (file.type.match(imageType)) {
var reader = new FileReader();

reader.onload = function(e) {
fileDisplayArea.innerHTML = "";

// Create a new image.
var img = new Image();
// Set the img src property using the data URL.
img.src = reader.result;

// Add the image to the page.
fileDisplayArea.appendChild(img);
}

reader.readAsDataURL(file);
} else {
fileDisplayArea.innerHTML = "File not supported!";
}
});
}



//Nick did it better below

// $(document).ready(function(){
// $('#contact-form input').each(function(){
// $(this).val(localStorage[$(this).attr('id')]);
// }).blur(function(){
// console.log($(this));
// localStorage.setItem($(this).attr('id'), $(this).val());
// });
// });

4 changes: 4 additions & 0 deletions Kate-Levi/modernizr.custom.48296.js
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Loading