API tools faq
paste
Advertisement
Guest User

index.html

a guest
Jan 10th, 2013
112
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 10.94 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <!DOCTYPE html>
  4. <head>
  5. <!-- meta -->
  6. <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  7. <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
  8. <meta http-equiv="Expires" content="Tue, 01 Jan 1980 1:00:00 GMT" />
  9. <meta http-equiv="Pragma" content="no-cache" />
  10. <meta name="Designer" content="PremiumPixels.com">
  11. <meta name="Author" content="$hekh@r d-Ziner, CSSJUNTION.com">
  12.  
  13.  
  14. <link rel="stylesheet" href="css/ui-lightness/jquery-ui-1.8.22.custom.css">
  15.     <link rel ="stylesheet" type ="text/css" href ="css/style.css">
  16.     <link rel="stylesheet" type="text/css" href="css/reset.css">
  17. <link rel="stylesheet" type="text/css" href="css/structure.css">
  18.     <script type="text/javascript" src="js/jquery.js"></script>
  19.     <script type="text/javascript" src="js/jquery-ui.js"></script>
  20.  
  21.    
  22.     <style>
  23.         body { font-size: 62.5%; }
  24.         label, input { display:block; }
  25.         input.text { margin-bottom:12px; width:95%; padding: .4em; }
  26.         fieldset { padding:0; border:0; margin-top:25px; }
  27.         h1 { font-size: 1.2em; margin: .6em 0; }
  28.    
  29.         .ui-dialog .ui-state-error { padding: .3em; }
  30.         .validateTips { border: 1px solid transparent; padding: 0.3em; }
  31.     </style>
  32.  
  33.        
  34. <!-- title -->
  35. <title> Login </title>
  36. <link rel="shortcut icon" type="image/x-icon" href="images/base.gif" />
  37.        
  38. <!-- css -->
  39. <link rel="stylesheet" href="css/main.css" type="text/css" media="screen, projection" />
  40. </head>
  41.  
  42. <body>
  43.  
  44. <script>
  45. $(function() {
  46. tips = $( ".validateTips" );
  47.  
  48. function updateTips( t ) {
  49.             tips
  50.                 .text( t )
  51.                 .addClass( "ui-state-highlight" );
  52.             setTimeout(function() {
  53.                 tips.removeClass( "ui-state-highlight", 1500 );
  54.             }, 500 );
  55.         }
  56.        
  57. function checkLength( o, n, min, max )
  58.        {
  59.        
  60.             if ( o.val().length > max || o.val().length < min ) {
  61.                 o.addClass( "ui-state-error" );
  62.                 updateTips( "Length of " + n + " must be between " +
  63.                     min + " and " + max + "." );
  64.                 return false;
  65.             } else {
  66.                 return true;
  67.             }
  68.         }
  69. function checkgmail(o,n)
  70. {
  71. var email = o.val();
  72. email = email.toLowerCase();
  73.     if(email.indexOf("@gmail.com") == -1)
  74.     {
  75.         o.addClass( "ui-state-error" );
  76.         updateTips( "Sorry only "+ n + " staff can register" );
  77.         return false;
  78.     }
  79.     else
  80.         return true;
  81. }
  82.  
  83. function checkRegexp( o, regexp, n ) {
  84.             if ( !( regexp.test( o.val() ) ) ) {
  85.                 o.addClass( "ui-state-error" );
  86.                 updateTips( n );
  87.                 return false;
  88.             } else {
  89.                 return true;
  90.             }
  91.         }      
  92.  
  93.  
  94.  
  95.     $( "#dialog-form" ).dialog({
  96.             autoOpen: false,
  97.             closeOnEscape : true,
  98.             height: 300,
  99.             show : 'fade',
  100.             width: 350,
  101.             modal: true,
  102.             resizable : false,
  103.             buttons: {
  104.                 "Send Password": function() {
  105.                    
  106.                         var email     = $('#email'),
  107.                     allFields = $( [] ).add(email);
  108.                     var bValid = true;
  109.                     allFields.removeClass( "ui-state-error" );
  110.  
  111.                    
  112.                     bValid = bValid && checkLength( email, "email", 6, 80 );
  113.                     bValid = bValid && checkRegexp(email,  /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/, "eg. abc@def.com" );     
  114.    
  115.         var mail = $( "#email" ).val();
  116.         var varData = '&email=' + mail ;
  117.  
  118.        
  119.             if(bValid)
  120.             {  
  121.                 window.location = "http://website1.com/forgotpswd.php?"+varData;
  122.                 $( this ).dialog( "close" );
  123.                     $( this ).find('form')[0].reset();     
  124.                 allFields.removeClass( "ui-state-error" );             
  125.             }  
  126.            
  127.                
  128.                 },
  129.                 },
  130.            
  131.             close: function() {
  132.                
  133.                 $( this ).find('form')[0].reset();
  134.  
  135.             }
  136.         });
  137.  
  138. $( "#forgot-password" )
  139.             .button()
  140.             .click(function() {
  141.                 $( "#dialog:ui-dialog" ).dialog( "destroy" );
  142.                 $( "#dialog-form" ).dialog( "open" );
  143.             });
  144.  
  145. $("#register").dialog({
  146.             autoOpen: false,
  147.             closeOnEscape : true,
  148.             height: 430,
  149.             show : 'fade',
  150.             width: 350,
  151.             modal: true,
  152.             resizable : false,
  153.        
  154.             buttons :{
  155.        
  156.         "Submit" : function(){
  157.         var firstname = $('#firstname'),
  158.             lastname  = $('#lastname'),
  159.             registeremail = $('#registeremail'),
  160.             password  = $('#password'),
  161.             allFields = $( [] ).add(firstname).add(lastname).add(registeremail).add(password);
  162.    
  163.         var bValid = true;
  164.          
  165.         allFields.removeClass( "ui-state-error" );
  166.  
  167.         bValid = bValid && checkLength( firstname, "First Name", 2, 16 );
  168.         bValid = bValid && checkLength( lastname, "Last Name", 2, 16 );
  169.         bValid = bValid && checkLength( registeremail, "email", 6, 80 );
  170.        
  171.         bValid = bValid && checkRegexp(registeremail,  /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/, "eg. abc@def.com" );
  172.         bValid = bValid && checkgmail( registeremail, "gmail" );  
  173.         bValid = bValid && checkLength( password, "password", 5, 20 );
  174.         var fname = $( "#firstname" ).val();
  175.         var lname = $("#lastname").val();
  176.         var mail = $( "#registeremail" ).val();
  177.         var pass = $('#password').val();
  178.         fname = fname.replace(" ","");
  179.        
  180.         var varData = 'firstname=' + fname + '&lastname=' + lname +  '&email=' + mail + '&password=' + pass;
  181.             if(bValid)
  182.             {  
  183.                 window.location = "http://website1.com/firstime_staff_registration.php?"+varData;
  184.                 $( this ).dialog( "close" );
  185.                     $( this ).find('form')[0].reset();     
  186.                 allFields.removeClass( "ui-state-error" );             
  187.             }
  188.            
  189.             },// This is submit button ending
  190.            
  191.         "Cancel" : function(){
  192.              $( this ).dialog( "close" );
  193.              $(this).find('form')[0].reset();
  194.             updateTips("All form fields are required");
  195.             var firstname = $('#firstname'),
  196.             lastname  = $('#lastname'),
  197.             registeremail     = $('#registeremail'),
  198.             password  = $('#password'),
  199.             allFields = $( [] ).add(firstname).add(lastname).add(registeremail).add(password);
  200.             allFields.removeClass( "ui-state-error" );
  201.         },     
  202.         },
  203.         close: function() {
  204.                 var firstname = $('#firstname'),
  205.             lastname  = $('#lastname'),
  206.             registeremail = $('#registeremail'),
  207.             password  = $('#password'),
  208.             allFields = $( [] ).add(firstname).add(lastname).add(registeremail).add(password);
  209.    
  210.        
  211.             updateTips("All form fields are required");
  212.  
  213.             allFields.removeClass( "ui-state-error" );
  214.  
  215.                 $(this).find('form')[0].reset();
  216.             }
  217. });
  218.  
  219. $( "#register-staff" )
  220.             .button().click(function() {
  221.                 $( "#dialog:ui-dialog" ).dialog( "destroy" );              
  222.                 $( "#register" ).dialog( "open" );
  223.                
  224.                 $( "#register" ).get($("#firstname").val("")); 
  225.                 $( "#register" ).get($("#lastname").val(""));
  226.                 $( "#register" ).get($("#password").val(""));
  227.                 $( "#register" ).get($("#registeremail").val(""));
  228.             });
  229.         });
  230. </script>  
  231.  
  232.  
  233. <!-- begin container to center layout in middle of page -->
  234. <div id="container">
  235.  
  236. <!-- begin header which contains our heading and navigation -->
  237. <div id="header">
  238.  
  239. <h1> <img src="images/main_logo.png" border="1" style="position:relative;left:0px;top:8px;"  />  </h1>
  240.                
  241. <!-- begin navigation -->
  242. <div id="nav">
  243.    
  244.     <ul class="clearfix">
  245.        
  246.     </ul>
  247.    
  248. </div><!-- end navigation -->
  249.  
  250. </div><!-- end header -->
  251.            
  252. <!-- begin content which houses our two columns and footer -->
  253. <div id="content" class="clearfix">
  254.  
  255. <!-- begin main column -->
  256. <div id="main"><div id="main-inner">
  257.    
  258.     <br><br>
  259. <br> <br>
  260.    
  261. <form class="box login"   name="login" method="post" action="login_authentication.php" onSubmit = "return validateForm();" style ="position:relative;left:300px;top:70px;">
  262.     <fieldset class="boxBody">
  263.       <label>E-mail</label>
  264.       <input type="text" name="myusername" tabindex="1"  required>
  265.   <label>Password</label>
  266.        <input type="password" name="mypassword" tabindex="2" required>
  267.     </fieldset>
  268.     <footer>
  269.        <input type="submit" class="btnLogin" value="Sign in" tabindex="4" onClick="return button1();">
  270.     </footer>
  271. </form>
  272.    
  273.        
  274.  
  275. <br> <br> <br> <br>
  276.        
  277.     <div style="position: relative;">
  278.     <button id="register-staff" style = "position:relative;font-size:12px;left:170px;top:40px;">Register</button>
  279.  
  280.  
  281.     </div>
  282.    
  283.     <div style="position: relative">
  284.     <div class="register">
  285.     <div id="register" title="First time registration for Staff">
  286.     <p class="validateTips">All form fields are required</p>
  287.  
  288.     <form>
  289.     <fieldset>
  290.    
  291.         <label for="first_name"><b>First Name</b></label>
  292.         <input type="text" name="firstname" id = "firstname"  class="text ui-widget-content ui-corner-all" />
  293.        
  294.         <label for="last_name"><b>Last Name</b></label>
  295.         <input type="text" name="lastname" id = "lastname"  class="text ui-widget-content ui-corner-all" />
  296.        
  297.         <label for="email"><b>Email  </b></label>
  298.         <input type="text" name="registeremail" id="registeremail" class="text ui-widget-content ui-corner-all" />
  299.        
  300.         <label for="password"><b>Password</b></label>
  301.         <input type="password" name = "password" id = "password" class="text ui-widget-content ui-corner-all" />
  302.                
  303.     </fieldset>
  304.     </form>
  305. </div>
  306. </div>
  307. </div> 
  308. </div></div><!-- end main column -->
  309.                
  310.                
  311.                
  312. <div class="Forgot Password">
  313.  
  314. <div id="dialog-form" title="Forgot Password">
  315.     <p class="validateTips"><big>Fill in the e-mail address for the password to be sent</big></p>
  316.  
  317.     <form>
  318.     <fieldset>
  319.    
  320.                
  321.         <label for="email"><b><big>Email</big></b></label>
  322.         <input type="text" name="email" id="email" class="text ui-widget-content ui-corner-all" />
  323.        
  324.        
  325.                
  326.     </fieldset>
  327.     </form>
  328. </div>
  329. <div style="position: relative;">
  330. <button id="forgot-password"  style  = "position:relative;font-size:12px;left:-280px;top:304px;" >Forgot Password</button>
  331. </div>
  332.  
  333. </div>
  334.                
  335.                
  336.                
  337.                
  338. <!-- begin side column -->
  339. <div id="side"><div id="side-inner">
  340.     <tr>
  341.     <img src="images/logo1.png" alt="H" class="img-right" />
  342.     <br> <br><br><br>
  343.  
  344.     <br>
  345.     </tr>
  346.     <tr> </tr>
  347.     <p style= "color:#153E7E;font-size:14pt;font-family:calibri;font-align:justify;"> ***** </p>
  348.  
  349.    
  350.    
  351. </div></div><!-- end side column -->
  352.            
  353. <!-- begin footer -->
  354. <div id="footer">
  355.    
  356.     <p>Copyright &#169;
  357.  
  358. <script type="text/javascript" language="JavaScript">
  359.     var d=new Date();
  360.     yr=d.getFullYear();
  361.     document.write(yr);
  362. </script>
  363.  
  364.  
  365.  </p>
  366.    
  367. </div><!-- end footer -->
  368.  
  369. </div><!-- end content -->
  370.        
  371. </div><!-- end container -->
  372.  
  373.  
  374.     <script language="Javascript">
  375.  
  376.     function button1()
  377.     {
  378.         document.login.action="./login_authentication.php";
  379.         document.login.target = "_self";
  380.         document.login.submit();
  381.        
  382.         return true;
  383.     }
  384.        
  385.  
  386.     function validateForm()
  387.     //The fields should be filled
  388.    
  389.     {
  390.         var x=document.forms["login"]["myusername"].value
  391.        
  392.         if (x==null || x=="" )
  393.             {
  394.                 alert("Please enter the Username");
  395.                 return false;
  396.             }
  397.         var y=document.forms["login"]["mypassword"].value
  398.         if (y==null || y=="")
  399.             {
  400.                 alert("Please enter the Password");
  401.                 return false;
  402.             }
  403.        
  404. var m = x.indexOf ("'");
  405. var n = y.indexOf("'");
  406.        
  407. if (m != -1)
  408.  {
  409.  alert("Unusual characters in username. Please re-try");
  410. return false;
  411. }
  412.  
  413. if (n != -1)
  414. {
  415.  alert("Unusual characters in password. Please re-try");
  416. return false;
  417. }
  418.  
  419. else
  420. return true;
  421.  
  422.     }
  423.    
  424.     </script>
  425.  
  426. </body>
  427. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!