Skip to content
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.

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

Primer code review - Fabiola González #23

Open
wants to merge 34 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
34 commits
Select commit Hold shift + click to select a range
7c52cce
Estas son las pruebas
DorsD Feb 7, 2020
1dc1f5e
funcion cipher en archivo pruebas
DorsD Feb 10, 2020
3335e48
first code review update
DorsD Feb 11, 2020
2d7cf20
changes: var for const/start coding index.js
DorsD Feb 11, 2020
31542d2
index.js first functions update
DorsD Feb 12, 2020
7d00dc7
radio buttons function update
DorsD Feb 12, 2020
ceab355
first try to call cipher object / offset validation
DorsD Feb 13, 2020
b0591ef
cipher object works in index.js / offset, textarea validations
DorsD Feb 13, 2020
cf39d6a
flex in css
DorsD Feb 14, 2020
be999c3
CSS styles
DorsD Feb 14, 2020
00918c2
clean function is working / added two icons
DorsD Feb 15, 2020
8238e81
Some hacker edition points: uppercase, lowercase, numbers, negative o…
DorsD Feb 17, 2020
0b7d021
last validation functions
DorsD Feb 17, 2020
6406667
Images for readme edition
DorsD Feb 17, 2020
2209c32
Update README.md
DorsD Feb 17, 2020
c5910f0
Update README.md
DorsD Feb 17, 2020
9f5be3d
last images edition for readme
DorsD Feb 17, 2020
a707f8f
readme images edition
DorsD Feb 17, 2020
79f9c7c
Update README.md
DorsD Feb 17, 2020
c4aa51b
Update README.md
DorsD Feb 17, 2020
d1e814f
Update README.md
DorsD Feb 17, 2020
f99b4a6
Update README.md
DorsD Feb 17, 2020
7e2f1c9
Update README.md
DorsD Feb 17, 2020
20dbc85
Update README.md
DorsD Feb 17, 2020
2d254f8
Update README.md
DorsD Feb 17, 2020
c2e7616
Update README.md
DorsD Feb 17, 2020
a14e406
Update README.md
DorsD Feb 17, 2020
3a0dd86
Update README.md
DorsD Feb 17, 2020
b273806
Update README.md
DorsD Feb 18, 2020
b7487b0
new file (docs) for gh-pages
DorsD Feb 19, 2020
1a2d4be
for gh-pages
DorsD Feb 19, 2020
ce9fc61
docs without src file for gh-pages
DorsD Feb 19, 2020
863e325
small orthographic update
DorsD Feb 19, 2020
a76d34a
Update README.md
DorsD Mar 27, 2020
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
Binary file added src/images/irisLogo_dark.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added src/images/irisLogo_image.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added src/images/irisLogo_light.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
58 changes: 52 additions & 6 deletions src/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -2,13 +2,59 @@
<html>
<head>
<meta charset="utf-8">
<title>Caesar Cipher</title>
<title>iris</title>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<div id="root">
<h1>Hello world!</h1>
</div>
<script src="index.js" type="module"></script>
<section>
<header>
<figure>
<img class="logo" src="images/irisLogo_light.png" alt="iris_logo">
</figure>
</header>
<div>
<label class="switch">
<input id ="bluetoothSwitch" type="checkbox">
<span class="slider round"></span>
<label id ="bluetoothLabel" for="bluetoothSwitch">Bluetooth</label>
</label>
</div>
<div>
<select id="contacts" placeholder="Contactos">
<option value="contactsTitle">Contactos en rango</option>
<option value="ana1">Ana 50m</option>
<option value="jose1">José 100m</option>
<option value="juan1">Juan 160m</option>
<option value="maria1">María 230m</option>
</select>
</div>
<div class="configBox">
<div>
<input type="radio" name="cipherSelector" value="cipher" id="cipher">
<label for="cipher">Cifrar</label><br>
<input type="radio" name="cipherSelector" value="decipher" id="decipher">
<label for="decipher">Descifrar</label>
</div>
<div>
<label for="offset">Offset</label><br>
<input id="offset" type="text" >
</div>
</div>
<div>
<textarea id="inputText" cols="30" rows="5" placeholder="Mensaje"></textarea>
</div>
<div>
<button id="cleanButton" type="button">Limpiar</button>
<button id="lookButton" type="button">Ver</button>
</div>
<div>
<textarea id="" cols="30" rows="5"></textarea>
</div>
<div>
<button id="sendButton" type="button">Enviar</button>
</div>
</section>
<!--<script src="index.js" type="module"></script>-->
<script src="pruebas.js" type="text/javascript"></script>
</body>
</html>
</html>
34 changes: 34 additions & 0 deletions src/pruebas.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,34 @@

