Changeset 289 in t29-www


Ignore:
Timestamp:
Aug 16, 2012, 8:03:29 PM (7 years ago)
Author:
sven
Message:

Viele Detailarbeiten:

  • Relationale Navigation (Vor/Zurück-Pfeile) im Footer aufgehübscht (sieht jetzt mehr wie auf alter Homepage aus)
  • Beam-Navigation (Punkte auf Strich) im Footer mal wieder repariert
  • Neuen Footer unterhalb des jetzigen Footers eingeführt, dort exemplarischen Inhalt hingeschrieben
  • Aktiv-Zustände werden in der horizontalen Navigation jetzt etwas angezeigt
  • Menü kann nun im Titel der Links anzeigen, was sie sind
  • messages.php kann nun serverseitig für Instanzen Nachrichten überschreiben, genutzt im template.php
Files:
10 edited

Legend:

Unmodified
Added
Removed
  • lib/menu.php

    r279 r289  
    157157        }
    158158
    159         // helper method
     159        // helper methods
     160       
     161        /** Check if a simplexml element has an attribute. Lightweight operation
     162         *  over the DOM.
     163         * @returns boolean
     164         **/
     165        public static function dom_has_attribute($simplexml_element, $attribute_name) {
     166                $dom = dom_import_simplexml($simplexml_element); // is a fast operation
     167                return $dom->hasAttribute($attribute_name);
     168        }
     169       
     170        public static function dom_prepend_attribute($simplexml_element, $attribute_name, $content, $seperator='') {
     171                if(!is_array($simplexml_element)) $simplexml_element = array($simplexml_element);
     172                foreach($simplexml_element as $e)
     173                        $e[$attribute_name] = $content . (self::dom_has_attribute($e, $attribute_name) ? ($seperator.$e[$attribute_name]) : '');
     174        }
     175       
     176        public static function dom_append_attribute($simplexml_element, $attribute_name, $content, $seperator='') {
     177                if(!is_array($simplexml_element)) $simplexml_element = array($simplexml_element);
     178                foreach($simplexml_element as $e)
     179                        $e[$attribute_name] = (self::dom_has_attribute($e, $attribute_name) ? ($e[$attribute_name].$seperator) : '') . $content;
     180        }
     181       
     182        /**
     183         * Appends a (CSS) class to a simplexml element, seperated by whitespace. Just an alias.
     184         **/
    160185        public static function dom_add_class($simplexml_element, $value) {
    161                 $dom = dom_import_simplexml($simplexml_element); // is a fast operation
    162                 $simplexml_element['class'] =
    163                         ($dom->hasAttribute("class") ? ($simplexml_element['class'].' '):'').$value;
     186                self::dom_append_attribute($simplexml_element, 'class', $value, ' ');
    164187        }
    165188       
     
    193216                if(count($current_a)) {
    194217                        $current_li = $current_a[0]->xpath("parent::li");
    195                         $this->dom_add_class($current_li[0], "current");
    196                         $ancestors = $current_li[0]->xpath("ancestor-or-self::li");
    197                         array_walk($ancestors, create_function('$i', 't29Menu::dom_add_class($i, "active");'));
     218                        self::dom_add_class($current_li[0], 'current');
     219                        self::dom_prepend_attribute($current_a, 'title', 'Aktuelle Seite', ': ');
     220
     221                        $actives = $current_li[0]->xpath("ancestor-or-self::li");
     222                        array_walk($actives, function($i) { t29Menu::dom_add_class($i, 'active'); });
     223                       
     224                        $ancestors = $current_li[0]->xpath("ancestor::li");
     225                        array_walk($ancestors, function($i) {
     226                                t29Menu::dom_prepend_attribute($i->xpath("./a[1]"), 'title', 'Übergeordnete Kategorie der aktuellen Seite' , ': ');
     227                        });
    198228                }
    199229
  • lib/messages.php

    r288 r289  
    22/**
    33 * t29v6 Message subsystem.
     4 * now with instanciated message overwriting.
    45 *
    56 **/
     
    2728
    2829        /**
     30         * Add new messages to the local overwrite array.
     31         **/
     32        function set($str_id, $content) {
     33                $this->local_msg[$str_id] = $content;
     34        }
     35
     36        /**
    2937         * The translate function, shorthand like the gettext shorthand.
    3038         * There's actually no long method name version :D
     
    3442         **/
    3543        function _($str_id, $lang=null) {
     44                // local overwrites come first
     45                if(isset($this->local_msg[$str_id]))
     46                        return $this->local_msg[$str_id];
     47       
    3648                $lang = ($lang && isset(self::$order[$lang])) ? $lang : $this->lang;
    3749                if(!isset(self::$msg[$str_id])) {
     
    7082         * out only matching entries. Example: $filter_regexp = "/^js-/"
    7183         * would filter out all JavaScript related entries.
     84         * This method doesn't consider the $local_msg's.
    7285         **/
    7386        static function create_json($filter_regexp=false) {
     
    8093                ));
    8194        }
     95
     96        /**
     97         * Since the static messages are considered as `const`, any changes/overwrites
     98         * will be applied to the instanciated object. Use the gettext for correct
     99         * handling.
     100         * This array simply maps message id to string without language handling since
     101         * the instances don't know languages.
     102         */
     103        public $local_msg = array();
    82104
    83105        /**
  • lib/template.php

    r279 r289  
    3737                // fill up configuration
    3838                // Path names in messages
    39                 foreach(array('footer-legal-file', 'topnav-search-page') as $msg)
    40                         $this->conf[$msg] = $this->conf['lang_path'] . $this->msg->_($msg);
     39                foreach(array('footer-legal-file', 'topnav-search-page') as $msg_id)
     40                        $this->msg->set($msg_id, $this->conf['lang_path'].$this->msg->_($msg_id));
    4141
    4242                // store informations about the current page
     
    129129  <title><?php echo $this->conf['html_title']; ?></title>
    130130  <meta name="description" content="Produziert am 08.01.2012">
    131   <meta name="author" content="Sven">
     131  <meta name="author" content="technikum29-Team">
    132132  <meta name="generator" content="t29v6">
    133133  <meta name="t29.cachedate" content="<?php print date('r'); ?>">
     
    149149  ?>
    150150 
    151   <link rel="copyright" href="<?php echo $this->conf['footer-legal-file']; ?>" title="<?php $p('footer-legal-link'); ?>">
    152   <link rel="search" type="application/opensearchdescription+xml" href="<?php print $this->conf['topnav-search-page'] . '?action=opensearch-desc'; ?>" title="<?php $p('opensearch-desc'); ?>">
     151  <link rel="copyright" href="<?php $p('footer-legal-file'); ?>" title="<?php $p('footer-legal-link'); ?>">
     152  <link rel="search" type="application/opensearchdescription+xml" href="<?php $p('topnav-search-page'); print '?action=opensearch-desc'; ?>" title="<?php $p('opensearch-desc'); ?>">
    153153  <?php
    154154        // print interlanguage links for all languages except the active one
     
    176176
    177177<body class="<?php echo implode(' ', $this->body_classes) ?>">
    178 <div id="footer-background-container"><!-- helper -->
    179178  <div id="container">
    180179        <h1 role="banner"><a href="/" title="<?php $p('head-h1-title'); ?>"><?php $p('head-h1'); ?></a></h1>
     
    247246                                ?>
    248247                        </ul>
    249                         <form method="get" action="<?php print $this->conf['topnav-search-page']; ?>">
     248                        <form method="get" action="<?php $p('topnav-search-page'); ?>">
    250249                                <span class="no-js"><?php $p('topnav-search-label'); ?>:</span>
    251250                                <input type="text" value="" data-defaultvalue="<?php $p('topnav-search-label'); ?>" name="q" class="text">
     
    255254    </header>
    256255        <hr>
    257     <footer>
     256    <footer class="in-sheet">
    258257                <nav class="guide">
    259258                        <!-- hier wird nav.side die Liste per JS reinkopiert -->
     
    274273                </nav>
    275274                <div class="right">
    276                         <img src="/shared/img-v6/logo.footer.png" title="technikum29 Logo" alt="Logo" class="logo">
    277                         <?php $p('footer-copyright-tag'); ?>
    278                         <br/><?php printf('<a href="%s">%s</a>', $this->conf['footer-legal-file'], $_('footer-legal-link')); ?>
    279                         <div class="icons">
    280                                 <a href="<?php echo $this->conf['footer-legal-file']; ?>#image-copyright"><img src="/shared/img-v6/cc-icon.png"></a>
    281                                 <!--<a href="http://ufopixel.de" title="Designed by Ufopixel"><img src="http://svenk.homeip.net/dropbox/Ufopixel/Ufopixel-Design/logo_90x30/ufopixel_logo_90x30_version2.png"></a>-->
    282                         </div>
    283                         <!--CC<br>Viele Bilder können unter einer CreativeCommons-Lizenz
    284                         verwendet werden. Erkundigen Sie sich.-->
     275                        <!-- text der rechts unten steht -->
    285276                </div>
    286277    </footer>
    287278  </div> <!--! end of #container -->
     279  <footer class="attached">
     280        <ul class="clearfix">
     281        <li class="logo">
     282                <a href="<?php $p('footer-legal-file'); ?>" class="img" title="technikum29 Logo">Logo</a>
     283                <p><?php $p('footer-copyright-tag'); ?>
     284                   <br><?php printf('<a href="%s">%s</a>', $_('footer-legal-file'), $_('footer-legal-link')); ?>
     285                </p>
     286        </li>
     287        <li class="copy">
     288                <a href="<?php $p('footer-legal-file'); ?>#image-copyright" class="img">CC</a>
     289                <p>Viele Bilder können unter einer <a href="<?php $p('footer-legal-file'); ?>#image-copyright">CreativeCommons-Lizenz</a>
     290                   verwendet werden. <a href="<?php $p('footer-legal-file'); ?>#image-copyright">Erkundigen Sie sich</a>.</p>
     291        </li>
     292        </ul>
     293  </footer>
    288294</div><!-- end of div id="footer-background-container" helper -->
    289295
  • shared/css-v6/modules/01-boilerplate.css

    r285 r289  
    102102ul, ol { margin: 1em 0; padding: 0 0 0 40px; }
    103103dd { margin: 0 0 0 40px; }
    104 nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }
     104nav ul, nav ol, footer ul, footer ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }
    105105
    106106
  • shared/css-v6/modules/10-window.css

    r281 r289  
    77
    88body {
     9        /* Hintergrund oben horizontal, fuer unten siehe footer css files */
    910        background: #cbc5bd url("/shared/img-v6/bg-v2.body.png") repeat-x;
    1011}
     
    2526        /*font-family: "Futura Std Book", "Trebuchet MS";*/
    2627        font-family: "Trebuchet MS", Verdana, Helvetica, Arial, sans-serif;
    27 }
    28 
    29 #footer-background-container {
    30         background: url("/shared/img-v6/bg-v2.body-footer.png") bottom left repeat-x;
    31         padding-bottom: 1px;
    3228}
    3329
  • shared/css-v6/modules/11-header.css

    r272 r289  
    5656nav.horizontal .u1 > li:hover > a {
    5757        background-color: white;
     58}
     59
     60nav.horizontal .u1 > li.active > a,
     61nav.horizontal .u2 > li.active > a {
     62        color: #6F2A41;
    5863}
    5964
  • shared/css-v6/modules/13-footer.css

    r279 r289  
    1111 **/
    1212
    13 /* Footer */
    14 footer {
    15         clear: both;
     13/* Footer innerhalb des Blattes, mit Navigationselementen */
     14footer.in-sheet {
     15        clear: both; padding-top: 1px; /* um margin innerer elemente an der oberkante beginnen zu lassen */
    1616        height: 104px; width: 100%;
    1717        /* temp. um Navi-Kram zu uebermalen: */
     
    2626        position: absolute;
    2727        z-index: 5; /* ueber nav.rel */
    28         top: -5px; left: -5px;
    29         width: 910px; margin: 0 25px; /* wie #content, in breite ein paar px mehr wegen ueberstehenden bullets */
     28        top: -5px; left: -5px; /* damit bullets rausschauen */
     29        width: 870px; margin: 0 40px; /* wie #content, in breite ein paar px mehr wegen ueberstehenden bullets */
    3030        /* width:900px, aber 10px Toleranz damit der Beam nicht umbricht wenn
    3131       eine ungerade Anzahl an Items vorhanden ist (1px Toleranz wuerde schon reichen) */
     
    118118/* Relationale Navigation */
    119119nav.rel {
    120         height: 20px;
    121         position: absolute;
    122         top: 17px; left: 0;
    123         z-index: 0;
    124         width: 940px;
    125         text-align: center;
    126 }
     120        position: relative;
     121        margin: 26px 70px 0;
     122        width: 800px;
     123}
     124
     125nav.rel li {
     126        position: absolute;
     127        top: 0;
     128}
     129
     130nav.rel li.prev { left: 0; }
     131nav.rel li.next { right: 0; }
    127132
    128133nav.rel a {
     
    130135        text-transform: uppercase;
    131136        display: inline-block;
    132         padding: 15px;
    133 
    134         font-size: 15px;
     137        padding: 10px;
     138        line-height: 17px;
     139        font-size: 14px;
    135140        color: rgba(65,111,124,.85); /*#416f7c;*/
    136         background-color: #dfe9f0;
     141        /*background-color: #dfe9f0;*/
    137142       
    138143        font-weight: bold;
    139144       
    140145        position: relative;
    141         height: 40px; /* wegen arrow: height+2*padding=arrowheight */
     146        /*height: 40px; *//* wegen arrow: height+2*padding=arrowheight */
    142147}
    143148
     
    148153}
    149154
    150 nav.rel .prev  a {
    151         text-align: right;
    152 }
    153 nav.rel .next a {
    154         text-align: left;
    155 }
     155nav.rel li.prev a { text-align: right; padding-right: 16px; }
     156nav.rel li.next a { text-align: left;  padding-left: 16px; }
    156157
    157158nav.rel a:after {
     
    160161        position: absolute;
    161162        top: 0;
    162         border-top: 35px solid transparent;
    163         border-bottom: 35px solid transparent;
    164         border-left: 30px solid #dfe9f0;
    165         border-right: 30px solid #dfe9f0;
    166 }
    167 
    168 nav.rel a:hover:after {
     163        border-top: 27px solid transparent;
     164        border-bottom: 27px solid transparent;
     165        border-left: 24px solid #dfe9f0;
     166        border-right: 24px solid #dfe9f0;
     167}
     168
     169nav.rel a:focus:after, nav.rel a:active:after {
    169170        border-left-color: #40a8e2;
    170171        border-right-color: #40a8e2;
     
    172173
    173174nav.rel .next a:after {
    174         right: -30px;
     175        right: -24px;
    175176        border-right: none;
    176177}
    177178
    178179nav.rel .prev a:after {
    179         left: -30px;
     180        left: -24px;
    180181        border-left: none;
    181182}
    182183
    183184nav.rel a:hover {
     185        background-color: #dfe9f0;
     186}
     187
     188nav.rel a:active, nav.rel a:focus {
    184189        background-color: #40a8e2;
    185190        color: white;
     
    187192
    188193/* Footer Icon-Sammlung und so */
     194/*
    189195footer .right {
    190196        position: absolute;
     
    210216footer .right .icons a { opacity: .5; }
    211217footer .right .icons a:hover, footer .right .icons a:focus { opacity: 1; }
     218*/
     219
     220/* Post-Footer */
     221footer.attached {
     222        /* @embed */ background: #307588 url("/shared/img-v6/bg-v2.body-footer.png") top left repeat-x;
     223        margin-top: -122px;
     224        padding: 122px;
     225       
     226        color: white;
     227        font-size: 14px;
     228}
     229
     230footer.attached ul {
     231        width: 1170px;
     232        margin: 10px auto 20px;
     233        /* padding: 0 20px; *//* ueberfluessig, Breite allein reguliert schon */
     234}
     235
     236footer.attached li {
     237        width: 370px;
     238        margin-right: 10px;
     239        float: left;
     240}
     241
     242footer.attached a:link, footer.attached a:visited {
     243        color: #BAF1FF;
     244}
     245
     246footer.attached a:hover {
     247        color: #3DD8FF;
     248}
     249
     250footer.attached a.img {
     251        display: block;
     252        float: left;
     253        text-indent: -999px;
     254}
     255
     256footer.attached p {
     257        margin-left: 80px;
     258        margin-top: 0px;
     259        line-height: 115%;
     260}
     261
     262
     263footer.attached li.logo a.img {
     264        background-image: url("/shared/img-v6/logo.footer.png");
     265        width: 46px; height: 59px;
     266}
     267footer.attached li.logo p { margin-left: 60px; }
     268
     269footer.attached li.copy a.img {
     270        background-image: url("/shared/img-v6/cc-icon.png");
     271        width: 90px; height: 30px;
     272}
     273footer.attached li.copy p { margin-left: 110px; }
  • shared/css-v6/modules/18-content.css

    r281 r289  
    3232    font-size: 180%;
    3333    border-bottom: 3px double #aaa;
     34    text-align: left; /* irgendwie meinen browser sonst `justify` */
    3435}
    3536
  • shared/js-v6/modules/menu.js

    r279 r289  
    343343        bwidth = $(".bullet",g).outerWidth();
    344344        each_width = (g.width() + bwidth*2) / count;
    345         a.width(Math.floor(each_width));
     345        each_width = g.width() / count;
     346       
     347       
     348        // problem: each_width = 16.384023... -> Math.floor liefert zu schmale Werte, direktes
     349        // a.width(each_width) hingegen kann mit Fliesskomma nicht umgehen. Daher jetzt ein Ansatz,
     350        // CSS3-Subpixelwerte mit ueberschaubar vielen Dezimalstellen anzuwenden.
     351        roundNumber = function(num,dec) { return Math.round(num*Math.pow(10,dec))/Math.pow(10,dec); };
     352        subpixel_width = roundNumber(each_width, 2);
     353        a.css("width", subpixel_width+"px");
     354        //a.css("width", Math.floor(each_width)+"px");
    346355        // text-Label zentriert darstellen um den Punkt
    347356        $(".text", a).css("left", function(){return(bwidth - $(this).width())/2; });
Note: See TracChangeset for help on using the changeset viewer.
© 2008 - 2013 technikum29 • Sven Köppel • Some rights reserved
Powered by Trac
Expect where otherwise noted, content on this site is licensed under a Creative Commons 3.0 License