[Author Prev][Author Next][Thread Prev][Thread Next][Author Index][Thread Index]

[tor-commits] [compass/master] Transformed results page to use Angular



commit 322c34cc9529b3795ade04f0a16a8f3302b87d69
Author: Chris Wacek <cwacek@xxxxxxxxxxxxxxxxx>
Date:   Thu Dec 20 16:46:31 2012 -0500

    Transformed results page to use Angular
---
 templates/index.html |  116 +++++++++++++++++++++++++++++++------------------
 1 files changed, 73 insertions(+), 43 deletions(-)

diff --git a/templates/index.html b/templates/index.html
index 613e28b..7626773 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -151,50 +151,80 @@
       </form>
     </div>
 
-      <div class="loading"><img src="{{ url_for('static', filename='img/loader.gif') }}" /></div>
-      <hr>
-      <div id="result" ></div>
+    <div class="hero-unit" ng-show="state == 'result_empty'">
+        <p>No results found</p>
+    </div>
+    <div class="hero-unit" ng-show="state == 'loaded' || state == 'sorting'">
       <table class="table table-striped">
-      <thead>
-      <tr>
-      <th>#</th>
-      <th><span rel="tooltip" title="Relative bandwidth weight assigned to this relay by the directory authorities">Consensus Weights</span></th>
-      <th><span rel="tooltip" title="Relative advertised bandwidth of this relay compared to the total advertised bandwidth in the network">Advertised Bandwidth</span></th>
-      <th><span rel="tooltip" title=" Probability of this relay to be selected for the guard position">Guard Probability</span></th>
-      <th><span rel="tooltip" title="Probability of this relay to be selected for the middle position">Middle Probability</span></th>
-      <th><span rel="tooltip" title="Probability of this relay to be selected for the exit position">Exit Probability</span></th>
-      <th>Nickname</th>
-      <th>Fingerprint</th>
-      <th>Exit</th>
-      <th>Guard</th>
-      <th>Country</th>
-      <th>Autonomous System</th>
-      </tr>
-      </thead>                                         
-      <tbody>
-      <tr ng-repeat="relay in relayResults.results">
-        <td> [[ relay.index ]] </td>
-        <td> [[ relay.cw ]] </td>
-        <td> [[ relay.adv_bw]] </td>
-        <td>[[ relay.p_guard ]]</td>
-        <td>[[ relay.p_middle ]]</td>
-        <td>[[ relay.p_exit ]]</td>
-        <td>[[ relay.nick ]]</td>
-        <!-- it's not a fingerprint -->
-        {% if relay.fp|length != 40 %}
-        <td>[[ relay.fp ]]</td>
-        {% else %}
-        <td><a href="https://atlas.torproject.org/#details/[[ relay.fp ]]">[[ relay.fp[:8] ]]</a></td>
-        {% endif %}
-        <td>[[ relay.exit ]]</td>
-        <td>[[ relay.guard ]]</td>
-        <td>[[ relay.cc ]]</td>
-        <td>[[ relay.as_info ]]</td>
-      <tr>
-      </tbody>
-      </table>
-
-
+        <thead>
+          <tr>
+            <th ng-click="setsort('index',false)">#</th>
+            <th ng-click="setsort('cw', true)">
+              <span rel="tooltip" title="Relative bandwidth weight assigned to this relay by the directory authorities">Consensus Weights</span>
+            </th>
+            <th ng-click="setsort('adv_bw',true)"><span rel="tooltip" title="Relative advertised bandwidth of this relay compared to the total advertised bandwidth in the network">Advertised Bandwidth</span></th>
+            <th ng-click="setsort('p_guard',true)"><span rel="tooltip" title=" Probability of this relay to be selected for the guard position">Guard Probability</span></th>
+            <th ng-click="setsort('p_middle',true)"><span rel="tooltip" title="Probability of this relay to be selected for the middle position">Middle Probability</span></th>
+            <th ng-click="setsort('p_exit',true)"><span rel="tooltip" title="Probability of this relay to be selected for the exit position">Exit Probability</span></th>
+            <th ng-click="setsort('nick',false)">Nickname</th>
+            <th ng-click="setsort('fp',false)">Fingerprint</th>
+            <th ng-click="setsort('exit',false)">Exit</th>
+            <th ng-click="setsort('guard',false)">Guard</th>
+            <th ng-click="setsort('cc',false)">Country</th>
+            <th ng-click="setsort('as_info',false)">Autonomous System</th>
+          </tr>
+        </thead>
+        <tfoot>
+          <tr ng-show="data.excluded">
+            <td> {{ data.excluded.index }} </td>
+            <td> {{ data.excluded.cw | number:4 }}%</td>
+            <td> {{ data.excluded.adv_bw | number:4}}%</td>
+            <td>{{ data.excluded.p_guard | number:4 }}%</td>
+            <td>{{ data.excluded.p_middle | number:4 }}%</td>
+            <td>{{ data.excluded.p_exit | number:4 }}%</td>
+            <td>{{ data.excluded.nick }}</td>
+            <td> {{data.excluded.fp }} </td>
+            <td>{{ data.excluded.exit }}</td>
+            <td>{{ data.excluded.guard }}</td>
+            <td>{{ data.excluded.cc }}</td>
+            <td>{{ data.excluded.as_info }}</td>
+          </tr>
+          <tr ng-show="data.total">
+            <td> {{ data.total.index }} </td>
+            <td> {{ data.total.cw | number:4 }}%</td>
+            <td> {{ data.total.adv_bw | number:4}}%</td>
+            <td>{{ data.total.p_guard | number:4 }}%</td>
+            <td>{{ data.total.p_middle | number:4 }}%</td>
+            <td>{{ data.total.p_exit | number:4 }}%</td>
+            <td>{{ data.total.nick }}</td>
+            <td> {{data.total.fp }} </td>
+            <td>{{ data.total.exit }}</td>
+            <td>{{ data.total.guard }}</td>
+            <td>{{ data.total.cc }}</td>
+            <td>{{ data.total.as_info }}</td>
+          </tr>
+        </tfoot>
+        <tbody>
+          <tr ng-repeat="relay in data.results | orderBy:table.sort:table.reverse">
+            <td> {{ relay.index }} </td>
+            <td> {{ relay.cw | number:4 }}%</td>
+            <td> {{ relay.adv_bw | number:4}}%</td>
+            <td>{{ relay.p_guard | number:4 }}%</td>
+            <td>{{ relay.p_middle | number:4 }}%</td>
+            <td>{{ relay.p_exit | number:4 }}%</td>
+            <td>{{ relay.nick }}</td>
+            <td>
+              <a href="https://atlas.torproject.org/#details/{{relay.fp}}"; >{{relay.fp.substring(0,8)}}</a>
+            </td>
+            <td>{{ relay.exit }}</td>
+            <td>{{ relay.guard }}</td>
+            <td>{{ relay.cc }}</td>
+            <td>{{ relay.as_info }}</td>
+            <tr>
+            </tbody>
+          </table>
+        </div>
+      </div>
 
       <footer>
         The Tor Project - 2012<br>



_______________________________________________
tor-commits mailing list
tor-commits@xxxxxxxxxxxxxxxxxxxx
https://lists.torproject.org/cgi-bin/mailman/listinfo/tor-commits