//var inputText= "Este es un texto de prueba.";
var inputText= "FTUF FT VO UFYUP EF QSVFCB";
var offset = -1;
var outputText = [];

console.log("texto:"+inputText+" - "+"offset:"+offset);
cipher(inputText, offset, outputText);
//console.log(cipheredLetter);
console.log(outputText.join(""));

function cipher(){

for (i in inputText){
var letterOriginal= inputText.charAt(i);
var letter = letterOriginal.toUpperCase();
var letterCode = letter.charCodeAt();
var letterCodeNumber = parseInt(letterCode);
if(letterCodeNumber == 32){

Choose a reason for hiding this comment

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

Es importante cambiar var por let o const (la mayoría pide const aunque no hay gran diferencia entre let y const es un debate) pero var compromete tu código, ya no lo uses.

codeNumberCiphered = letterCodeNumber;
}else{
codeNumberCiphered = (letterCodeNumber-65+offset)%26+65;
}
var cipheredLetter = String.fromCharCode(codeNumberCiphered);

Choose a reason for hiding this comment

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

let

console.log(letter+" "+letterCode+" "+codeNumberCiphered+" "+cipheredLetter);

Choose a reason for hiding this comment

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

de preferencia crea una variable que almacene todo esto y despues solo le das al console log la variable

//return cipheredLetter;
outputText.push(cipheredLetter);
}
return outputText;
//console.log("texto cifrado:"+outputText.join(""));
/* var outputText = ["Que"];
var outputText = outputText.push(cipheredLetter);
console.log("texto cifrado:"+outputText);*/
}
92 changes: 92 additions & 0 deletions src/style.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,92 @@
html, body{
margin:0;
padding:0;
background-color: #c7e6e6;
text-align: center;
display: inline-block;
height: 100%;
vertical-align:middle;

}

section{
border: 1px solid black;
margin: 0 auto;
height: 100%;
}

.logo{
width: 15%;
}

#bluetoothLabel{
float: left;
}

.configBox{
display: inline-block;
}

/* Estilo para toogle switch que activa el Bluetooth */
/* The switch - the box around the slider */
.switch {
position: relative;
display: inline-block;
width: 60px;
height: 34px;
}

/* Hide default HTML checkbox */
.switch input {
opacity: 0;
width: 0;
height: 0;
}

/* The slider */
.slider {
position: absolute;
cursor: pointer;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #ccc;
-webkit-transition: .4s;
transition: .4s;
}

.slider:before {
position: absolute;
content: "";
height: 26px;
width: 26px;
left: 4px;
bottom: 4px;
background-color: white;
-webkit-transition: .4s;
transition: .4s;
}

input:checked + .slider {
background-color: #2196F3;
}

input:focus + .slider {

Choose a reason for hiding this comment

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

Esto es muy específico y está bien, pero puede fallar, mejor usa el selector de descendente (espacio) en vez del + para que sea más seguro

box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
-webkit-transform: translateX(26px);
-ms-transform: translateX(26px);
transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
border-radius: 34px;
}

.slider.round:before {
border-radius: 50%;
}