Control the loadingIndicator using a loading property
authorJaroslav Tulach <jtulach@netbeans.org>
Wed, 15 May 2013 09:46:37 +0200
changeset 1641a76f55fcc6
parent 15 91219d000cb8
child 17 2ab6a1056726
Control the loadingIndicator using a loading property
twitter/src/main/java/org/apidesign/html/demo/twitter/TwitterClient.java
twitter/src/main/resources/org/apidesign/html/demo/twitter/index.html
twitter/src/main/resources/org/apidesign/html/demo/twitter/twitterExample.css
     1.1 --- a/twitter/src/main/java/org/apidesign/html/demo/twitter/TwitterClient.java	Thu May 09 22:41:43 2013 +0200
     1.2 +++ b/twitter/src/main/java/org/apidesign/html/demo/twitter/TwitterClient.java	Wed May 15 09:46:37 2013 +0200
     1.3 @@ -42,7 +42,8 @@
     1.4      @Property(name="activeTweetersName", type=String.class),
     1.5      @Property(name="activeTweeters", type=String.class, array = true),
     1.6      @Property(name="userNameToAdd", type=String.class),
     1.7 -    @Property(name="currentTweets", type=Tweet.class, array = true)
     1.8 +    @Property(name="currentTweets", type=Tweet.class, array = true),
     1.9 +    @Property(name="loading", type=boolean.class)
    1.10  })
    1.11  public class TwitterClient {
    1.12      @Model(className = "Tweeters", properties = {
    1.13 @@ -92,6 +93,7 @@
    1.14      static void queryTweets(TwitterModel page, TwitterQuery q) {
    1.15          page.getCurrentTweets().clear();
    1.16          page.getCurrentTweets().addAll(q.getResults());
    1.17 +        page.setLoading(false);
    1.18      }
    1.19      
    1.20      @OnPropertyChange("activeTweetersName")
    1.21 @@ -112,6 +114,7 @@
    1.22              sb.append(p);
    1.23              sep = " OR ";
    1.24          }
    1.25 +        model.setLoading(true);
    1.26          model.queryTweets("http://search.twitter.com", sb.toString());
    1.27      }
    1.28      
     2.1 --- a/twitter/src/main/resources/org/apidesign/html/demo/twitter/index.html	Thu May 09 22:41:43 2013 +0200
     2.2 +++ b/twitter/src/main/resources/org/apidesign/html/demo/twitter/index.html	Wed May 15 09:46:37 2013 +0200
     2.3 @@ -80,7 +80,7 @@
     2.4                  </form>
     2.5              </div>
     2.6              <div class='tweets'>
     2.7 -                <div class='loadingIndicator'>Loading...</div>
     2.8 +                <div class='loadingIndicator' data-bind="visible: loading">Loading...</div>
     2.9                  <table data-bind='foreach: currentTweets' width='100%'>
    2.10                      <tr>
    2.11                          <td><img data-bind='attr: { src: profile_image_url }' /></td>
     3.1 --- a/twitter/src/main/resources/org/apidesign/html/demo/twitter/twitterExample.css	Thu May 09 22:41:43 2013 +0200
     3.2 +++ b/twitter/src/main/resources/org/apidesign/html/demo/twitter/twitterExample.css	Wed May 15 09:46:37 2013 +0200
     3.3 @@ -55,4 +55,4 @@
     3.4  .configuration form input { width:40%; font-size: 1.3em; border:1px solid silver; background-color: White; padding: 0.1em; }
     3.5  .configuration form button { width: 20%; margin-left: 0.3em; height: 2em; }
     3.6  
     3.7 -.loadingIndicator { position: absolute; top: 0.1em; left: 0.1em; font: 0.8em Arial; background-color: #229; color: White; padding: 0.2em 0.5em 0.2em 0.5em; display: none; }
     3.8 +.loadingIndicator { position: absolute; top: 0.1em; left: 0.1em; font: 0.8em Arial; background-color: #229; color: White; padding: 0.2em 0.5em 0.2em 0.5em; }