Skip to content

Commit 93d391d

Browse files
alexmanchenoalexmancheno
committed
Finished assignment 3
1 parent 4f278b7 commit 93d391d

File tree

2 files changed

+74
-35
lines changed

2 files changed

+74
-35
lines changed

‎src/components/Assignment3/UserInput.js

Lines changed: 71 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import React from 'react';
22
import autoBind from 'react-autobind';
3+
import style from './style.css';
34

45
export default class UserInput extends React.Component {
56
constructor(props) {
@@ -14,9 +15,11 @@ export default class UserInput extends React.Component {
1415
numberOfNetworksNeeded: 0,
1516
generatedIPAddress: "",
1617
ipAddressInBinary: "",
18+
IPv6AddressInColonHex: "",
19+
IPv6AddressInBinary: "",
1720
addresses: JSON.stringify(addresses)
1821
}
19-
localStorage.clear();
22+
// localStorage.clear();
2023
}
2124

2225
handleclassNameChange(event) {
@@ -63,24 +66,28 @@ export default class UserInput extends React.Component {
6366
let randomAddress;
6467
let binaryString;
6568
let r = 0;
69+
let subnetMask = 0;
6670
do {
6771
if (this.state.classful) {
6872
if (this.state.classNameValue === "A") {
69-
r = (this.getRandomInt(128)) << 24;
73+
subnetMask = 24;
74+
r = (this.getRandomInt(128)) << subnetMask;
7075
binaryString = r.toString(2);
7176
while (binaryString.length < 31)
7277
binaryString = "0" + binaryString;
7378
binaryString = "0" + binaryString;
7479

7580
} else if (this.state.classNameValue === "B") {
76-
r = (this.getRandomInt(16384)) << 16;
81+
subnetMask = 16;
82+
r = (this.getRandomInt(16384)) << subnetMask;
7783
binaryString = r.toString(2);
7884
while (binaryString.length < 30)
7985
binaryString = "0" + binaryString;
8086
binaryString = "10" + binaryString;
8187

8288
} else if (this.state.classNameValue === "C") {
83-
r = (this.getRandomInt(2097152)) << 8;
89+
subnetMask = 8;
90+
r = (this.getRandomInt(2097152)) << subnetMask;
8491
binaryString = r.toString(2);
8592
while (binaryString.length < 29)
8693
binaryString = "0" + binaryString;
@@ -94,24 +101,28 @@ export default class UserInput extends React.Component {
94101

95102
} else if (this.state.classNameValue === "E") {
96103
this.setState({generatedIPAddress: "Cannot assign class E addressses!"});
97-
this.setState({ ipAddressInBinary: "Cannot assign class E addressses!" });
104+
this.setState({ ipAddressInBinary: "Cannot assign class E addressses!"});
98105
return;
99106
}
100107
} else {
101-
if (this.state.numberOfHostsNeeded === 0) return;
108+
let numberOfHostsNeeded = this.state.numberOfHostsNeeded;
109+
if (numberOfHostsNeeded === 0 || numberOfHostsNeeded == "") return;
102110
let suffixBits = Math.ceil(Math.log2(this.state.numberOfHostsNeeded));
103-
r = this.getRandomInt(Math.pow(2, 32 - suffixBits));
111+
subnetMask = 32 - suffixBits;
112+
r = this.getRandomInt(Math.pow(2, subnetMask));
104113
r = r << (suffixBits);
105114
binaryString = r.toString(2);
106115
if (binaryString[0] === '-') binaryString = binaryString.substr(1);
107-
while (binaryString.length < 32)
116+
while (binaryString.length < 32) {
108117
binaryString = "0" + binaryString;
118+
this.sleep(1000);
119+
}
109120
}
110121

111-
} while ((r in map)) ;
122+
} while (r in map) ;
123+
112124
map[r] = true;
113-
114-
randomAddress = this.intToIPAddressString(r);
125+
randomAddress = this.intToIPAddressString(r) + "/" + subnetMask.toString();
115126
this.setState({generatedIPAddress: randomAddress});
116127
this.setState({ipAddressInBinary: binaryString});
117128

@@ -121,7 +132,6 @@ export default class UserInput extends React.Component {
121132
generateIPv6Address() {
122133
let numberOfNetworksNeeded = this.state.numberOfNetworksNeeded;
123134
let zeroCompression = this.state.zeroCompression;
124-
// console.log(`numberOfHostsNeeded: ${numberOfNetworksNeeded}\nzeroCompression: ${zeroCompression}`);
125135

126136
let map;
127137
if (localStorage.getItem("IPv6Addresses") !== null) {
@@ -137,29 +147,54 @@ export default class UserInput extends React.Component {
137147
}
138148

139149
let suffixBits = 64 - networkBits;
150+
let randomNumber = 0;
151+
let result;
152+
do {
153+
randomNumber = this.getRandomInt(Math.pow(2, suffixBits));
154+
for (let i = randomNumber.toString(2).length; i < 64; i++) {
155+
randomNumber = randomNumber * 2;
156+
}
140157

141-
let randomNumber = this.getRandomInt(Math.pow(2, suffixBits));
142-
for (let i = randomNumber.toString(2).length; i < 64; i++) {
143-
randomNumber = randomNumber * 2;
144-
}
158+
let hexString = randomNumber.toString(16);
159+
result = "";
145160

146-
let hexString = randomNumber.toString(16);
147-
let result = "";
161+
let count = 0;
162+
for (let i = 0; i < hexString.length; ) {
163+
if (count === 4) {
164+
result += ":";
165+
count = 0;
166+
} else {
167+
let c = hexString.charAt(i);
168+
result += c;
169+
count++;
170+
i++;
171+
}
172+
}
173+
result += ":0000:0000:0000:0000";
174+
175+
let array = result.split(":");
176+
let compressed = "::";
177+
let foundNonZeroes = false;
178+
if (zeroCompression) {
179+
for (let i = array.length - 1; i >= 0; i--) {
180+
let s = array[i];
181+
if (s !== "0000" || foundNonZeroes) {
182+
compressed = ":" + parseInt(s, 16).toString(16) + compressed;
183+
foundNonZeroes = true;
184+
}
185+
}
148186

149-
let count = 0;
150-
for (let i = 0; i < hexString.length; ) {
151-
if (count === 4) {
152-
result += ":";
153-
count = 0;
154-
} else {
155-
let c = hexString.charAt(i);
156-
result += c;
157-
count++;
158-
i++;
187+
result = compressed.substr(1);
159188
}
160-
}
161-
result += ":0000:0000:0000:0000";
162-
console.log(result);
189+
190+
result += "/" + (64 - networkBits).toString();
191+
} while (result in map) ;
192+
193+
map[result] = true;
194+
localStorage.setItem("IPv6Addresses", JSON.stringify(map));
195+
196+
this.setState({IPv6AddressInColonHex: result});
197+
this.setState({IPv6AddressInBinary: randomNumber.toString(2)});
163198
}
164199

165200
intToIPAddressString(ip) {
@@ -219,11 +254,11 @@ export default class UserInput extends React.Component {
219254
<div>
220255
<div className="form-group">
221256
<label htmlFor="exampleFormControlInput1">Your IPv4 address in decimal:</label>
222-
<input className="form-control" type="text" name="country" value={this.state.generatedIPAddress} readOnly />
257+
<input className={"form-control " + style.courier} type="text" name="country" value={this.state.generatedIPAddress} readOnly />
223258
</div>
224259
<div className="form-group">
225260
<label htmlFor="exampleFormControlInput1">Your IPv4 address in binary:</label>
226-
<input className="form-control" type="text" name="country" value={this.state.ipAddressInBinary} readOnly />
261+
<input className={"form-control " + style.courier} type="text" name="country" value={this.state.ipAddressInBinary} readOnly />
227262
</div>
228263
</div>
229264
</div>
@@ -263,11 +298,11 @@ export default class UserInput extends React.Component {
263298
<div>
264299
<div className="form-group">
265300
<label htmlFor="exampleFormControlInput1">Your IPv6 address in colon hex:</label>
266-
<input className="form-control" type="text" name="country" value={this.state.generatedIPAddress} readOnly />
301+
<input className={"form-control " + style.courier} type="text" name="country" value={this.state.IPv6AddressInColonHex} readOnly />
267302
</div>
268303
<div className="form-group">
269304
<label htmlFor="exampleFormControlInput1">Your IPv6 address in binary:</label>
270-
<input className="form-control" type="text" name="country" value={this.state.ipAddressInBinary} readOnly />
305+
<input className={"form-control " + style.courier} type="text" name="country" value={this.state.IPv6AddressInBinary} readOnly />
271306
</div>
272307
</div>
273308
</div>
@@ -285,6 +320,7 @@ export default class UserInput extends React.Component {
285320
</ul>
286321

287322
<div className="tab-content">
323+
<br></br>
288324
<div id="IPv4Tab" className="tab-pane fade in active">
289325
{this.getIPv4TabContent()}
290326
</div>

‎src/components/Assignment3/style.css

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
.courier {
2+
font-family: "Courier New"
3+
}

0 commit comments

Comments
 (0)