Skip to content

Automatic rebuild onsave, prettier frontend, and actual readme #3

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
mathcoder3141 wants to merge 1 commit into
base: master
Choose a base branch
from
Open

Automatic rebuild onsave, prettier frontend, and actual readme #3

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
26 changes: 22 additions & 4 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,22 @@
TODO:
- Actual readme
- Transparency support
- Prettier frontend
# Partify

## What does this actually do?
- Great question! The magic behind the scenes takes an image and applies a Red, Blue, Green, Aplha (RGBA) filter to the image. The RGBA filter is what gives the illusion this image is having a party.

## I love this! Do I need to download anything to get started?
- Nope! This web application is deployed to heroku. You can get started with Partify by clicking [this link](https://ancient-fjord-96143.herokuapp.com/).

## How can I see this in action?
- Original image:

![LGBT Heart](static/images/lgbtheart.png)

- Party Image:

![LGBT Heart Party](static/images/party_lgbtheart.gif)

## I want to contribute. How can I contribute?
- We're always accepting pull requests. So fork the repo and then start developing.

## TODO:
- Transparency support
2 changes: 2 additions & 0 deletions docker-compose.yml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,5 +2,7 @@ version: '3'
services:
app:
build: .
volumes:
- .:/app
ports:
- "3333:3333"
2 changes: 1 addition & 1 deletion partify/webapp.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ async def partify_image(request):
request_body = await request.post()
try:
result = partify(request_body['image'].file.read())
except KeyError:
except AttributeError:
return web.json_response({'error': 'Missing image'}, status=400)
except IOError:
return web.json_response({'error': 'Image could not be processed'}, status=400)
Expand Down
56 changes: 43 additions & 13 deletions static/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,8 +1,27 @@
<!doctype html>
<html>
<html lang="en" xmlns="http://www.w3.org/1999/html">
<head>
<title>Partify</title>
<link rel="stylesheet" href="css/styles.css">
<title>🎉 Partify 🎉</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
<style>
.bg-success {
background-color:#FFFFFF !important;
}
.bg-warning {
background-color:#4ecdc4 !important;
}

.btn-primary {
background-color:#FF6b6b !important;
border: 1px solid #000000;

}
</style>
<script>
partify = (event) => {
event.preventDefault();
Expand All @@ -25,14 +44,25 @@
</script>
</head>
<body>
<h1>Partify</h1>
<p>
Every emoji should be a party
</p>
<form onsubmit="partify(event)">
<input type="file" />
<input type="submit" value="Partify"/>
</form>
<div id="rendered-gif"></div>
<center>
<h1>Partify</h1>
<h2>🥳 Every emoji should be a party 🥳</h2>
</center>
<br>
<div class="container-fluid">
<div class="row">
<div class="col bg-success">Before:</div>
<div class="col-6 bg-warning">
<form class="form-signin" onsubmit="partify(event)">
<center>
<h1 class="h3 mb-3 font-weight-normal">Select an image file</h1>
</center>
<input type="file" class="form-control-file" />
<input class="btn btn-lg btn-primary btn-block" type="submit" value="🎉 &nbsp; Partify" />
</form>
</div>
<div class="col bg-success" id="rendered-gif">After:</div>
</div>
</div>
</body>
</html>
</html>