Create a gist now

Instantly share code, notes, and snippets.

[ Posted by Jonathan ] update2 for stasis
<style>
*{
top: 0px;
margin: 0px;
padding: 0px;
font-family: sans-serif;
}
.form_group{
display: block;
margin-bottom: 10px;
}
.form_group label{
font-size: 15px;
font-weight: bold;
display: block;
}
.form_group input[type='text'] {
width: 80%;
}
input[type='submit'] {
background-color: orangered;
padding: 10px 15px;
border: 0px;
outline: 0px;
color: white;
margin-top: 10px;
font-weight: bold;
font-size: 15px;
}
.broadcaster_info{
position: relative;
width: 100%;
padding: 10px;
}
.broadcaster_info .form_group{
display: inline-block;
width: 20%;
}
/* accordion begin */
.accordion{
min-height: 200px;
background-color: #ddd;
}
.accordion_header {
position: relative;
width: 100%;
height: 30px;
background-color: orangered;
color: white;
line-height: 30px;
border-bottom: 1px solid red;
}
.accordion_header strong {
margin-left: 20px;
}
.accordion_content {
position: relative;
height: auto;
padding: 0px 20px;
-webkit-transition: all 0.5s linear;
transition: all 0.5s linear;
}
/* accordion end */
</style>
<b>update</b>
<form method="POST" style="width: 98%;">
<h1>
Profile builder
</h1>
<p style="padding-bottom: 10px;">
Please note: this is not an official profile builder (nor do I even know if that exists). This is a free tool. If you have paid for this, you are being ripped of.
</p>
<div class="accordion">
<div class="accordion_header header1" onclick="accordion_open(1)">
<strong>General</strong>
</div>
<div class="accordion_content content1">
<div class="broadcaster_info">
<div class="form_group">
<label for="broadcaster_name">Broadcaster(s) name</label>
<input name="broadcaster_name" type="text" value="<?php refillField('broadcaster_name');?>"/>
</div><div class="form_group">
<label for="broadcaster_url">Broadcaster(s) profile</label>
<input name="broadcaster_url" type="text" value="<?php refillField('broadcaster_url');?>"/>
</div><div class="form_group">
<label for="broadcaster_age">Broadcaster(s) age</label>
<input name="broadcaster_age" type="text" value="<?php refillField('broadcaster_age');?>"/>
</div><div class="form_group">
<label for="broadcaster_height">Broadcaster(s) height</label>
<input name="broadcaster_height" type="text" value="<?php refillField('broadcaster_height');?>"/>
</div><div class="form_group">
<label for="broadcaster_size">Broadcaster(s) size in cm</label>
<input name="broadcaster_size" type="text" value="<?php refillField('broadcaster_size');?>"/>
</div>
</div>
</div>
<div class="accordion_header header2" onclick="accordion_open(2)">
<strong>Header</strong>
</div>
<div class="accordion_content content2">
<div class="form_group">
<label for="enable_header">Enable header</label>
<input type="checkbox" id="enable_header" name="enable_header" value="Yes" <?php recheckField('enable_header'); ?>> Yes<br>
<div id="header_group" <?php if(recheckField('enable_header') == false){echo 'hidden';}; ?>>
<strong>Image</strong>
<label for="enable_header_profile_image">Enable header profile image</label>
<input type="checkbox" id="enable_header_profile_image" name="enable_header_profile_image" value="Yes"<?php recheckField('enable_header_profile_image'); ?>> Yes<br>
<strong>Name</strong>
<label for="enable_header_profile_name">Enable header profile name</label>
<input type="checkbox" id="enable_header_profile_name" name="enable_header_profile_name" value="Yes"<?php recheckField('enable_header_profile_name'); ?>> Yes<br>
<input type="radio" name="header_name_align" value="left" <?php reselectRadio('header_name_align', 'left');?>> left<br>
<input type="radio" name="header_name_align" value="center" <?php reselectRadio('header_name_align', 'center');?>> center<br>
<input type="radio" name="header_name_align" value="right" <?php reselectRadio('header_name_align', 'right');?>> right<br>
<input type="radio" name="header_name_align" value="justify" <?php reselectRadio('header_name_align', 'justify');?>> justified<br>
<strong>stats</strong>
<label for="enable_header_profile_stats">Enable header profile stats</label>
<input type="checkbox" id="enable_header_profile_stats" name="enable_header_profile_stats" value="Yes"<?php recheckField('enable_header_profile_stats'); ?>> Yes<br>
<input type="radio" name="header_stats_align" value="left" <?php reselectRadio('header_stats_align', 'left');?>> left<br>
<input type="radio" name="header_stats_align" value="center" <?php reselectRadio('header_stats_align', 'center');?>> center<br>
<input type="radio" name="header_stats_align" value="right" <?php reselectRadio('header_stats_align', 'right');?>> right<br>
<input type="radio" name="header_stats_align" value="justify" <?php reselectRadio('header_stats_align', 'justify');?>> justified<br>
<strong>Background</strong>
<div class="form_group">
<label for="header_background_image">Background image url(no upload)</label>
<input name="header_background_image" type="text" value="<?php refillField('header_background_image', 'https://static.pexels.com/photos/5369/lights-night-building-construction.jpg');?>"/>
</div><div class="form_group">
<label for="header_background_color">Background color(if no image)</label>
<input name="header_background_color" type="color" value="<?php refillField('header_background_color');?>"/>
</div>
</div>
</div>
</div>
</div>
<div class="form_group">
<input type="submit" value="update"/>
</div>
</form>
<script>
// accordion begin
function accordion_open(integer){
// get all content elements
var elements = document.getElementsByClassName('accordion_content');
// loop trough all content elements and hide
for (var i = 0; i < elements.length; i++) {
elements[i].style.height = "0px";
elements[i].style.opacity = "0";
elements[i].style.padding = "0px 20px";
}
// open specific tab
document.getElementsByClassName('content' + integer)[0].style.height = "auto";
document.getElementsByClassName('content' + integer)[0].style.opacity = "1";
document.getElementsByClassName('content' + integer)[0].style.padding = "20px";
}
accordion_open(1);
// accordion end
// header checkbox
var ageCheckbox = document.getElementById('enable_header');
var ageInput = document.getElementById('header_group');
// Just because of IE <333
ageCheckbox.onchange = function() {
// Check if the checkbox is checked, and show/hide the text field.
ageInput.hidden = this.checked ? false : true;
};
</script>
<?php
function refillField($field, $value = ""){
if (isset($_POST[$field])){
echo $_POST[$field];
} else if ($value != ""){
echo $value;
}
}
function recheckField($field){
if (isset($_POST[$field])){
echo 'checked';
}
}
function reselectRadio($field, $value){
if (isset($_POST[$field]) && $_POST[$field] == $value){
echo 'checked';
}
}
if($_POST){
$return = "";
$header_broadcaster_name = isset($_POST['enable_header_profile_name']) ? $_POST['broadcaster_name'] : "";
$header_broadcaster_url = isset($_POST['broadcaster_url']) ? $_POST['broadcaster_url'] : "";
$header_profile_image = isset($_POST['enable_header_profile_image']) ? "https://roomimg.stream.highwebmedia.com/ri/" . $_POST['broadcaster_url'] . ".jpg" : "";
$header_broadcaster_stats = isset($_POST['enable_header_profile_stats']) ? $_POST['broadcaster_age'] : "";
$header_name_align = isset($_POST['header_name_align']) ? $_POST['header_name_align'] : "";
$header_stats_align = isset($_POST['header_stats_align']) ? $_POST['header_stats_align'] : "";
$header_background_image = isset($_POST['header_background_image']) ? $_POST['header_background_image'] : "";
$header_background_color = isset($_POST['header_background_color']) ? $_POST['header_background_color'] : "";
// header
if(isset($_POST['enable_header'])){
$return .= "<i style='width:100%; height:280px; display:block; position:relative; background-size:cover; background-position:0px 510px; background-image:url(\" " . $header_background_image . " \"); background-color:" . $header_background_color . "; font-style:normal;'><br><b style='position:absolute; width:100%; height:30px; display:block; '><a style='color:white; text-decoration: none; font-weight:normal; font-size:30px; font-family:\"Century Gothic\", \"Avant Garde Gothic\", \"Avant Garde\", \"URW Gothic L\", helvetica, sans-serif; text-decoration:none; text-align:" . $header_name_align . "; width: 100%; display:inline-block;' href='http://chaturbate.com/" . $header_broadcaster_url . "/' >" . $header_broadcaster_name . "</a><br><img src='" . $header_profile_image . "' style='position:relative; margin:10px auto 0px auto; border-radius:10px; border:5px white solid; min-width:182px; min-height:149px; max-width:182px; max-height:149px; display: block;'></b>";
// header stats
if($header_broadcaster_stats != ""){
$return .= "<b style='position:absolute; top:auto; bottom:0px; width:100%; height:30px; display:block; color:white; text-align:" . $header_stats_align . ";'>" . $_POST['broadcaster_age'] . "Y " . $_POST['broadcaster_height'] . "CM " . $_POST['broadcaster_size'] . "CM</b>";
}
$return .= "<br></i>";
}
// Show the visual
echo '<pre>' . $return . '</pre>';
// Show the code
echo '<pre style=" font-family: monospace; background-color: #eee; padding: 10px; white-space: pre-wrap;">';
echo htmlspecialchars($return);
echo '</pre>';
}
?>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment