dominic/portfolio
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions
portfolio/index.html

658 lines
28 KiB
HTML
Raw Blame History

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Dominic DiTaranto - Portfolio</title>
<link rel="stylesheet" href="./assets/css/style.css">
<script type="text/javascript" src="./assets/js/renderer.js" defer></script>
<script type="text/javascript" src="./assets/js/constants.js" defer></script>
<script type="text/javascript" src="./assets/js/player.js" defer></script>
<script type="text/javascript" src="./assets/js/window.js" defer></script>
<script type="text/javascript" src="./assets/js/terminal.js" defer></script>
<script type="text/javascript" src="./assets/js/games.js" defer></script>
<script type="text/javascript" src="./assets/js/music.js" defer></script>
<script type="text/javascript" src="./assets/js/resume.js" defer></script>
<script type="text/javascript" src="./assets/js/portfolio.js" defer></script>
<script type="text/javascript" src="./assets/js/contact.js" defer></script>
<script type="text/javascript" src="./assets/js/dialog.js" defer></script>
<script type="text/javascript" src="./assets/js/indicator.js" defer></script>
<script type="text/javascript" src="./assets/js/keystroke.js" defer></script>
<script type="text/javascript" src="./assets/js/app.js" defer></script>
<script type="text/javascript" src="./assets/js/pathfinder.js" defer></script>
</head>
<body>
<div class="outer-container">
<div class="container">
<h1 style="margin-bottom: -3px;">Dominic DiTaranto</h1>
Software Developer & Architect
</div>
<div class="container" style="margin-bottom: 4px;">
<div class="nav-bar">
<center>
<button onclick="contact.hide(); resume.hide(); games.hide(); portfolio.show(); dialog.hide()">💼 View Portfolio</button>
<button onclick="contact.hide(); portfolio.hide(); games.hide(); resume.show();dialog.hide();">📄 Download Resume</button>
<button onclick="resume.hide(); games.hide(); portfolio.hide(); contact.show(); dialog.hide();">📧 Contact Me</button>
<button onclick="contact.hide(); resume.hide(); portfolio.hide(); games.show(); dialog.hide()">🕹️ Play Games</button>
</center>
</div>
</div>
<div class="container">
<canvas id="canvas"></canvas>
<button id="on-screen-controller-button" onclick="toggleController()">🎮 Toggle On Screen Controller</button>
<span class="indicator" id='resume-indicator'></span>
<span class="indicator" id='portfolio-indicator'></span>
<span class="indicator" id='computer-indicator'></span>
<span class="indicator" id='tv-indicator'></span>
<span class="indicator" id='guitar-indicator'></span>
<div class="dialog" id="dialog">
<span id="dialog-text"></span>
<div class="enter-indicator" id="enter-indicator">PRESS ENTER</div>
</div>
<div class="click-map">
<img src="./assets/img/empty2.png" usemap="#click-map" alt="">
</div>
<map name="click-map" id="click-map"></map>
<!---->
<!-- <area shape="rect" href="#" onclick="console.log('hi'); pathfind(0, 0)" coords="0,0,80,80"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(0, 1)" coords="0,80,80,160"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(0, 2)" coords="0,160,80,240"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(0, 3)" coords="0,240,80,320"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(0, 4)" coords="0,320,80,400"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(0, 5)" coords="0,400,80,480"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(0, 6)" coords="0,480,80,560"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(0, 7)" coords="0,560,80,640"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(0, 8)" coords="0,640,80,720"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(1, 0)" coords="80,0,160,80"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(1, 1)" coords="80,80,160,160"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(1, 2)" coords="80,160,160,240"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(1, 3)" coords="80,240,160,320"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(1, 4)" coords="80,320,160,400"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(1, 5)" coords="80,400,160,480"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(1, 6)" coords="80,480,160,560"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(1, 7)" coords="80,560,160,640"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(1, 8)" coords="80,640,160,720"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(2, 0)" coords="160,0,240,80"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(2, 1)" coords="160,80,240,160"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(2, 2)" coords="160,160,240,240"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(2, 3)" coords="160,240,240,320"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(2, 4)" coords="160,320,240,400"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(2, 5)" coords="160,400,240,480"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(2, 6)" coords="160,480,240,560"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(2, 7)" coords="160,560,240,640"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(2, 8)" coords="160,640,240,720"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(3, 0)" coords="240,0,320,80"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(3, 1)" coords="240,80,320,160"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(3, 2)" coords="240,160,320,240"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(3, 3)" coords="240,240,320,320"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(3, 4)" coords="240,320,320,400"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(3, 5)" coords="240,400,320,480"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(3, 6)" coords="240,480,320,560"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(3, 7)" coords="240,560,320,640"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(3, 8)" coords="240,640,320,720"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(4, 0)" coords="320,0,400,80"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(4, 1)" coords="320,80,400,160"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(4, 2)" coords="320,160,400,240"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(4, 3)" coords="320,240,400,320"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(4, 4)" coords="320,320,400,400"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(4, 5)" coords="320,400,400,480"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(4, 6)" coords="320,480,400,560"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(4, 7)" coords="320,560,400,640"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(4, 8)" coords="320,640,400,720"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(5, 0)" coords="400,0,480,80"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(5, 1)" coords="400,80,480,160"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(5, 2)" coords="400,160,480,240"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(5, 3)" coords="400,240,480,320"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(5, 4)" coords="400,320,480,400"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(5, 5)" coords="400,400,480,480"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(5, 6)" coords="400,480,480,560"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(5, 7)" coords="400,560,480,640"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(5, 8)" coords="400,640,480,720"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(6, 0)" coords="480,0,560,80"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(6, 1)" coords="480,80,560,160"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(6, 2)" coords="480,160,560,240"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(6, 3)" coords="480,240,560,320"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(6, 4)" coords="480,320,560,400"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(6, 5)" coords="480,400,560,480"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(6, 6)" coords="480,480,560,560"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(6, 7)" coords="480,560,560,640"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(6, 8)" coords="480,640,560,720"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(7, 0)" coords="560,0,640,80"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(7, 1)" coords="560,80,640,160"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(7, 2)" coords="560,160,640,240"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(7, 3)" coords="560,240,640,320"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(7, 4)" coords="560,320,640,400"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(7, 5)" coords="560,400,640,480"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(7, 6)" coords="560,480,640,560"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(7, 7)" coords="560,560,640,640"/> -->
<!-- <area shape="rect" href="#" onclick="pathfind(7, 8)" coords="560,640,640,720" /> -->
<!---->
<!-- </map> -->
<div class="controls" id="controls">
<img src="./assets/img/sprites/controls.png" alt="" usemap="#dpadmap">
</div>
<map name="dpadmap">
<!-- up -->
<area
shape="rect"
coords="110,55,180,120"
href="#"
onclick="player.move('up')"
/>
<!-- down -->
<area
shape="rect"
coords="110,180,180,250"
href="#"
onclick="player.move('down')"
/>
<!-- left -->
<area
shape="rect"
coords="50,125,110,190"
href="#"
onclick="player.move('left')"
/>
<!-- right -->
<area
shape="rect"
coords="170,110,240,190"
href="#"
onclick="player.move('right')"
/>
<!-- A-button -->
<area
shape="rect"
coords="580,110,680,190"
href="#"
onclick="onEnter()"
/>
</map>
<!-- Terminal -->
<div class="window-container" id="term-container">
<div class="window-bar">
<div style="float:inline-start;">
💻 Terminal
</div>
<div style="float:inline-end;">
<button class="close-button" onclick="terminal.hide()">X</button>
</div>
<div style="clear:both;"></div>
</div>
<div id="term">
DD-Term 1.0.0 (main, Dec 14 2025, 23:35:36) on javascript <br>
Type "help" for more information.<br>
<div id="prompt-container" class="prompt-container"></div>
</div>
</div>
<!-- Contact -->
<div class="window-container" id="contact-container">
<div class="window-bar">
<div style="float:inline-start;">
📄 Contact Me
</div>
<div style="float:inline-end;">
<button class="close-button" onclick="contact.hide()">X</button>
</div>
<div style="clear:both;"></div>
</div>
<div id="contact">
<h3>Contact Me:</h3>
Feel free to contact me with a job offering or for freelance work.
<p>
<b>EMAIL:</b> <a href= "mailto:me@domdit.com">me@domdit.com</a><br>
<b>XMPP:</b> domdit@xmpp.jp
</p>
</div>
</div>
<!-- Resume -->
<div class="window-container" id="resume-container">
<div class="window-bar">
<div style="float:inline-start;">
📄 Resume
</div>
<div style="float:inline-end;">
<button class="close-button" onclick="resume.hide()">X</button>
</div>
<div style="clear:both;"></div>
</div>
<div id="resume">
<a class="download-resume" href="./assets/docs/resume.pdf"><button>💾 Download</button></a>
<object data="./assets/docs/resume.pdf#toolbar=0" type="application/pdf" width="100%" height="100%">
<p>Unable to display PDF file. <a href="./assets/docs/resume.pdf">Download</a> instead.</p>
</object>
</div>
</div>
<!-- Portfolio -->
<div class="window-container" id="portfolio-container">
<div class="window-bar">
<div style="float:inline-start;">
💼 Portfolio
</div>
<div style="float:inline-end;">
<button class="close-button" onclick="portfolio.hide()">X</button>
</div>
<div style="clear:both;"></div>
</div>
<div id="portfolio">
<div class="games-inner-container">
<!-- Homemaker -->
<div class="portfolio-item">
<div class="game-thumbnail-container">
<img src="./assets/img/thumbnails/homemaker.png" alt="">
</div>
<div class="game-description-container">
<u><h3>Homemaker</h3></u>
<b>Description:</b> Custom self-hostable browser homepage. Simple generation via a config file. Functionality for multiple backgrounds and color choices available. Also enables VIM style keybinding for access to your favorite websites without needing to touch a mouse.<br><br>
<b>Technology:</b> Python, Javascript
<br>
<br>
<a href="https://git.domdit.com/dominic/homemaker" target="_blank">
<button>🐙 GitHub</button>
</a>
<a href="https://home.domdit.com/" target="_blank">
<button>🌐 Live Demo</button>
</a>
</div>
<div style="clear:both;"></div>
</div>
<hr>
<!-- Korabo -->
<div class="portfolio-item">
<div class="game-thumbnail-container">
<img src="./assets/img/thumbnails/korabo.png" alt="">
</div>
<div class="game-description-container">
<u><h3>Korabo</h3></u>
<b>Description:</b> Collaborative planning application. Create a prospective event and select a date range in which the event may take place. Share the event with friends/coworkers to provide the days and times they are available. This was built in order to solve the issue of coordinating the hectic schedules of my band members. <br><br>
<b>Technology:</b> Python, Django, JavaScript
<br>
<br>
<a href="https://git.domdit.com/dominic/korabo" target="_blank">
<button>🐙 GitHub</button>
</a>
</div>
<div style="clear:both;"></div>
</div>
<hr>
<!-- Asteroids -->
<div class="portfolio-item">
<div class="game-thumbnail-container">
<img src="./assets/img/thumbnails/asteroids.png" alt="">
</div>
<div class="game-description-container">
<u><h3>Asteroids</h3></u>
<b>Description:</b> Asteroids port with a few extra features like power ups and a space ship that shoots homing missiles at you. <br><br>
<b>Technology:</b> p5.js, JavaScript
<br>
<br>
<a href="https://git.domdit.com/dominic/asteroids" target="_blank">
<button>🐙 GitHub</button>
</a>
<a href="https://asteroids.domdit.com/" target="_blank">
<button>🌐 Live Demo</button>
</a>
</div>
<div style="clear:both;"></div>
</div>
<hr>
<!-- Sokobanya -->
<div class="portfolio-item">
<div class="game-thumbnail-container">
<img src="./assets/img/thumbnails/sokobanya.png" alt="">
</div>
<div class="game-description-container">
<u><h3>Sokobanya</h3></u>
<b>Description:</b> A puzzle game where you are an old man pushing coal onto burners to keep your sauna hot! <br><br>
<b>Technology:</b> JavaScript
<br>
<br>
<a href="https://git.domdit.com/dominic/sokobanya" target="_blank">
<button>🐙 GitHub</button>
</a>
<a href="https://sokobanya.domdit.com/" target="_blank">
<button>🌐 Live Demo</button>
</a>
</div>
<div style="clear:both;"></div>
</div>
<hr>
<!-- Forum -->
<div class="portfolio-item">
<div class="game-thumbnail-container">
<img src="./assets/img/thumbnails/cwr.png" alt="">
</div>
<div class="game-description-container">
<u><h3>CWR Forum</h3></u>
<b>Description:</b> Forum software I made for one of the online communities I am a part of. Includes profile management, full-fledged forum, admin management pages to control user membership status. <br><br>
<b>Technology:</b> Python, Django, JavaScript
<br>
<br>
<a href="https://git.domdit.com/dominic/cwr" target="_blank">
<button>🐙 GitHub</button>
</a>
</div>
<div style="clear:both;"></div>
</div>
<hr>
<!-- Chord Tone -->
<div class="portfolio-item">
<div class="game-thumbnail-container">
<img src="./assets/img/thumbnails/chordtone.png" alt="">
</div>
<div class="game-description-container">
<u><h3>Chord Tone Map Generator</h3></u>
<b>Description:</b> Generates a guitar fretboard populated with notes applicable for improvisation over user-provided chords. Advanced improvisation over complex chords made simple. <br><br>
<b>Technology:</b> Python, Flask, JavaScript
<br>
<br>
<a href="https://git.domdit.com/dominic/chord_tone" target="_blank">
<button>🐙 GitHub</button>
</a>
<a href="https://chordtone.domdit.com/" target="_blank">
<button>🌐 Live Demo</button>
</a>
</div>
<div style="clear:both;"></div>
</div>
<hr>
<!-- Pysokoban -->
<div class="portfolio-item">
<div class="game-thumbnail-container">
<img src="./assets/img/thumbnails/pysokoban.png" alt="">
</div>
<div class="game-description-container">
<u><h3>Pysokoban</h3></u>
<b>Description:</b> Similar to Sokobanya above: This is a Python port of the same game. All of the gameplay takes place in the terminal. This version includes 500+ more levels! <br><br>
<b>Technology:</b> Python
<br>
<br>
<a href="https://git.domdit.com/dominic/pysokoban" target="_blank">
<button>🐙 GitHub</button>
</a>
</div>
<div style="clear:both;"></div>
</div>
<hr>
<!-- Shrinkin Minkin Website -->
<div class="portfolio-item">
<div class="game-thumbnail-container">
<img src="./assets/img/thumbnails/minkin-site.png" alt="">
</div>
<div class="game-description-container">
<u><h3>Shrinkin-Minkin Website</h3></u>
<b>Description:</b> Website I made for my band. There is some interesting functionality under the hood like: Autogenerating link-trees, newsletter subscription and pages for advertising new releases without enforced ads (interrupting our music) from social media sites. <br><br>
<b>Technology:</b> Python, Django, JavaScript
<br>
<br>
<a href="https://git.domdit.com/dominic/shrinkinminkin/src/branch/master/shrinkinminkin" target="_blank">
<button>🐙 GitHub</button>
</a>
<a href="https://www.shrinkinminkin.com/" target="_blank">
<button>🌐 Live Demo</button>
</a>
</div>
<div style="clear:both;"></div>
</div>
<hr>
<!-- Webring -->
<div class="portfolio-item">
<div class="game-thumbnail-container">
<img style="background-color:black;" src="./assets/img/thumbnails/tilde-webring.png" alt="">
</div>
<div class="game-description-container">
<u><h3>NoJS Webring</h3></u>
<b>Description:</b> Simple webring that does not require users to add JavaScript to their page. Instead, the webring host handles the JavaScript, and the users simply need to add a block of HTML code. This allows for users who like to keep a minimal website free from bulky JavaScript and calling CDNs. Currently used by at least 2 live webrings (that I know of).<br><br>
<b>Technology:</b> JavaScript
<br>
<br>
<a href="https://git.domdit.com/dominic/nojs-webring" target="_blank">
<button>🐙 GitHub</button>
</a>
<a href="https://tilde.green/~jigong/tilde-ring/" target="_blank">
<button>🌐 Live Demo</button>
</a>
</div>
<div style="clear:both;"></div>
</div>
<hr>
<!-- Pong -->
<div class="portfolio-item">
<div class="game-thumbnail-container">
<img src="./assets/img/thumbnails/pong.png" alt="">
</div>
<div class="game-description-container">
<u><h3>Pong</h3></u>
<b>Description:</b> You know I had to do it. One of my first coding projects, PONG!<br><br>
<b>Technology:</b> p5.js, JavaScript
<br>
<br>
<a href="https://pong.domdit.com/" target="_blank">
<button>🌐 Live Demo</button>
</a>
</div>
<div style="clear:both;"></div>
</div>
<hr>
<!-- Alambi -->
<div class="portfolio-item">
<div class="game-thumbnail-container">
<img src="./assets/img/thumbnails/alambi.png" alt="">
</div>
<div class="game-description-container">
<u><h3>Alambi</h3></u>
<b>Description:</b>Alambi is a blogging engine made with the Python micro-framework Flask. Provides a simple and elegant blogging solution with complete customization of colors and layout. <br><br>
<b>Technology:</b> Python, Flask
<br>
<br>
<a href="https://github.com/domdit/Alambi" target="_blank">
<button>🐙 GitHub</button>
</a>
</div>
<div style="clear:both;"></div>
</div>
<hr>
<!-- Buleku -->
<div class="portfolio-item">
<div class="game-thumbnail-container">
<img src="./assets/img/thumbnails/buleku.png" alt="">
</div>
<div class="game-description-container">
<u><h3>Buleku - Manchu/English/Chinese Dictionary</h3></u>
<b>Description:</b> The first online Manchu Dictionary. This was used extensively by my classmates and I for a few years during my time at university. Manchu is a dead language and there were no online dictionaries at the time. Now there are a few reputable ones that I would recommend over this. I am still very proud of this project because it proved to me that I <i>can</i> become a software developer. This is truly my first ever project, made over 6 years ago (excluding the silly geocities sites I made in the early 2000s). <br><br>
<b>Technology:</b> JavaScript
<br>
<br>
<a href="https://github.com/domdit/buleku" target="_blank">
<button>🐙 GitHub</button>
</a>
</div>
<div style="clear:both;"></div>
</div>
</div>
</div>
</div>
<!-- Music -->
<div class="window-container" id="music-container">
<div class="window-bar">
<div style="float:inline-start;">
🎸 Music
</div>
<div style="float:inline-end;">
<button class="close-button" onclick="music.hide()">X</button>
</div>
<div style="clear:both;"></div>
</div>
<div id="music" class="music-inner-container">
<center>
<div id="album-thumb">
<img id="album-art" src="./assets/img/thumbnails/shrinkinminkin.jpg" alt=""><br>
<div class="audio-controls">
<span onclick="music.prev()">⏮</span>
<span onclick="music.resume()">▶</span>
<span onclick="music.pause()">⏸</span>
<span onclick="music.next()">⏭</span>
</div>
Currently Playing: <span id="currently-playing">None</span>
<br>
<br>
</div>
<table>
<tr>
<th>Song</th>
<th>Artist</th>
<th>Album</th>
<th>Actions</th>
</tr>
<tr>
<td>Down Polypore Wood</td>
<td>shrinkin-minkin</td>
<td>Tyrannizing Harmonics</td>
<td><a href="#" onclick="music.play('Down Polypore Wood')">play</a></td>
</tr>
<tr>
<td>Sneaking Out Alone</td>
<td>shrinkin-minkin</td>
<td>Tyrannizing Harmonics</td>
<td><a href="#" onclick="music.play('Sneaking Out Alone')">play</a></td>
</tr>
<tr>
<td>Ritual Dance of The...</td>
<td>shrinkin-minkin</td>
<td>Tyrannizing Harmonics</td>
<td><a href="#" onclick="music.play('Ritual Dance of The Cavern Walls Cult')">play</a></td>
</tr>
<tr>
<td>Tatari</td>
<td>Dominic Ditaranto</td>
<td>Tatari</td>
<td><a href="#" onclick="music.play('Tatari')">play</a></td>
</tr>
<tr>
<td>Buranko</td>
<td>Dominic Ditaranto</td>
<td>Tatari</td>
<td><a href="#" onclick="music.play('Buranko')">play</a></td>
</tr>
<tr>
<td>New Jersey Again</td>
<td>Dominic Ditaranto</td>
<td>Chicago-New Jersey</td>
<td><a href="#" onclick="music.play('New Jersey Again')">play</a></td>
</tr>
<tr>
<td>Asteroids</td>
<td>Dominic Ditaranto</td>
<td>Amphibians And Asteroids</td>
<td><a href="#" onclick="music.play('Asteroids')">play</a></td>
</tr>
</table>
<span style="font-size: 12px;">
I am the singer, guitarist and composer for the band <a href="https://shrinkinminkin.com/" target="_blank">shrinkin-minkin</a> <br>All songs by Dominic DiTaranto are from my <a href="https://dominicditaranto.bandcamp.com/" target="_blank">solo project</a>
</span>
</center>
</div>
</div>
<!-- Games -->
<div class="window-container" id="games-container">
<div class="window-bar">
<div style="float:inline-start;">
🕹️ Games
</div>
<div style="float:inline-end;">
<button class="close-button" onclick="games.hide()">X</button>
</div>
<div style="clear:both;"></div>
</div>
<div id="games" class="games-inner-container">
Take a break and enjoy the games I have made!
<br>
<br>
<div class="single-game-container" onclick="window.open('https://asteroids.domdit.com', '_blank')">
<div class="game-thumbnail-container">
<img src="./assets/img/thumbnails/asteroids.png" alt="">
</div>
<div class="game-description-container">
<u><h3>Asteroids</h3></u>
<b>Description:</b> Asteroids port with a few extra features like power ups and a space ship that shoots homing missiles at you. <br><br>
<b>Technology:</b> p5.js, JavaScript
</div>
<div style="clear:both;"></div>
</div>
<div class="single-game-container" onclick="window.open('https://sokobanya.domdit.com', '_blank')">
<div class="game-thumbnail-container">
<img src="./assets/img/thumbnails/sokobanya.png" alt="">
</div>
<div class="game-description-container">
<u><h3>Sokobanya</h3></u>
<b>Description:</b> A puzzle game where you are an old man pushing coal onto burners to keep your sauna hot! <br><br>
<b>Technology:</b> JavaScript
</div>
<div style="clear:both;"></div>
</div>
<div class="single-game-container" onclick="window.open('https://git.domdit.com/dominic/scoundrel', '_blank')">
<div class="game-thumbnail-container">
<img src="./assets/img/thumbnails/scoundrel.png" alt="">
</div>
<div class="game-description-container">
<u><h3>Scoundrel</h3></u>
<b>Description:</b> TUI port of the rogue-like card game. I was inspired by Balatro to code a card game for the terminal.<br><br>
<b>Technology:</b> Python
</div>
<div style="clear:both;"></div>
</div>
<div class="single-game-container" onclick="window.open('https://pong.domdit.com', '_blank')">
<div class="game-thumbnail-container">
<img src="./assets/img/thumbnails/pong.png" alt="">
</div>
<div class="game-description-container">
<u><h3>Pong</h3></u>
<b>Description:</b> You know I had to do it. One of my first coding projects, PONG!<br><br>
<b>Technology:</b> p5.js, JavaScript
</div>
<div style="clear:both;"></div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
Reference in a new issue View git blame Copy permalink