Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
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
4 changes: 2 additions & 2 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
<link rel="stylesheet" href="style.css">
</head>
<body>
<input class="starter" id="input" placeholder="input"/>
<input class="starter" id="input" placeholder="input a number"/>
<h2>output:</h2>
<p class="starter" id="output"></p>
<script>
Expand All @@ -16,4 +16,4 @@ <h2>output:</h2>
</script>
<script src="script.js"></script>
</body>
</html>
</html>
53 changes: 47 additions & 6 deletions script.js
Original file line number Diff line number Diff line change
@@ -1,11 +1,52 @@
console.log("hello script js");

//---------------------------------------------defined variables-------------------------------------------//
var totalEmojis = "";
var output = document.getElementById("output");
var emoji = "😼";

//-------------------------------------------------functions-----------------------------------------------//

//clear input value
var clearInput = function() {

document.getElementById("input").value = "";

}


// add emoji to total emojis and append to output in 'p'
var display = function(currentInput) {

var emojiRow = document.createElement("p");

for ( i = 0 ; i < currentInput ; i++ ) {

totalEmojis += emoji;

}

emojiRow.innerText = totalEmojis;

output.appendChild(emojiRow);

totalEmojis = "";

clearInput();

}


// clear output
var inputHappened = function(currentInput){

console.log( currentInput );
display( "WOW SOMETHING HAPPENED" );
};

var display = function(stuffToDisplay){
// your DOM manipulation code here

};
display(currentInput);

if ( currentInput === "clear" ){

document.querySelector("#output").innerHTML = "";
}

};
15 changes: 13 additions & 2 deletions style.css
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,17 @@
border:3px solid blue;
}

#output{
background-color:pink;
#input {
display: block;
margin: 0 auto;
text-align: center;
}

body {
text-align: center;
}

#output{
background-color: black;
text-align: center;
}