Ignore:
Timestamp:
Nov 3, 2010, 12:58:27 PM (9 years ago)
Author:
robert@…
Message:

Changed template editor to be more user friendly with selecting field types (see ticket #154)

Location:
trunk/grails-app/views/templateEditor
Files:
6 edited

Legend:

Unmodified
Added
Removed
  • trunk/grails-app/views/templateEditor/compare.gsp

    r1029 r1056  
    3636                          } );
    3737                  } );
     38
     39
     40                  function toggleColumns()
     41                  {
     42                        var columns = new Array( 1, 2, 3, 4);
     43                       
     44                        /* Get the DataTables object again - this is not a recreation, just a get of the object */
     45                        var oTable = $('#compare_templates').dataTable();
     46
     47                        /* Toggle column visibility */
     48                        var bVis = oTable.fnSettings().aoColumns[ columns[ 0 ] ].bVisible;
     49                        $.each( columns, function(index, col) {
     50                          oTable.fnSetColumnVis( col, bVis ? false : true );
     51                        });
     52
     53                        /* Show large or small titles */
     54                        if( bVis ) {
     55                          // If the columns were visible, they are hidden now and large titles should be shown
     56                          $( '.shortTitle' ).hide();
     57                          $( '.longTitle' ).show();
     58                        } else {
     59                          $( '.longTitle' ).hide();
     60                          $( '.shortTitle' ).show();
     61                        }
     62                  }
    3863                </script>
    3964
     
    5075          </h1>
    5176
     77          <p>
     78                If you want more space or more information, try to <a class="toggle" href="#" onClick="toggleColumns(); return false;">toggle columns</a>.
     79          </p>
     80
    5281        <table id="list"></table>
    5382        <div id="pager"></div>
    5483
     84        <% /* Length of long titles depends on the number of templates.
     85                  We've got about 90 characters to show in total */
     86                  def numCharsLongTitle = Math.floor( 90 / templates.size() );
     87        %>
    5588        <table id="compare_templates">
    5689          <thead>
     
    6295                  <th>Required</th>
    6396                  <g:each in="${templates}" var="currentTemplate">
    64                         <th title="${currentTemplate.name}">${currentTemplate.name.substring(0,3)}...</th>
     97                        <th title="${currentTemplate.name}">
     98                          <span class="shortTitle">
     99                                <g:if test="${currentTemplate.name.size() > 5}">
     100                                  ${currentTemplate.name.substring(0,3)}...
     101                                </g:if>
     102                                <g:else>
     103                                  ${currentTemplate.name}
     104                                </g:else>
     105                          </span>
     106                          <span class="longTitle">
     107                                <g:if test="${currentTemplate.name.size() > numCharsLongTitle}">
     108                                  ${currentTemplate.name.substring(0,numCharsLongTitle - 3)}...
     109                                </g:if>
     110                                <g:else>
     111                                  ${currentTemplate.name}
     112                                </g:else>
     113                          </span>
     114                        </th>
    65115                  </g:each>
    66116                </tr>
     
    77127                        <td style="text-align: center;" align="center">
    78128                          <g:if test="${currentTemplate.fields.contains(field)}">
    79                                 <img align="center" src="${createLinkTo( dir: 'images/icons', file: 'accept.png', plugin: 'famfamfam' )}" alt="X" />
     129                                <img align="center" src="${createLinkTo( dir: 'images/icons', file: 'tick.png', plugin: 'famfamfam' )}" alt="X" />
    80130                          </g:if>
    81131                        </td>
  • trunk/grails-app/views/templateEditor/elements/_boolean.gsp

    r959 r1056  
    1313         * $Date$
    1414         */
    15 %>
    16 True/False
     15%>True/False
  • trunk/grails-app/views/templateEditor/elements/_date.gsp

    r959 r1056  
    1313         * $Date$
    1414         */
    15 %>
    16 Date
     15%>Date
  • trunk/grails-app/views/templateEditor/elements/_double.gsp

    r959 r1056  
    1313         * $Date$
    1414         */
    15 %>
    16 Double
     15%>Double
  • trunk/grails-app/views/templateEditor/elements/_fieldForm.gsp

    r959 r1056  
    11        <label for="name">Name:</label> <g:textField name="name" value="${templateField?.name}" /><br />
    2         <label for="type">Type:</label> <g:select from="${fieldTypes}" name="type" value="${templateField?.type}" onChange="showExtraFields( ${templateField ? templateField.id : '\'new\''} );" /><br />
     2        <label for="type">Type:</label>
     3          <%
     4                /* Create a list of field types grouped on category */
     5                def grouped = [:]
     6                fieldTypes.each {
     7                  if( !grouped[ it.category ] )
     8                        grouped[ it.category ] = []
     9
     10                        grouped[ it.category ].add( it )
     11                }
     12          %>
     13          <select name="type" onChange="showExtraFields( ${templateField ? templateField.id : '\'new\''} );">
     14                <g:each in="${grouped}" var="group">
     15                  <optgroup label="${group.key}">
     16                        <g:each in="${group.value}" var="field">
     17                          <option
     18                                <g:if test="${templateField?.type == field}">selected="selected"</g:if>
     19                                value="${field}">${field} <g:if test="${field.example}">(${field.example})</g:if></option>
     20                        </g:each>
     21                  </optgroup>
     22                </g:each>
     23          </select>
     24
     25                <br />
    326
    427        <div class="extra stringlist_options" <g:if test="${templateField?.type.toString() == 'STRINGLIST'}">style='display: block;'</g:if>>
  • trunk/grails-app/views/templateEditor/elements/_integer.gsp

    r959 r1056  
    1313         * $Date$
    1414         */
    15 %>
    16 Integer
     15%>Integer
Note: See TracChangeset for help on using the changeset viewer.