{"version":3,"sources":["webpack:///./src/pages/projects.js"],"names":["Projects","styled","div","ProjectsPage","activePage","title","style","display","marginRight","verticalAlign","width","name","href","to","button","secondary","as"],"mappings":"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","file":"component---src-pages-projects-js-2d96ee58af2f2e355fdd.js","sourcesContent":["import React from 'react'\nimport styled from 'styled-components'\n\nimport {\n\tIcon,\n\tLayout,\n\tLink,\n\tQueryImage,\n\tSEO,\n\tSmall,\n\tWaveSection,\n} from 'src/components'\n\nconst Projects = styled.div`\n\tsection {\n\t\tpadding: calc(2rem + 1vw) 0;\n\n\t\t> :first-child {\n\t\t\tmargin-top: 0;\n\t\t}\n\t}\n`\n\nconst ProjectsPage = () => (\n\t<Layout activePage=\"projects\">\n\t\t<SEO title=\"Projects\" />\n\t\t<WaveSection>\n\t\t\t<p>\n\t\t\t\tHere's a brief introduction to some of the projects I've built\n\t\t\t\tor made significant contributions to! More details about some of\n\t\t\t\tthe most interesting parts of the projects coming soon...\n\t\t\t</p>\n\t\t</WaveSection>\n\n\t\t<Projects>\n\t\t\t<section>\n\t\t\t\t<h3>\n\t\t\t\t\t<QueryImage\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tdisplay: 'inline-block',\n\t\t\t\t\t\t\tmarginRight: '10px',\n\t\t\t\t\t\t\tverticalAlign: 'middle',\n\t\t\t\t\t\t\twidth: 54,\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tname=\"flock\"\n\t\t\t\t\t/>\n\t\t\t\t\tFlocking Infinity\n\t\t\t\t</h3>\n\t\t\t\t<p>\n\t\t\t\t\t{' '}\n\t\t\t\t\tFlocking Infinity is a chrome extension which replaces your\n\t\t\t\t\tnew tab in chrome with lively boids/flock simulation. The\n\t\t\t\t\tsimulation is randomly genrated and dosen't form any\n\t\t\t\t\trepetive patterns and is quite simillar to how real flock of\n\t\t\t\t\tbirds behave.\n\t\t\t\t</p>\n\t\t\t\t<p>\n\t\t\t\t\t{' '}\n\t\t\t\t\tThe Project is developed in Canvas js and is based on Craig\n\t\t\t\t\tReynolds{' '}\n\t\t\t\t\t<a href=\"https://www.red3d.com/cwr/papers/1987/boids.html\">\n\t\t\t\t\t\tpaper\n\t\t\t\t\t</a>\n\t\t\t\t\t.\n\t\t\t\t</p>\n\t\t\t\t<Small>\n\t\t\t\t\t<Link\n\t\t\t\t\t\tto=\"https://chrome.google.com/webstore/detail/flocking-infinity/pmknhocdemkjddgphkdneljlokgfejca\"\n\t\t\t\t\t\tbutton\n\t\t\t\t\t>\n\t\t\t\t\t\tWeb Store\n\t\t\t\t\t</Link>\n\t\t\t\t\t&nbsp;\n\t\t\t\t\t<Link\n\t\t\t\t\t\tto=\"https://github.com/StTronn/Boids-Chrome-Extension\"\n\t\t\t\t\t\tsecondary\n\t\t\t\t\t\tbutton\n\t\t\t\t\t>\n\t\t\t\t\t\t<Icon name=\"GitHub\" /> Code\n\t\t\t\t\t</Link>\n\t\t\t\t</Small>\n\t\t\t</section>\n\n\t\t\t<WaveSection as=\"section\">\n\t\t\t\t<h3>8-TILES</h3>\n\t\t\t\t<p>\n\t\t\t\t\t8-TILES is a web recreation of popular sliding puzzle in\n\t\t\t\t\tReact. The app also feature an solving visualizer which uses\n\t\t\t\t\tA* search algorithm and manhattan distance as weights to\n\t\t\t\t\tsolve the puzzle\n\t\t\t\t</p>\n\t\t\t\t<Small>\n\t\t\t\t\t<Link to=\"https://sttronn.github.io/8-TILES/\" button>\n\t\t\t\t\t\tPlay Game\n\t\t\t\t\t</Link>\n\t\t\t\t\t&nbsp;\n\t\t\t\t\t<Link\n\t\t\t\t\t\tto=\"https://github.com/StTronn/8-TILES\"\n\t\t\t\t\t\tsecondary\n\t\t\t\t\t\tbutton\n\t\t\t\t\t>\n\t\t\t\t\t\t<Icon name=\"GitHub\" /> Code\n\t\t\t\t\t</Link>\n\t\t\t\t</Small>\n\t\t\t</WaveSection>\n\n\t\t\t<section>\n\t\t\t\t<h3>Vibes</h3>\n\t\t\t\t<p>Online tool to generate color pallete from images. </p>\n\t\t\t\t<Small>\n\t\t\t\t\t<Link\n\t\t\t\t\t\tto=\"https://sttronn.github.io/color-pallete-generator/\"\n\t\t\t\t\t\tbutton\n\t\t\t\t\t>\n\t\t\t\t\t\tSite\n\t\t\t\t\t</Link>\n\t\t\t\t\t&nbsp;\n\t\t\t\t\t<Link\n\t\t\t\t\t\tto=\"https://github.com/StTronn/color-pallete-generator\"\n\t\t\t\t\t\tsecondary\n\t\t\t\t\t\tbutton\n\t\t\t\t\t>\n\t\t\t\t\t\t<Icon name=\"GitHub\" /> Code\n\t\t\t\t\t</Link>\n\t\t\t\t</Small>\n\t\t\t</section>\n\n\t\t\t<WaveSection as=\"section\">\n\t\t\t\t<h3>Spotify-Party</h3>\n\t\t\t\t<p>\n\t\t\t\t\tThe project allows users to create a room with friends\n\t\t\t\t\tallowing them to chat and see what others are playing.\n\t\t\t\t</p>\n\t\t\t\t<p>It is made using MERN stack, spotify api and socket.io</p>\n\t\t\t\t<Small>\n\t\t\t\t\t<Link to=\"http://3.92.116.12:3000/\" button>\n\t\t\t\t\t\tSite\n\t\t\t\t\t</Link>\n\t\t\t\t\t&nbsp;\n\t\t\t\t\t<Link\n\t\t\t\t\t\tto=\"https://github.com/StTronn/spotify-party-1.0\"\n\t\t\t\t\t\tsecondary\n\t\t\t\t\t\tbutton\n\t\t\t\t\t>\n\t\t\t\t\t\t<Icon name=\"GitHub\" /> Code\n\t\t\t\t\t</Link>\n\t\t\t\t</Small>\n\t\t\t</WaveSection>\n\n\t\t\t<section>\n\t\t\t\t<h3>\n\t\t\t\t\t<QueryImage\n\t\t\t\t\t\tname=\"Web-Cat\"\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tdisplay: 'inline-block',\n\t\t\t\t\t\t\tmarginRight: '10px',\n\t\t\t\t\t\t\tverticalAlign: 'middle',\n\t\t\t\t\t\t\twidth: 44,\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>{' '}\n\t\t\t\t\tWeb Cat\n\t\t\t\t</h3>\n\t\t\t\t<p>\n\t\t\t\t\tBuilt a market analysis tool with @Walkover by crawling 1\n\t\t\t\t\tmillion sites and categorized them. With features like\n\t\t\t\t\tsearch engine,sub-categorization, rank and size changes of\n\t\t\t\t\teach Industry for analyzing market trends\n\t\t\t\t</p>\n\t\t\t\t<p>\n\t\t\t\t\t{' '}\n\t\t\t\t\tAll of this is packed in a clean but detailed UI. The UI is\n\t\t\t\t\tdeveloped as a web app using React and is open sourced on my\n\t\t\t\t\tgithub profile.{' '}\n\t\t\t\t</p>\n\t\t\t\t<Small>\n\t\t\t\t\t<Link to=\"https://sttronn.github.io/web_cat/\" button>\n\t\t\t\t\t\tSite\n\t\t\t\t\t</Link>\n\t\t\t\t\t&nbsp;\n\t\t\t\t\t<Link\n\t\t\t\t\t\tto=\"https://github.com/StTronn/web_cat\"\n\t\t\t\t\t\tsecondary\n\t\t\t\t\t\tbutton\n\t\t\t\t\t>\n\t\t\t\t\t\t<Icon name=\"GitHub\" /> Code\n\t\t\t\t\t</Link>\n\t\t\t\t</Small>\n\t\t\t</section>\n\n\t\t\t<WaveSection as=\"section\">\n\t\t\t\t<h3>Drums-2.0</h3>\n\t\t\t\t<p>\n\t\t\t\t\tA Drum Machine made for desktop with WebAudioApi and React.\n\t\t\t\t\tIts design is based on the old and iconic roland 8080. It\n\t\t\t\t\tprovides Attach, Delay, Sustain and Release controls for\n\t\t\t\t\tevery instrument and a global reverb setting.\n\t\t\t\t</p>\n\n\t\t\t\t<Small>\n\t\t\t\t\t<Link to=\"https://sttronn.github.io/Drums-2.0/\" button>\n\t\t\t\t\t\tRock Beats\n\t\t\t\t\t</Link>\n\t\t\t\t\t&nbsp;\n\t\t\t\t\t<Link\n\t\t\t\t\t\tto=\"https://github.com/StTronn/Drums-2.0\"\n\t\t\t\t\t\tsecondary\n\t\t\t\t\t\tbutton\n\t\t\t\t\t>\n\t\t\t\t\t\t<Icon name=\"GitHub\" /> Code\n\t\t\t\t\t</Link>\n\t\t\t\t</Small>\n\t\t\t</WaveSection>\n\n\t\t\t<section>\n\t\t\t\t<h3>Music visualizer</h3>\n\t\t\t\t<p>\n\t\t\t\t\tA music frequency visualizer using D3.js and the Web Audio\n\t\t\t\t\tAPI.\n\t\t\t\t</p>\n\t\t\t\t<Small>\n\t\t\t\t\t<Link to=\"https://sttronn.github.io/d3-music-viz/\" button>\n\t\t\t\t\t\tviz\n\t\t\t\t\t</Link>\n\t\t\t\t\t&nbsp;\n\t\t\t\t\t<Link\n\t\t\t\t\t\tto=\"https://github.com/StTronn/d3-music-viz\"\n\t\t\t\t\t\tsecondary\n\t\t\t\t\t\tbutton\n\t\t\t\t\t>\n\t\t\t\t\t\t<Icon name=\"GitHub\" /> Code\n\t\t\t\t\t</Link>\n\t\t\t\t</Small>\n\t\t\t</section>\n\n\t\t\t<WaveSection as=\"section\">\n\t\t\t\t<h3>6 Degrees of Kevin Bacon</h3>\n\t\t\t\t<p>\n\t\t\t\t\tThe project find a Link between any actor in imdb database\n\t\t\t\t\tand Kevin Bacon. For Example Robert Downey Jr worked with\n\t\t\t\t\tMickey Rourke in Iron Man 2 who then worked with Kevin Bacon\n\t\t\t\t\tin Diner, therfore Robert Downey Jr and Kevin Bacon has a\n\t\t\t\t\tdegree of 2.\n\t\t\t\t</p>\n\t\t\t\t<p>\n\t\t\t\t\tIt uses a graph database created from imdb database and then\n\t\t\t\t\tuses a 2 way bfs to link the 2 actors\n\t\t\t\t</p>\n\t\t\t\t<p>\n\t\t\t\t\tThe project is inspired from the following famous{' '}\n\t\t\t\t\t<a href=\"https://oracleofbacon.org/\"> project</a> and{' '}\n\t\t\t\t\t<a href=\"https://www.cs.cornell.edu/home/kleinber/networks-book/networks-book-ch20.pdf\">\n\t\t\t\t\t\tPaper\n\t\t\t\t\t</a>\n\t\t\t\t\t.\n\t\t\t\t</p>\n\t\t\t\t<Small>\n\t\t\t\t\t<Link\n\t\t\t\t\t\tto=\"https://github.com/StTronn/Oracle-of-Kevin-Bacon\"\n\t\t\t\t\t\tsecondary\n\t\t\t\t\t\tbutton\n\t\t\t\t\t>\n\t\t\t\t\t\t<Icon name=\"GitHub\" /> Code\n\t\t\t\t\t</Link>\n\t\t\t\t</Small>\n\t\t\t</WaveSection>\n\n\t\t\t<section>\n\t\t\t\t<h3>Tetris </h3>\n\t\t\t\t<p>Tetris clone in js </p>\n\t\t\t\t<Small>\n\t\t\t\t\t<Link to=\"https://github.com/StTronn/Tetris\" button>\n\t\t\t\t\t\tplay\n\t\t\t\t\t</Link>\n\t\t\t\t\t&nbsp;\n\t\t\t\t\t<Link\n\t\t\t\t\t\tto=\"https://sttronn.github.io/Tetris/\"\n\t\t\t\t\t\tsecondary\n\t\t\t\t\t\tbutton\n\t\t\t\t\t>\n\t\t\t\t\t\t<Icon name=\"GitHub\" /> Code\n\t\t\t\t\t</Link>\n\t\t\t\t</Small>\n\t\t\t</section>\n\t\t</Projects>\n\t</Layout>\n)\n\nexport default ProjectsPage\n"],"sourceRoot":""}