Custom class to generate jquery dialog in php

One of my clients requirements in his framework is to create a class that will define a dialog box. He already created the said class which is really not efficient to use but he insisted to use it anyway.

In order to use the object you have to instantiate every dialog box object you want so if you want a 4 dialog box you will instantiate or create 4 objects which is really an issue to me or even to other developer conscious on memory usage.

<?php
$popup1 = new PopUp( $width, $height, $id, $params = array( ) );
$popup2 = new PopUp( $width, $height, $id, $params = array( ) );
$popup3 = new PopUp( $width, $height, $id, $params = array( ) );
$popup3id = $popup3->id();   //get generated id if id is empty or not passed
$popup4 = new PopUp( $width, $height, $id, $params = array( ) );
?>

Everything is okay until his requirements on dialog box events change. He wants the dialog to resize when the window resize I really though it would be easy since JQuery Dialog had an option autoResize but I found out it doesnt make sense since it wont resize if unless you dont specify the width and the height.

I hard coded it in javascript to resize automatically when a resize event on window triggers the dialog will resize itself. Below is a code snippet I used.
<script>
jQuery(document).ready(function(){
 
   var wind = jQuery(window);
   var currWidth = wind.width();
   var currHeight = wind.height();
 
   //ie fix, create static variable
  this.ieCurWidth = wind.width();
  this.ieCurHeight = wind.height();

 var dialog = jQuery("#dialog");

   jQuery(window).resize(function(){
     
       var chWidth = wind.width(),    //width on resize
             chHeight = wind.height(),  //height on resize
             dlWidth = dialog.width(),  //current dialog width
            dlHeight = dialog.height();  //current dialog height

       var newWidth = 0 , newHeight = 0;
   
     //proportion the resize to dialog
     //
      newWidth = chWidth * dlWidth / currWidth;
      newHeight = chHeight * dlHeight / currHeight;

     if( navigator.userAgent == "Microsoft Internet Explorer"){
          newWidth = chWidth * dlWidth / this.ieCurrWidth;
          newHeigth = chWidth * dliHeight / this.ieCurrHeight;
     }
   
     dialog.dialog("option", "width", newWidth);
     dialog.dialog("option", "height", newHeight):
   });
});
</script>

This code snippet may not be really efficient but it works fine.

Comments

Popular Posts