Login | Register (Invite Only)
Title: Page Telegram of Amfile.org
Description: Brown Hats Collective F' Around and Find Out user of the Interwebs and Project Developer for a Cause Toward Insuring a Future of Liberty without Illusion.
@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ @@=:---#@@@#%@@@*=+#@%====@@@@..:--@#====@-==#@@@+===#@%=-+@... -@@@@*@@@=+@%-*@ @@@.*@-.@@@.:@@==@:=@+ -..*@@@:# @:@=.=. #%.#@@@@ ::..@.%#.@@ %+ %@@% #@@-.@+ #@ @@@.*@+.@@@:.@@.#@%*@*.@.-*@@%@#.@.@=.%..#% *@@@@ %:+:+:@@=@@ #+ %@@+..@@= %: @@ @@@..-.=@@:* %@.%#=+@+..:@@@@@@*.@@@=..:@@@ %@%%% :.@@+-@:=#@ ...@@@:+ @@+ :- @@ @@@.+@@@@@.- =@.#@.-@*.@:=@@@@@+ @@@+:@-:@% @@*=@ @=%#+-@-.#@ @*.%@@.- #@=. + @@ @@@.+@@@@+.@..@:*%.*@*.@%.@@@@%- +@@=:@%.@@.%@:=@ @@=*#:@::@@ *# =@--% -@:- * @@ @@-::#@@%::+::*@-:=%@::.::@@@@+-::@*:.:::@::...%:::::#@*:==@#==@+:*.:=::%:-=::=@ @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@#-. .-#@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*. .+@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@- :@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@: .@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@: .++: .@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@@@@@@@= :@@@@@@- -@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@@@@@@# =@@@@@@@@+ #@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@@@@@@: =@@@@@@@@@@+ .@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@@@@@# .@@@@@@@@@@@@. *@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@@@@@. %@@@@@@@@@@@@%. @@@@@@@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@@@@% -@@@@@@@@@@@@@@- #@@@@@@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@@@@= #@@@@@@@@@@@@@@% -@@@@@@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@@@@. .@@@@@@@@@@@@@@@@. .@@@@@@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@@@@ -@@@@%##***#%@@@@+ %@@@@@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@@@* %@#:.. .:+@% *@@@@@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@@@= =. : -@@@@@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@@@: .@@@@@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@@@. .@@@@@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@@@. .=%@@@@@@@+: .@@@@@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@@# .%@@@@@@@@@@@@@- -@@@@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@# .*@@@@@@@@@@@@@@@@%: -@@@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@%. .@@@@@@*%@@@@%#@@@@@@= *@@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@. :@@@@@@@@:-@@*.%@@@@@@@+ %@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@+ :@@@@@@@@@@---.@@@@@@@@@@= :@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@. @@@@@@@@@@@. @@@@@@@@@@@: #@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@= #@@@+--#@@@@ #@@@@%#@@@@@. .@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@. :@%- .%@@- .@@@*. .+@@= #@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@# *+. .@@@#*@@@= .#@ -@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@- .# =@@-.@@%. += .@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@. -@. @@. %@: #% %@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@. #@- +% =% .@@. *@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@% %@% :+ .+ +@@. =@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@# @@@: .: .- .@@@: -@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@* .@@@% # .# =@@@: :@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@* .@@@@= -@ @- .@@@@: :@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@# @@@@@. .@@ @@. %@@@@: -@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@% %@@@@@: :@@@ @@@. .*@@@@@. =@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@. #@@@@@@#+#@@@@ @@@@=.:%@@@@@@. *@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@. :@@@@@@-..:*@@ @@#-..:%@@@@@# %@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@- .@@@@@: .@ @. .@@@@@- .@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@# *@@@% @. .@ *@@@@ -@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@. .@@@+ @- .@. -@@@= #@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@+ +@@%. .@* :@- .*@@%. .@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@. %@@@- *@% #@%. :%@@@. %@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@* .@@@@%=-+@@@. @@@*--#@@@@- -@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@: .@@@@@@@@@@*=@@@@@@@@@@: @@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@. .%@@@@@@@@@@@@@@@@@@@- .#@@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@%. +@@@@@@@@@@@@@@@@#. +@@@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@@%. .+@@@@@@@@@@@@%: +@@@@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@@@%. -*%@@@@@#=. .*@@@@@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@@@@@: .%@@@@@@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@@@@@@#. +@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@+. .=@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@=. .-%@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@%%###%@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>BondFires - Connecting People in Real Life for Friendship and More</title>
<meta property="og:title" content="BondFires - Connecting People in Real Life for Networking, Friendship and More">
<meta property="og:description" content="Create a profile. Upload your photo auto-converted to ASCII Text Art. Add qualifiers (both good and bad) and submit with access to a contact card and QR code you can share/print to stay connected with people you encounter in real life. This resource provides a way to give strangers a means of contact before providing them more private contact information.">
<meta property="og:image" content="http://bondfires.cc/display.png">
<meta property="og:url" content="http://bondfires.cc/">
<meta property="og:type" content="website">
<link rel="icon" type="image/x-icon" href="./fav.ico">
<style>
body {
background-color: black;
color: #FFA500; /* Change green to bright orange */
font-family: monospace;
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
align-items: center;
}
.container {
width: 90%;
max-width: 600px;
padding: 20px;
text-align: center;
}
h1 {
font-size: 6vw;
}
p {
font-size: 4vw;
}
label {
font-size: 2em;
display: block;
margin-top: 10px;
}
textarea, input[type="text"], input[type="password"], input[type="file"], input[type="date"], input[type="email"] {
width: 100%;
margin-bottom: 10px;
font-size: 2em;
autocomplete: off;
}
.menu {
display: flex;
flex-direction: column;
align-items: center;
margin-bottom: 20px;
}
.menu button {
background-color: black;
color: #FFA500; /* Change green to bright orange */
border: 1px solid #FFA500; /* Change green to bright orange */
padding: 10px 20px;
margin: 5px;
cursor: pointer;
width: 100%;
font-size: 3vw;
}
.menu button:hover {
background-color: #FFA500; /* Change green to bright orange */
color: black;
}
.menu button:focus {
outline: none;
}
.menu button:active {
background-color: darkorange; /* Optional: make active state darker orange */
}
.form-container {
width: 100%;
}
@media (min-width: 768px) {
h1 {
font-size: 3vw;
}
p {
font-size: 2vw;
}
label, textarea, input[type="text"], input[type="password"], input[type="file"], input[type="date"], input[type="email"], .menu button {
font-size: 1.5vw;
}
}
</style>
</head>
<body>
<div class="container">
<h1>The Connection Site that Encourages Real Life Encounters for Networking, Friendship Building & More!</h1>
<tt> <p>Create your profile and upload a photo, which will be converted to text art. Add your personal qualities—both strengths and quirks—separated by commas. Submit your profile and produce a printable contact card, helping you stay connected with people you meet in real life without giving out your private contact information.</p>
</tt>
<div class="menu">
<button data-action="1">[1.] Create Profile</button>
<button data-action="2">[2.] View a Profile w/ Code</button>
<button data-action="3">[3.] Change Profile Details</button>
<button data-action="4">[4.] Generate Profile Card</button>
<button data-action="5">[5.] Send / Check Messages</button>
<button data-action="6">[6.] Delete Profile</button>
<button data-action="7">[7.] Clear Screen</button>
</div>
<div id="content" class="form-container"></div>
</div>
<script>
document.querySelectorAll('.menu button').forEach(button => {
button.addEventListener('click', function() {
const action = this.getAttribute('data-action');
document.getElementById('content').innerHTML = '';
switch (action) {
case '1':
displayAddProfileForm();
break;
case '2':
displayLoadProfileForm();
break;
case '3':
displayChangeProfileForm();
break;
case '4':
displayGenerateProfileCardForm();
break;
case '5':
displaySendMessageForm();
break;
case '6':
displayDeleteProfileForm();
break;
case '7':
clearScreen();
break;
default:
break;
}
});
});
function displayAddProfileForm() {
document.getElementById('content').innerHTML = `
<form action="add_profile.php" method="POST" enctype="multipart/form-data" autocomplete="off">
<label for="photo">Upload Photo:</label>
<input type="file" id="photo" name="photo" accept=".jpg,.jpeg,.gif,.png" required><br>
<label for="name">Name:</label>
<input type="text" id="name" name="name" required autocomplete="off"><br>
<label for="dob">Date of Birth:</label>
<input type="date" id="dob" name="dob" required autocomplete="off"><br>
<label for="motto">Motto or Favorite Quote:</label>
<input type="text" id="motto" name="motto" required autocomplete="off"><br>
<label for="hobbies">Hobbies and Interests:</label>
<input type="text" id="hobbies" name="hobbies" required autocomplete="off"><br>
<label for="summary">Summary:</label>
<textarea id="summary" name="summary" maxlength="800" required autocomplete="off"></textarea><br>
<label for="positive">Positive Qualifiers:</label>
<input type="text" id="positive" name="positive" required autocomplete="off"><br>
<label for="negative">Qualifiers You Should Know First:</label>
<input type="text" id="negative" name="negative" required autocomplete="off"><br>
<label for="email">Email (optional):</label>
<input type="email" id="email" name="email" autocomplete="off"><br>
<label for="password">Password:</label>
<input type="password" id="password" name="password" required autocomplete="new-password"><br>
<input type="submit" value="Submit">
</form>
`;
}
function displayLoadProfileForm() {
document.getElementById('content').innerHTML = `
<form action="load_profile.php" method="POST" autocomplete="off">
<label for="filename">Enter Profile Code:</label>
<input type="text" id="filename" name="filename" required autocomplete="off"><br>
<input type="submit" value="Load Profile">
</form>
`;
}
function displayChangeProfileForm() {
document.getElementById('content').innerHTML = `
<form action="change_profile.php" method="POST" autocomplete="off">
<label for="filename">Enter Profile Code:</label>
<input type="text" id="filename" name="filename" required autocomplete="off"><br>
<label for="password">Enter Password:</label>
<input type="password" id="password" name="password" required autocomplete="new-password"><br>
<input type="submit" value="Load Profile">
</form>
`;
}
function displayGenerateProfileCardForm() {
document.getElementById('content').innerHTML = `
<form action="generate_profile_card.php" method="POST" autocomplete="off">
<label for="filename">Enter Profile Code:</label>
<input type="text" id="filename" name="filename" required autocomplete="off"><br>
<label for="password">Enter Password:</label>
<input type="password" id="password" name="password" required autocomplete="new-password"><br>
<input type="submit" value="Generate Profile Card">
</form>
`;
}
function displaySendMessageForm() {
document.getElementById('content').innerHTML = `
<form action="send_message.php" method="POST" autocomplete="off">
<label for="sender">Enter Your Profile Code:</label>
<input type="text" id="sender" name="sender" required autocomplete="off"><br>
<label for="password">Enter Your Password:</label>
<input type="password" id="password" name="password" required autocomplete="new-password"><br>
<label for="receiver">Enter Recipient Profile Code (Optional):</label>
<input type="text" id="receiver" name="receiver" autocomplete="off"><br>
<textarea name="message" placeholder="Type your message here" autocomplete="off"></textarea><br>
<input type="submit" value="Send/Check Messages">
</form>
`;
}
function displayDeleteProfileForm() {
document.getElementById('content').innerHTML = `
<form action="delete_profile.php" method="POST" autocomplete="off">
<label for="filename">Enter Profile Code:</label>
<input type="text" id="filename" name="filename" required autocomplete="off"><br>
<label for="password">Enter Password:</label>
<input type="password" id="password" name="password" required autocomplete="new-password"><br>
<input type="submit" value="Delete Profile">
</form>
`;
}
function clearScreen() {
document.getElementById('content').innerHTML = '';
window.location.reload();
}
</script>
<footer><tt>BondFires is a Project by Page Telegram in Designing for a Better World</tt></footer>
</body>
</html>