Added splash page. Add new graphics for both splash page and about page. Moved to...
authorRichard Whitehouse <github@richardwhiuk.com>
Sat, 29 Jan 2011 20:44:51 +0000 (20:44 +0000)
committerRichard Whitehouse <github@richardwhiuk.com>
Sat, 29 Jan 2011 20:44:51 +0000 (20:44 +0000)
index.php
page/splash.php [new file with mode: 0644]
template/about.php
template/index.php
template/splash.php [new file with mode: 0644]
theme/about.png [new file with mode: 0644]
theme/hmb.css
theme/hmb.js
theme/logo.png
theme/splash.png [new file with mode: 0644]

index 6d922a48f4e338c5445cbfab9d3c59c310677cb3..d9b9c55cbe7616d1f7518bd9314ccef0d8a26328 100644 (file)
--- a/index.php
+++ b/index.php
@@ -8,7 +8,7 @@ require_once 'template/index.php';
 $pages = array();
 $templates = array();
 
-$files = array('about','tickets','food','ents','committee','sponsorship','charity','workers');
+$files = array('splash','about','tickets','food','ents','committee','sponsorship','charity','workers');
 
 foreach($files as $page){
        if(is_file('page/' . $page . '.php') && is_file('template/' . $page . '.php')){
@@ -28,8 +28,8 @@ foreach($pages as $name => $page){
 
 if(isset($_GET['page']) && isset($templates[$_GET['page']])){
        $current = $_GET['page'];
-} elseif(isset($templates['about'])){
-       $current = 'about';
+} elseif(isset($templates['splash'])){
+       $current = 'splash';
 } elseif(count($templates) > 0) {
        $current = array_shift(array_keys($templates));
 }
diff --git a/page/splash.php b/page/splash.php
new file mode 100644 (file)
index 0000000..416ac81
--- /dev/null
@@ -0,0 +1,10 @@
+<?php
+
+class Page_Splash extends Page {
+
+ public function execute($template){
+
+ }
+
+
+}
index 15531703f0f1d46105ec8d76715aee6218902264..7c4cffee1a4e8c33b9a8e039c9e82796098b063f 100644 (file)
@@ -2,6 +2,8 @@
 
 class Template_About extends Template {
 
-
+function display(){
+       ?><img src="/theme/about.png"><?
+}
 
 }
index 61c8ec808607bef9b1766d98976b28c324e0c798..5189d8870c99107da90161c95718f2f7d844928d 100644 (file)
@@ -15,7 +15,7 @@ public function Display(){
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
        <script src="theme/hmb.js"></script>
        <script>
-       hmb_setup(<?php echo $this->keys[$this->current]; ?>,<?php echo count($this->keys); ?>, {
+       hmb_setup(/* current */ <?php echo $this->keys[$this->current]; ?>, /* number */ <?php echo count($this->keys); ?>, {
 <?php 
                foreach($this->keys as $name => $i){ 
                
@@ -28,7 +28,6 @@ public function Display(){
        </script>
 </head>
 <body>
-       <div id="wrapper">
                <div id="logo">
                        <a href="/"><img src="theme/logo.png"></a>
                </div>
@@ -48,7 +47,9 @@ public function Display(){
                        <div class="arrow" id="arrow-l" <?php if(!($this->keys[$this->current] > 0)){ ?> style="display: none;" <?php } ?>>
                                <a href="-1"><img src="theme/left.png"></a>
                        </div>
-                       <ul id="panes" style="left: -<?php echo $this->keys[$this->current] * 80; ?>%;">
+                       <div id="paneshow" style="left: <?php echo -1 * $this->keys[$this->current] * 850; ?>px;">
+                       <div id="panebar">
+                       <ul id="panes">
                                <?php 
                                if(count($this->templates) == 0){ 
                                ?>
@@ -59,24 +60,23 @@ public function Display(){
                                } else { 
                                        foreach($this->templates as $name => $template){
                                ?>
-                               <li class="pane pane-<?php echo ($this->keys[$name] % 2) == 0 ? 'r' : 'p'; ?>" style="left: <?php echo ($this->keys[$name] * 80) + 10; ?>%;" id="pane-<?php echo $name; ?>">
-                                       <div class="content">
-                                               <?php $template->display(); ?>
-                                       </div>
+                               <li class="pane pane-<?php echo ($this->keys[$name] % 2) == 0 ? 'r' : 'p'; ?>" style="left: <?php echo ($this->keys[$name] * 850); ?>px;" id="pane-<?php echo $name; ?>">
+                                       <div class="content"><?php $template->display(); ?></div>
                                </li>
                                <?php
                                        }
                                }
                                ?>
                        </ul>
+                       </div>
+                       </div>
                        <div class="arrow" id="arrow-r">
                                <a href="<?php echo $this->numbers[$this->keys[$this->current] + 1]; ?>"><img src="theme/right.png"></a>
                        </div>
+                       <div id="footer">
+                               &copy; 2010 Homerton May Ball Committee. All rights reserved.
+                       </div>
                </div>
-               <div id="footer">
-                       &copy; 2010 Homerton May Ball Committee. All rights reserved.
-               </div>
-       </div>
 </body>
 </html>
 <?php
diff --git a/template/splash.php b/template/splash.php
new file mode 100644 (file)
index 0000000..0c775f1
--- /dev/null
@@ -0,0 +1,9 @@
+<?php
+
+class Template_Splash extends Template {
+
+public function display(){
+       ?><img src="/theme/splash.png"><?
+}
+
+}
diff --git a/theme/about.png b/theme/about.png
new file mode 100644 (file)
index 0000000..3ff5f02
Binary files /dev/null and b/theme/about.png differ
index 819fc4287963861e428d302a5d7130be05b17b52..1e0becc672a2cafbfde83d69317223d148c3e248 100644 (file)
@@ -1,5 +1,6 @@
 /** Homerton May Ball CSS File - Richard Whitehouse **/
 
+
 body {
        margin: 0;
        padding: 0;
@@ -11,14 +12,9 @@ body {
 }
 
 div#wrapper {
-       overflow: hidden;
-       position: absolute;
-       top: 0;
-       bottom: 20px;
-       left: 0;
-       right: 0;
 }
 
+
 div#logo {
        z-index: 20;
        position: absolute;
@@ -37,11 +33,11 @@ div#logo img {
 
 div#navbar {
        background: black;
-       width: 70%;
+       width: 700px;
        height: 40px;
        position: absolute;
-       left: 15%;
-       right: 15%;
+       left: 50%;
+       margin-left: -350px;
        top: 104px;
        z-index: 10;
 }
@@ -88,8 +84,9 @@ div#main {
        position: absolute;
        left: 0;
        right: 0;
+       height: 530px;
        top: 124px;
-       bottom: 20px; 
+       overflow: hidden;
 }
 
 div.arrow {
@@ -105,15 +102,34 @@ div.arrow img {
        position: absolute;
        top: 50%;
        height: 40px;
-       margin-top: -20px;
+       margin-top: -60px;
 }
 
 div#arrow-l {
-       left: 10%;
+       left: 50%;
+       margin-left: -420px;
 }
 
 div#arrow-r {
-       right: 10%;
+       right: 50%;
+       margin-right: -420px;
+}
+
+div#paneshow {
+       margin: 0;
+       padding: 0;
+       position: relative;
+       top: 0;
+       height: 100%;
+}
+
+div#panebar {
+       position: absolute;
+       left:50%;
+       top: 0px;
+       margin-left: -425px;
+       bottom: 0px;
+       width: 100%;
 }
 
 ul#panes {
@@ -122,17 +138,16 @@ ul#panes {
        margin: 0;
        position: relative;
        top: 0;
-       height: 100%;
+       height: 500px;
 }
 
 ul#panes li.pane {
        display: block;
-       width: 80%;
+       width: 850px;
+       height: 500px;
        background: white;
-       height: 100%;
        position: absolute;
        z-index: 3;
-       padding: 1px;
        overflow: hidden;
 }
 
@@ -148,20 +163,20 @@ ul#panes li.pane-p {
 }
 
 div.content {
-       height: 100%;
-       overflow: auto;
-       padding: 20px;
+       width: 850px;
+       height: 500px;
+       overflow: visible;
        color: white;
 }
 
 div#footer {
        z-index: 10;
        background: black;
-       width: 70%;
+       width: 700px;
        position: absolute;
-       left: 15%;
-       right: 15%;
-       bottom: 0;
+       left: 50%;
+       margin-left: -350px;
+       bottom: 10px;
        height: 40px;
        line-height: 40px;
        font-size: 14px;
@@ -170,3 +185,4 @@ div#footer {
        font-weight: black;
        font-family: Verdana, Arial, sans-serif;
 }
+
index bdef3a8b17a7538f8226cd1f8164a178a46ca609..7c46adcabf76b05f6a27ea499902bc16765f877a 100644 (file)
@@ -7,8 +7,8 @@ var current = pane;
 function update_hmb(){
        $("#arrow-l,#arrow-r").hide();
 
-       var left = current * 80;
-       $("#panes").animate({ left: "-" + left + "%" }, function(){
+       var left = current * 850;
+       $("#paneshow").animate({ left: "-" + left + "px" }, function(){
 
        if(current > 0){
                $("#arrow-l").fadeIn('slow');
index ff7009bc6d83a6932b90afe278bbd662a036caa5..e3d13b5e5139e382b8f4df2ae1f68b17d68fcd5b 100644 (file)
Binary files a/theme/logo.png and b/theme/logo.png differ
diff --git a/theme/splash.png b/theme/splash.png
new file mode 100644 (file)
index 0000000..dd4bb25
Binary files /dev/null and b/theme/splash.png differ