Monday, May 16, 2011

Simple Custom Dialog box using Jquery

<html>
<head>
import the jquery plugins from the jquery website like
jquery.js
jquery.ui.core.min.js etc..there will be two part one will be the core and one for the ui.
Also include the css files that come along with the zip file which you download from the jquery website
<script type="text/javascript">


    var divContents = "<h1>";
         divContents +="<a href=\"www.google.com\">";
         divContents +="Google";
         divContents +="</a>";
         divContents +="</h1>";
         divContents +="<h1>";
         divContents +="<a href=\"www.yahoo.com\">";
         divContents +="Yahoo";
         divContents +="</a>";
         divContents +="</h1>";
       
       
       var resumeortrackclaimdiv = jQuery('<div id="resumeortrackclaim"></div>')
         .html(divContents)
         .dialog({
              autoOpen: false,
              modal:true,
              draggable: true,
              resizable: false,
              height: 120,
              width: 270,
              position: ['center'],
                 overlay: { opacity: 0, background: 'black'},
                 open: function(){jQuery(".ui-dialog-titlebar-close").focus();}
         });
    jQuery('#ui-dialog-title-resumeortrackclaim').append("<span>Resume Or Track Claim</span>")
      
     jQuery('#my-claim-button').click(function() {
         resumeortrackclaimdiv.dialog('open');
         return false;
         });


/* this will create a a div and dialog box
    But the style sheet will be default since we want a custom dialog box we need to modify the css file for the dialog box.
*/


/* Now change the css content to create a default dialog box*/


.ui-dialog .ui-dialog-titlebar {
    padding: 0px;
    position: none;
}

.ui-widget-header {
    background: none;
    border: 0px ;
}

#resumeortrackclaim {
    height: 100px !important;
    width: 250px !important;
}

.ui-dialog-titlebar {
    height :20px;
    widht:300px;
    background-color:black;
    padding:4px;
}


.ui-dialog .ui-dialog-content {
    background: none repeat scroll 0 0 transparent;
    border: 0 none;
    overflow: auto;
    padding: 0 !important;
    position: relative;
}

.ui-dialog-content {
     margin-top:15px;
     margin-left: 7px;
    }
   
.ui-dialog .ui-dialog-titlebar {
    padding: 0.5em 2px 0.3em !important;
    color: #FFFFFF;
    font-size: 14px;
    font-weight: bold;
}


.ui-dialog-titlebar-close {
    background-image: url("../images/close.png") !important;
    border:0 none;
    padding: 0px !important;
    height: 18px !imporant;
    width: 18px !important;
    }
   
.ui-icon .ui-widget-content .ui-widget-header  {
    background-image: url("../images/close.png") !important;
    height: 18px !imporant;
    width: 18px !important;
    }
   
.ui-widget-overlay {
    background: black;
    opacity: 0.7 !important;
    filter: alpha(opacity = 50);
    position: absolute;
    top: 0;
    left: 0;
 }

 .ui-icon {
    background-image: url("../images/close.png") !important;
    height: 18px !imporant;
    width: 18px !important;
}

.ui-widget-content .ui-icon {
     background-image: url("../images/close.png") !important;
}

.ui-widget-header .ui-icon {
     background-image: url("../images/close.png") !important;
}


.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus {
    background: url("../images/close.png") repeat-x  !important;
    border: none !important;
    height: 18px !imporant;
    width: 18px !important;
    color: #212121;
    font-weight: normal;
}

.ui-state-hover {
    background-color: black transparent !important;
    }
   
.ui-dialog .ui-dialog-titlebar-close:hover, .ui-dialog .ui-dialog-titlebar-close:focus {
    background-color: black transparent !important;
}

</script>
</head>

<body>
</body>
</html>



You can also create the div in body and initially hide that div and display it on click
Here #resumeortrackclaim will be placed in the body

/* jQuery('#resumeortrackclaim').hide();
   
     jQuery('#resumeortrackclaim').dialog({
         autoOpen: false,
         modal:true,
         draggable: true,
         resizable: false,
         height: 120,
         width: 270,
         position: ['center'],
            overlay: { opacity: 0, background: 'black'},
            open: function(){jQuery(".ui-dialog-titlebar-close").focus();}
     });
   
     jQuery('#my-claim-button').click(function() {
         jQuery('#resumeortrackclaim').dialog('open');
         return false;
     });
*/

Place the below div in body

<div id="resumeortrackclaim">
<div style="display: block; position: absolute;   overflow: hidden; z-index: 1002; outline: 0pt none; " class="ui-dialog ui-draggable" tabindex="-1">
<div class="ui-dialog-container" style="position: relative; width: 100%; height: 100%;"><div class="ui-dialog-titlebar" unselectable="on" style="-moz-user-select: none;">
    <span class="ui-dialog-title" unselectable="on" style="-moz-user-select: none;">Resume Or Track Claim
       </span>
   <a class="ui-dialog-titlebar-close" href="#" unselectable="on" style="-moz-user-select: none;">
    </a>
