diff --git a/address.json b/address.json index 352927d..b5fd37e 100644 --- a/address.json +++ b/address.json @@ -1,66 +1,60 @@ [ + { - "ip": "94.198.99.82" , + "ip": "18:36:F3:98:4F:9A" , "date": "2018-12-25" }, { - "ip":"123.125.67.160" , + "ip": "2a0a:e5c0:0:2:400:b3ff:fe39:7959" , + "date": "2018-12-25" + }, + { + "ip":"2a0a:e5c0:2:2:400:c8ff:fe68:bed1" , "date":"2018-12-26" }, { - "ip":"123.125.67.165", + "ip": "18:36:F3:98:4F:9A" , + "date": "2018-12-25" + }, + { + "ip":"2a0a:e5c0:2:5:3106:3977:2f62:5c3c", "date":"2018-12-27" }, { - "ip":"123.125.67.121", + "ip":"2a0a:e5c0:0:2:400:b3ff:fe39:7959", "date":"2018-12-28" }, { - "ip": "94.198.99.82" , - "date": "2018-12-29" + "ip": "18:36:F3:98:4F:9A" , + "date": "2018-12-25" }, { - "ip":"123.125.67.160" , - "date":"2018-12-30" - }, - { - "ip":"123.125.67.165", - "date":"2018-12-31" - }, - { - "ip":"123.125.67.121", + "ip":"2001:0db8:85a3:0000:0000:8a2e:0370:7334", "date":"2018-01-01" }, { - "ip": "94.198.99.82" , + "ip": "2a0a:e5c0:2:2:400:c8ff:fe68:bed1" , + "date": "2018-12-29" + }, + { + "ip":"2a0a:e5c0:2:2:400:c8ff:fe68:bed1" , + "date":"2018-12-30" + }, + { + "ip": "18:36:F3:98:4F:9A" , + "date": "2018-12-25" + }, + { + "ip":"2a0a:e5c0:0:2:400:b3ff:fe39:7959", + "date":"2018-12-31" + }, + { + "ip":"2a0a:e5c0:2:2:400:c8ff:fe68:bed1", + "date":"2018-01-01" + }, + { + "ip": "2a0a:e5c0:0:2:400:b3ff:fe39:7959" , "date": "2018-01-01" - }, - { - "ip":"123.125.67.160" , - "date":"2018-01-02" - }, - { - "ip":"123.125.67.165", - "date":"2018-01-03" - }, - { - "ip":"123.125.67.121", - "date":"2018-01-04" - },{ - "ip": "94.198.99.82" , - "date": "2018-12-16" - }, - { - "ip":"123.125.67.160" , - "date":"2018-12-18" - }, - { - "ip":"123.125.67.165", - "date":"2018-12-01" - }, - { - "ip":"123.125.67.121", - "date":"2018-12-02" } ] diff --git a/app.js b/app.js index bf35697..64cff02 100644 --- a/app.js +++ b/app.js @@ -1,55 +1,77 @@ -let addresses = [] -let date = [] -let ipv4_v6 = [] +const IPV4_EX = new RegExp("") +const regex = RegExp("^((25[0–5]|2[0–4][0–9]|[01]?[0–9][0–9]?).(25[0–5]|2[0–4][0–9]|[01]?[0–9][0–9]?).(25[0–5]|2[0–4][0–9]|[01]?[0–9][0–9]?).(25[0–5]|2[0–4][0–9]|[01]?[0–9][0–9]?))|((([0–9A-Fa-f]{1,4}:){7}[0–9A-Fa-f]{1,4})|(([0–9A-Fa-f]{1,4}:){6}:[0–9A-Fa-f]{1,4})|(([0–9A-Fa-f]{1,4}:){5}:([0–9A-Fa-f]{1,4}:)?[0–9A-Fa-f]{1,4})|(([0–9A-Fa-f]{1,4}:){4}:([0–9A-Fa-f]{1,4}:){0,2}[0–9A-Fa-f]{1,4})|(([0–9A-Fa-f]{1,4}:){3}:([0–9A-Fa-f]{1,4}:){0,3}[0–9A-Fa-f]{1,4})|(([0–9A-Fa-f]{1,4}:){2}:([0–9A-Fa-f]{1,4}:){0,4}[0–9A-Fa-f]{1,4})|(([0–9A-Fa-f]{1,4}:){6}((b((25[0–5])|(1d{2})|(2[0–4]d)|(d{1,2}))b).){3}(b((25[0–5])|(1d{2})|(2[0–4]d)|(d{1,2}))b))|(([0–9A-Fa-f]{1,4}:){0,5}:((b((25[0–5])|(1d{2})|(2[0–4]d)|(d{1,2}))b).){3}(b((25[0–5])|(1d{2})|(2[0–4]d)|(d{1,2}))b))|(::([0–9A-Fa-f]{1,4}:){0,5}((b((25[0–5])|(1d{2})|(2[0–4]d)|(d{1,2}))b).){3}(b((25[0–5])|(1d{2})|(2[0–4]d)|(d{1,2}))b))|([0–9A-Fa-f]{1,4}::([0–9A-Fa-f]{1,4}:){0,5}[0–9A-Fa-f]{1,4})|(::([0–9A-Fa-f]{1,4}:){0,6}[0–9A-Fa-f]{1,4})|(([0–9A-Fa-f]{1,4}:){1,7}:))$") -//Fetch call to get data from addresses json file -fetch('./address.json').then(response => { - return response.json(); - }).then(data => { - data.sort(function(a,b){ - return new Date(a.date) - new Date(b.date); - }); +var addresses = [] +var date = [] +var ipv4_v6 = [] + +function Ip4OrIp6(ipAddress){ + console.log(ipAddress) + console.log(regex.test(ipAddress)); +} + +// Refactor getStudents and getScores to return Promise for their response bodies +function getData(){ + return fetch(`address.json`, { + headers: { + 'Content-Type': 'application/json', + 'Accept': 'application/json' + } + }).then((response) => response.json()) +}; + +getData().then((data)=>{ data.forEach(element => { date.push(element.date) - }) -}).catch(err => { - console.log(err); -}); -console.log(date); + }); -var ctx = document.getElementById("myChart").getContext('2d'); -var myChart = new Chart(ctx, { - type: 'bar', - data: { - labels:date, - datasets: [{ - label: 'Ipv4 and Ipv6 routin protocols used ', - data: [1 , -1 ,1 , -1 ,1 , -1 ,1 , -1 ,1 , -1 ,1 , -1 ,1 , -1 ,1 ,1], - borderWidth: 1 - }] - }, - options: { - - scales: { - - yAxes: [{ - ticks: { - beginAtZero:true - } - }] + console.log(date); + + data.forEach(element => { + Ip4OrIp6(element.ip) + }) + console.log(ipv4_v6) + var ctx = document.getElementById("myChart").getContext('2d'); + var chart = new Chart(ctx, { + type: 'line', + data: { + labels:date , + datasets: [{ + label: "Statistics for IPV4 and IPV6", + data: ipv4_v6, + } + ] + }, + options: { + legend: { display: false }, + title: { + display: true, + text: 'Statistics for IPV4 and IPV6' } - }, - plugins: [{ - beforeInit: function(chart) { - var time = chart.options.scales.xAxes[0].time, // 'time' object reference - // difference (in days) between min and max date - timeDiff = moment(time.max).diff(moment(time.min), 'd'); - // populate 'labels' array - // (create a date string for each date between min and max, inclusive) - for (i = 0; i <= timeDiff; i++) { - var _label = moment(time.min).add(i, 'd').format('YYYY-MM-DD HH:mm:ss'); - chart.data.labels.push(_label); - } } - }] -}); + }) +}) +//Fetch call to get data from addresses json file +// async function retrieveIpAdresses(){ +// await fetch('./address.json').then(response => { +// response.json(); +// }).then(data => { +// data.forEach(element=>{ +// console.log(element) +// date.push(element.date) +// }) +// }).catch(err => { +// err = err +// }); + +// } + + + + + + + + + + diff --git a/index.htm b/index.htm index efd8279..0f33f3b 100644 --- a/index.htm +++ b/index.htm @@ -5,7 +5,7 @@ - + Test @@ -13,14 +13,10 @@ - - - - - diff --git a/style/style.css b/style/style.css index e69de29..8c9564c 100644 --- a/style/style.css +++ b/style/style.css @@ -0,0 +1,3 @@ +#myChart { + height: 85vh!important; +} \ No newline at end of file