test.php

   1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
   2 <html>
   3 <head>
   4 <style type="text/css">
   5
   6 .ObjectListViewport {
   7         width:100%;
   8         height:100%;
   9         border-collapse:collapse;
  10 }
  11
  12 .ObjectListViewport_Header_Table {
  13         width:100%;
  14         border: 0px;
  15         border-collapse:collapse;
  16 }
  17
  18 .ObjectListViewport_Entry_Table {
  19         width:100%;
  20         border: 0px;
  21         border-collapse:collapse;
  22 }
  23
  24 .ObjectListViewport_Entry_Cover{
  25
  26         border: 0px;
  27         margin:0px;
  28         padding:0px;
  29 }
  30
  31 .ObjectListViewport_Footer_Table {
  32     width:100%;
  33     border: 0px;
  34     border-collapse:collapse;
  35 }
  36
  37
  38 .ObjectListViewport_Table {
  39         border-collapse:collapse;
  40     width:100%;
  41         height:100%;
  42         border: 0px;
  43 }
  44
  45 .ObjectListViewport_TD_Header {
  46         height:20px;
  47         background-color: #CCCCCC;
  48         vertical-align:middle;
  49         border: 0px;
  50         margin:0px;
  51         padding:0px;
  52 }
  53 .ObjectListViewport_TD_Entries {
  54         vertical-align:middle;
  55         border: 0px;
  56         margin:0px;
  57         padding:0px;
  58 }
  59 .ObjectListViewport_TD_Footer {
  60         height:20px;
  61         background-color: #CCCCCC;
  62         vertical-align:middle;
  63         border: 0px;
  64         margin:0px;
  65         padding:0px;
  66 }
  67 .ObjectListViewport_Entry_Cover{
  68         overflow:auto;
  69 }
  70 .ObjectListViewport_Entry_Cell {
  71         border-left: solid 1px;
  72         font-size:10px;
  73         height:18px;
  74 }
  75
  76 </style>
  77 <script type="text/javascript">
  78
  79 /* Register resize event to force redraw of all
  80  *  displayed lists
  81  */
  82 window.onload = updateObjectListViewportSize;
  83 window.onresize = updateObjectListViewportSize;
  84
  85         function updateObjectListViewportSize() {
  86
  87                 var dbg = document.getElementById('debug');
  88
  89                 /* Somehow IE do not need to be resized
  90          *  So skip the following part if the client uses ie
  91          */
  92                 if(document.all){
  93                         var all = getElementsByStyleClass('ObjectListViewport_Entry_Cover');
  94                         for (var i = 0; i < all.length; ++i){
  95                                 document.getElementById(all[i].id).style.height= "100%";
  96                         }
  97                         return;
  98                 }
  99
 100                 var all = getElementsByStyleClass('ObjectListViewport');
 101                 for (var i = 0; i < all.length; ++i){
 102
 103                         var id_pref = all[i].id.replace(/[^0-9]*/,"");
 104
 105                         /* Set Viewport to min height, to ensure
 106                          *  that resize will work correctly in konqueror
 107                          */
 108                         document.getElementById('ObjectListViewport_Entry_Cover' + id_pref).style.height= "50px";
 109
 110                         /* Get values of displayed header and footer heights to be
 111                          *  able to recalculate the Viewport
 112                          */
 113                         var viewport    = getObjectHeight('ObjectListViewport_Table' + id_pref);
 114                         var header      = getObjectHeight('ObjectListViewport_TD_Header' + id_pref);
 115                         var footer      = getObjectHeight('ObjectListViewport_TD_Footer' + id_pref);
 116
 117                         /* Calculate the new visible entry part height. */
 118                         var calc = (viewport  - ( header + footer ));
 119                         document.getElementById('ObjectListViewport_Entry_Cover' + id_pref).style.height = calc;
 120
 121                         /* Reduce width of entry list, we need some space to
 122                          *  display the scrollbar without breaking the layout
 123                          */
 124                         var viewport = getObjectWidth('ObjectListViewport_Table' + id_pref);
 125                         document.getElementById('ObjectListViewport_Entry_Table' + id_pref).style.width = (viewport - 16) + 'px';
 126                 }
 127         }
 128
 129
 130         /* Return all elements of a specific class */
 131         function getElementsByStyleClass (className) {
 132                 var all = document.all ? document.all : document.getElementsByTagName('*');
 133                 var elements = new Array();
 134                 for (var e = 0; e < all.length; e++)
 135                         if (all[e].className == className)
 136                                 elements[elements.length] = all[e];
 137                 return elements;
 138         }
 139
 140
 141         /* Return integer value of style attribute width for specified ID  */
 142         function getObjectWidth(obj){
 143                 obj = getComputedStyle(document.getElementById(obj),"").width;
 144                 return(parseInt(obj.replace(/px/,'')));
 145         }
 146
 147         /* Return integer value of style attribute height for specified ID  */
 148         function getObjectHeight(obj){
 149                 obj = getComputedStyle(document.getElementById(obj),"").height;
 150                 return(parseInt(obj.replace(/px/,'')));
 151         }
 152 </script>
 153 </head>
 154 <body>
 155 <input type='text' id='debug' value="" style='width:100%;'>
 156         <table style='height:90%;width:90%;background-color:#DDDDDD; border: solid 1px;'
 157                 cellspacing=0 cellpadding=0>
 158                 <tr>
 159                         <td style='width:30%;height:50%;background-color:#EEEEEE;'>
 160                                 hallo<br>
 161                                 hallo<br>
 162                                 hallo<br>
 163                                 hallo<br>
 164                                 hallo<br>
 165                                 hallo<br>
 166                         </td>
 167                         <td style='background-color:#EEEEEE;'>
 168                                 <?php echo passthru("./test"); ?>
 169                         </td>
 170                 </tr>
 171                 <tr>
 172                         <td style='background-color:#999777;'>
 173                                 hallo<br>
 174                                 <?php echo passthru("./test"); ?>
 175                                 hallo<br>
 176                         </td>
 177                         <td style='background-color:#AAA006;'>
 178                                 hallo<br>
 179                                 hallo<br>
 180                         </td>
 181                 </tr>
 182         </table>
 183 <script type="text/javascript">
 184 updateObjectListViewportSize();
 185 </script>
 186 </body>
 187 </html>