Advanced Search

Scalable code and much refined to aletrs custom messages based on the errors returned from the server or even static way....JSON

/ Published in: JavaScript
Save to your folder(s)
It doesn't work directly make the url virtual and run it on any of the major links.....remove the images

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="utf-8" />
  5.     <title>Json</title>
  6.     <style>
  7.         html, body
  8.         {
  9.             margin: 0;
  10.             padding: 0px;
  11.             font-family: Arial, Helvetica, sans-serif;
  12.             height: 100%;
  13.             width: 100%;
  14.             background: #99C8E8;
  15.         }
  16.  
  17.         h1
  18.         {
  19.             font-size: 24px;
  20.             padding: 0;
  21.             margin: 0 0 8px 0;
  22.         }
  23.  
  24.         #logo
  25.         {
  26.             width: 550px;
  27.             margin: 50px auto 20px auto;
  28.             text-align: center;
  29.             padding-left: 112px;
  30.         }
  31.  
  32.         #ErrorMessage
  33.         {
  34.             width: 100%;
  35.             min-width: 650px;
  36.             height: 100%;
  37.         }
  38.  
  39.         #ErrorMessageContent
  40.         {
  41.  
  42.             width: 550px;
  43.             margin: 0 auto;
  44.             font-size: 22px;
  45.             border: #FFF 1px solid;
  46.             color: #FFF;
  47.             padding: 30px 50px 30px 50px;
  48.         }
  49.  
  50.         #ErrorMessage h1
  51.         {
  52.             text-align: center;
  53.         }
  54.         .spanner
  55.         {
  56.             border:1px;
  57.             display:block;
  58.             background:#9CCBEF;
  59.             padding:10px; 
  60.         }
  61.         .hmessage
  62.         {
  63.             color:#424542;
  64.             font-size:18px;
  65.             font-weight:bold;
  66.             text-align:left;
  67.             padding-right:300px;
  68.         }
  69.         .message_box
  70.         {
  71.             border:1px solid;
  72.             padding:8px;
  73.         }
  74.         .pmessage
  75.         {
  76.             text-align:left;
  77.             color:#717171;
  78.             font-size:16px;
  79.         } 
  80.         #ErrorMessage p
  81.         {
  82.             padding: 0;
  83.             margin: 0;
  84.             line-height: 18px;
  85.             font-size:12px;
  86.             text-align: left;
  87.             padding-top:5px;
  88.         }
  89.  
  90.         #ErrorMessage p a, #ErrorMessage p a:link
  91.         {
  92.             display: block;
  93.             color: #c5dae8;
  94.             text-decoration: none;
  95.         }
  96.  
  97.         #ErrorMessage p a:hover
  98.         {
  99.             color: #99C8E8;
  100.         }
  101.     </style>
  102.     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js" type="text/javascript"></script>
  103. 	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
  104.  
  105.  
  106. </head>
  107. <body>
  108.     <div id="logo">
  109.         <img src="images/yourimg.png" border="0" />
  110.     </div>
  111.     <div id="ErrorMessage">
  112.         <div id="ErrorMessageContent">
  113.            <div class="message_box">
  114.            <div class="spanner"> 
  115.                 <font class="hmessage">Welcome to the site</font>
  116.  
  117.                 <p class="pmessage">
  118.                     We are currently performing planned maintenance.</p>
  119.                 <p>
  120.                     &nbsp;</p>
  121.             </div>
  122.             </div>
  123.  
  124.         </div>
  125.     </div>
  126. </body>
  127. </html>
  128. <script type="text/javascript">
  129.  
  130.  
  131.     var errorSettings = {
  132.  
  133.         getURLParameter: function (name) {
  134.  
  135.             var str = decodeURIComponent((RegExp('[?|&]' + name + '=' + '(.+?)(&|#|;|$)').exec(location.search) || [, ""])[1].replace(/\+/g, '%20')) || null;
  136.             return str;
  137.         },
  138.  
  139.         errorcode: function () { return errorSettings.getURLParameter("errorReason") },
  140.  
  141.         language: function () { return errorSettings.getURLParameter("lang") },
  142.  
  143.         hmessageDivId: {
  144.             "0": "Access Denied",
  145.             "1": "Access Denied",
  146.             "2": "Access Denied",
  147.             "3": "Access Denied",
  148.             "4": "Access Denied",
  149.             "5": "Access Denied",
  150.             "6": "Access Denied",
  151.             "7": "Access Denied",
  152.             "8": "Access Denied",
  153.             "9": "Access Denied"
  154.         },
  155.  
  156.         messages: {
  157.             "0": "Your user permissions do not authorize you to access this page.",
  158.             "1": "The user name and password combination you entered does not correspond to a registered user.",
  159.             "2": "The password you have entered is invalid.",
  160.             "3": "Your account has been locked. Please contact your System Administrator.",
  161.             "4": "Your account has been deleted. For further details, please contact your System Administrator.",
  162.             "5": "Your account has expired. Please contact your System Administrator.",
  163.             "6": "Invalid assertion.",
  164.             "7": "Please provide a user name and a password.",
  165.             "8": "You cannot access this product since you belong to no group. Please contact your System Administrator.",
  166.             "9": "Invalid answer to secret question.",
  167.             "10": "Your account has been deactivated. Please contact your System Administrator to reactivate it.",
  168.             "11": "Your password is expired"
  169.         },
  170.  
  171.         errorDivId: ".pmessage",
  172.  
  173.         hmessid: ".hmessage"
  174.     };
  175.  
  176.  
  177.     $(document).ready(function (e) {
  178.  
  179.         if (errorSettings.errorcode() != null) {
  180.             // alert(errorSettings.messages[errorSettings.errorcode] + " :: " + errorSettings.language);
  181.             $(errorSettings.hmessid).html(  errorSettings.hmessageDivId[errorSettings.errorcode()] )
  182.             $(errorSettings.errorDivId).html('<p><font class="sublabel">' + errorSettings.messages[errorSettings.errorcode()] + '</font></p>')
  183.  
  184.         }
  185.  
  186.     });
  187.  
  188. </script>

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.