Changeset 88

Show
Ignore:
Timestamp:
14-01-10 15:00:05 (4 years ago)
Author:
duh
Message:

- refactored the wizard code a bit

Location:
trunk
Files:
3 added
8 modified
2 moved

Legend:

Unmodified
Added
Removed
  • trunk/grails-app/controllers/dbnp/studycapturing/WizardController.groovy

    r87 r88  
    4343      onStart { 
    4444        println "wizard started" 
     45         
     46        // define flow variables 
     47        flow.page = 0 
     48        flow.pages = [ 
     49                [title:'Een'], 
     50                [title:'Twoooo'], 
     51                [title:'Trois'] 
     52        ] 
     53         
    4554      } 
    4655      onEnd { 
     
    5261            onRender { 
    5362                  println "render main page" 
     63          flow.page = 1 
    5464            } 
    5565            render(view:"/wizard/index") 
     
    6272            onRender { 
    6373                  println "render page one" 
     74          flow.page = 1 
    6475            } 
    6576            render(view:"_one") 
     
    7384            onRender { 
    7485                  println "render page two" 
     86          flow.page = 2 
    7587            } 
    7688        render(view:"_two") 
     
    8799            onRender { 
    88100                  println "render page three" 
     101          flow.page = 3 
    89102            } 
    90103        render(view:"_three") 
  • trunk/grails-app/taglib/dbnp/studycapturing/WizardTagLib.groovy

    r87 r88  
    1818  static namespace = "wizard" 
    1919 
     20  // define the AJAX provider to use 
     21  static ajaxProvider = "jquery" 
     22   
    2023  /** 
    2124   * ajaxButton tag, this is a modified version of the default 
     
    6265 
    6366  /** 
    64    * render the wizard navigation button 
    65    * @param map attrs (supports: previous="true/false" and next="true/false" 
     67   * wizard navigation buttons render wrapper, in order to be able to add 
     68   * functionality in the future 
    6669   */ 
    6770  def previousNext = { attrs -> 
    68     def buttons = new LinkedHashMap() 
    69     buttons.previous  = (attrs.get('previous') == null || (attrs.get('previous') instanceof String && attrs.get('previous') == "true")) ? true : false 
    70     buttons.next      = (attrs.get('next') == null || (attrs.get('next') instanceof String && attrs.get('next') == "true")) ? true : false 
     71    // define AJAX provider 
     72    setProvider([library:ajaxProvider]) 
    7173 
    72     out << render(template:"/wizard/common/buttons", model:[button:buttons]) 
     74    // render navigation buttons 
     75    out << render(template:"/wizard/common/buttons") 
     76  } 
     77 
     78  def pageContent = { attrs, body -> 
     79    // define AJAX provider 
     80    setProvider([library:ajaxProvider]) 
     81 
     82    // render new body content 
     83    out << render(template:"/wizard/common/tabs") 
     84    out << '<div class="content">' 
     85    out << body() 
     86    out << '</div>' 
     87    out << render(template:"/wizard/common/navigation") 
    7388  } 
    7489} 
  • trunk/grails-app/views/wizard/common/_navigation.gsp

    r87 r88  
    66 * @since   20100113 
    77 * @package wizard 
    8  * @see     dbnp.studycapturing.WizardTagLib::previousNext 
    98 * @see     dbnp.studycapturing.WizardController 
    109 * 
     
    1514 */ 
    1615%> 
    17     <div id="wizardNavigation"> 
    18       <g:if test="${button.previous}">&laquo; <wizard:ajaxButton name="previous" value="prev" url="[controller:'wizard',action:'pages']" update="[success:'wizardContent',failure:'wizardError']" /></g:if> 
    19       <g:if test="${button.previous && button.next}">|</g:if> 
    20       <g:if test="${button.next}"><wizard:ajaxButton name="next" value="next" url="[controller:'wizard',action:'pages']" update="[success:'wizardContent',failure:'wizardError']" /> &raquo;</g:if> 
     16    <div class="navigation"> 
     17      <g:if test="${page>1}"><wizard:ajaxButton name="previous" value="&laquo; prev" url="[controller:'wizard',action:'pages']" update="[success:'wizardPage',failure:'wizardError']" class="prevnext" /></g:if> 
     18      <g:if test="${page>1 && page<pages.size}"> | </g:if> 
     19      <g:if test="${page<pages.size}"><wizard:ajaxButton name="next" value="next &raquo;" url="[controller:'wizard',action:'pages']" update="[success:'wizardPage',failure:'wizardError']" class="prevnext" /></g:if> 
    2120    </div> 
  • trunk/grails-app/views/wizard/common/_tabs.gsp

    r87 r88  
    1515 */ 
    1616%> 
    17 <div class="wizardHeader"> 
    18   tabs go in here 
     17<div class="tabs"> 
     18  <g:each status="i" var="item" in="${pages}"><div class="element<g:if test="${(i == (page-1))}"> active</g:if>">${i+1}. ${item.title}</div></g:each> 
    1919</div> 
  • trunk/grails-app/views/wizard/common/_wizard.gsp

    r87 r88  
    11<% 
    22/** 
    3  * Wizard template 
     3 * Wizard template with first page rendered 
    44 * 
    55 * @author  Jeroen Wesbeek 
     
    1515 */ 
    1616%> 
    17   <g:setProvider library="jquery"/> 
    18   <div id="wizard" style="border:1px solid black;"> 
     17  <div id="wizard" class="wizard"> 
    1918    <h1>Proof of concept AJAXified Grails Webflow Wizard</h1> 
    2019    <g:form action="pages" name="_wizard" > 
    21     <div id="wizardContent" style="border:1px solid blue;"> 
     20    <div id="wizardPage"> 
    2221      <g:render template="pages/one"/> 
    2322    </div> 
    24     <div id="wizardError" style="border:1px solid red;">errors go in here</div> 
     23    <g:render template="common/error"/> 
    2524    </g:form> 
    2625  </div> 
  • trunk/grails-app/views/wizard/index.gsp

    r87 r88  
    1818 <head> 
    1919  <meta name="layout" content="main" /> 
     20  <link rel="stylesheet" href="${resource(dir:'css',file:'wizard.css')}" /> 
    2021  <g:javascript library="jquery" /> 
    2122 </head> 
  • trunk/grails-app/views/wizard/pages/_one.gsp

    r87 r88  
    1515 */ 
    1616%> 
    17 <g:setProvider library="jquery"/> 
    18 <g:render template="common/header" /> 
    19 <h1>page one</h1> 
     17<wizard:pageContent> 
     18  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer et elit magna. Maecenas felis tortor, tempus ac condimentum id, cursus ac tellus. Phasellus auctor, ligula vel interdum egestas, tortor justo rutrum ligula, sit amet dictum mi libero a mi. Nam porttitor volutpat nunc in ornare. Cras mi neque, dignissim at vulputate ut, consequat sed eros. Aliquam lobortis lorem nec lorem lobortis in vulputate augue viverra. Nunc mi tellus, elementum id sagittis eu, varius vitae purus. Sed nulla massa, venenatis id tempor nec, consequat suscipit mi. Vivamus erat libero, placerat vitae mollis ut, accumsan vitae augue. Phasellus porta libero quis felis accumsan id congue lectus vestibulum. Etiam aliquam euismod libero, nec feugiat ipsum scelerisque sollicitudin. Duis congue metus quis tellus fermentum cursus. Quisque vel lectus nec felis eleifend blandit. Maecenas sed dolor dolor, eu vulputate quam. Quisque volutpat placerat tortor eget rhoncus.</p> 
    2019 
    21 <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer et elit magna. Maecenas felis tortor, tempus ac condimentum id, cursus ac tellus. Phasellus auctor, ligula vel interdum egestas, tortor justo rutrum ligula, sit amet dictum mi libero a mi. Nam porttitor volutpat nunc in ornare. Cras mi neque, dignissim at vulputate ut, consequat sed eros. Aliquam lobortis lorem nec lorem lobortis in vulputate augue viverra. Nunc mi tellus, elementum id sagittis eu, varius vitae purus. Sed nulla massa, venenatis id tempor nec, consequat suscipit mi. Vivamus erat libero, placerat vitae mollis ut, accumsan vitae augue. Phasellus porta libero quis felis accumsan id congue lectus vestibulum. Etiam aliquam euismod libero, nec feugiat ipsum scelerisque sollicitudin. Duis congue metus quis tellus fermentum cursus. Quisque vel lectus nec felis eleifend blandit. Maecenas sed dolor dolor, eu vulputate quam. Quisque volutpat placerat tortor eget rhoncus.</p> 
    22  
    23 <p>Donec non nulla at erat malesuada sollicitudin quis eu arcu. In laoreet placerat justo, quis feugiat purus tempus eu. Sed hendrerit euismod lacinia. Sed fringilla sollicitudin magna nec consectetur. Proin arcu libero, varius ac iaculis in, mattis in arcu. Sed vel odio dui. Nam quis lectus diam, eu dictum urna. Proin molestie, augue ut posuere interdum, orci augue accumsan purus, in aliquet erat tellus nec felis. Vivamus pulvinar, leo in bibendum mattis, libero lacus porttitor nisl, vitae mattis augue sem eget arcu. Sed viverra dui eu eros egestas non malesuada dui venenatis. Sed a neque turpis. Cras vitae erat turpis. Mauris neque nisl, blandit vitae tincidunt in, ultrices sed felis. Quisque interdum urna eu est fringilla id tristique tellus consectetur.</p> 
    24 <wizard:previousNext previous="false" /> 
     20  <p>Donec non nulla at erat malesuada sollicitudin quis eu arcu. In laoreet placerat justo, quis feugiat purus tempus eu. Sed hendrerit euismod lacinia. Sed fringilla sollicitudin magna nec consectetur. Proin arcu libero, varius ac iaculis in, mattis in arcu. Sed vel odio dui. Nam quis lectus diam, eu dictum urna. Proin molestie, augue ut posuere interdum, orci augue accumsan purus, in aliquet erat tellus nec felis. Vivamus pulvinar, leo in bibendum mattis, libero lacus porttitor nisl, vitae mattis augue sem eget arcu. Sed viverra dui eu eros egestas non malesuada dui venenatis. Sed a neque turpis. Cras vitae erat turpis. Mauris neque nisl, blandit vitae tincidunt in, ultrices sed felis. Quisque interdum urna eu est fringilla id tristique tellus consectetur.</p>   
     21</wizard:pageContent> 
  • trunk/grails-app/views/wizard/pages/_three.gsp

    r87 r88  
    1515 */ 
    1616%> 
    17 <g:setProvider library="jquery"/> 
    18 <g:render template="common/header" /> 
    19 <h1>page three</h1> 
     17<wizard:pageContent> 
     18  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce ut metus nisi, eget tincidunt enim. Vivamus in nulla est, sed viverra odio. Praesent venenatis hendrerit ipsum, id tristique enim fringilla sed. Duis diam magna, accumsan at sodales a, rutrum et leo. Sed non metus non odio tristique malesuada blandit sed velit. Aenean pulvinar nisi eu augue gravida id malesuada velit lobortis. Nulla facilisi. In sit amet urna quis lorem eleifend venenatis. Duis eu sem sed nulla rutrum sodales eu ac lorem. Nam a pellentesque tortor. Pellentesque tincidunt sollicitudin odio, id condimentum leo condimentum aliquam. Aliquam tincidunt faucibus elit, sit amet interdum justo vestibulum quis. Praesent ac sagittis nunc. Nulla eu lacus id mauris laoreet vehicula. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p> 
    2019 
    21 <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce ut metus nisi, eget tincidunt enim. Vivamus in nulla est, sed viverra odio. Praesent venenatis hendrerit ipsum, id tristique enim fringilla sed. Duis diam magna, accumsan at sodales a, rutrum et leo. Sed non metus non odio tristique malesuada blandit sed velit. Aenean pulvinar nisi eu augue gravida id malesuada velit lobortis. Nulla facilisi. In sit amet urna quis lorem eleifend venenatis. Duis eu sem sed nulla rutrum sodales eu ac lorem. Nam a pellentesque tortor. Pellentesque tincidunt sollicitudin odio, id condimentum leo condimentum aliquam. Aliquam tincidunt faucibus elit, sit amet interdum justo vestibulum quis. Praesent ac sagittis nunc. Nulla eu lacus id mauris laoreet vehicula. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p> 
     20  <p>Quisque suscipit dictum velit, tempus pharetra elit cursus eget. Mauris pulvinar libero bibendum tortor tristique ut suscipit ante vestibulum. Integer dignissim sagittis mi, nec tincidunt dui posuere ac. Vivamus risus turpis, blandit at dictum in, scelerisque in nibh. Mauris ac erat vel purus pellentesque ullamcorper et ac nulla. Integer ante arcu, ornare sit amet sodales eget, lacinia vitae dolor. Pellentesque dignissim odio at nisl hendrerit euismod. Duis at eros erat, id congue tortor. Donec commodo, eros at ullamcorper tincidunt, arcu est vehicula mauris, quis imperdiet magna elit sit amet massa. Maecenas suscipit, leo a fermentum mollis, nulla nulla pretium enim, et auctor risus lectus sed tortor.</p> 
    2221 
    23 <p>Quisque suscipit dictum velit, tempus pharetra elit cursus eget. Mauris pulvinar libero bibendum tortor tristique ut suscipit ante vestibulum. Integer dignissim sagittis mi, nec tincidunt dui posuere ac. Vivamus risus turpis, blandit at dictum in, scelerisque in nibh. Mauris ac erat vel purus pellentesque ullamcorper et ac nulla. Integer ante arcu, ornare sit amet sodales eget, lacinia vitae dolor. Pellentesque dignissim odio at nisl hendrerit euismod. Duis at eros erat, id congue tortor. Donec commodo, eros at ullamcorper tincidunt, arcu est vehicula mauris, quis imperdiet magna elit sit amet massa. Maecenas suscipit, leo a fermentum mollis, nulla nulla pretium enim, et auctor risus lectus sed tortor.</p> 
    24  
    25 <p>Donec tempor feugiat ullamcorper. Sed viverra leo a nisi ornare id posuere urna laoreet. Curabitur a est leo, a luctus libero. Mauris dapibus feugiat sodales. Duis sollicitudin dui eget erat ullamcorper et mattis leo euismod. Aliquam dapibus egestas tortor a vehicula. Proin ut nisi justo, et volutpat orci. Vestibulum elementum eleifend nibh eu blandit. Vivamus at enim id magna iaculis commodo. Integer sagittis malesuada risus, at rutrum elit volutpat in. Morbi faucibus quam vitae arcu pharetra egestas. Pellentesque ac est ornare lacus tempus lobortis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. </p> 
    26 <wizard:previousNext next="false" /> 
     22  <p>Donec tempor feugiat ullamcorper. Sed viverra leo a nisi ornare id posuere urna laoreet. Curabitur a est leo, a luctus libero. Mauris dapibus feugiat sodales. Duis sollicitudin dui eget erat ullamcorper et mattis leo euismod. Aliquam dapibus egestas tortor a vehicula. Proin ut nisi justo, et volutpat orci. Vestibulum elementum eleifend nibh eu blandit. Vivamus at enim id magna iaculis commodo. Integer sagittis malesuada risus, at rutrum elit volutpat in. Morbi faucibus quam vitae arcu pharetra egestas. Pellentesque ac est ornare lacus tempus lobortis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. </p> 
     23</wizard:pageContent> 
  • trunk/grails-app/views/wizard/pages/_two.gsp

    r87 r88  
    1515 */ 
    1616%> 
    17 <g:setProvider library="jquery"/> 
    18 <g:render template="common/header" /> 
    19 <h1>page two</h1> 
     17<wizard:pageContent> 
     18  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sodales porta enim, sed ornare sapien molestie mollis. Maecenas at pretium turpis. Duis fermentum lectus vitae nisl venenatis id hendrerit sapien dictum. Duis blandit ornare augue nec porttitor. Quisque at tortor sapien, ac volutpat sem. Nullam venenatis placerat risus a euismod. Donec massa dui, porttitor sed fermentum eu, ornare ac velit. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. In id odio nisl, non semper neque. Vivamus facilisis, neque sed lacinia blandit, odio nisi sagittis turpis, accumsan iaculis tellus magna at velit. In sed turpis metus. Phasellus id sem eget dui sollicitudin ultrices. Duis cursus vehicula diam vel pharetra. Donec mattis libero eget tortor venenatis at cursus felis scelerisque. Nunc hendrerit metus quis leo sollicitudin sodales. In urna quam, aliquet in eleifend eget, rutrum tempor elit.</p> 
    2019 
    21 <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sodales porta enim, sed ornare sapien molestie mollis. Maecenas at pretium turpis. Duis fermentum lectus vitae nisl venenatis id hendrerit sapien dictum. Duis blandit ornare augue nec porttitor. Quisque at tortor sapien, ac volutpat sem. Nullam venenatis placerat risus a euismod. Donec massa dui, porttitor sed fermentum eu, ornare ac velit. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. In id odio nisl, non semper neque. Vivamus facilisis, neque sed lacinia blandit, odio nisi sagittis turpis, accumsan iaculis tellus magna at velit. In sed turpis metus. Phasellus id sem eget dui sollicitudin ultrices. Duis cursus vehicula diam vel pharetra. Donec mattis libero eget tortor venenatis at cursus felis scelerisque. Nunc hendrerit metus quis leo sollicitudin sodales. In urna quam, aliquet in eleifend eget, rutrum tempor elit.</p> 
    22  
    23 <p>Suspendisse magna mauris, pretium eget elementum sed, aliquam nec neque. Nam et lorem lacus. Phasellus dapibus, erat nec tristique commodo, turpis tellus tempor est, tincidunt dignissim urna tortor at dui. Nulla faucibus, velit in lobortis venenatis, neque sapien lobortis neque, ut varius sem tortor id purus. Duis posuere condimentum ante, quis mattis arcu fringilla quis. Vivamus in augue tellus, posuere mattis nisl. Praesent sit amet ligula a turpis ullamcorper elementum non quis felis. Nulla elit ipsum, viverra ut cursus at, pharetra eget nibh. Vivamus mauris velit, elementum eu ornare vitae, imperdiet id velit. Phasellus sit amet mi vel est lobortis sagittis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. </p> 
    24 <wizard:previousNext /> 
     20  <p>Suspendisse magna mauris, pretium eget elementum sed, aliquam nec neque. Nam et lorem lacus. Phasellus dapibus, erat nec tristique commodo, turpis tellus tempor est, tincidunt dignissim urna tortor at dui. Nulla faucibus, velit in lobortis venenatis, neque sapien lobortis neque, ut varius sem tortor id purus. Duis posuere condimentum ante, quis mattis arcu fringilla quis. Vivamus in augue tellus, posuere mattis nisl. Praesent sit amet ligula a turpis ullamcorper elementum non quis felis. Nulla elit ipsum, viverra ut cursus at, pharetra eget nibh. Vivamus mauris velit, elementum eu ornare vitae, imperdiet id velit. Phasellus sit amet mi vel est lobortis sagittis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. </p> 
     21</wizard:pageContent> 
  • trunk/web-app/css/default_style.css

    r29 r88  
    22        margin: 0; padding: 0; 
    33        font: 10px normal Arial, Helvetica, sans-serif; 
    4         background: #ddd url(../images/default_style/body_bg.gif) repeat-x; 
     4        background: #fff url(../images/default_style/body_bg.gif) repeat-x; 
    55} 
    66/*a:link, a:visited, a:hover {