From 9185988f832c065b8e41ab9449d175db896239c6 Mon Sep 17 00:00:00 2001 From: Camerin Figueroa Date: Mon, 8 Nov 2021 16:02:02 -0500 Subject: [PATCH 01/24] Removed Navigation hiding Navigation no longer hides at visit to the site --- src/actions/index.js | 16 -------- src/components/Intro.js | 10 +---- src/components/Navigation.js | 61 +++++++++++++------------------ src/reducers/index.js | 2 - src/reducers/navigationReducer.js | 11 ------ 5 files changed, 27 insertions(+), 73 deletions(-) delete mode 100644 src/reducers/navigationReducer.js diff --git a/src/actions/index.js b/src/actions/index.js index afa02d8..e3bd052 100644 --- a/src/actions/index.js +++ b/src/actions/index.js @@ -71,20 +71,4 @@ export const setIntro = (start=true) => async (dispatch, getState) => { type: 'SET_INTRO', payload: start, }); -} - -export const hideNavigation = () => async (dispatch, getState) => { - - dispatch({ - type: 'SET_NAVIGATION', - payload: false, - }); -} - -export const showNavigation = () => async (dispatch, getState) => { - - dispatch({ - type: 'SET_NAVIGATION', - payload: true, - }); } \ No newline at end of file diff --git a/src/components/Intro.js b/src/components/Intro.js index e392a5a..d3f13c0 100644 --- a/src/components/Intro.js +++ b/src/components/Intro.js @@ -1,7 +1,6 @@ import React from 'react'; import { connect } from 'react-redux'; import './css/Intro.css'; -import {hideNavigation, showNavigation} from '../actions'; import Topic from './subcomponents/Topic'; import { ChevronDoubleUp, ChevronDoubleDown } from 'react-bootstrap-icons'; @@ -108,8 +107,6 @@ class Intro extends React.Component { } else if (input === "down" && this.state.nextLoc >= this.topics.length) { // Set something to happen when you reach the end - this.props.showNavigation(); - localStorage.setItem('intro', true); } }; @@ -123,11 +120,6 @@ class Intro extends React.Component { document.title = "HomePage"; // Set document title - // Hide the navigation - if (!localStorage.getItem('intro')) { - this.props.hideNavigation(); - } - } // Topics to display in intro @@ -178,4 +170,4 @@ const mapStateToProps = (state) => { } -export default connect(mapStateToProps, {hideNavigation, showNavigation})(Intro); +export default connect(mapStateToProps, {})(Intro); diff --git a/src/components/Navigation.js b/src/components/Navigation.js index fd3f365..765e0cf 100644 --- a/src/components/Navigation.js +++ b/src/components/Navigation.js @@ -1,45 +1,36 @@ import React from 'react'; import { Link } from 'react-router-dom'; -import { connect } from 'react-redux'; -import {toggleContactModal} from '../actions' import './css/Navigation.css'; import { HouseDoor, FileEarmarkPerson, Github, Envelope, Book } from 'react-bootstrap-icons'; import ContactModal from './subcomponents/ContactModal'; const Navigation = (props) => { - if (props.enable){ - return ( -
- - Home - - - - Github - - - - Articles - - - - About - - - - -
- ); - } + return ( +
+ + Home + + + + Github + + + + Articles + + + + About + + + + +
+ ); - return
; } -const mapStateToProps = (state) => { - return {modal: state.contactModal.contactModal, enable: state.navigation.enable}; -} - -export default connect(mapStateToProps, {toggleContactModal})(Navigation); +export default Navigation; diff --git a/src/reducers/index.js b/src/reducers/index.js index c7375a8..1561232 100644 --- a/src/reducers/index.js +++ b/src/reducers/index.js @@ -3,13 +3,11 @@ import { combineReducers } from "redux"; import githubReducer from './githubReducer'; import contactModalReducer from "./contactModalReducer"; import introReducer from "./introReducer"; -import navigationReducer from "./navigationReducer"; import articlesReducer from "./articlesReducer"; export default combineReducers({ github: githubReducer, contactModal: contactModalReducer, intro: introReducer, - navigation: navigationReducer, articles: articlesReducer, }); diff --git a/src/reducers/navigationReducer.js b/src/reducers/navigationReducer.js deleted file mode 100644 index 44d22df..0000000 --- a/src/reducers/navigationReducer.js +++ /dev/null @@ -1,11 +0,0 @@ -let navigationReducer = (state={enable: true}, action) => { - switch(action.type) { - case 'SET_NAVIGATION': - return { ...state, enable: action.payload }; - default: - return state; - } - }; - - -export default navigationReducer; \ No newline at end of file From b43efd229dfd2a1d1bbe184894c973d16c84aa9f Mon Sep 17 00:00:00 2001 From: Camerin Figueroa Date: Mon, 15 Nov 2021 12:45:46 -0500 Subject: [PATCH 02/24] Replaced modal code in Navigation.js --- src/components/Navigation.js | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/src/components/Navigation.js b/src/components/Navigation.js index 765e0cf..f5745aa 100644 --- a/src/components/Navigation.js +++ b/src/components/Navigation.js @@ -1,5 +1,7 @@ import React from 'react'; import { Link } from 'react-router-dom'; +import { connect } from 'react-redux'; +import {toggleContactModal} from '../actions' import './css/Navigation.css'; import { HouseDoor, FileEarmarkPerson, Github, Envelope, Book } from 'react-bootstrap-icons'; import ContactModal from './subcomponents/ContactModal'; @@ -33,4 +35,8 @@ const Navigation = (props) => { } -export default Navigation; +const mapStateToProps = (state) => { + return {modal: state.contactModal.contactModal}; +} + +export default connect(mapStateToProps, {toggleContactModal})(Navigation); \ No newline at end of file From 597b4efca69245b30e7f2f371ded71830b6a4d55 Mon Sep 17 00:00:00 2001 From: Camerin Figueroa Date: Mon, 15 Nov 2021 14:49:32 -0500 Subject: [PATCH 03/24] Added support for Lists in articles --- src/components/Article.js | 16 +++++++--------- src/components/css/Articles.css | 4 ++++ 2 files changed, 11 insertions(+), 9 deletions(-) diff --git a/src/components/Article.js b/src/components/Article.js index 4fa9c40..6b32443 100644 --- a/src/components/Article.js +++ b/src/components/Article.js @@ -8,19 +8,16 @@ const Article = ({article}) => { let type = []; let ind = 0; let tick=false; - let delimiters = ['', '`', '*']; + let delimiters = ['', '`', '*', '~']; for (let i = 0; i < text.length; i++) { // Iterate through input - console.log(text[i]); if (delimiters.indexOf(text[i]) !== -1) { // Detect Code Delimiter if (tick) { // Close the code section - console.log(1); output[++ind] = "" tick = false; } else { // Start a new code section - console.log(2); type.push(delimiters.indexOf(text[i])); if (!output[ind]) { @@ -44,16 +41,12 @@ const Article = ({article}) => { } - console.log(3); output[ind] += text[i] } } - console.log(output); - console.log(type); - return [...output.keys()].map((i)=>{ // Format text and return as jsx @@ -69,7 +62,12 @@ const Article = ({article}) => { return
{output[i]}
; - }else { + } else if (type[i] === 3) { + + return
  • {output[i]}
    • ; + + + } else { return
    ; } }); diff --git a/src/components/css/Articles.css b/src/components/css/Articles.css index ca63e41..67d3742 100644 --- a/src/components/css/Articles.css +++ b/src/components/css/Articles.css @@ -23,4 +23,8 @@ font-weight:bolder; margin-top: 10px; margin-bottom: 10px; +} + +.article .li { + margin-left: 10px; } \ No newline at end of file From 6503a90fa240dbdad2c410bee826dff45cc1f59b Mon Sep 17 00:00:00 2001 From: Camerin Figueroa Date: Mon, 15 Nov 2021 14:49:49 -0500 Subject: [PATCH 04/24] Added new steganography article --- public/api/articles.json | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/public/api/articles.json b/public/api/articles.json index 95ac975..40c02a2 100644 --- a/public/api/articles.json +++ b/public/api/articles.json @@ -5,6 +5,12 @@ "title": "Printing in Python", "desc":"How to print to the terminal in python", "contents": "*Introduction* This is my tutorial on how to print in python3. The print function is an easy way to show your users important information, design menus, and more. The print command is simple in it's usage. First you want to open a python interpreter. Next type the following: `print('Hello World')` After that you Hello World printed to the screen. You can check out more articles by scrolling down to the list of articles on this page." + }, + { + "id": 1, + "title": "Hiding Data on Linux", + "desc": "Showing you how to hide files within a file in linux.", + "contents":"*Steganography*Steganography is the art or practice of concealing a message, image or file within another message, image or file. There are many techniques to perform steganography, one of which is to hide messages on physical paper in the physical world. Another technique involves hiding messages in digital images or digital data, also called digital messages. Images are the typical victim used to hide information. Social steganography is when messages are hidden in the title and context of a video or image. Names or words may be misspelled that are popular in a given time to suggest alternative meanings, or pictures can be traced by paint or drawing tools. When information is hidden in telecommunication networks, this is called network steganography. Today steganography is mostly done on computers with tools such as steghide, stegstudio and more. One simple way of doing so is on linux, by combining a zip file and an image in order to hide the in the back part of the image file.*Hiding Files Inside of a JPG File* You can first download an image that you'd like to use. Next, you'll create a file to hide. You can use anything, given that it can be hidden within a zip. I'm using a text file called steg.txt. Next, you'll want to compress the file. You can do this in the terminal by running the following. `zip zipfile.zip steg.txt` Now that you have a zip file you can now hide the file. We'll do this by using the cat command. This command will combine the data within two files, and allow us to create a new file with the data concatenated. Run the following command using image.jpg as our image file and zipfile as the zip we just created. If you have a file with a different file extension (I.E. .jpg, .png) change StegFile.jpg to reflect this change in addition to the original image file. `cat image.jpg zipfile.zip > StegFile.jpg` Now that everything is combined, you can attempt to view the StegFile.jpg image to see if you've correctly combined the two files. If you'd like to get the files out of the zip/steg file, you can then run the following on the image. `unzip StegFile.jpg` As you can see, it just unzipped the steg.txt from the image and placed it in the current directory. *Conclusion* Steganography is an interesting concept, especially revolving computer forensics and can be used to hide files and make interesting puzzles. *Sources* ~ https://www.merriam-webster.com/dictionary/steganography ~ ~ https://en.wikipedia.org/wiki/Steganography#Techniques ~ ~ http://steghide.sourceforge.net/ ~ ~ http://stegstudio.sourceforge.net/ ~" } ] } \ No newline at end of file From 6f4addd6bcb956c42a1fee2c43bbc1db14530ad4 Mon Sep 17 00:00:00 2001 From: Camerin Figueroa Date: Mon, 15 Nov 2021 14:51:55 -0500 Subject: [PATCH 05/24] Added readaibility improvements to articles --- src/components/css/Articles.css | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/src/components/css/Articles.css b/src/components/css/Articles.css index 67d3742..8851b24 100644 --- a/src/components/css/Articles.css +++ b/src/components/css/Articles.css @@ -8,20 +8,21 @@ .article .content { width: 80vw; text-align:left; + line-height: 1.5; } .article .code { padding: 10px; background-color: #3A3B3B; - color: gray; + color: lightgray; border-radius: 5px; - margin: 10px; + margin: 20px; } .article .h1 { font-size: 24px; font-weight:bolder; - margin-top: 10px; + margin-top: 20px; margin-bottom: 10px; } From 1c22825ff8f025cb919e8e6d4a39f50631e99c07 Mon Sep 17 00:00:00 2001 From: Camerin Figueroa Date: Mon, 15 Nov 2021 15:19:38 -0500 Subject: [PATCH 06/24] Added link support to articles --- src/components/Article.js | 52 +++++++++++++++++++++++++++------ src/components/css/Articles.css | 4 +++ 2 files changed, 47 insertions(+), 9 deletions(-) diff --git a/src/components/Article.js b/src/components/Article.js index 6b32443..3f2a4a2 100644 --- a/src/components/Article.js +++ b/src/components/Article.js @@ -3,12 +3,45 @@ import Theater from './subcomponents/Theater'; import './css/Articles.css'; const Article = ({article}) => { + let linkProcessor = (text) => { + /** + * Given some text, processes and returns jsx with any link represented as an anchor + */ + + let output = [""]; // Stores all text in a list + let loc = 0; // Stores the current location in output that we're working with + + for (let i = 0; i < text.length; i++) { // Iterate through the entire text string + if (text.slice(i, i+4) === "http"){ // slice from i to 4 chars plus and check for http + let x = i; // store i in x so the location is not modified + + for (i; text[i] != " " && i < text.length; i++){} // iterate until we find the end of the link denoted by a space + + if (output[loc] !== "") { // if the current output location isn't empty, increment loc + loc++; + } + + // Put anchor for link into output list + output[loc] = {text.slice(x, i)}; + output[++loc] = ""; // Create new location in output with empty string + + } else { + // Append current char to output + output[loc] += text[i]; + + } + } + + // Return the output + return output; + }; + let articleFormatter = (text) => { - let output = []; - let type = []; - let ind = 0; - let tick=false; - let delimiters = ['', '`', '*', '~']; + let output = []; // Used to store separate formatted text + let type = []; // Parallel to output list to signify format type + let ind = 0; // Denote index of output + let tick=false; // used to check if we're currently in formatted text. + let delimiters = ['', '`', '*', '~']; // Denotes characters used to format for (let i = 0; i < text.length; i++) { // Iterate through input if (delimiters.indexOf(text[i]) !== -1) { // Detect Code Delimiter @@ -49,22 +82,23 @@ const Article = ({article}) => { return [...output.keys()].map((i)=>{ // Format text and return as jsx + let text = linkProcessor(output[i]); // Process links if (type[i] === 0){ // Return default text type - return
    {output[i]}
    ; + return
    {text}
    ; } else if(type[i] === 1) { // Return Code text type - return
    {output[i]}
    ; + return
    {text}
    ; } else if (type[i] === 2) { - return
    {output[i]}
    ; + return
    {text}
    ; } else if (type[i] === 3) { - return
  • {output[i]}
    • ; + return
  • {text}
    • ; } else { diff --git a/src/components/css/Articles.css b/src/components/css/Articles.css index 8851b24..b7a808b 100644 --- a/src/components/css/Articles.css +++ b/src/components/css/Articles.css @@ -28,4 +28,8 @@ .article .li { margin-left: 10px; +} + +.article a { + color: #ACACFF; } \ No newline at end of file From 875685248bcf50ae0a66d6a986fed3ad1277a739 Mon Sep 17 00:00:00 2001 From: Camerin Figueroa Date: Tue, 16 Nov 2021 16:50:46 -0500 Subject: [PATCH 07/24] Changed some css to work with mobile --- src/components/Article.js | 2 +- src/components/css/About.css | 8 +++++++- src/components/css/Github.css | 7 +++++++ 3 files changed, 15 insertions(+), 2 deletions(-) diff --git a/src/components/Article.js b/src/components/Article.js index 3f2a4a2..92112be 100644 --- a/src/components/Article.js +++ b/src/components/Article.js @@ -15,7 +15,7 @@ const Article = ({article}) => { if (text.slice(i, i+4) === "http"){ // slice from i to 4 chars plus and check for http let x = i; // store i in x so the location is not modified - for (i; text[i] != " " && i < text.length; i++){} // iterate until we find the end of the link denoted by a space + for (i; text[i] !== " " && i < text.length; i++){} // iterate until we find the end of the link denoted by a space if (output[loc] !== "") { // if the current output location isn't empty, increment loc loc++; diff --git a/src/components/css/About.css b/src/components/css/About.css index 8914400..eec3836 100644 --- a/src/components/css/About.css +++ b/src/components/css/About.css @@ -31,7 +31,7 @@ display:flex; flex-direction:row; align-content:center; - justify-content:flex-start; + justify-content:space-evenly; align-items:center; flex-wrap: wrap; width:85vw; @@ -44,4 +44,10 @@ .About .links * { margin: 10px; +} + +@media only screen and (max-width: 600px) { + .About .links .link img { + width: 25vw; + } } \ No newline at end of file diff --git a/src/components/css/Github.css b/src/components/css/Github.css index c72eacb..034044d 100644 --- a/src/components/css/Github.css +++ b/src/components/css/Github.css @@ -95,4 +95,11 @@ border-radius: 10rem; height: 10rem; width: 10rem; +} + +@media only screen and (max-width: 600px) { + + .repo .content { + flex-direction: column; + } } \ No newline at end of file From c67c04cd40e96b826fee17dcad728e28555683de Mon Sep 17 00:00:00 2001 From: Camerin Figueroa Date: Mon, 22 Nov 2021 17:05:14 -0500 Subject: [PATCH 08/24] Started new article --- public/api/articles.json | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/public/api/articles.json b/public/api/articles.json index 40c02a2..20921ee 100644 --- a/public/api/articles.json +++ b/public/api/articles.json @@ -11,6 +11,12 @@ "title": "Hiding Data on Linux", "desc": "Showing you how to hide files within a file in linux.", "contents":"*Steganography*Steganography is the art or practice of concealing a message, image or file within another message, image or file. There are many techniques to perform steganography, one of which is to hide messages on physical paper in the physical world. Another technique involves hiding messages in digital images or digital data, also called digital messages. Images are the typical victim used to hide information. Social steganography is when messages are hidden in the title and context of a video or image. Names or words may be misspelled that are popular in a given time to suggest alternative meanings, or pictures can be traced by paint or drawing tools. When information is hidden in telecommunication networks, this is called network steganography. Today steganography is mostly done on computers with tools such as steghide, stegstudio and more. One simple way of doing so is on linux, by combining a zip file and an image in order to hide the in the back part of the image file.*Hiding Files Inside of a JPG File* You can first download an image that you'd like to use. Next, you'll create a file to hide. You can use anything, given that it can be hidden within a zip. I'm using a text file called steg.txt. Next, you'll want to compress the file. You can do this in the terminal by running the following. `zip zipfile.zip steg.txt` Now that you have a zip file you can now hide the file. We'll do this by using the cat command. This command will combine the data within two files, and allow us to create a new file with the data concatenated. Run the following command using image.jpg as our image file and zipfile as the zip we just created. If you have a file with a different file extension (I.E. .jpg, .png) change StegFile.jpg to reflect this change in addition to the original image file. `cat image.jpg zipfile.zip > StegFile.jpg` Now that everything is combined, you can attempt to view the StegFile.jpg image to see if you've correctly combined the two files. If you'd like to get the files out of the zip/steg file, you can then run the following on the image. `unzip StegFile.jpg` As you can see, it just unzipped the steg.txt from the image and placed it in the current directory. *Conclusion* Steganography is an interesting concept, especially revolving computer forensics and can be used to hide files and make interesting puzzles. *Sources* ~ https://www.merriam-webster.com/dictionary/steganography ~ ~ https://en.wikipedia.org/wiki/Steganography#Techniques ~ ~ http://steghide.sourceforge.net/ ~ ~ http://stegstudio.sourceforge.net/ ~" + }, + { + "id": 2, + "title": "(POC) Cracking Wifi using Phone Numbers", + "desc": "Showing you how to crack wifi passwords using phone numbers.", + "contents":"*Introduction*This article is a proof of concept and should show you why it's dangerous to use your phone number as your wifi password. Since the introduction of wifi, people have tried breaking into and exploiting it. WEP an old edition of wifi password security was a very weak method and could be easily broken just by sniffing wifi traffic coming to/from the AP. Since the introduction of WPA security, cracking has become more and more difficult. Although, if you can find the right password, one could potentially crack the login for wireless networks. This is done by sniffing for a specific traffic containing an EAPoL or Extensible Authentication Protocol over Lan. This essentially contains an hashed version of the wifi password. Using this we can then bruteforce the password and crack the password. As found in another article (see references) many people use their phone numbers as their wifi passwords. This can make it specifically easy to crack since your phone number is often related to your location through your area code. For example, if I was living in New York City, my area code would be either 212 or 718. If the wifi's password hash was sniffed somewhere in NYC, every phone number could be stored in a file around 200MB in size. With the technology of today, that password would be cracked in a matter of minutes if you used a phone number as your password. *Prerequisits*~Linux~ ~Wifi Card~ ~git~ ~python3~ *Creating a Phone List* In order to create the list of phone numbers you'll need to use a tool that I created. You can grab the files by cloning the repository `git clone https://github.com/RaspberryProgramming/phone-wordlist-generator` Enter the folder by running `cd phone-wordlsit-generator` Using this you can generate every phone number in your area code and put it into a file. Replacing AREA with your area code run `python3 main.py --staticnum AREA` You will then find the phone numbers in a file called phones.list *Capturing Wifi Hashes* You might be wondering, how would I even get these password hashes? Theres a simple tool called aircrack-ng that gives you a suite of tools that you'll need. If you're running Ubuntu Linux you can run `sudo apt install aircrack-ng` to install all of the necessary tools. On Arch/Manjaro run `sudo pacman -Sy aircrack-ng-git` " } ] } \ No newline at end of file From 2b4b23bd3090bc0ae4afd5607edcec95b6a25266 Mon Sep 17 00:00:00 2001 From: Camerin Figueroa Date: Tue, 23 Nov 2021 14:49:07 -0500 Subject: [PATCH 09/24] Added animation when opening/closing articles --- src/components/Article.js | 37 +++++++++++++++++++++++-- src/components/css/Articles.css | 18 ++++++++++++ src/components/css/Theater.css | 2 +- src/components/subcomponents/Listing.js | 5 ++-- 4 files changed, 56 insertions(+), 6 deletions(-) diff --git a/src/components/Article.js b/src/components/Article.js index 92112be..d014e3c 100644 --- a/src/components/Article.js +++ b/src/components/Article.js @@ -1,8 +1,39 @@ -import React from 'react'; +import React, { useEffect, useState } from 'react'; import Theater from './subcomponents/Theater'; import './css/Articles.css'; const Article = ({article}) => { + const [show, setShow] = useState(""); + const [currArticle, setCurrArticle] = useState(""); + + useEffect(()=>{ + if (currArticle === ""){ + console.log("A"); + if (show === "") { + setCurrArticle(article); + setShow("open"); + setTimeout(() =>{ + setShow("show"); + }, 1024) + } else { + setShow(""); + } + } else if (currArticle !== article) { + console.log("B"); + setCurrArticle(article); + setShow("close"); + setTimeout(()=>{ + setShow(""); + setTimeout(()=>{ + setShow("open"); + setTimeout(() =>{ + setShow("show"); + }, 1024); + }, 1024); + }, 24); + } + }); + let linkProcessor = (text) => { /** * Given some text, processes and returns jsx with any link represented as an anchor @@ -107,9 +138,9 @@ const Article = ({article}) => { }); }; - + return ( -
    +
    { @@ -11,12 +12,12 @@ const Listing = (props) => { */ return ( ); }; From 8a30d930cc8bdba1c2f55a2da3f091069999f4d9 Mon Sep 17 00:00:00 2001 From: Camerin Figueroa Date: Tue, 23 Nov 2021 15:31:51 -0500 Subject: [PATCH 10/24] Added newline functionality to article --- src/components/Article.js | 57 ++++++++++++++++++++++++++++++++++----- 1 file changed, 50 insertions(+), 7 deletions(-) diff --git a/src/components/Article.js b/src/components/Article.js index d014e3c..eb46762 100644 --- a/src/components/Article.js +++ b/src/components/Article.js @@ -7,32 +7,38 @@ const Article = ({article}) => { const [currArticle, setCurrArticle] = useState(""); useEffect(()=>{ - if (currArticle === ""){ - console.log("A"); + if (currArticle === ""){ // If no articles have been opened if (show === "") { + // Set the current article and initiate the open animation setCurrArticle(article); setShow("open"); + + // Once the animation runs, open the entire article setTimeout(() =>{ setShow("show"); }, 1024) - } else { - setShow(""); } - } else if (currArticle !== article) { - console.log("B"); + + } else if (currArticle !== article) { // If we've changed articles + // Change currArticle to the actual current article and initiate close animation setCurrArticle(article); setShow("close"); + + // Step through the close animation, open animation, and fully opening the article setTimeout(()=>{ setShow(""); + setTimeout(()=>{ + setShow("open"); + setTimeout(() =>{ setShow("show"); }, 1024); }, 1024); }, 24); } - }); + }, [currArticle, article, show]); let linkProcessor = (text) => { /** @@ -67,6 +73,42 @@ const Article = ({article}) => { return output; }; + let newLineProcessor = (text) => { + /** + * Given some text, processes and returns jsx with line breaks + */ + let tmp; + let output = [""]; // Stores all text in a list + let loc = 0; // Stores the current location in output that we're working with + + for (let i = 0; i < text.length; i++) { // Iterate through the entire text string + if (!React.isValidElement(text[i])) { + tmp = [""]; + loc = 0; + for (let j = 0; j < text[i].length; j++){ + + if (text[i].slice(j, j+1) === "\n"){ // slice from i to 4 chars plus and check for http + if (tmp[loc] !== "") { // if the current output location isn't empty, increment loc + loc++; + } + tmp[loc] =
    ; + tmp[++loc] = ""; + + } else { + // Append current char to output + tmp[loc] += text[i][j]; + + } + } + tmp[++loc] = ""; + } + output.push(tmp) + } + + // Return the output + return output; + }; + let articleFormatter = (text) => { let output = []; // Used to store separate formatted text let type = []; // Parallel to output list to signify format type @@ -114,6 +156,7 @@ const Article = ({article}) => { return [...output.keys()].map((i)=>{ // Format text and return as jsx let text = linkProcessor(output[i]); // Process links + text = newLineProcessor(text); if (type[i] === 0){ // Return default text type From 9d4b4a51bc6e29b8c99dc727aba14bff8deb4384 Mon Sep 17 00:00:00 2001 From: Camerin Figueroa Date: Tue, 23 Nov 2021 15:32:02 -0500 Subject: [PATCH 11/24] Added more information to new article --- public/api/articles.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/public/api/articles.json b/public/api/articles.json index 20921ee..fe37763 100644 --- a/public/api/articles.json +++ b/public/api/articles.json @@ -16,7 +16,7 @@ "id": 2, "title": "(POC) Cracking Wifi using Phone Numbers", "desc": "Showing you how to crack wifi passwords using phone numbers.", - "contents":"*Introduction*This article is a proof of concept and should show you why it's dangerous to use your phone number as your wifi password. Since the introduction of wifi, people have tried breaking into and exploiting it. WEP an old edition of wifi password security was a very weak method and could be easily broken just by sniffing wifi traffic coming to/from the AP. Since the introduction of WPA security, cracking has become more and more difficult. Although, if you can find the right password, one could potentially crack the login for wireless networks. This is done by sniffing for a specific traffic containing an EAPoL or Extensible Authentication Protocol over Lan. This essentially contains an hashed version of the wifi password. Using this we can then bruteforce the password and crack the password. As found in another article (see references) many people use their phone numbers as their wifi passwords. This can make it specifically easy to crack since your phone number is often related to your location through your area code. For example, if I was living in New York City, my area code would be either 212 or 718. If the wifi's password hash was sniffed somewhere in NYC, every phone number could be stored in a file around 200MB in size. With the technology of today, that password would be cracked in a matter of minutes if you used a phone number as your password. *Prerequisits*~Linux~ ~Wifi Card~ ~git~ ~python3~ *Creating a Phone List* In order to create the list of phone numbers you'll need to use a tool that I created. You can grab the files by cloning the repository `git clone https://github.com/RaspberryProgramming/phone-wordlist-generator` Enter the folder by running `cd phone-wordlsit-generator` Using this you can generate every phone number in your area code and put it into a file. Replacing AREA with your area code run `python3 main.py --staticnum AREA` You will then find the phone numbers in a file called phones.list *Capturing Wifi Hashes* You might be wondering, how would I even get these password hashes? Theres a simple tool called aircrack-ng that gives you a suite of tools that you'll need. If you're running Ubuntu Linux you can run `sudo apt install aircrack-ng` to install all of the necessary tools. On Arch/Manjaro run `sudo pacman -Sy aircrack-ng-git` " + "contents":"*Introduction*This article is a proof of concept and should show you why it's dangerous to use your phone number as your wifi password. Since the introduction of wifi, people have tried breaking into and exploiting it. WEP an old edition of wifi password security was a very weak method and could be easily broken just by sniffing wifi traffic coming to/from the AP. Since the introduction of WPA security, cracking has become more and more difficult. Although, if you can find the right password, one could potentially crack the login for wireless networks. This is done by sniffing for a specific traffic containing an EAPoL or Extensible Authentication Protocol over Lan. This essentially contains an hashed version of the wifi password. Using this we can then bruteforce the password and crack the password. As found in another article (see references) many people use their phone numbers as their wifi passwords. This can make it specifically easy to crack since your phone number is often related to your location through your area code. For example, if I was living in New York City, my area code would be either 212 or 718. If the wifi's password hash was sniffed somewhere in NYC, every phone number could be stored in a file around 200MB in size. With the technology of today, that password would be cracked in a matter of minutes if you used a phone number as your password. *Prerequisits*~Linux~ ~Wifi Card~ ~git~ ~python3~ *Creating a Phone List* In order to create the list of phone numbers you'll need to use a tool that I created. You can grab the files by cloning the repository `git clone https://github.com/RaspberryProgramming/phone-wordlist-generator` Enter the folder by running `cd phone-wordlsit-generator` Using this you can generate every phone number in your area code and put it into a file. Replacing AREA with your area code run `python3 main.py --staticnum AREA` You will then find the phone numbers in a file called phones.list *Capturing Wifi Hashes* You might be wondering, how would I even get these password hashes? Theres a simple tool called aircrack-ng that gives you a suite of tools that you'll need. If you're running Ubuntu Linux you can run `sudo apt install aircrack-ng` To install all of the necessary tools. On Arch/Manjaro run `sudo pacman -Sy aircrack-ng-git` Now that you've got aircrack installed, you can now set your wifi card in monitor mode. Run `ifconfig`. You'll get something similar to the following output `wlan0: flags=4163 mtu 1500\ninet 192.168.0.2 netmask 255.255.255.0 broadcast 192.168.0.255\nether db:3d:4d:b5:ff:12 txqueuelen 1000 (Ethernet)\nRX packets 130672 bytes 152955605 (152.9 MB)\nRX errors 0 dropped 0 overruns 0 frame 0\nTX packets 40063 bytes 8409394 (8.4 MB)\nTX errors 0 dropped 0 overruns 0 carrier 0 collisions 0`" } ] } \ No newline at end of file From c893199265b503921d2bb099c9ec53f946abccf7 Mon Sep 17 00:00:00 2001 From: Camerin Figueroa Date: Mon, 29 Nov 2021 16:38:27 -0500 Subject: [PATCH 12/24] Added beta article editor --- src/components/App.js | 2 ++ src/components/Article.js | 5 ++--- src/components/ArticleEditor.js | 23 +++++++++++++++++++++++ src/components/css/ArticleEditor.css | 22 ++++++++++++++++++++++ 4 files changed, 49 insertions(+), 3 deletions(-) create mode 100644 src/components/ArticleEditor.js create mode 100644 src/components/css/ArticleEditor.css diff --git a/src/components/App.js b/src/components/App.js index ac7986f..1d8cb1a 100644 --- a/src/components/App.js +++ b/src/components/App.js @@ -4,6 +4,7 @@ import "./css/App.css"; import Navigation from './Navigation'; import Github from './Github'; import Articles from './Articles'; +import ArticleEditor from './ArticleEditor'; import About from './About'; import Intro from './Intro'; @@ -18,6 +19,7 @@ const App = (props) => { } /> +
    diff --git a/src/components/Article.js b/src/components/Article.js index eb46762..7013c1f 100644 --- a/src/components/Article.js +++ b/src/components/Article.js @@ -44,7 +44,6 @@ const Article = ({article}) => { /** * Given some text, processes and returns jsx with any link represented as an anchor */ - let output = [""]; // Stores all text in a list let loc = 0; // Stores the current location in output that we're working with @@ -80,7 +79,6 @@ const Article = ({article}) => { let tmp; let output = [""]; // Stores all text in a list let loc = 0; // Stores the current location in output that we're working with - for (let i = 0; i < text.length; i++) { // Iterate through the entire text string if (!React.isValidElement(text[i])) { tmp = [""]; @@ -116,6 +114,7 @@ const Article = ({article}) => { let tick=false; // used to check if we're currently in formatted text. let delimiters = ['', '`', '*', '~']; // Denotes characters used to format + for (let i = 0; i < text.length; i++) { // Iterate through input if (delimiters.indexOf(text[i]) !== -1) { // Detect Code Delimiter @@ -181,7 +180,7 @@ const Article = ({article}) => { }); }; - + return (
    { + const [content, setContent] = useState("Hello World"); + + let article = { + "id":"0", + "title": "Article Editor", + "desc":"This is a place to edit articles", + "contents": content + }; + + return ( +
    +
    + {setContent(e.target.value)}}/> +
    + ); +}; + +export default ArticleEditor; \ No newline at end of file diff --git a/src/components/css/ArticleEditor.css b/src/components/css/ArticleEditor.css new file mode 100644 index 0000000..a356569 --- /dev/null +++ b/src/components/css/ArticleEditor.css @@ -0,0 +1,22 @@ +.ArticleEditor input { + width:100%; + height: 35vh; + border-style: solid; + border-color: lightgray; + border-radius: 2px; + border-width: 2px; + padding: 0.4em 0.4em 0.4em 0; + text-align: left; +} + +.article .open { + max-height:100vh; +} + +.article .Close { + max-height:100vh; +} + +.article { + max-height:100vh; +} \ No newline at end of file From 7be49dd45ff4b55668b5278b52c69a90ffce7c20 Mon Sep 17 00:00:00 2001 From: Camerin Figueroa Date: Wed, 8 Dec 2021 16:31:48 -0500 Subject: [PATCH 13/24] Added Hotjar analytics --- public/index.html | 12 ++++++++++++ 1 file changed, 12 insertions(+) diff --git a/public/index.html b/public/index.html index d5c0374..b5ab2d4 100644 --- a/public/index.html +++ b/public/index.html @@ -41,4 +41,16 @@ To create a production bundle, use `npm run build` or `yarn build`. --> + + + From f903823a2f39ed4cb9e51fdef0458ba0cdf285ec Mon Sep 17 00:00:00 2001 From: Camerin Figueroa Date: Wed, 8 Dec 2021 16:52:02 -0500 Subject: [PATCH 14/24] Revert "Merge pull request #3 from RaspberryProgramming/PreRelease" This reverts commit 938e41d98348b69ca2bb6204b5de02c51fd94d82, reversing changes made to 7be49dd45ff4b55668b5278b52c69a90ffce7c20. --- public/api/articles.json | 6 -- src/components/App.js | 2 - src/components/Article.js | 79 +------------------------ src/components/ArticleEditor.js | 23 ------- src/components/css/ArticleEditor.css | 22 ------- src/components/css/Articles.css | 18 ------ src/components/css/Theater.css | 2 +- src/components/subcomponents/Listing.js | 5 +- 8 files changed, 6 insertions(+), 151 deletions(-) delete mode 100644 src/components/ArticleEditor.js delete mode 100644 src/components/css/ArticleEditor.css diff --git a/public/api/articles.json b/public/api/articles.json index fe37763..40c02a2 100644 --- a/public/api/articles.json +++ b/public/api/articles.json @@ -11,12 +11,6 @@ "title": "Hiding Data on Linux", "desc": "Showing you how to hide files within a file in linux.", "contents":"*Steganography*Steganography is the art or practice of concealing a message, image or file within another message, image or file. There are many techniques to perform steganography, one of which is to hide messages on physical paper in the physical world. Another technique involves hiding messages in digital images or digital data, also called digital messages. Images are the typical victim used to hide information. Social steganography is when messages are hidden in the title and context of a video or image. Names or words may be misspelled that are popular in a given time to suggest alternative meanings, or pictures can be traced by paint or drawing tools. When information is hidden in telecommunication networks, this is called network steganography. Today steganography is mostly done on computers with tools such as steghide, stegstudio and more. One simple way of doing so is on linux, by combining a zip file and an image in order to hide the in the back part of the image file.*Hiding Files Inside of a JPG File* You can first download an image that you'd like to use. Next, you'll create a file to hide. You can use anything, given that it can be hidden within a zip. I'm using a text file called steg.txt. Next, you'll want to compress the file. You can do this in the terminal by running the following. `zip zipfile.zip steg.txt` Now that you have a zip file you can now hide the file. We'll do this by using the cat command. This command will combine the data within two files, and allow us to create a new file with the data concatenated. Run the following command using image.jpg as our image file and zipfile as the zip we just created. If you have a file with a different file extension (I.E. .jpg, .png) change StegFile.jpg to reflect this change in addition to the original image file. `cat image.jpg zipfile.zip > StegFile.jpg` Now that everything is combined, you can attempt to view the StegFile.jpg image to see if you've correctly combined the two files. If you'd like to get the files out of the zip/steg file, you can then run the following on the image. `unzip StegFile.jpg` As you can see, it just unzipped the steg.txt from the image and placed it in the current directory. *Conclusion* Steganography is an interesting concept, especially revolving computer forensics and can be used to hide files and make interesting puzzles. *Sources* ~ https://www.merriam-webster.com/dictionary/steganography ~ ~ https://en.wikipedia.org/wiki/Steganography#Techniques ~ ~ http://steghide.sourceforge.net/ ~ ~ http://stegstudio.sourceforge.net/ ~" - }, - { - "id": 2, - "title": "(POC) Cracking Wifi using Phone Numbers", - "desc": "Showing you how to crack wifi passwords using phone numbers.", - "contents":"*Introduction*This article is a proof of concept and should show you why it's dangerous to use your phone number as your wifi password. Since the introduction of wifi, people have tried breaking into and exploiting it. WEP an old edition of wifi password security was a very weak method and could be easily broken just by sniffing wifi traffic coming to/from the AP. Since the introduction of WPA security, cracking has become more and more difficult. Although, if you can find the right password, one could potentially crack the login for wireless networks. This is done by sniffing for a specific traffic containing an EAPoL or Extensible Authentication Protocol over Lan. This essentially contains an hashed version of the wifi password. Using this we can then bruteforce the password and crack the password. As found in another article (see references) many people use their phone numbers as their wifi passwords. This can make it specifically easy to crack since your phone number is often related to your location through your area code. For example, if I was living in New York City, my area code would be either 212 or 718. If the wifi's password hash was sniffed somewhere in NYC, every phone number could be stored in a file around 200MB in size. With the technology of today, that password would be cracked in a matter of minutes if you used a phone number as your password. *Prerequisits*~Linux~ ~Wifi Card~ ~git~ ~python3~ *Creating a Phone List* In order to create the list of phone numbers you'll need to use a tool that I created. You can grab the files by cloning the repository `git clone https://github.com/RaspberryProgramming/phone-wordlist-generator` Enter the folder by running `cd phone-wordlsit-generator` Using this you can generate every phone number in your area code and put it into a file. Replacing AREA with your area code run `python3 main.py --staticnum AREA` You will then find the phone numbers in a file called phones.list *Capturing Wifi Hashes* You might be wondering, how would I even get these password hashes? Theres a simple tool called aircrack-ng that gives you a suite of tools that you'll need. If you're running Ubuntu Linux you can run `sudo apt install aircrack-ng` To install all of the necessary tools. On Arch/Manjaro run `sudo pacman -Sy aircrack-ng-git` Now that you've got aircrack installed, you can now set your wifi card in monitor mode. Run `ifconfig`. You'll get something similar to the following output `wlan0: flags=4163 mtu 1500\ninet 192.168.0.2 netmask 255.255.255.0 broadcast 192.168.0.255\nether db:3d:4d:b5:ff:12 txqueuelen 1000 (Ethernet)\nRX packets 130672 bytes 152955605 (152.9 MB)\nRX errors 0 dropped 0 overruns 0 frame 0\nTX packets 40063 bytes 8409394 (8.4 MB)\nTX errors 0 dropped 0 overruns 0 carrier 0 collisions 0`" } ] } \ No newline at end of file diff --git a/src/components/App.js b/src/components/App.js index 1d8cb1a..ac7986f 100644 --- a/src/components/App.js +++ b/src/components/App.js @@ -4,7 +4,6 @@ import "./css/App.css"; import Navigation from './Navigation'; import Github from './Github'; import Articles from './Articles'; -import ArticleEditor from './ArticleEditor'; import About from './About'; import Intro from './Intro'; @@ -19,7 +18,6 @@ const App = (props) => { } /> -
    diff --git a/src/components/Article.js b/src/components/Article.js index 7013c1f..92112be 100644 --- a/src/components/Article.js +++ b/src/components/Article.js @@ -1,49 +1,13 @@ -import React, { useEffect, useState } from 'react'; +import React from 'react'; import Theater from './subcomponents/Theater'; import './css/Articles.css'; const Article = ({article}) => { - const [show, setShow] = useState(""); - const [currArticle, setCurrArticle] = useState(""); - - useEffect(()=>{ - if (currArticle === ""){ // If no articles have been opened - if (show === "") { - // Set the current article and initiate the open animation - setCurrArticle(article); - setShow("open"); - - // Once the animation runs, open the entire article - setTimeout(() =>{ - setShow("show"); - }, 1024) - } - - } else if (currArticle !== article) { // If we've changed articles - // Change currArticle to the actual current article and initiate close animation - setCurrArticle(article); - setShow("close"); - - // Step through the close animation, open animation, and fully opening the article - setTimeout(()=>{ - setShow(""); - - setTimeout(()=>{ - - setShow("open"); - - setTimeout(() =>{ - setShow("show"); - }, 1024); - }, 1024); - }, 24); - } - }, [currArticle, article, show]); - let linkProcessor = (text) => { /** * Given some text, processes and returns jsx with any link represented as an anchor */ + let output = [""]; // Stores all text in a list let loc = 0; // Stores the current location in output that we're working with @@ -72,41 +36,6 @@ const Article = ({article}) => { return output; }; - let newLineProcessor = (text) => { - /** - * Given some text, processes and returns jsx with line breaks - */ - let tmp; - let output = [""]; // Stores all text in a list - let loc = 0; // Stores the current location in output that we're working with - for (let i = 0; i < text.length; i++) { // Iterate through the entire text string - if (!React.isValidElement(text[i])) { - tmp = [""]; - loc = 0; - for (let j = 0; j < text[i].length; j++){ - - if (text[i].slice(j, j+1) === "\n"){ // slice from i to 4 chars plus and check for http - if (tmp[loc] !== "") { // if the current output location isn't empty, increment loc - loc++; - } - tmp[loc] =
    ; - tmp[++loc] = ""; - - } else { - // Append current char to output - tmp[loc] += text[i][j]; - - } - } - tmp[++loc] = ""; - } - output.push(tmp) - } - - // Return the output - return output; - }; - let articleFormatter = (text) => { let output = []; // Used to store separate formatted text let type = []; // Parallel to output list to signify format type @@ -114,7 +43,6 @@ const Article = ({article}) => { let tick=false; // used to check if we're currently in formatted text. let delimiters = ['', '`', '*', '~']; // Denotes characters used to format - for (let i = 0; i < text.length; i++) { // Iterate through input if (delimiters.indexOf(text[i]) !== -1) { // Detect Code Delimiter @@ -155,7 +83,6 @@ const Article = ({article}) => { return [...output.keys()].map((i)=>{ // Format text and return as jsx let text = linkProcessor(output[i]); // Process links - text = newLineProcessor(text); if (type[i] === 0){ // Return default text type @@ -182,7 +109,7 @@ const Article = ({article}) => { }; return ( -
    +
    { - const [content, setContent] = useState("Hello World"); - - let article = { - "id":"0", - "title": "Article Editor", - "desc":"This is a place to edit articles", - "contents": content - }; - - return ( -
    -
    - {setContent(e.target.value)}}/> -
    - ); -}; - -export default ArticleEditor; \ No newline at end of file diff --git a/src/components/css/ArticleEditor.css b/src/components/css/ArticleEditor.css deleted file mode 100644 index a356569..0000000 --- a/src/components/css/ArticleEditor.css +++ /dev/null @@ -1,22 +0,0 @@ -.ArticleEditor input { - width:100%; - height: 35vh; - border-style: solid; - border-color: lightgray; - border-radius: 2px; - border-width: 2px; - padding: 0.4em 0.4em 0.4em 0; - text-align: left; -} - -.article .open { - max-height:100vh; -} - -.article .Close { - max-height:100vh; -} - -.article { - max-height:100vh; -} \ No newline at end of file diff --git a/src/components/css/Articles.css b/src/components/css/Articles.css index 24d8038..b7a808b 100644 --- a/src/components/css/Articles.css +++ b/src/components/css/Articles.css @@ -3,24 +3,6 @@ align-items: center; display: flex; flex-direction: column; - max-height:0; - overflow: hidden; - transition: max-height 1s ease; - -} - -.article.open { - max-height:100vh; - transition: max-height 1s ease; -} - -.article.close { - max-height:100vh; -} - -.article.show { - max-height:none; - } .article .content { diff --git a/src/components/css/Theater.css b/src/components/css/Theater.css index f912564..0940f71 100644 --- a/src/components/css/Theater.css +++ b/src/components/css/Theater.css @@ -15,7 +15,7 @@ .theater-bg { - height: inherit; + height: 100%; width:100%; background-size: cover; background-image: url('../../img/background.webp'); diff --git a/src/components/subcomponents/Listing.js b/src/components/subcomponents/Listing.js index 6fb3bb1..a9e7379 100644 --- a/src/components/subcomponents/Listing.js +++ b/src/components/subcomponents/Listing.js @@ -1,5 +1,4 @@ import React from 'react'; -import { Link } from 'react-router-dom'; import '../css/Listing.css'; const Listing = (props) => { @@ -12,12 +11,12 @@ const Listing = (props) => { */ return ( ); }; From 9eb47657e111d7867fae956a966e701fa5f58c7a Mon Sep 17 00:00:00 2001 From: Camerin Figueroa Date: Thu, 23 Dec 2021 15:38:53 -0500 Subject: [PATCH 15/24] Finished the POC Article --- public/api/articles.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/public/api/articles.json b/public/api/articles.json index fe37763..09267d6 100644 --- a/public/api/articles.json +++ b/public/api/articles.json @@ -16,7 +16,7 @@ "id": 2, "title": "(POC) Cracking Wifi using Phone Numbers", "desc": "Showing you how to crack wifi passwords using phone numbers.", - "contents":"*Introduction*This article is a proof of concept and should show you why it's dangerous to use your phone number as your wifi password. Since the introduction of wifi, people have tried breaking into and exploiting it. WEP an old edition of wifi password security was a very weak method and could be easily broken just by sniffing wifi traffic coming to/from the AP. Since the introduction of WPA security, cracking has become more and more difficult. Although, if you can find the right password, one could potentially crack the login for wireless networks. This is done by sniffing for a specific traffic containing an EAPoL or Extensible Authentication Protocol over Lan. This essentially contains an hashed version of the wifi password. Using this we can then bruteforce the password and crack the password. As found in another article (see references) many people use their phone numbers as their wifi passwords. This can make it specifically easy to crack since your phone number is often related to your location through your area code. For example, if I was living in New York City, my area code would be either 212 or 718. If the wifi's password hash was sniffed somewhere in NYC, every phone number could be stored in a file around 200MB in size. With the technology of today, that password would be cracked in a matter of minutes if you used a phone number as your password. *Prerequisits*~Linux~ ~Wifi Card~ ~git~ ~python3~ *Creating a Phone List* In order to create the list of phone numbers you'll need to use a tool that I created. You can grab the files by cloning the repository `git clone https://github.com/RaspberryProgramming/phone-wordlist-generator` Enter the folder by running `cd phone-wordlsit-generator` Using this you can generate every phone number in your area code and put it into a file. Replacing AREA with your area code run `python3 main.py --staticnum AREA` You will then find the phone numbers in a file called phones.list *Capturing Wifi Hashes* You might be wondering, how would I even get these password hashes? Theres a simple tool called aircrack-ng that gives you a suite of tools that you'll need. If you're running Ubuntu Linux you can run `sudo apt install aircrack-ng` To install all of the necessary tools. On Arch/Manjaro run `sudo pacman -Sy aircrack-ng-git` Now that you've got aircrack installed, you can now set your wifi card in monitor mode. Run `ifconfig`. You'll get something similar to the following output `wlan0: flags=4163 mtu 1500\ninet 192.168.0.2 netmask 255.255.255.0 broadcast 192.168.0.255\nether db:3d:4d:b5:ff:12 txqueuelen 1000 (Ethernet)\nRX packets 130672 bytes 152955605 (152.9 MB)\nRX errors 0 dropped 0 overruns 0 frame 0\nTX packets 40063 bytes 8409394 (8.4 MB)\nTX errors 0 dropped 0 overruns 0 carrier 0 collisions 0`" + "contents":"*Introduction*This article is a proof of concept and should show you why it's dangerous to use your phone number as your wifi password. Since the introduction of wifi, people have tried breaking into and exploiting it. WEP an old edition of wifi password security was a very weak method and could be easily broken just by sniffing wifi traffic coming to/from the AP. Since the introduction of WPA security, cracking has become more and more difficult. Although, if you can find the right password, one could potentially crack the login for wireless networks. This is done by sniffing for a specific traffic containing an EAPoL or Extensible Authentication Protocol over Lan. This essentially contains an hashed version of the wifi password. Using this we can then bruteforce the password and crack the password. As found in another article (see references) many people use their phone numbers as their wifi passwords. This can make it specifically easy to crack since your phone number is often related to your location through your area code. For example, if I was living in New York City, my area code would be either 212 or 718. If the wifi's password hash was sniffed somewhere in NYC, every phone number could be stored in a file around 200MB in size. With the technology of today, that password would be cracked in a matter of minutes if you used a phone number as your password. *Prerequisits*~Linux~ ~Wifi Card~ ~git~ ~python3~ *Creating a Phone List* In order to create the list of phone numbers you'll need to use a tool that I created. You can grab the files by cloning the repository `git clone https://github.com/RaspberryProgramming/phone-wordlist-generator` Enter the folder by running `cd phone-wordlist-generator` Using this you can generate every phone number in your area code and put it into a file. Replacing AREA with your area code run `python3 main.py --staticnum AREA` You will then find the phone numbers in a file called phones.list *Capturing Wifi Hashes* You might be wondering, how would I even get these password hashes? Theres a simple tool called aircrack-ng that gives you a suite of tools that you'll need. If you're running Ubuntu Linux you can run `sudo apt install aircrack-ng` To install all of the necessary tools. On Arch/Manjaro run `sudo pacman -Sy aircrack-ng-git` Now that you've got aircrack installed, you can now set your wifi card in monitor mode. Run `ifconfig` You'll get something similar to the following output `wlan0: flags=4163 mtu 1500\ninet 192.168.0.2 netmask 255.255.255.0 broadcast 192.168.0.255\nether db:3d:4d:b5:ff:12 txqueuelen 1000 (Ethernet)\nRX packets 130672 bytes 152955605 (152.9 MB)\nRX errors 0 dropped 0 overruns 0 frame 0\nTX packets 40063 bytes 8409394 (8.4 MB)\nTX errors 0 dropped 0 overruns 0 carrier 0 collisions 0`In my case, I'll be using the wlan0 for any sniffing. This may be unneccesary, but I'll be killing any conflicting processed by running. `sudo airmon-ng check kill` Run the following to put your wifi card in monitor mode `sudo airmon-ng start wlan0` You should now have a wlan0mon which is the monitor interface for the wlan0 card. If you had something longer like wlx... it may be the same as the original name. Now that you created the monitor interface, you can now start the sniff traffic. You can do this by running airodump. Replace INTERFACE with your monitor interface. The -w argument specifies the filename we'll be storing the capture to. The --output-format argument specifies we want a pcap file. `sudo airodump-ng --output-format pcap -w capfile INTERFACE` After a while, you may start to capture handshakes. There are multiple ways to determine this but the way I'll go over is using aircrack-ng. You may have multiple capture files if you ran the command multiple times, so we'll run ls to find the file. `ls` Look for a file with the extension .pcap. Next, run aircrack-ng with FILENAME as the filename of your capture file `sudo aircrack-ng FILENAME` You should see a list of SSIDs similar to the following output `Reading packets, please wait...\nOpening capfile-02.cap\nRead 370 packets.\n\n # BSSID ESSID Encryption\n\n 1 00:5F:67:FB:48:FC Unknown\n 2 64:05:E4:6A:E1:2A CarPlay_e12a WPA (1 handshake)\n 3 B6:BC:1F:14:72:0B AndroidAP_6374 WPA (0 handshake)\n 4 BC:82:5D:57:FC:AC WiFi Hotspot 4877 Unknown\n 5 C6:D4:38:D1:4A:2A Unknown\n 6 F8:55:CD:67:54:E0 HotspotLftY Unknown\n 7 F8:55:CD:68:0A:1F Truck WiFi Unknown\n\nIndex number of target network ? 1` If you see, we have 1 handshake from CarPlay_e12a. We can then use the wordlist we made before to try to crack the password. Run aircrack with the wordlist argument `sudo aircrack-ng -w phones.list` You can then select the ssid or wifi name with the handshake to start cracking. If you have the password you'll see the following message `KEY FOUND: 1839231234`" } ] } \ No newline at end of file From f3e3d5aa8ff9ae04a057d22bfe4b03248d04d017 Mon Sep 17 00:00:00 2001 From: Camerin Figueroa Date: Thu, 23 Dec 2021 15:42:51 -0500 Subject: [PATCH 16/24] Changed to textarea --- src/components/ArticleEditor.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/ArticleEditor.js b/src/components/ArticleEditor.js index e7d975a..1d4c256 100644 --- a/src/components/ArticleEditor.js +++ b/src/components/ArticleEditor.js @@ -15,7 +15,7 @@ const ArticleEditor = (props) => { return (
    - {setContent(e.target.value)}}/> +
    ); }; From 6acd54bf8a5ae79df301910642645e3027c5653c Mon Sep 17 00:00:00 2001 From: Camerin Figueroa Date: Thu, 23 Dec 2021 15:44:12 -0500 Subject: [PATCH 17/24] Fit textarea to fit with --- src/components/ArticleEditor.js | 2 +- src/components/css/ArticleEditor.css | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/ArticleEditor.js b/src/components/ArticleEditor.js index 1d4c256..b855669 100644 --- a/src/components/ArticleEditor.js +++ b/src/components/ArticleEditor.js @@ -15,7 +15,7 @@ const ArticleEditor = (props) => { return (
    - +
    ); }; diff --git a/src/components/css/ArticleEditor.css b/src/components/css/ArticleEditor.css index a356569..29c5e15 100644 --- a/src/components/css/ArticleEditor.css +++ b/src/components/css/ArticleEditor.css @@ -1,4 +1,4 @@ -.ArticleEditor input { +.ArticleEditor textarea { width:100%; height: 35vh; border-style: solid; From c72d3882c7d6cab550e92606474595ec8c6848a5 Mon Sep 17 00:00:00 2001 From: Camerin Figueroa Date: Thu, 23 Dec 2021 16:24:39 -0500 Subject: [PATCH 18/24] Fixed Link Bug --- src/components/Article.js | 37 ++++++++++++++++++++++--------------- 1 file changed, 22 insertions(+), 15 deletions(-) diff --git a/src/components/Article.js b/src/components/Article.js index 7013c1f..0e81ab6 100644 --- a/src/components/Article.js +++ b/src/components/Article.js @@ -46,26 +46,31 @@ const Article = ({article}) => { */ let output = [""]; // Stores all text in a list let loc = 0; // Stores the current location in output that we're working with - - for (let i = 0; i < text.length; i++) { // Iterate through the entire text string + let tmp; + let i = 0; + console.log(text); + while (i < text.length) { // Iterate through the entire text string if (text.slice(i, i+4) === "http"){ // slice from i to 4 chars plus and check for http let x = i; // store i in x so the location is not modified - for (i; text[i] !== " " && i < text.length; i++){} // iterate until we find the end of the link denoted by a space + for (let y = i; ![" ", "\n"].includes(text[y]) && y < text.length; y++){ + i=y; + } // iterate until we find the end of the link denoted by a space if (output[loc] !== "") { // if the current output location isn't empty, increment loc loc++; } - + tmp = text.slice(x, i+1); // Put anchor for link into output list - output[loc] = {text.slice(x, i)}; + output[loc] = {tmp}; output[++loc] = ""; // Create new location in output with empty string - } else { // Append current char to output output[loc] += text[i]; } + i++; + } // Return the output @@ -99,7 +104,10 @@ const Article = ({article}) => { } } tmp[++loc] = ""; + } else { + tmp = text[i] } + output.push(tmp) } @@ -108,15 +116,14 @@ const Article = ({article}) => { }; let articleFormatter = (text) => { - let output = []; // Used to store separate formatted text + let output = [""]; // Used to store separate formatted text let type = []; // Parallel to output list to signify format type let ind = 0; // Denote index of output let tick=false; // used to check if we're currently in formatted text. let delimiters = ['', '`', '*', '~']; // Denotes characters used to format - for (let i = 0; i < text.length; i++) { // Iterate through input - if (delimiters.indexOf(text[i]) !== -1) { // Detect Code Delimiter + if (delimiters.indexOf(text[i]) >= 0) { // Detect Code Delimiter if (tick) { // Close the code section output[++ind] = "" @@ -125,7 +132,7 @@ const Article = ({article}) => { } else { // Start a new code section type.push(delimiters.indexOf(text[i])); - if (!output[ind]) { + if (output.length < ind) { output[ind] = ""; @@ -142,14 +149,14 @@ const Article = ({article}) => { if (output.length > type.length) { // If this is the beggining of a default text type type.push(0); - output[ind] = "" + //output[ind] = text[i] + } else if (output.length < type.length) { + output[++ind] = "" } - - - - output[ind] += text[i] } + + output[ind] += text[i] } return [...output.keys()].map((i)=>{ // Format text and return as jsx From 2023f37289b56b507323ac5d9b6ff94e3365faa9 Mon Sep 17 00:00:00 2001 From: Camerin Figueroa Date: Thu, 23 Dec 2021 16:35:56 -0500 Subject: [PATCH 19/24] Added copy to clipboard tool --- src/components/ArticleEditor.js | 11 +++++++++++ src/components/css/ArticleEditor.css | 20 ++++++++++++++++++++ 2 files changed, 31 insertions(+) diff --git a/src/components/ArticleEditor.js b/src/components/ArticleEditor.js index b855669..4f9b8d8 100644 --- a/src/components/ArticleEditor.js +++ b/src/components/ArticleEditor.js @@ -12,8 +12,19 @@ const ArticleEditor = (props) => { "contents": content }; + let copyToClipboard = () => { + navigator.clipboard.writeText(content).then(function() { + console.log('Async: Copying to clipboard was successful!'); + }, function(err) { + console.error('Async: Could not copy text: ', err); + }); + }; + return (
    +
    +
    Copy to Clipboard
    +
    diff --git a/src/components/css/ArticleEditor.css b/src/components/css/ArticleEditor.css index 29c5e15..44c05ec 100644 --- a/src/components/css/ArticleEditor.css +++ b/src/components/css/ArticleEditor.css @@ -9,6 +9,26 @@ text-align: left; } +.ArticleEditor .toolbar { + width: 100%; + height: 56px; + display: flex; +} + +.ArticleEditor .toolbar .btn { + color: white; + background-color: darkgreen; + text-align: center; + align-items:center; + justify-content: center; + display: flex; + padding-left: 3px; + padding-right: 3px; +} +.ArticleEditor .toolbar .btn:hover{ + background-color: #005400 +} + .article .open { max-height:100vh; } From be619a123b3150e48069526fffcb992451b2c770 Mon Sep 17 00:00:00 2001 From: Camerin Figueroa Date: Thu, 23 Dec 2021 17:37:19 -0500 Subject: [PATCH 20/24] Implemented newLineProcessor --- src/components/Article.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/Article.js b/src/components/Article.js index 80ab284..df8b1ef 100644 --- a/src/components/Article.js +++ b/src/components/Article.js @@ -126,7 +126,7 @@ const Article = ({article}) => { return [...output.keys()].map((i)=>{ // Format text and return as jsx let text = linkProcessor(output[i]); // Process links - + text = newLineProcessor(text); if (type[i] === 0){ // Return default text type return
    {text}
    ; From 7cf9954f7f18d120af53a16895c9b1a4f461ab7e Mon Sep 17 00:00:00 2001 From: Camerin Figueroa Date: Thu, 23 Dec 2021 17:58:18 -0500 Subject: [PATCH 21/24] Fixed Missing Code from merge --- src/components/App.js | 2 ++ src/components/Article.js | 43 +++++++++++++++++++++++-- src/components/ArticleEditor.js | 34 +++++++++++++++++++ src/components/css/ArticleEditor.css | 42 ++++++++++++++++++++++++ src/components/css/Articles.css | 18 +++++++++++ src/components/css/Theater.css | 2 +- src/components/subcomponents/Listing.js | 5 +-- 7 files changed, 140 insertions(+), 6 deletions(-) create mode 100644 src/components/ArticleEditor.js create mode 100644 src/components/css/ArticleEditor.css diff --git a/src/components/App.js b/src/components/App.js index ac7986f..1d8cb1a 100644 --- a/src/components/App.js +++ b/src/components/App.js @@ -4,6 +4,7 @@ import "./css/App.css"; import Navigation from './Navigation'; import Github from './Github'; import Articles from './Articles'; +import ArticleEditor from './ArticleEditor'; import About from './About'; import Intro from './Intro'; @@ -18,6 +19,7 @@ const App = (props) => { } /> +
    diff --git a/src/components/Article.js b/src/components/Article.js index df8b1ef..0e81ab6 100644 --- a/src/components/Article.js +++ b/src/components/Article.js @@ -1,13 +1,49 @@ -import React from 'react'; +import React, { useEffect, useState } from 'react'; import Theater from './subcomponents/Theater'; import './css/Articles.css'; const Article = ({article}) => { + const [show, setShow] = useState(""); + const [currArticle, setCurrArticle] = useState(""); + + useEffect(()=>{ + if (currArticle === ""){ // If no articles have been opened + if (show === "") { + // Set the current article and initiate the open animation + setCurrArticle(article); + setShow("open"); + + // Once the animation runs, open the entire article + setTimeout(() =>{ + setShow("show"); + }, 1024) + } + + } else if (currArticle !== article) { // If we've changed articles + // Change currArticle to the actual current article and initiate close animation + setCurrArticle(article); + setShow("close"); + + // Step through the close animation, open animation, and fully opening the article + setTimeout(()=>{ + setShow(""); + + setTimeout(()=>{ + + setShow("open"); + + setTimeout(() =>{ + setShow("show"); + }, 1024); + }, 1024); + }, 24); + } + }, [currArticle, article, show]); + let linkProcessor = (text) => { /** * Given some text, processes and returns jsx with any link represented as an anchor */ - let output = [""]; // Stores all text in a list let loc = 0; // Stores the current location in output that we're working with let tmp; @@ -127,6 +163,7 @@ const Article = ({article}) => { let text = linkProcessor(output[i]); // Process links text = newLineProcessor(text); + if (type[i] === 0){ // Return default text type return
    {text}
    ; @@ -152,7 +189,7 @@ const Article = ({article}) => { }; return ( -
    +
    { + const [content, setContent] = useState("Hello World"); + + let article = { + "id":"0", + "title": "Article Editor", + "desc":"This is a place to edit articles", + "contents": content + }; + + let copyToClipboard = () => { + navigator.clipboard.writeText(content).then(function() { + console.log('Async: Copying to clipboard was successful!'); + }, function(err) { + console.error('Async: Could not copy text: ', err); + }); + }; + + return ( +
    +
    +
    Copy to Clipboard
    +
    +
    + +
    + ); +}; + +export default ArticleEditor; \ No newline at end of file diff --git a/src/components/css/ArticleEditor.css b/src/components/css/ArticleEditor.css new file mode 100644 index 0000000..43dd00e --- /dev/null +++ b/src/components/css/ArticleEditor.css @@ -0,0 +1,42 @@ +.ArticleEditor textarea { + width:100%; + height: 35vh; + border-style: solid; + border-color: lightgray; + border-radius: 2px; + border-width: 2px; + padding: 0.4em 0.4em 0.4em 0; + text-align: left; +} + +.ArticleEditor .toolbar { + width: 100%; + height: 56px; + display: flex; +} + +.ArticleEditor .toolbar .btn { + color: white; + background-color: darkgreen; + text-align: center; + align-items:center; + justify-content: center; + display: flex; + padding-left: 3px; + padding-right: 3px; +} +.ArticleEditor .toolbar .btn:hover{ + background-color: #005400 +} + +.ArticleEditor .article .open { + max-height:100vh; +} + +.ArticleEditor .article .Close { + max-height:100vh; +} + +.ArticleEditor .article { + max-height:100vh; +} \ No newline at end of file diff --git a/src/components/css/Articles.css b/src/components/css/Articles.css index b7a808b..24d8038 100644 --- a/src/components/css/Articles.css +++ b/src/components/css/Articles.css @@ -3,6 +3,24 @@ align-items: center; display: flex; flex-direction: column; + max-height:0; + overflow: hidden; + transition: max-height 1s ease; + +} + +.article.open { + max-height:100vh; + transition: max-height 1s ease; +} + +.article.close { + max-height:100vh; +} + +.article.show { + max-height:none; + } .article .content { diff --git a/src/components/css/Theater.css b/src/components/css/Theater.css index 0940f71..f912564 100644 --- a/src/components/css/Theater.css +++ b/src/components/css/Theater.css @@ -15,7 +15,7 @@ .theater-bg { - height: 100%; + height: inherit; width:100%; background-size: cover; background-image: url('../../img/background.webp'); diff --git a/src/components/subcomponents/Listing.js b/src/components/subcomponents/Listing.js index a9e7379..6fb3bb1 100644 --- a/src/components/subcomponents/Listing.js +++ b/src/components/subcomponents/Listing.js @@ -1,4 +1,5 @@ import React from 'react'; +import { Link } from 'react-router-dom'; import '../css/Listing.css'; const Listing = (props) => { @@ -11,12 +12,12 @@ const Listing = (props) => { */ return ( ); }; From d4df31a80b8c678a4de44eda79e4cb075bfdcb0b Mon Sep 17 00:00:00 2001 From: Camerin Figueroa Date: Thu, 23 Dec 2021 18:03:30 -0500 Subject: [PATCH 22/24] Fixed delimiter bug in articles --- src/components/Article.js | 12 ++++++++---- 1 file changed, 8 insertions(+), 4 deletions(-) diff --git a/src/components/Article.js b/src/components/Article.js index 0e81ab6..e28f8ff 100644 --- a/src/components/Article.js +++ b/src/components/Article.js @@ -121,15 +121,17 @@ const Article = ({article}) => { let ind = 0; // Denote index of output let tick=false; // used to check if we're currently in formatted text. let delimiters = ['', '`', '*', '~']; // Denotes characters used to format + let tmp; for (let i = 0; i < text.length; i++) { // Iterate through input if (delimiters.indexOf(text[i]) >= 0) { // Detect Code Delimiter - + console.log(text[i]) if (tick) { // Close the code section output[++ind] = "" tick = false; + tmp = ""; - } else { // Start a new code section + } else { // Start a new code section type.push(delimiters.indexOf(text[i])); if (output.length < ind) { @@ -139,7 +141,7 @@ const Article = ({article}) => { } else if (output.length < type.length) { output[++ind] = ""; } - + tmp = ""; tick = true; } @@ -154,9 +156,11 @@ const Article = ({article}) => { } else if (output.length < type.length) { output[++ind] = "" } + + tmp = text[i] } - output[ind] += text[i] + output[ind] += tmp } return [...output.keys()].map((i)=>{ // Format text and return as jsx From d93b8a52ff2f5dd790c12c0882dd3bcf05585df4 Mon Sep 17 00:00:00 2001 From: Camerin Figueroa Date: Thu, 23 Dec 2021 18:18:58 -0500 Subject: [PATCH 23/24] Added Time information to github --- src/components/Github.js | 7 +++++++ src/components/css/Github.css | 10 +++++++++- 2 files changed, 16 insertions(+), 1 deletion(-) diff --git a/src/components/Github.js b/src/components/Github.js index 15abaaf..aa33e0d 100644 --- a/src/components/Github.js +++ b/src/components/Github.js @@ -51,6 +51,8 @@ class Github extends React.Component { if (this.props.repos.length > 0) { // Render each repo const render = this.props.repos.map((repo) =>{ + let updated = (new Date (repo.updated_at)).toLocaleString(); + let created = (new Date (repo.created_at)).toLocaleString(); return (
    @@ -74,6 +76,11 @@ class Github extends React.Component { this.renderLanguages(repo.name) // Render each language for the repo }
    +
    + Last Updated: {updated} +
    + Created: {created} +
    ); diff --git a/src/components/css/Github.css b/src/components/css/Github.css index 034044d..8173495 100644 --- a/src/components/css/Github.css +++ b/src/components/css/Github.css @@ -61,7 +61,7 @@ .repo .description { flex-grow: 1; - padding:10px; + padding:5px; } .repo .languages { @@ -82,6 +82,14 @@ color: #DAD4DF; } +.repo .times { + padding: 5px; + margin: 2px; + margin-left: 5px; + width: 100%; + text-align: start; +} + .content { margin: 25px; text-align: center; From 2016772b31e33e5c509843f0dfa309975a429d74 Mon Sep 17 00:00:00 2001 From: Camerin Figueroa Date: Fri, 24 Dec 2021 06:02:19 -0500 Subject: [PATCH 24/24] Updated literature in homepage --- src/components/Intro.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/Intro.js b/src/components/Intro.js index d3f13c0..a9d9698 100644 --- a/src/components/Intro.js +++ b/src/components/Intro.js @@ -129,7 +129,7 @@ class Intro extends React.Component {
    This website helps you access the projects that I've worked on. You can navigate at the top to different locations in the site. Within you can find information about me, - my github repositories, and some youtube videos I've posted. This website is coded with + my github repositories, and articles I've posted. This website is coded with React/Redux and hosted over Vercel. You can email me at cam@camscode.com.
    ,