Author: buildbot
Date: Tue Jul 1 10:15:30 2014
New Revision: 914572
Log:
Staging update by buildbot for thrift
Modified:
websites/staging/thrift/trunk/content/ (props changed)
websites/staging/thrift/trunk/content/tutorial/js.html
Propchange: websites/staging/thrift/trunk/content/
------------------------------------------------------------------------------
--- cms:source-revision (original)
+++ cms:source-revision Tue Jul 1 10:15:30 2014
@@ -1 +1 @@
-1607025
+1607030
Modified: websites/staging/thrift/trunk/content/tutorial/js.html
==============================================================================
--- websites/staging/thrift/trunk/content/tutorial/js.html (original)
+++ websites/staging/thrift/trunk/content/tutorial/js.html Tue Jul 1 10:15:30
2014
@@ -92,7 +92,7 @@
</ol>
<h3 id="prerequisites">Prerequisites</h3>
<ul>
-<li>This tutorial depends on an existing Thrift server. See either the <a
href="/tutorial/java">Java tutorial</a> or <a href="/tutorial/cpp">C++
tutorial</a> for how to build and setup one of these servers.</li>
+<li>This tutorial depends on an existing Thrift server. See either the <a
href="/tutorial/java">Java tutorial</a> or <a href="/tutorial/nodejs">node.js
tutorial</a> for how to build and setup one of these servers.</li>
</ul>
<h3 id="client">Client</h3>
<pre><code class="language-js">
@@ -187,12 +187,33 @@ function calc() {
<p>Unfortunately, the Javascript object isn't just called Calculator and there
are a lot of other functions defined as well, but how those are used are out of
the scope of this tutorial. </p>
<h3 id="inspecting-the-thriftjs-file">Inspecting the Thrift.js file</h3>
<ul>
-<li>The Thrift.js library currently uses jQuery.js in it's usage.</li>
<li>The main goal of the library is to define the Transport and Protocol
layers.</li>
-<li>The Transport layer only uses AJAX as of right now. </li>
-<li>The Protocol layer handles the encoding/decoding to JSON format.</li>
+<li>The Transport layer can use AJAX or WebSockets. </li>
+<li>The Protocol layer handles the encoding/decoding to JSON or Binary
format.</li>
<li>There are also the Thrift object types and call functions defined here as
well.</li>
+<li>The Thrift.js library can use jQuery.js if provided.</li>
</ul>
+<h4 id="jquery-api">jQuery API</h4>
+<p>jQuery aware JS source files can generated using the <em>jq</em> compiler
option:</p>
+<div class="codehilite"><pre><span class="n">thrift</span> <span
class="o">--</span><span class="n">gen</span> <span class="n">js</span><span
class="p">:</span><span class="n">jq</span> <span
class="n">tutorial</span><span class="p">.</span><span class="n">thrift</span>
+</pre></div>
+
+
+<p>This does not change the default behavior of the library, i.e. service
calls will be done synchronously. However, services will start using
jQuery.ajax when a callback function is provided as showed below.</p>
+<div class="codehilite"><pre><span class="n">client</span><span
class="p">.</span><span class="n">calculate</span><span
class="p">(</span>1<span class="p">,</span> <span class="n">work</span><span
class="p">,</span> <span class="k">function</span><span class="p">(</span><span
class="n">result</span><span class="p">)</span> <span class="p">{</span> <span
class="n">alert</span><span class="p">(</span><span
class="n">result</span><span class="p">);</span> <span class="p">});</span>
+</pre></div>
+
+
+<p>This method call will return immediately but the callback function (and its
<em>alert</em>) will be called as soon as a response is received from the
server. The service call also returns a jqXHR object, which has more callback
options:</p>
+<div class="codehilite"><pre><span class="n">client</span><span
class="p">.</span><span class="n">calculate</span><span
class="p">(</span>1<span class="p">,</span> <span class="n">work</span><span
class="p">,</span> <span class="k">function</span><span class="p">(){}</span>
<span class="p">)</span>
+<span class="p">.</span><span class="n">fail</span><span class="p">(</span>
<span class="k">function</span><span class="p">(</span><span
class="n">jqXHR</span><span class="p">,</span> <span
class="n">status</span><span class="p">,</span> <span
class="n">error</span><span class="p">)</span> <span class="p">{</span> <span
class="n">alert</span><span class="p">(</span><span class="n">error</span><span
class="p">.</span><span class="n">message</span><span class="p">);</span> <span
class="p">}</span> <span class="p">)</span>
+<span class="p">.</span><span class="n">done</span><span class="p">(</span>
<span class="k">function</span><span class="p">(</span><span
class="n">result</span><span class="p">)</span> <span class="p">{</span> <span
class="o">/*</span> <span class="n">success</span>! <span class="n">do</span>
<span class="n">something</span> <span class="o">*/</span> <span
class="p">}</span> <span class="p">)</span>
+<span class="p">.</span><span class="n">always</span><span class="p">(</span>
<span class="k">function</span><span class="p">()</span> <span
class="p">{</span> <span class="o">/*</span> <span class="n">do</span> <span
class="n">something</span> <span class="n">more</span> <span
class="o">*/</span> <span class="p">}</span> <span class="p">);</span>
+</pre></div>
+
+
+<p>For more information refer to: http://api.jquery.com/jquery.ajax/
+Note: Synchronously calls are easy to debug and good for testing but should
not be used on a front-end browser, as it will normally result on the a whole
browser freeze until the response is back.</p>
</div>
<div class="container">
<hr>
