Streamlined response message, implement JQuery into templates by default.

This commit is contained in:
Nate Jones
2014-02-20 23:57:50 +00:00
parent 8281fc2f80
commit 7ec1d651cd
5 changed files with 353 additions and 112 deletions

View File

@@ -375,7 +375,42 @@ table tr:last-child td:last-child {
/*list-style-image: url("images/img.gif");*/ /*list-style-image: url("images/img.gif");*/
} }
/* end the menu css */ /* end the menu css*/
#message_container {
z-index: 99999;
position: absolute;
left: 0px;
top: 0px;
right: 0px;
filter: alpha(opacity=0);
opacity: 0;
-moz-opacity:0;
-khtml-opacity: 0;
}
#message_block {
margin: 0px auto;
width: 300px;
height: auto;
background-color: #000;
background-repeat: repeat-x;
background-image: url('<?=PROJECT_PATH?>/themes/accessible/images/background_black.png');
background-position: top center;
padding: 10px;
-webkit-border-radius: 0px 0px 7px 7px;
-moz-border-radius: 0px 0px 7px 7px;
border-radius: 0px 0px 7px 7px;
text-align: center;
}
#message_block .text {
font-family: arial, san-serif;
font-size: 10pt;
font-weight: bold;
color: #fff;
}
</style> </style>
<script type="text/javascript"> <script type="text/javascript">
@@ -400,8 +435,30 @@ function confirmdelete(url) {
} }
//--> //-->
</SCRIPT> </SCRIPT>
<script language="javascript" type="text/javascript" src="<?=PROJECT_PATH?>/resources/jquery/jquery-1.8.3.js"></script>
<script language="JavaScript" type="text/javascript">
function display_message() {
$(document).ready(function() {
$("#message_container").animate({ opacity: 0.9 }, "fast").delay(1750).animate({marginTop: '-=200'}, 1000);
});
}
</script>
</head> </head>
<body> <body onload="display_message();">
<?php
if (strlen($_SESSION['message']) > 0) {
echo "<div id='message_container'>";
echo " <div id='message_block'>";
echo " <span class='text'>".$_SESSION['message']."</span>";
echo " </div>";
echo "</div>";
unset($_SESSION['message']);
}
?>
<div align='center'> <div align='center'>
<table width='90%' class='border' border='0' cellpadding='0' cellspacing='0'> <table width='90%' class='border' border='0' cellpadding='0' cellspacing='0'>

View File

@@ -207,7 +207,7 @@ th:last-child th:first-child {
border-bottom: 1px solid #999999; border-bottom: 1px solid #999999;
font-size: 11px; font-size: 11px;
background-color: #990000; background-color: #990000;
color: #444444; color: #444444;
padding-right: 16px; padding-right: 16px;
padding-left: 6px; padding-left: 6px;
padding-top: 4px; padding-top: 4px;
@@ -282,7 +282,7 @@ table {
table th { table th {
padding:4px 10px padding:4px 10px
} }
table td { table td {
/*background:#fff;*/ /*background:#fff;*/
/*padding:2px 10px 4px 10px*/ /*padding:2px 10px 4px 10px*/
@@ -294,7 +294,7 @@ table tr.even td {
border-bottom: 1px solid #999999; border-bottom: 1px solid #999999;
color: #444444; color: #444444;
} }
table tr.odd td { table tr.odd td {
border-bottom: 1px solid #999999; border-bottom: 1px solid #999999;
color: #000000; color: #000000;
@@ -474,6 +474,41 @@ table tr:nth-last-child(-5) td:first-of-type {
} }
/* end the menu css*/ /* end the menu css*/
#message_container {
z-index: 99999;
position: absolute;
left: 0px;
top: 0px;
right: 0px;
filter: alpha(opacity=0);
opacity: 0;
-moz-opacity:0;
-khtml-opacity: 0;
}
#message_block {
margin: 0px auto;
width: 300px;
height: auto;
background-color: #000;
background-repeat: repeat-x;
background-image: url('<?=PROJECT_PATH?>/themes/classic/images/background_black.png');
background-position: top center;
padding: 10px;
-webkit-border-radius: 0px 0px 7px 7px;
-moz-border-radius: 0px 0px 7px 7px;
border-radius: 0px 0px 7px 7px;
text-align: center;
}
#message_block .text {
font-family: arial, san-serif;
font-size: 10pt;
font-weight: bold;
color: #fff;
}
</style> </style>
<script type="text/javascript"> <script type="text/javascript">
@@ -498,8 +533,31 @@ function confirmdelete(url) {
} }
//--> //-->
</SCRIPT> </SCRIPT>
<script language="javascript" type="text/javascript" src="<?=PROJECT_PATH?>/resources/jquery/jquery-1.8.3.js"></script>
<script language="JavaScript" type="text/javascript">
function display_message() {
$(document).ready(function() {
$("#message_container").animate({ opacity: 0.9 }, "fast").delay(1750).animate({marginTop: '-=200'}, 1000);
});
}
</script>
</head> </head>
<body> <body onload="display_message();">
<?php
if (strlen($_SESSION['message']) > 0) {
echo "<div id='message_container'>";
echo " <div id='message_block'>";
echo " <span class='text'>".$_SESSION['message']."</span>";
echo " </div>";
echo "</div>";
unset($_SESSION['message']);
}
?>
<div align='center'> <div align='center'>
<table width='90%' class='border.disabled' style='background-color:#FFFFFF;' border='0' cellpadding='0' cellspacing='0'> <table width='90%' class='border.disabled' style='background-color:#FFFFFF;' border='0' cellpadding='0' cellspacing='0'>
<tr> <tr>

