New theme for the IPFire web user interface

diff --git a/html/html/themes/ipfire-new/images/n2.gif b/html/html/themes/ipfire-new/images/n2.gif
new file mode 100644 (file)
index 0000000..b92a19d
Binary files /dev/null and b/html/html/themes/ipfire-new/images/n2.gif differ

diff --git a/html/html/themes/ipfire-new/images/n3.gif b/html/html/themes/ipfire-new/images/n3.gif
new file mode 100644 (file)
index 0000000..6627c91
Binary files /dev/null and b/html/html/themes/ipfire-new/images/n3.gif differ

diff --git a/html/html/themes/ipfire-new/images/n5.gif b/html/html/themes/ipfire-new/images/n5.gif
new file mode 100644 (file)
index 0000000..a032242
Binary files /dev/null and b/html/html/themes/ipfire-new/images/n5.gif differ

diff --git a/html/html/themes/ipfire-new/images/n6.gif b/html/html/themes/ipfire-new/images/n6.gif
new file mode 100644 (file)
index 0000000..ed1781c
Binary files /dev/null and b/html/html/themes/ipfire-new/images/n6.gif differ

diff --git a/html/html/themes/ipfire-new/images/tux2.png b/html/html/themes/ipfire-new/images/tux2.png
new file mode 100644 (file)
index 0000000..cd84ad5
Binary files /dev/null and b/html/html/themes/ipfire-new/images/tux2.png differ

diff --git a/html/html/themes/ipfire-new/include/colors.txt b/html/html/themes/ipfire-new/include/colors.txt
new file mode 100644 (file)
index 0000000..6d7dd1c
--- /dev/null
+++ b/html/html/themes/ipfire-new/include/colors.txt
@@ -0,0 +1,25 @@
+color1=#CD5B45
+color2=#EE6A50
+color3=#FF7256
+color4=#EE9572
+color5=#FFA07A
+color6=#CDAF95
+color7=#EECBAD
+color8=#FFDAB9
+color9=#FFE4C4
+color10=#FFCCCC
+color11=#0000FF
+color12=#00FF00
+color13=#FF0000
+color14=#FFD700
+color15=#CCCCCC
+color16=#40E0D0
+color17=#90EE90
+color18=#F4A460
+color19=#EAE9EE
+color20=#D6D6D6
+color21=#FFFFFF
+color22=#F0F0F0
+color23=#FF00FF
+color24=#6464FF
+color25=#FF6464