</div>
<div title="Resume Or Track Claim" id="dialog-modal" class="ui-dialog-content" style="width: 270px;" >
  <h1>
    <a href="https://process.phoneclaim.com/ATT/Default.aspx?clientID=313&amp;UserAction=CompleteExisting&amp;Culture=en-US&amp;Mode=LIVE">Resume Claim
    </a>
  </h1>
 <h1>
  <a href="https://process.phoneclaim.com/ATT/Default.aspx?clientID=313&amp;UserAction=TrackStatus&amp;Culture=en-US&amp;Mode=LIVE">
     Track Claim
   </a>
 </h1>
 </div>
</div>
</div>

     <div class="ui-dialog-buttonpane" style="position: absolute; bottom: 0pt; display: none;">
     </div>
 </div>

Tuesday, April 12, 2011

Steps to do SSH Login from Remote Server without the password

Steps to do SSH Login from Remote Server without the password

Open 2 terminal screens - 1 for local and one for remote

1. ~/.ssh$ ssh-keygen -t rsa
    Press enter for the rest of the steps below
    Generating public/private rsa key pair.
    Enter file in which to save the key (/home/localadmin/.ssh/id_rsa):
    Enter passphrase (empty for no passphrase):
    Enter same passphrase again:

    You will get 2 files generated .pub is the public key and other one is the private key.
    :~/.ssh$ ls
    id_rsa  id_rsa.pub

2 :~/.ssh$ vi id_rsa.pub
 Now right click and copy the key

3. Go to remote server terminal screen
  Create a user using useradd -m "name of the user same as the user on your localhost"

 a. Now go to /home/youruser and create a directory .ssh
    remotehost:/home/youruser/.ssh# ls
    remotehost:/home/youruser/.ssh# nano authorized_keys

 Now paste the key which you copied in previous step
 b.
    remotehost:/home/youruser/.ssh# chmod 600 authorized_keys
    remotehost:/home/youruser/.ssh# cd ..
    remotehost:/home/youruser/# chmod 755 .ssh
    remotehost:/home/youruser# cd ..
    remotehost:/home# chown -R youruser youruser
    remotehost:/home# chgrp -R youruser youruser


4. Now come back to your localhost screen

    localhost:~/.ssh$ ssh usercreatedonremoteserver(Step 3 a)@remoteserveripaddress

     You should be able to login from the localhost

     Tip : change of owner and change of group is required. Step 3 b.

Wednesday, March 23, 2011

Access database in php

<?php
error_reporting(-1);

$man_db = db_query("SELECT DISTINCT manufacture_name FROM {drup_deductible} WHERE drup_deductible.carrier_name LIKE '%Verizon%' ORDER BY manufacture_name");
$model_db = db_query("SELECT DISTINCT model_name FROM {drup_deductible} WHERE manufacture_name LIKE '%".$_REQUEST['manufacturer']."%' ORDER BY model_name");
$deduct_db = db_query("SELECT drup_deductible.tier_name, drup_tier.tier_name, drup_tier.tier_amount, drup_tier.tier_premium FROM {drup_tier},{drup_deductible} WHERE drup_tier.tier_name = drup_deductible.tier_name AND drup_deductible.carrier_name = 'Verizon' LIMIT 1");

$today = date('m/d/Y');
if($today >= "06/01/2011"){
    $effectiveDate = "05/17/2009";
} else {
    $effectiveDate = "02/01/11";
}

function dropdownfunc($name, $rowname, $source){
    foreach($source as $row) {
        if ($row->$rowname == $_REQUEST[$name])
        {
            $s = " SELECTED";
        } else {
            $s = "";
        }
        echo '<option value="'.$row->$rowname.'"'. $s.'>'.$row->$rowname.'</option>';
    }
}
?>
<div id="newwrapper">
    <div style="margin-top: -23px; margin-left: -22px; /margin-left: -15px; width: 975px; position: relative;">
        <div style="float:left; width:648px; margin-right: 5px;">
            <div id="vz-redesign-top"></div>
            <div style="padding-left: 25px; margin-top: 20px; /margin-top: 0px; position: relative; min-height: 200px;">
                <p style="font-size: 16px;">Select your manufacturer and model</p>
                <form method="POST" action="lookup">
                    <div style="float:left;width:160px;padding-right:15px; margin-top: 0px;">
                        <span style="font-size: 16px !important;">Manufacturer</span><br/>
                        <select name="manufacturer" onchange="this.form.submit();">
                            <option value="">Select a manufacturer</option>
                            <?php dropdownfunc('manufacturer', 'manufacture_name', $man_db); ?>
                        </select>
                    </div>
                    <input type="hidden" name="_submit" value="1">
                    <div style="float:left;width:150px;">
                        <span style="font-size:16px !important; margin-bottom: 10px;">Model</span><br/>
                        <select name="model" onchange="this.form.submit();"><br/>
                            <option value="">Select a model</option>
                            <?php dropdownfunc('model', 'model_name', $model_db); ?>
                        </select>
                    </div>
               </form>

               </form>
               </div>
               </div>
               </div>
               </div>