View File

@@ -199,7 +199,7 @@ INPUT.txt {
border-bottom: 1px solid #999999; border-bottom: 1px solid #999999;
font-size: 11px; font-size: 11px;
background-color: #990000; background-color: #990000;
color: #444444; color: #444444;
padding-right: 16px; padding-right: 16px;
padding-left: 6px; padding-left: 6px;
padding-top: 4px; padding-top: 4px;
@@ -274,7 +274,7 @@ table {
table th { table th {
padding:4px 10px padding:4px 10px
} }
table td { table td {
/*background:#fff;*/ /*background:#fff;*/
/*padding:2px 10px 4px 10px*/ /*padding:2px 10px 4px 10px*/
@@ -286,7 +286,7 @@ table tr.even td {
border-bottom: 1px solid #999999; border-bottom: 1px solid #999999;
color: #333333; color: #333333;
} }
table tr.odd td { table tr.odd td {
border-bottom: 1px solid #999999; border-bottom: 1px solid #999999;
color: #000000; color: #000000;
@@ -535,6 +535,41 @@ table tr:nth-last-child(-5) td:first-of-type {
text-decoration:none; text-decoration:none;
} }
/* end the menu css*/ /* end the menu css*/
#message_container {
z-index: 99999;
position: absolute;
left: 0px;
top: 0px;
right: 0px;
filter: alpha(opacity=0);
opacity: 0;
-moz-opacity:0;
-khtml-opacity: 0;
}
#message_block {
margin: 0px auto;
width: 300px;
height: auto;
background-color: #000;
background-repeat: repeat-x;
background-image: url('<?=PROJECT_PATH?>/themes/default/images/background_black.png');
background-position: top center;
padding: 10px;
-webkit-border-radius: 0px 0px 7px 7px;
-moz-border-radius: 0px 0px 7px 7px;
border-radius: 0px 0px 7px 7px;
text-align: center;
}
#message_block .text {
font-family: arial, san-serif;
font-size: 10pt;
font-weight: bold;
color: #fff;
}
</style> </style>
<style type="text/css"> <style type="text/css">
/* Remove margins from the 'html' and 'body' tags, and ensure the page takes up full screen height */ /* Remove margins from the 'html' and 'body' tags, and ensure the page takes up full screen height */
@@ -546,25 +581,25 @@ table tr:nth-last-child(-5) td:first-of-type {
/* Set the position and dimensions of the background image. */ /* Set the position and dimensions of the background image. */
#page-background { #page-background {
position:fixed; position:fixed;
top:0; top:0;
left:0; left:0;
width:100%; width:100%;
height:100%; height:100%;
} }
/* Specify the position and layering for the content that needs to /* Specify the position and layering for the content that needs to
appear in front of the background image. Must have a higher z-index appear in front of the background image. Must have a higher z-index
value than the background image. Also add some padding to compensate value than the background image. Also add some padding to compensate
for removing the margin from the 'html' and 'body' tags. */ for removing the margin from the 'html' and 'body' tags. */
#page { #page {
position:relative; position:relative;
z-index:1; z-index:1;
padding:10px; padding:10px;
} }
.vtable { .vtable {
position:relative; position:relative;
z-index:1; z-index:1;
padding:10px; padding:10px;
color: 000; color: 000;
@@ -584,6 +619,41 @@ table tr:nth-last-child(-5) td:first-of-type {
-khtml-opacity: 0.9; -khtml-opacity: 0.9;
opacity: 0.9; opacity: 0.9;
} }
#message_container {
z-index: 99999;
position: absolute;
left: 0px;
top: 0px;
right: 0px;
filter: alpha(opacity=0);
opacity: 0;
-moz-opacity:0;
-khtml-opacity: 0;
}
#message_block {
margin: 0px auto;
width: 300px;
height: auto;
background-color: #000;
background-repeat: repeat-x;
background-image: url('<?=PROJECT_PATH?>/themes/accessible/images/background_black.png');
background-position: top center;
padding: 10px;
-webkit-border-radius: 0px 0px 7px 7px;
-moz-border-radius: 0px 0px 7px 7px;
border-radius: 0px 0px 7px 7px;
text-align: center;
}
#message_block .text {
font-family: arial, san-serif;
font-size: 10pt;
font-weight: bold;
color: #fff;
}
</style> </style>
<script type="text/javascript"> <script type="text/javascript">
@@ -608,8 +678,31 @@ function confirmdelete(url) {
} }
//--> //-->
</SCRIPT> </SCRIPT>
<script language="javascript" type="text/javascript" src="<?=PROJECT_PATH?>/resources/jquery/jquery-1.8.3.js"></script>
<script language="JavaScript" type="text/javascript">
function display_message() {
$(document).ready(function() {
$("#message_container").animate({ opacity: 0.9 }, "fast").delay(1750).animate({marginTop: '-=200'}, 1000);
});
}
</script>
</head> </head>
<body> <body onload="display_message();">
<?php
if (strlen($_SESSION['message']) > 0) {
echo "<div id='message_container'>";
echo " <div id='message_block'>";
echo " <span class='text'>".$_SESSION['message']."</span>";
echo " </div>";
echo "</div>";
unset($_SESSION['message']);
}
?>
<?php <?php
//get a random background image //get a random background image

