Changeset 5953


Ignore:
Timestamp:
Feb 10, 2012, 2:35:22 PM (11 years ago)
Author:
Nicklas Nordborg
Message:

References #1655: GUI improvements

Select file/directory and "save as" dialogs.

Location:
trunk/www
Files:
6 edited

Legend:

Unmodified
Added
Removed

  • trunk/www/filemanager/directories/list_directories.jsp

    r5951 r5953  
    131131  Set<Directory> ignore = new HashSet<Directory>();
    132132  %>
    133   <base:page title="<%=requestTitle != null ? requestTitle : ""%>" type="iframe">
     133  <base:page title="<%=requestTitle != null ? requestTitle : ""%>"
     134    type="<%="selectonedirectory".equals(mode) ? "popup" : "iframe"%>">
    134135  <base:head scripts="newjoust.js,table.js,ajax.js,json2.js" styles="newjoust.css,toolbar.css">
    135136  <script language="JavaScript">
    … …  
    266267      if (window.top.setSelected)
    267268      {
    268         window.top.setSelected('', path);
     269        //window.top.setSelected('', path);
    269270      }
    270271    }
    … …  
    327328  {
    328329    %>
    329     <base:body onload="initialise()"
    330       style="padding-left: 0px; padding-right: 0px;"
    331       >
    332       <div id="main" class="joust" style="width:100%;">
    333         <h3 class="docked"><%=requestTitle == null ? "Select one directory" : requestTitle%></h3>
    334         <tbl:toolbar>
    335           <tbl:button
    336             image="directory_new.png"
    337             onclick="newDirectory()"
    338             title="New&hellip;"
    339             tooltip="Create a new directory"
    340           />
    341         </tbl:toolbar>
    342         <div id="joust" class="boxedbottom" style="height: <%=(int)(scale*340)%>px; overflow:auto; background: #E0E0E0;">
     330    <base:body onload="initialise()">
     331      <h1><%=requestTitle == null ? "Select one directory" : requestTitle%></h1>
     332     
     333      <form name="directory">
     334      <input type="hidden" name="directory_id" value="">
     335
     336      <div class="content bottomborder">
     337        <div id="main" class="absolutefull" style="bottom: 3em;">
     338          <tbl:toolbar subclass="bottomborder">
     339            <tbl:button
     340              image="directory_new.png"
     341              onclick="newDirectory()"
     342              title="New&hellip;"
     343              tooltip="Create a new directory"
     344            />
     345          </tbl:toolbar>
     346          <div id="joust" class="absolutefull joust" style="top: 1.8em; overflow:auto;">
     347          </div>
     348        </div>
     349     
     350        <div class="absolutefull topborder" style="top: auto; height: 3em;">
     351          <table class="fullform input100">
     352            <tr>
     353              <th><%=requestTitle == null ? "Path" : requestTitle%></th>
     354              <td><input type="text" class="text" readonly name="path"></td>
     355            </tr>
     356          </table>
    343357        </div>
    344358      </div>
     359      </form>
     360
     361      <base:buttongroup subclass="dialogbuttons">
     362        <base:button onclick="returnSelected()" title="Ok" />
     363        <base:button onclick="window.close()" title="Cancel" />
     364      </base:buttongroup>
    345365     
    346       <form name="directory">
    347       <br>
    348       <input type="hidden" name="directory_id" value="">
    349       <b><%=requestTitle == null ? "Path" : requestTitle%></b> <input type="text" class="text" readonly name="path" size="40">
    350       <p>
    351       <table align="center">
    352       <tr>
    353         <td width="50%"><base:button onclick="returnSelected()" title="Ok" /></td>
    354         <td width="50%"><base:button onclick="window.close()" title="Cancel" /></td>
    355       </tr>
    356       </table>
    357       </form>
    358366    </base:body>
    359367    <%

  • trunk/www/filemanager/files/list_files.jsp

    r5952 r5953  
    388388          return;
    389389        }
    390         Main.openPopup('../directories/index.jsp?ID=<%=ID%>&mode=selectonedirectory&title=Move+to&directory_id=<%=directoryId%>&callback=moveToDirectory', 'SelectDirectory', 400, 540);
     390        Main.openPopup('../directories/index.jsp?ID=<%=ID%>&mode=selectonedirectory&title=Move+to&directory_id=<%=directoryId%>&callback=moveToDirectory', 'SelectDirectory', 500, 500);
    391391      }
    392392      else if (numChecked > 0)

  • trunk/www/filemanager/save_as.jsp

    r5426 r5953  
    4343<base:head >
    4444  <script language="JavaScript">
    45   var timer = 0;
    46   var inCall = false;
    4745  var defaultFileName = '<%=HTML.javaScriptEncode(fileName)%>';
    48   function adjustIFrameSize()
    49   {
    50     if (inCall) return;
    51     inCall = true;
    52     var iframeElement = document.getElementById("idManager");
    53     // Find the top coordinate of the IFrame
    54     var offsetTop = 1;
    55     var offsetTrail = iframeElement;
    56     while (offsetTrail)
    57     {
    58       offsetTop += offsetTrail.offsetTop;
    59       offsetTrail = offsetTrail.offsetParent;
    60     }
    6146
    62     // Find the browser window height
    63     var windowHeight = Main.getWindowHeight();
    64     iframeElement.height = windowHeight-offsetTop-120;
    65 
    66     // Adjust the height of the frames
    67     var iframe = window.frames['manager'];
    68     var directories = iframe.frames['directories'].document.getElementById('main');
    69     if (directories) directories.style.height = (iframeElement.height-1)+'px';
    70     var joust = iframe.frames['directories'].document.getElementById('joust');
    71     if (joust) joust.style.height = (iframeElement.height-1-30)+'px';
    72     var files = iframe.frames['files'].document.getElementById('main');
    73     if (files) files.style.height = iframeElement.height+'px';
    74     inCall = false;
    75   }
    76   function setTimer()
    77   {
    78     if (inCall) return;
    79     if (timer) clearTimeout(timer);
    80     timer = setTimeout('adjustIFrameSize()', 150);
    81   }
    8247  function setSelected(fileId, path)
    8348  {
    … …  
    11176  </script>
    11277</base:head>
    113 <base:body attributes="onresize='setTimer();'">
    114   <h3>Save as</h3>
    115   <iframe name="manager" id="idManager" src="frameset.jsp?ID=<%=ID%>&mode=selectone" width="100%"
    116     frameborder="0" vspace="0" hspace="0"
    117     marginwidth="0" marginheight="0" scrolling="no" style="overflow: visible"></iframe>
    118 
    119   <div style="border-top: 1px solid #666666" >
     78<base:body>
     79  <h1>Save as</h1>
    12080  <form name="file">
    12181  <input type="hidden" name="file_id" value="">
     82
     83  <div class="content bottomborder">
     84    <div id="f1" class="absolutefull" style="bottom: 3em;"><iframe name="manager" id="idManager"
     85      src="frameset.jsp?ID=<%=ID%>&mode=selectone"
     86      style="width: 100%; height: 100%;"></iframe></div>
     87     
     88    <div class="absolutefull topborder" style="top: auto; height: 3em;">
     89      <table class="fullform input100">
     90        <tr>
     91          <th>Save as</th>
     92          <td><input type="text" class="text" name="path" value=""></td>
     93        </tr>
     94      </table>
     95    </div>
     96  </div>
     97  </form>
     98
     99  <base:buttongroup subclass="dialogbuttons">
     100    <base:button onclick="returnSelected();" title="Ok"  />
     101    <base:button onclick="window.top.close();" title="Cancel" />
     102  </base:buttongroup>
    122103 
    123   <p>
    124   <table class="form" align="center">
    125   <tr>
    126     <td class="prompt">Save as</td>
    127     <td><input type="text" class="text" name="path" size="100" value=""></td>
    128   </tr>
    129   </table>
    130   </form>
    131   </div>
    132  
    133   <table align="center">
    134   <tr>
    135     <td width="50%"><base:button onclick="returnSelected();" title="Ok"  /></td>
    136     <td width="50%"><base:button onclick="window.top.close();" title="Cancel" /></td>
    137   </tr>
    138   </table>
    139104</base:body>
    140105</base:page>

  • trunk/www/filemanager/select_file.jsp

    r5713 r5953  
    4141<base:head >
    4242  <script language="JavaScript">
    43   var timer = 0;
    44   var inCall = false;
    45   function adjustIFrameSize()
    46   {
    47     if (inCall) return;
    48     inCall = true;
    49     var iframeElement = document.getElementById("idManager");
    50     // Find the top coordinate of the IFrame
    51     var offsetTop = 1;
    52     var offsetTrail = iframeElement;
    53     while (offsetTrail)
    54     {
    55       offsetTop += offsetTrail.offsetTop;
    56       offsetTrail = offsetTrail.offsetParent;
    57     }
    58 
    59     // Find the browser window height
    60     var windowHeight = Main.getWindowHeight();
    61     var controlsPos = Main.getElementPosition(document.getElementById('controls'));
    62     iframeElement.height = windowHeight-offsetTop - controlsPos.height - 15;
    63 
    64     // Adjust the height of the frames
    65     var iframe = window.frames['manager'];
    66     var directories = iframe.frames['directories'].document.getElementById('main');
    67     if (directories) directories.style.height = (iframeElement.height-1)+'px';
    68     var joust = iframe.frames['directories'].document.getElementById('joust');
    69     if (joust) joust.style.height = (iframeElement.height-1-30)+'px';
    70     var files = iframe.frames['files'].document.getElementById('main');
    71     if (files) files.style.height = iframeElement.height+'px';
    72     inCall = false;
    73   }
    74   function setTimer()
    75   {
    76     if (inCall) return;
    77     if (timer) clearTimeout(timer);
    78     timer = setTimeout('adjustIFrameSize()', 150);
    79   }
     43  var selected = new Array();
    8044  function setSelected(fileId, path)
    8145  {
    82     var frm = document.forms['file'];
    83     frm.file_id.value = fileId;
    84     frm.path.value = path;
     46    selected[0] = {'id': fileId, 'path': path};
     47    updatePath();
    8548  }
    8649  function addSelected(fileId, path)
    8750  {
    88     var frm = document.forms['file'];
    8951    if (getSelectedFileIndex(fileId) == -1)
    9052    {
    91       frm.paths[frm.paths.length] = new Option(path, fileId);
     53      selected[selected.length] = {'id': fileId, 'path': path};
    9254    }
     55    updatePath();
    9356  }
    9457  function removeSelected(fileId)
    9558  {
    96     var frm = document.forms['file'];
    9759    var index = getSelectedFileIndex(fileId);
    98     if (index >= 0) frm.paths[index] = null;
     60    if (index >= 0) selected.splice(index, 1);
     61    updatePath();
    9962  }
    10063 
    10164  function getSelectedFileIndex(fileId)
    10265  {
    103     var frm = document.forms['file'];
    104     for (var i = 0; i < frm.paths.length; i++)
     66    for (var i = 0; i < selected.length; i++)
    10567    {
    106       if (frm.paths[i].value == fileId) return i;
     68      if (selected[i].id == fileId) return i;
    10769    }
    10870    return -1;
    10971  }
    11072 
     73  function updatePath()
     74  {
     75    var path = '';
     76    for (var i = 0; i < selected.length; i++)
     77    {
     78      if (path != '') path += ', ';
     79      path += selected[i].path;
     80    }
     81    document.getElementById('files').innerHTML = path;
     82   
     83  }
    11184  function returnSelected()
    11285  {
    113     var frm = document.forms['file'];
    114     <%
    115     if (mode == ModeInfo.SELECTONE)
     86    for (var i = 0; i < selected.length; i++)
    11687    {
    117       %>
    118       if (frm.file_id.value)
    119       {
    120         window.opener.<%=callback%>(frm.file_id.value, frm.path.value);
    121       }
    122       <%
     88      window.opener.<%=callback%>(selected[i].id, selected[i].path);
    12389    }
    124     else
    125     {
    126       %>
    127       for (var i = 0; i < frm.paths.length; i++)
    128       {
    129         window.opener.<%=callback%>(frm.paths[i].value, frm.paths[i].text);
    130       }
    131       <%
    132     }
    133     %>   
    13490    window.close();
    13591  }
    13692  </script>
    13793</base:head>
    138 <base:body attributes="onresize='setTimer();'">
    139   <h3><%=requestTitle == null ? title : requestTitle%></h3>
    140   <iframe name="manager" id="idManager" src="frameset.jsp?ID=<%=ID%>&mode=<%=mode.getName()%>" width="100%"
    141     frameborder="0" vspace="0" hspace="0"
    142     marginwidth="0" marginheight="0" scrolling="no" style="overflow: visible"></iframe>
     94<base:body>
     95  <h1><%=requestTitle == null ? title : requestTitle%></h1>
     96  <div class="content bottomborder">
     97    <div id="f1" class="absolutefull" style="bottom: 5em;"><iframe
     98      name="manager" id="idManager" src="frameset.jsp?ID=<%=ID%>&mode=<%=mode.getName()%>"
     99      style="width: 100%; height: 100%;"></iframe></div>
    143100
    144   <div style="border-top: 1px solid #666666" id="controls">
    145   <form name="file">
    146   <input type="hidden" name="file_id" value="">
    147   <table class="form" align="center">
    148   <%
    149   if (mode == ModeInfo.SELECTONE)
    150   {
    151     %>
    152     <tr>
    153       <td class="prompt">Selected file</td>
    154       <td><input type="text" class="text" name="path" size="100" value=""></td>
    155     </tr>
    156     <%
    157   }
    158   else
    159   {
    160     %>
    161     <tr>
    162       <td class="prompt">Selected files</td>
    163       <td><select name="paths" size="5" multiple style="width: 50em;"></select></td>
    164     </tr>
    165     <%
    166   }
    167   %>
    168   </table>
    169   </form>
     101    <div class="absolutefull topborder" style="top: auto; height: 5em;" id="controls">
     102      <table class="fullform">
     103        <tr class="dynamic">
     104          <th>Selected file(s)</th>
     105          <td id="files"></td>
     106        </tr>
     107      </table>
     108    </div>
     109  </div>
    170110 
    171   <table align="center">
    172   <tr>
    173     <td width="50%"><base:button onclick="returnSelected();" title="Ok"  /></td>
    174     <td width="50%"><base:button onclick="window.top.close();" title="Cancel" /></td>
    175   </tr>
    176   </table>
    177   </div>
     111  <base:buttongroup subclass="dialogbuttons">
     112    <base:button onclick="returnSelected();" title="Ok"  />
     113    <base:button onclick="window.top.close();" title="Cancel" />
     114  </base:buttongroup>
    178115</base:body>
    179116</base:page>

  • trunk/www/include/scripts/main.js

    r5940 r5953  
    104104  this.openPopup = function(url, name, width, height, options)
    105105  {
    106     if (height * 1.5 != width) Main.debug('window.size: name=' + name + '; height='+height + '; width='+width);
     106    if (height * 1.5 != width && height != width)
     107    {
     108      Main.debug('window.size: name=' + name + '; height='+height + '; width='+width);
     109    }
    107110   
    108111    // Rescale the width and height

  • trunk/www/include/styles/table.css

    r5952 r5953  
    147147  width: 40px; /* Should be enough to hold two icons */
    148148  border-left: 0px;
     149  white-space: nowrap;
    149150}
    150151
    … …  
    248249
    249250
    250 /*
    251 
    252 
    253 .itemlist .data .joustcell {
    254   border-top: 1px solid #FFFFFF;
    255   border-left: 1px solid #FFFFFF;
    256   border-bottom: 1px solid #999999;
    257   border-right: 1px solid #999999;
    258   padding: 0px 3px 0px 3px;
    259   vertical-align: middle;
    260   white-space: nowrap;
    261 }
    262 .itemlist .data .joustcell img {
    263   margin-top: -1px;
    264   margin-bottom: -1px;
    265 }
    266 
    267 
    268 .itemlist .itemtype {
    269   font-size: 10px;
    270   color: #777777;
    271 }
    272 
    273 */
    274 
Note: See TracChangeset for help on using the changeset viewer.