Last active
February 20, 2016 16:45
-
-
Save royshil/8e69d0bc1eb93c74ae51 to your computer and use it in GitHub Desktop.
A Tapestry 5 Mixin for a loading spinner with spin.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| package com.yourapp.mixins; | |
| import org.apache.tapestry5.BindingConstants; | |
| import org.apache.tapestry5.ClientElement; | |
| import org.apache.tapestry5.annotations.Import; | |
| import org.apache.tapestry5.annotations.InjectContainer; | |
| import org.apache.tapestry5.annotations.Parameter; | |
| import org.apache.tapestry5.ioc.annotations.Inject; | |
| import org.apache.tapestry5.json.JSONObject; | |
| import org.apache.tapestry5.services.javascript.JavaScriptSupport; | |
| //Put the spin.min.js wherever on the context and point to it here | |
| @Import( | |
| library = { | |
| "context:layout/assets/js/spin.min.js" | |
| }) | |
| public class LoadingSpinner { | |
| @Parameter(defaultPrefix = BindingConstants.LITERAL) | |
| private boolean closeSpinner; | |
| @Inject | |
| private JavaScriptSupport javaScriptSupport; | |
| @InjectContainer | |
| private ClientElement clientElement; | |
| public void afterRender() { | |
| if ( closeSpinner) { | |
| javaScriptSupport.addScript("$('.loader-wrapper').remove();"); | |
| } else { | |
| javaScriptSupport.addScript( | |
| "$('#%s').click(function(e) { " | |
| + "new Spinner().spin($('<div />', { class: 'loader-wrapper'}).appendTo('body')[0]); " | |
| + "});", clientElement.getClientId()); | |
| } | |
| } | |
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <html xmlns:t="http://tapestry.apache.org/schema/tapestry_5_3.xsd" | |
| xmlns:p="tapestry:parameter"> | |
| <!-- | |
| This example shows using the spinner mixin with a Tapestry-jQuery ajax dialog. | |
| But it is just as easy to use in any other situation when a zone is rendered | |
| (i.e. any actionlink, eventlink, form submit, etc. that are bound to a zone). | |
| --> | |
| <!-- when this is clicked, a spinner object will be added to the DOM --> | |
| <t:jquery.dialogajaxlink dialog="myDialog" t:id="myDialogLink" class="btn btn-info" t:mixins="LoadingSpinner" zone="myDialogZone"> | |
| Long operation | |
| </t:jquery.dialogajaxlink> | |
| <t:jquery.dialog t:clientId="myDialog" title="My Dialog"> | |
| <t:zone t:id="mtDialogZone"> | |
| <!-- when this zone renders it will kill the spinner object --> | |
| <t:any t:mixins="LoadingSpinner" t:closeSpinner="true" /> | |
| Wow! This took a very long time... lucky we had that spinner to make time go by faster. | |
| </t:zone> | |
| </t:jquery.dialog> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment