atomaka/NCA-Screens
1
0
Fork 0
Code Releases Activity

Setup basic style for individual image viewing.

Browse source
This commit is contained in:
Andrew Tomaka 2011-11-04 20:20:32 -04:00
parent 74bebb570c
commit ccd7abbf0e
2 changed files with 53 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

43
css/style.css
View file

@ -19,6 +19,7 @@
html {
background-color: #c0c0c0;
background-image: url(../img/concrete_wall_3.png);
min-height: 100%;
position: relative;
@ -54,12 +55,13 @@ header {
header{
background-color: #303030;
position: fixed;
background-image: url(../img/dark_circles.png);
/*position: fixed;*/
width: 100%;
height: 40px;
height: 25px;
top: 0;
left: 0;
z-index: 100000;
/*z-index: 100000;*/
box-shadow: 0 1px 2px #303030;
-webkit-box-shadow: 0 1px 2px #303030;
@ -79,8 +81,9 @@ h1{
#dropbox{
#dropbox {
background-color: #a0a0a0;
background-image: url(../img/brushed_alu_dark.png);
border-radius: 3px;
position: relative;
@ -182,7 +185,8 @@ h1{
}
#dropbox .progress {
background-color: #2586d0;
background-color: #c0c0c0;
background-image: url(../img/concrete_wall_3.png);
position: absolute;
height: 100%;
left: 0;
@ -217,4 +221,33 @@ h1{
#dropbox .linkHolder input {
width: 100%;
}
/*-------------------------
Uploaded Image
--------------------------*/
#imageContainer {
width: 100%;
text-align: center;
margin-top: 25px;
margin-bottom: 25px;
}
.image {
max-width: 920px;
}
#message {
background-color: #a0a0a0;
background-image: url(../img/brushed_alu_dark.png);
border-radius: 3px;
margin: auto;
overflow: hidden;
width: 600px;
padding: 10px;
box-shadow: 0 0 4px rgba(0,0,0,0.3) inset,0 -3px 2px rgba(0,0,0,0.1);
}

22
index.php
View file

@ -8,22 +8,24 @@ if($id == '' ) {
$content = 'id not set';
} else {
if(!is_numeric($id) || $id <= 0) {
$content = 'This image does not exist: bad id format (' . $id . ')';
$message = 'This image does not exist: bad id format (' . $id . ')';
} else {
$db = mysqli_init();
$db->real_connect($conf->hostname, $conf->username, $conf->password, $conf->database);
$query = "SELECT extension, created FROM screens WHERE id = $id";
$query = "SELECT extension, created, original FROM screens WHERE id = $id";
$result = $db->query($query);
if($result->num_rows == 0) {
$content = 'This image does not exist: not in database';
$message = 'This image does not exist: not in database';
} else {
// load tags
$image = $result->fetch_object();
$content = '<img src="uploads/' . $id . '.' . $image->extension . '" />';
$content .= '<br/>Created on: ' . $image->created;
$imageOutput = '<img src="uploads/' . $id . '.' . $image->extension . '" class="image" />';
$message = 'Uploaded on: ' . $image->created;
$message .= '<br/>Original name: ' . $image->original;
$message .= '<br/>View Raw: <a href="uploads/' . $id . '.' . $image->extension . '">'. $id . '.' . $image->extension . '</a>';
}
}
}
@ -45,9 +47,15 @@ if($id == '' ) {
<header>
<h1>title or navigation or something</h1>
</header>
<?if (isset($imageOutput)) { ?>
<div id="imageContainer">
<?php echo $imageOutput; ?>
</div>
<?php } ?>
<div id="message">
<?php echo $message; ?>
</div>
<div style="margin-top: 200px;">
<?php echo $content; ?>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>