View File

@@ -215,7 +215,7 @@ INPUT.txt {
border-bottom: 1px solid #999999; border-bottom: 1px solid #999999;
font-size: 11px; font-size: 11px;
background-color: #990000; background-color: #990000;
color: #444444; color: #444444;
padding-right: 16px; padding-right: 16px;
padding-left: 6px; padding-left: 6px;
padding-top: 4px; padding-top: 4px;
@@ -291,7 +291,7 @@ table {
table th { table th {
padding:4px 10px padding:4px 10px
} }
table td { table td {
/*background:#fff;*/ /*background:#fff;*/
/*padding:2px 10px 4px 10px*/ /*padding:2px 10px 4px 10px*/
@@ -303,7 +303,7 @@ table tr.even td {
border-bottom: 1px solid #999999; border-bottom: 1px solid #999999;
color: #333333; color: #333333;
} }
table tr.odd td { table tr.odd td {
border-bottom: 1px solid #999999; border-bottom: 1px solid #999999;
color: #000000; color: #000000;
@@ -547,18 +547,18 @@ table tr:nth-last-child(-5) td:first-of-type {
padding:0; padding:0;
} }
/* Specify the position and layering for the content that needs to /* Specify the position and layering for the content that needs to
appear in front of the background image. Must have a higher z-index appear in front of the background image. Must have a higher z-index
value than the background image. Also add some padding to compensate value than the background image. Also add some padding to compensate
for removing the margin from the 'html' and 'body' tags. */ for removing the margin from the 'html' and 'body' tags. */
#page { #page {
position:relative; position:relative;
z-index:1; z-index:1;
padding:10px; padding:10px;
} }
.vtable { .vtable {
position:relative; position:relative;
z-index:1; z-index:1;
padding:7px; padding:7px;
color: 000; color: 000;
@@ -579,20 +579,40 @@ table tr:nth-last-child(-5) td:first-of-type {
opacity: 0.9; opacity: 0.9;
} }
.message { #message_container {
background-repeat: repeat-x; z-index: 99999;
background-attachment: fixed; position: absolute;
padding: 20px; left: 0px;
opacity: 0.9; top: 0px;
filter:alpha(opacity=90); right: 0px;
-moz-opacity:0.9; filter: alpha(opacity=0);
-khtml-opacity: 0.9; opacity: 0;
opacity: 0.9; -moz-opacity:0;
-webkit-border-radius: 7px 7px 7px 7px; -khtml-opacity: 0;
-moz-border-radius: 7px 7px 7px 7px;
border-radius: 7px 7px 7px 7px;
text-align: left;
} }
#message_block {
margin: 0px auto;
width: 300px;
height: auto;
background-color: #000;
background-repeat: repeat-x;
background-image: url('<?=PROJECT_PATH?>/themes/enhanced/images/background_black.png');
background-position: top center;
padding: 10px;
-webkit-border-radius: 0px 0px 7px 7px;
-moz-border-radius: 0px 0px 7px 7px;
border-radius: 0px 0px 7px 7px;
text-align: center;
}
#message_block .text {
font-family: arial, san-serif;
font-size: 10pt;
font-weight: bold;
color: #fff;
}
</style> </style>
<script type="text/javascript"> <script type="text/javascript">
@@ -617,8 +637,31 @@ table tr:nth-last-child(-5) td:first-of-type {
} }
//--> //-->
</SCRIPT> </SCRIPT>
<script language="javascript" type="text/javascript" src="<?=PROJECT_PATH?>/resources/jquery/jquery-1.8.3.js"></script>
<script language="JavaScript" type="text/javascript">
function display_message() {
$(document).ready(function() {
$("#message_container").animate({ opacity: 0.9 }, "fast").delay(1750).animate({marginTop: '-=200'}, 1000);
});
}
</script>
</head> </head>
<body onload="message_timeout();"> <body onload="display_message();">
<?php
if (strlen($_SESSION['message']) > 0) {
echo "<div id='message_container'>";
echo " <div id='message_block'>";
echo " <span class='text'>".$_SESSION['message']."</span>";
echo " </div>";
echo "</div>";
unset($_SESSION['message']);
}
?>
<div id="page" align='center'> <div id="page" align='center'>
<table width='90%' class='border.disabled' border='0' cellpadding='0' cellspacing='0'> <table width='90%' class='border.disabled' border='0' cellpadding='0' cellspacing='0'>
<tr> <tr>
@@ -748,32 +791,6 @@ table tr:nth-last-child(-5) td:first-of-type {
<table width='100%' cellpadding='0' cellspacing='0' border='0'> <table width='100%' cellpadding='0' cellspacing='0' border='0'>
<tr> <tr>
<td class='main_content' align='left' valign='top' width='85%'> <td class='main_content' align='left' valign='top' width='85%'>
<script type = "text/javascript">
<!--
function message_hide() {
document.getElementById("message").style.display="none";
}
function message_timeout() {
var tim = window.setTimeout("message_hide()", 1000);
}
-->
</script>
<?php
if (strlen($_SESSION['message']) > 0) {
echo "<div id='message' align='center'>\n";
echo " <table width='40%' border='0'>\n";
echo " <tr>\n";
echo " <th align='left'>".$text['message-message']."</th>\n";
echo " </tr>\n";
echo " <tr>\n";
echo " <td class='row_style1'><strong>".$_SESSION['message']."</strong></td>\n";
echo " </tr>\n";
echo " </table>\n";
echo "<br />\n";
echo "</div>\n";
unset($_SESSION['message']);
}
?>
<!--{body}--> <!--{body}-->
<br /><br /> <br /><br />

View File

@@ -218,7 +218,7 @@ INPUT.txt {
border-bottom: 1px solid #999999; border-bottom: 1px solid #999999;
font-size: 11px; font-size: 11px;
background-color: #990000; background-color: #990000;
color: #444444; color: #444444;
padding-right: 16px; padding-right: 16px;
padding-left: 6px; padding-left: 6px;
padding-top: 4px; padding-top: 4px;
@@ -294,7 +294,7 @@ table {
table th { table th {
padding:4px 10px padding:4px 10px
} }
table td { table td {
/*background:#fff;*/ /*background:#fff;*/
/*padding:2px 10px 4px 10px*/ /*padding:2px 10px 4px 10px*/
@@ -306,7 +306,7 @@ table tr.even td {
border-bottom: 1px solid #999999; border-bottom: 1px solid #999999;
color: #333333; color: #333333;
} }
table tr.odd td { table tr.odd td {
border-bottom: 1px solid #999999; border-bottom: 1px solid #999999;
color: #000000; color: #000000;
@@ -552,25 +552,25 @@ table tr:nth-last-child(-5) td:first-of-type {
/* Set the position and dimensions of the background image. */ /* Set the position and dimensions of the background image. */
#page-background { #page-background {
position:fixed; position:fixed;
top:0; top:0;
left:0; left:0;
width:100%; width:100%;
height:100%; height:100%;
} }
/* Specify the position and layering for the content that needs to /* Specify the position and layering for the content that needs to
appear in front of the background image. Must have a higher z-index appear in front of the background image. Must have a higher z-index
value than the background image. Also add some padding to compensate value than the background image. Also add some padding to compensate
for removing the margin from the 'html' and 'body' tags. */ for removing the margin from the 'html' and 'body' tags. */
#page { #page {
position:relative; position:relative;
z-index:1; z-index:1;
padding:10px; padding:10px;
} }
.vtable { .vtable {
position:relative; position:relative;
z-index:1; z-index:1;
padding:7px; padding:7px;
color: 000; color: 000;
@@ -591,19 +591,38 @@ table tr:nth-last-child(-5) td:first-of-type {
opacity: 0.9; opacity: 0.9;
} }
.message { #message_container {
z-index: 99999;
position: absolute;
left: 0px;
top: 0px;
right: 0px;
filter: alpha(opacity=0);
opacity: 0;
-moz-opacity:0;
-khtml-opacity: 0;
}
#message_block {
margin: 0px auto;
width: 300px;
height: auto;
background-color: #000;
background-repeat: repeat-x; background-repeat: repeat-x;
background-attachment: fixed; background-image: url('<?=PROJECT_PATH?>/themes/nature/images/background_black.png');
padding: 20px; background-position: top center;
opacity: 0.9; padding: 10px;
filter:alpha(opacity=90); -webkit-border-radius: 0px 0px 7px 7px;
-moz-opacity:0.9; -moz-border-radius: 0px 0px 7px 7px;
-khtml-opacity: 0.9; border-radius: 0px 0px 7px 7px;
opacity: 0.9; text-align: center;
-webkit-border-radius: 7px 7px 7px 7px; }
-moz-border-radius: 7px 7px 7px 7px;
border-radius: 7px 7px 7px 7px; #message_block .text {
text-align: left; font-family: arial, san-serif;
font-size: 10pt;
font-weight: bold;
color: #fff;
} }
</style> </style>
@@ -629,8 +648,31 @@ table tr:nth-last-child(-5) td:first-of-type {
} }
//--> //-->
</SCRIPT> </SCRIPT>
<script language="javascript" type="text/javascript" src="<?=PROJECT_PATH?>/resources/jquery/jquery-1.8.3.js"></script>
<script language="JavaScript" type="text/javascript">
function display_message() {
$(document).ready(function() {
$("#message_container").animate({ opacity: 0.9 }, "fast").delay(1750).animate({marginTop: '-=200'}, 1000);
});
}
</script>
</head> </head>
<body onload="message_timeout();"> <body onload="display_message();">
<?php
if (strlen($_SESSION['message']) > 0) {
echo "<div id='message_container'>";
echo " <div id='message_block'>";
echo " <span class='text'>".$_SESSION['message']."</span>";
echo " </div>";
echo "</div>";
unset($_SESSION['message']);
}
?>
<?php <?php
//get a random background image //get a random background image
$dir = $_SERVER["DOCUMENT_ROOT"].PROJECT_PATH.'/themes/nature/images/backgrounds'; $dir = $_SERVER["DOCUMENT_ROOT"].PROJECT_PATH.'/themes/nature/images/backgrounds';
@@ -792,32 +834,6 @@ table tr:nth-last-child(-5) td:first-of-type {
<table width='100%' cellpadding='0' cellspacing='0' border='0'> <table width='100%' cellpadding='0' cellspacing='0' border='0'>
<tr> <tr>
<td class='main_content' align='left' valign='top' width='85%'> <td class='main_content' align='left' valign='top' width='85%'>
<script type = "text/javascript">
<!--
function message_hide() {
document.getElementById("message").style.display="none";
}
function message_timeout() {
var tim = window.setTimeout("message_hide()", 1000);
}
-->
</script>
<?php
if (strlen($_SESSION['message']) > 0) {
echo "<div id='message' align='center'>\n";
echo " <table width='40%' border='0'>\n";
echo " <tr>\n";
echo " <th align='left'>".$text['message-message']."</th>\n";
echo " </tr>\n";
echo " <tr>\n";
echo " <td class='row_style1'><strong>".$_SESSION['message']."</strong></td>\n";
echo " </tr>\n";
echo " </table>\n";
echo "<br />\n";
echo "</div>\n";
unset($_SESSION['message']);
}
?>
<!--{body}--> <!--{body}-->
<br /><br /> <br /><br />