diff --git a/html/html/themes/ipfire-new/include/css/style.css b/html/html/themes/ipfire-new/include/css/style.css
new file mode 100644 (file)
index 0000000..1f1189a
--- /dev/null
+++ b/html/html/themes/ipfire-new/include/css/style.css
@@ -0,0 +1,631 @@
+@charset 'UTF-8';
+/* Menu */
+#cssmenu ul,
+#cssmenu li,
+#cssmenu span,
+#cssmenu a {
+       border: 0;
+       margin: 0;
+       padding: 0;
+       position: relative;
+}
+
+#cssmenu {
+position: relative;
+       width: 950px;
+       margin: 0 auto;
+       background: #dddddd; /* Old browsers */
+       border-radius: 8px 8px 8px 8px;
+       -webkit-border-radius: 8px 8px 8px 8px;
+       font-weight: 600;
+       height: 32px;
+       border: 1px solid black;
+}
+#cssmenu:after,
+#cssmenu ul:after {
+       content: '';
+       display: block;
+       clear: both;
+}
+#cssmenu a {
+       border-radius: 8px 8px 8px 8px;
+       -webkit-border-radius: 8px 8px 8px 8px;
+       color: #111111;
+       display: inline-block;
+       font-family: Arial, Verdana, sans-serif;
+       font-size: 12px;
+       line-height: 32px;
+       padding: 0 15px;
+       text-decoration: none;
+       top: 100%;
+}
+
+#cssmenu ul {
+       list-style: none;
+}
+#cssmenu > ul > li {
+       display: inline-block;
+       line-height: 20px;
+}
+
+#cssmenu > ul > li.active a,
+#cssmenu > ul > li:hover > a {
+       color: white;
+       background: #aaaaaa;
+}
+
+#cssmenu .has-sub {
+       z-index: 1;
+}
+#cssmenu .has-sub:hover > ul {
+       display: block;
+}
+#cssmenu .has-sub ul {
+       display: none;
+       position: absolute;
+       width: 160px;
+       top: 100%;
+       left: 0;
+}
+#cssmenu .has-sub ul li a {
+       border-radius: 7px 7px 7px 7px;
+       background: #ffffff;
+       color: grey;
+       font-size: 12px;
+       display: block;
+       line-height: 40%;
+       padding: 12px 5px;
+       border: 1px solid black;
+}
+#cssmenu .has-sub ul li:hover a {
+       background: #dddddd;
+       box-shadow: inset 0  5px 1px rgba(0, 0, 0, 0.15);
+       -webkit-box-shadow: inset 0  5px 1px rgba(0, 0, 0, 0.15);
+}
+#cssmenu .has-sub .has-sub:hover > ul {
+       display: block;
+}
+#cssmenu .has-sub .has-sub ul {
+       display: none;
+       position: absolute;
+}
+#cssmenu .has-sub .has-sub ul li a {
+       background: #606a76;
+       box-shadow: none;
+       -webkit-box-shadow: none;
+}
+#cssmenu .has-sub .has-sub ul li a:hover {
+       background: #4a5662;
+       box-shadow: inset 0 0 3px 1px rgba(0, 0, 0, 0.15);
+       -webkit-box-shadow: inset 0 0 3px 1px rgba(0, 0, 0, 0.15);
+}
+
+
+
+
+/* Table */
+/* when using class='bordered' after tabletag */
+
+table {
+       *border-collapse: collapse; /* IE7 and lower */
+       border-spacing: 0;
+}
+
+.bordered th{
+       border-top: 1px solid grey;
+       border-bottom: 1px solid grey;
+       background: #cccccc;
+}
+
+.bordered th:first-child{
+       -moz-border-radius: 6px 0 0 0;
+       -webkit-border-radius: 6px 0 0 0;
+       border-radius: 6px 0 0 0;
+       border-left: 1px solid grey;
+       border-top: 1px solid grey;
+       border-bottom: 1px solid grey;
+}
+
+.bordered th:last-child {
+       -moz-border-radius: 0 6px 0 0;
+       -webkit-border-radius: 0 6px 0 0;
+       border-radius: 0 6px 0 0;
+       border-right: 1px solid grey;
+       border-top: 1px solid grey;
+       border-bottom: 1px solid grey;
+}
+
+.bordered th:only-child{
+       -moz-border-radius: 6px 6px 0 0;
+       -webkit-border-radius: 6px 6px 0 0;
+       border-radius: 6px 6px 0 0;
+       border: 1px solid grey;
+}
+
+.bordered tr:first-child td:first-child{
+       -moz-border-radius: 6px 0 0 0;
+       -webkit-border-radius: 6px 0 0 0;
+       border-radius: 6px 0 0 0;
+       border-left: 1px solid grey;
+       border-top: 1px solid grey;
+}
+
+.bordered tr:first-child td:last-child{
+       -moz-border-radius: 0 6px 0 0;
+       -webkit-border-radius: 0 6px 0 0;
+       border-radius: 0 6px 0 0;
+       border-top: 1px solid grey;
+}
+.bordered tr:first-child td:only-child{
+       -moz-border-radius: 6px 6px 0 0;
+       -webkit-border-radius: 6px 6px 0 0;
+       border-radius: 6px 6px 0 0;
+       border-left: 1px solid grey;
+       border-right: 1px solid grey;
+       border-top: 1px solid grey;
+}
+
+.bordered tr:first-child td{
+       border-top: 1px solid grey;
+}
+
+.bordered tr:last-child{
+       border-left: 1px solid grey;
+       border-right: 1px solid grey;
+}
+
+.bordered tr:last-child td:first-child {
+       -moz-border-radius: 0 0 0 6px;
+       -webkit-border-radius: 0 0 0 6px;
+       border-radius: 0 0 0 6px;
+       border-bottom: 1px solid grey;
+}
+
+.bordered tr:last-child td:last-child {
+       -moz-border-radius: 0 0 6px 0;
+       -webkit-border-radius: 0 0 6px 0;
+       border-radius: 0 0 6px 0;
+       border-bottom: 1px solid grey;
+}
+
+.bordered tr:last-child td:only-child {
+       -moz-border-radius: 0 0 6px 6px;
+       -webkit-border-radius: 0 0 6px 6px;
+       border-radius: 0 0 6px 6px;
+       border-bottom: 1px solid grey;
+}
+
+.bordered tr:last-child td {
+       border-bottom: 1px solid grey;
+}
+
+.bordered td:first-child {
+       border-left: 1px solid grey;
+}
+
+.bordered td:last-child {
+       border-right: 1px solid grey;
+}
+
+
+/* This controls the width of the fluid width layouts */
+
+div.fluid
+{
+width: 90% !important;
+}
+
+/* This controls the width of the fixed width layouts */
+
+div.fixed
+{
+width: 910px !important;
+}
+
+/* Basic Stuff */
+
+*
+{
+margin: 0em;
+padding: 0em;
+}
+
+/* body */
+
+body
+{
+background: #ffffff;
+background-image: -webkit-linear-gradient(#880400 0%, black 100%); 
+background-image: -moz-linear-gradient(#880400 0%, black 100%); 
+background-image: -o-linear-gradient(#880400 0%, black 100%); 
+background-image: linear-gradient(#880400 0%, black 100%);
+background-attachment: fixed;
+font-size: 9pt;
+font-family: "trebuchet ms", helvetica, sans-serif;
+}
+
+
+h1,h3,h4,h5,h6
+{
+font-size: 20px;
+font-weight: normal;
+letter-spacing: -1px;
+text-transform: lowercase;
+text-align: left;
+}
+
+
+h3,h4,h5,h6
+{
+color: #66000F;
+}
+
+h1 span
+{
+position: absolute;
+font-weight: bold;
+padding-left: 1.7em;
+}
+
+h3 span
+{
+font-weight: bold;
+}
+
+h4 span
+{
+font-weight: bold;
+}
+
+br.clear
+{
+clear: both;
+}
+
+img
+{
+padding: 3px;
+}
+
+img.floatTL
+{
+float: left;
+margin-right: 1.5em;
+margin-bottom: 1.5em;
+margin-top: 0.5em;
+}
+
+a
+{
+text-decoration: underline;
+color: #D90000;
+}
+
+a:hover
+{
+text-decoration: none;
+}
+
+ul.links
+{
+list-style: none;
+}
+
+ul.links li
+{
+line-height: 2em;
+}
+
+ul.links li.first
+{
+}
+
+p
+{
+line-height: 1.8em;
+}
+
+iframe {
+       border: 0;
+       padding: 0;
+}
+
+/* Header */
+
+#header
+{
+width:100%;
+height:80px;
+}
+
+#header_inner
+{
+position: relative;
+width: 910px;
+height:80px;
+margin: 0 auto;
+}
+
+/* Logo */
+
+#logo
+{
+position: absolute;
+width: 200px;
+height:65px;
+bottom: 0em;
+background: url('/themes/ipfire-new/images/tux2.png') no-repeat;
+background-position: left;
+}
+
+#logo h1
+{
+display: inline;
+color: #fff;
+font-size: 3.6em;
+}
+
+#logo h2
+{
+position: relative;
+width: 300px;
+height: 20px;
+top: 70px;
+left: 0px;
+display: block;
+padding-left: 0.5em;
+color: #880400;
+font-size: 14px;
+z-index: 1;
+}
+
+
+/* Main */
+
+#main
+{
+position: relative;
+width: 910px;
+margin: 0 auto;
+margin-top: 1em;
+padding-left: 20px;
+padding-right: 20px;
+border-radius: 8px 8px 8px 8px;
+-webkit-border-radius: 8px 8px 8px 8px;
+background: #fff url('/themes/ipfire-new/images/n2.gif') 0px 0px repeat-x;
+border: 1px solid black;
+}
+
+#main_inner p
+{
+text-align: justify;
+margin-bottom: 2.0em;
+}
+
+#main_inner ul
+{
+margin-bottom: 2.0em;
+}
+
+#main_inner
+{
+position: relative;
+width: 910px;
+margin: 0 auto;
+padding-top: 3.5em;
+}
+
+#main_inner h3,h4
+{
+border-bottom: dotted 1px #E1E1E1;
+position: relative;
+}
+
+#main_inner h3
+{
+font-size: 2.1em;
+padding-bottom: 0.1em;
+margin-bottom: 0.8em;
+}
+
+#main_inner h4
+{
+font-size: 1.2em;
+padding-bottom: 0.175em;
+margin-bottom: 1.4em;
+margin-top: 0.95em;
+}
+
+#main_inner .post
+{
+position: relative;
+border-radius: 8px 8px 8px 8px;
+-webkit-border-radius: 8px 8px 8px 8px;
+border: 1px solid silver;
+padding-left: 2em;
+padding-right: 2em;
+padding-bottom: 1em;
+padding-top: 1em;
+}
+
+#main_inner .post h3
+{
+font-size: 1.7em;
+padding-bottom: 1.2em;
+}
+
+#main_inner .post ul.post_info
+{
+list-style: none;
+position: absolute;
+top: 3em;
+font-size: 0.8em;
+}
+
+#main_inner .post ul.post_info li
+{
+background-position: 0em 0.2em;
+background-repeat: no-repeat;
+display: inline;
+padding-left: 18px;
+}
+
+#main_inner .post ul.post_info li.date
+{
+background-image: url('/themes/ipfire-new/images/n5.gif');
+}
+
+#main_inner .post ul.post_info li.comments
+{
+background-image: url('/themes/ipfire-new/images/n6.gif');
+margin-left: 1.1em;
+}
+
+/* Footer */
+
+#footer
+{
+width: 930px;
+margin: 0 auto;
+text-align: center;
+clear: both;
+border-top: dotted 1px #E1E1E1;
+margin-top: 1.0em;
+margin-bottom: 1.0em;
+padding-top: 1.0em;
+text-transform: lowercase;
+}
+
+/* Search */
+
+input
+{
+margin: 0.2em;
+}
+
+input.button
+{
+background: #CA2F2F url('/themes/ipfire-new/images/n3.gif') repeat-x;
+color: #fff;
+border: solid 1px #A94B4B;
+font-weight: bold;
+text-transform: lowercase;
+font-size: 0.8em;
+height: 2.0em;
+}
+
+input.text
+{
+border: solid 1px #F1F1F1;
+font-size: 1.0em;
+padding: 0.25em 0.25em 0.25em 0.25em;
+}
+
+#search
+{
+width: 100%;
+margin-bottom: 2.0em;
+}
+
+#search input.text
+{
+position: absolute;
+top: 0em;
+left: 0em;
+width: 9.5em;
+}
+
+#search input.button
+{
+position: absolute;
+top: 0em;
+right: 0em;
+min-width: 2.0em;
+max-width: 2.5em;
+}
+
+#traffic
+{
+margin-top: -2.2em;
+margin-left: 60em;
+}
+/* LAYOUT - 3 COLUMNS */
+
+       /* Primary content */
+       
+       #primaryContent_3columns
+       {
+       margin-right: 34em;
+       }
+       
+       #columnA_3columns
+       {
+       float: left;
+       width: 100%;
+       margin-right: -34em;
+       padding-right: 2em;
+       }
+       
+       /* Secondary Content */
+       
+       #secondaryContent_3columns
+       {
+       float: right;
+       }
+       
+       #columnB_3columns
+       {
+       width: 13.0em;
+       float: left;
+       padding: 0em 2em 0.5em 2em;
+       border-left: dotted 1px #E1E1E1;
+       }
+       
+       #columnC_3columns
+       {
+       width: 13.0em;
+       float: left;
+       padding: 0em 0em 0.5em 2em;
+       border-left: dotted 1px #E1E1E1;
+       }
+       #columnC_2columns
+       {
+       float: left;
+       width: 100%;
+       }
+
+/* LAYOUT - COLUMNLESS */
+
+       /* Primary content */
+       
+       #primaryContent_columnless
+       {
+       position: relative;
+       }
+       
+       #columnA_columnless
+       {
+       position: relative;
+       margin-left: -5em;
+       }
+
+/* status */
+.statusdisplay {
+
+       border-radius: 8px 8px 8px 8px;
+       -webkit-border-radius: 8px 8px 8px 8px;
+       padding-left: 20px;
+       padding-right: 20px;
+       margin: 0 auto;
+       width: 950px;
+       height:100px;
+       margin-left: -1.6em;
+       margin-top: 1em;
+       margin-bottom: 1em;
+       background: #fff url('/themes/ipfire-new/images/n2.gif') 0px 0px repeat-x;
+}
+/* Bandwidth Calculation */
+
+#bandwidthCalculationContainer {
+       display: block;
+}

diff --git a/html/html/themes/ipfire-new/include/functions.pl b/html/html/themes/ipfire-new/include/functions.pl
new file mode 100644 (file)
index 0000000..b644c07
--- /dev/null
+++ b/html/html/themes/ipfire-new/include/functions.pl
@@ -0,0 +1,270 @@
+#!/usr/bin/perl
+###############################################################################
+#                                                                             #
+# IPFire.org - A linux based firewall                                         #
+# Copyright (C) 2007  Michael Tremer & Christian Schmidt                      #
+#                                                                             #
+# This program is free software: you can redistribute it and/or modify        #
+# it under the terms of the GNU General Public License as published by        #
+# the Free Software Foundation, either version 3 of the License, or           #
+# (at your option) any later version.                                         #
+#                                                                             #
+# This program is distributed in the hope that it will be useful,             #
+# but WITHOUT ANY WARRANTY; without even the implied warranty of              #
+# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the               #
+# GNU General Public License for more details.                                #
+#                                                                             #
+# You should have received a copy of the GNU General Public License           #
+# along with this program.  If not, see <http://www.gnu.org/licenses/>.       #
+#                                                                             #
+###############################################################################
+#                                                                             #
+# Theme file for IPfire (based on ipfire theme)                               #
+# Author kay-michael köhler kmk <michael@koehler.tk>                          #
+#                                                                             #
+# Version 1.0  March, 6th 2013                                               #
+###############################################################################
+#                                                                             #
+# Modyfied theme by a.marx@ipfire.org January 2014                            #
+#                                                                             #
+# Cleanup code, deleted unused code and rewrote the rest to get a new working #
+# IPFire default theme.                                                       #
+###############################################################################
+
+use File::Basename;
+require "${General::swroot}/lang.pl";
+###############################################################################
+#
+# print menu html elements for submenu entries
+# @param submenu entries
+sub showsubmenu() {
+       my $submenus = shift;
+       
+       print "<ul>";
+       foreach my $item (sort keys %$submenus) {
+               $link = getlink($submenus->{$item});
+               next if (!is_menu_visible($link) or $link eq '');
+
+               my $subsubmenus = $submenus->{$item}->{'subMenu'};
+
+               if ($subsubmenus) {
+                       print '<li class="has-sub ">';
+               } else {
+                       print '<li>';
+               }
+               print '<a href="'.$link.'"><span>'.$submenus->{$item}->{'caption'}.'</span></a>';
+
+               &showsubmenu($subsubmenus) if ($subsubmenus);
+               print '</li>';
+       }
+       print "</ul>"
+}
+
+###############################################################################
+#
+# print menu html elements
+sub showmenu() {
+       print '<div id="cssmenu"><ul>';
+       foreach my $k1 ( sort keys %$menu ) {
+               $link = getlink($menu->{$k1});
+               next if (!is_menu_visible($link) or $link eq '');
+               print '<li class="has-sub "><a><span>'.$menu->{$k1}->{'caption'}.'</span></a>';
+               my $submenus = $menu->{$k1}->{'subMenu'};
+               &showsubmenu($submenus) if ($submenus);
+               print "</li>";
+       }
+       if ($settings{'SPEED'} ne 'off') {
+               print"<div id='traffic'>";
+               print"<table><tr><td style='font-weight: bold;'>Traffic: &nbsp;</td>";
+               print"<td id='bandwidthCalculationContainer'>In <span id='rx_kbs'></span> &nbsp; Out <span id='tx_kbs'></span></td>";
+               print"</tr></table>";
+               print '</ul></div></div>';
+       }
+}
+
+###############################################################################
+#
+# print page opening html layout
+# @param page title
+# @param boh
+# @param extra html code for html head section
+# @param suppress menu option, can be numeric 1 or nothing.
+#               menu will be suppressed if param is 1
+sub openpage {
+       my $title = shift;
+       my $boh = shift;
+       my $extrahead = shift;
+       my $suppressMenu = shift;
+       my @tmp = split(/\./, basename($0));
+       my $scriptName = @tmp[0];
+       my $h2 = $title;
+
+       @URI=split ('\?',  $ENV{'REQUEST_URI'} );
+       &General::readhash("${swroot}/main/settings", \%settings);
+       &genmenu();
+
+       $title = "IPFire - $title";
+       if ($settings{'WINDOWWITHHOSTNAME'} eq 'on') {
+               $title =  "$settings{'HOSTNAME'}.$settings{'DOMAINNAME'} - $title"; 
+       }
+
+print <<END
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html>
+       <head>
+       <title>$title</title>
+       $extrahead
+       <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
+       <link rel="shortcut icon" href="/favicon.ico" />
+       <link href="/themes/ipfire-new/include/css/style.css" rel="stylesheet" type="text/css"  />
+       <script type="text/javascript" src="/include/jquery-1.9.1.min.js"></script>
+END
+;
+if ($settings{'SPEED'} ne 'off') {
+print <<END
+       <script type="text/javascript" src="/themes/ipfire-new/include/js/refreshInetInfo.js"></script>
+END
+;
+}
+
+if ($settings{'FX'} ne 'off') {
+print <<END
+       <meta http-equiv="Page-Enter" content="blendTrans(Duration=0.5,Transition=12)" />
+       <meta http-equiv="Page-Exit" content="blendTrans(Duration=0.5,Transition=12)" />
+END
+;
+}
+
+print <<END
+               </head>
+               <body>
+END
+;
+
+print <<END
+<!-- IPFIRE HEADER -->
+               <div id="header_inner" class="fixed">
+                       <div id="logo">
+END
+;
+       if ($settings{'WINDOWWITHHOSTNAME'} eq 'on') {
+               print "<h1><span>$settings{'HOSTNAME'}.$settings{'DOMAINNAME'}</span></h1><br />"; 
+       } else {
+               print "<h1><span>IPFire</span></h1><br />";
+       }
+
+print <<END
+                               <h2>$h2</h2>
+                       </div>
+               </div>
+END
+;
+
+&showmenu() if ($suppressMenu != 1);
+
+print <<END
+<div id="main">
+       <div id="main_inner" class="fixed">
+               <div id="columnA_2columns">
+END
+;
+}
+
+###############################################################################
+#
+# print page opening html layout without menu
+# @param page title
+# @param boh
+# @param extra html code for html head section
+sub openpagewithoutmenu {
+       openpage(shift,shift,shift,1);
+       return;
+}
+
+
+###############################################################################
+#
+# print page closing html layout
+
+sub closepage () {
+       my $status = &connectionstatus();
+       my $uptime = `/usr/bin/uptime|cut -d \" \" -f 4-`;
+       $uptime =~ s/year(s|)/$Lang::tr{'year'}/;
+       $uptime =~ s/month(s|)/$Lang::tr{'month'}/;
+       $uptime =~ s/days/$Lang::tr{'days'}/;
+       $uptime =~ s/day /$Lang::tr{'day'}/;
+       $uptime =~ s/user(s|)/$Lang::tr{'user'}/;
+       $uptime =~ s/load average/$Lang::tr{'uptime load average'}/;  
+print <<END
+               <!-- closepage begin -->
+                       </div>
+       </div>
+END
+;
+
+print "<div id='columnC_2columns'>";
+print <<END
+                       <table cellspacing="5"  class="statusdisplay" border="0">
+                       <tr><td align='center'>$status   Uptime: $uptime</td></tr>
+END
+;
+
+print <<END
+               </table>
+               </div>
+       </div>
+</body>
+</html>
+<!-- closepage end -->
+END
+;
+}
+
+###############################################################################
+#
+# print big box opening html layout
+sub openbigbox
+{
+}
+
+###############################################################################
+#
+# print big box closing html layout
+sub closebigbox
+{
+}
+
+###############################################################################
+#
+# print box opening html layout
+# @param page width
+# @param page align
+# @param page caption
+sub openbox
+{
+       $width = $_[0];
+       $align = $_[1];
+       $caption = $_[2];
+
+print <<END
+<!-- openbox -->
+               <div class="post" align="$align">
+END
+;
+if ($caption) { print "<h3>$caption</h3>\n"; } else { print "&nbsp;"; }
+}
+
+###############################################################################
+#
+# print box closing html layout
+sub closebox
+{
+       print <<END
+       </div>
+       <br class="clear" />
+       <!-- closebox -->
+END
+;
+}
+
+1;

diff --git a/html/html/themes/ipfire-new/include/js/refreshInetInfo.js b/html/html/themes/ipfire-new/include/js/refreshInetInfo.js
new file mode 100644 (file)
index 0000000..7ead833
--- /dev/null
+++ b/html/html/themes/ipfire-new/include/js/refreshInetInfo.js
@@ -0,0 +1,53 @@
+/* refreshInetInfo.js \r
+* functions for retrieving status information via jQuery\r
+* Modified: March 6th, 2013 by michael@koehler.tk\r
+* Authors:     IPFire Team (info@ipfire.org)\r
+                       Kay-Michael Köhler (michael@koehler.tk)\r
+* Visit http://www.ipfire.org/\r
+*/\r
+\r
+var t_current;\r
+var t_last = 0;\r
+var rxb_current;\r
+var rxb_last = 0;\r
+var txb_current;\r
+var txb_last = 0;\r
+\r
+$(document).ready(function(){\r
+       refreshInetInfo();\r
+});\r
+\r
+function refreshInetInfo() {\r
+       $.ajax({\r
+               url: '/cgi-bin/speed.cgi',\r
+               success: function(xml){\r
+                       \r
+                       t_current = new Date();\r
+                       var t_diff = t_current - t_last;\r
+                       \r
+                       rxb_current = $("rxb",xml).text();\r
+                       var rxb_diff = rxb_current - rxb_last;\r
+                       rxb_last = rxb_current;\r
+\r
+                       var rx_kbs = rxb_diff/t_diff;\r
+                       rx_kbs = Math.round(rx_kbs*10)/10;\r
+\r
+                       txb_current = $("txb",xml).text();\r
+                       var txb_diff = txb_current - txb_last;\r
+                       txb_last = txb_current;\r
+\r
+                       var tx_kbs = txb_diff/t_diff;\r
+                       tx_kbs = Math.round(tx_kbs*10)/10;\r
+                       \r
+                       if (t_last != 0) {\r
+                               $("#rx_kbs").text(rx_kbs + ' kb/s');\r
+                               $("#tx_kbs").text(tx_kbs + ' kb/s');\r
+                               if ($("#bandwidthCalculationContainer").css('display') == 'none')\r
+                                       $("#bandwidthCalculationContainer").css('display','block');\r
+                       }\r
+                       \r
+                       t_last = t_current;\r
+               }\r
+       });\r
+       window.setTimeout("refreshInetInfo()", 2000);\r
+}\r