[ARVADOS] updated: b10a9487702db5d776c09bfa11f8abcb62f7419a

git at public.curoverse.com git at public.curoverse.com
Fri Mar 27 09:53:32 EDT 2015


Summary of changes:
 .../app/assets/javascripts/modal_pager.js          | 37 ++++++++++++++++++++++
 .../application/_getting_started_popup.html.erb    | 16 ++++++++--
 2 files changed, 51 insertions(+), 2 deletions(-)
 create mode 100644 apps/workbench/app/assets/javascripts/modal_pager.js

       via  b10a9487702db5d776c09bfa11f8abcb62f7419a (commit)
      from  53fac68b8025db64c50c0370a16c7afaf4be7bd3 (commit)

Those revisions listed above that are new to this repository have
not appeared on any other notification email; so we list those
revisions in full, below.


commit b10a9487702db5d776c09bfa11f8abcb62f7419a
Author: Radhika Chippada <radhika at curoverse.com>
Date:   Fri Mar 27 09:52:49 2015 -0400

    5493: (thanks to tom) modal paging is awesome.

diff --git a/apps/workbench/app/assets/javascripts/modal_pager.js b/apps/workbench/app/assets/javascripts/modal_pager.js
new file mode 100644
index 0000000..8d2bf2f
--- /dev/null
+++ b/apps/workbench/app/assets/javascripts/modal_pager.js
@@ -0,0 +1,37 @@
+// Usage:
+//
+// 1. Add some buttons to your modal, one with class="pager-next" and
+// one with class="pager-prev".
+//
+// 2. Put multiple .modal-body sections in your modal.
+
+$(document).on('click', '.modal .pager-next', function() {
+    var $modal = $(this).parents('.modal');
+    $modal.data('page', ($modal.data('page') || 0) + 1).trigger('pager:render');
+    return false;
+}).on('click', '.modal .pager-prev', function() {
+    var $modal = $(this).parents('.modal');
+    $modal.data('page', ($modal.data('page') || 1) - 1).trigger('pager:render');
+    return false;
+}).on('ready ajax:success', function() {
+    $('.modal').trigger('pager:render');
+}).on('pager:render', '.modal', function() {
+    var $modal = $(this);
+    var page = $modal.data('page') || 0;
+    var $panes = $('.modal-body', $modal);
+    if (page >= $panes.length) {
+        // Somehow moved past end
+        page = $panes.length - 1;
+        $modal.data('page', page);
+    } else if (page < 0) {
+        page = 0;
+    }
+    var selected = $panes.hide().eq(page).show();
+    enableButton($('.pager-prev', $modal), page > 0);
+    enableButton($('.pager-next', $modal), page < $panes.length - 1);
+    function enableButton(btn, ok) {
+        btn.prop('disabled', !ok).
+            toggleClass('btn-primary', ok).
+            toggleClass('btn-default', !ok);
+    }
+});
diff --git a/apps/workbench/app/views/application/_getting_started_popup.html.erb b/apps/workbench/app/views/application/_getting_started_popup.html.erb
index eb161bc..9a792c4 100644
--- a/apps/workbench/app/views/application/_getting_started_popup.html.erb
+++ b/apps/workbench/app/views/application/_getting_started_popup.html.erb
@@ -15,11 +15,23 @@
       </div>
 
       <div class="modal-body" style="height: 25em; overflow-y: scroll">
-        Wait for it
+        Page 1
+      </div>
+      <div class="modal-body" style="height: 25em; overflow-y: scroll">
+        Page 2
+      </div>
+      <div class="modal-body" style="height: 25em; overflow-y: scroll">
+        Page 3
+      </div>
+      <div class="modal-body" style="height: 25em; overflow-y: scroll">
+        Page 4
       </div>
 
       <div class="modal-footer">
-          <button class="btn btn-default" data-dismiss="modal" aria-hidden="true">Close</button>
+        <div style="text-align:center">
+          <button class="btn btn-default pager-prev"><i class="fa fa-fw fa-chevron-left"></i><span style="font-weight: bold;"> Prev</span></button>
+          <button class="btn btn-default pager-next"><span style="font-weight: bold;">Next </span><i class="fa fa-fw fa-chevron-right"></i></button>
+        </div>
       </div>
     </div>
   </div>

-----------------------------------------------------------------------


hooks/post-receive
-- 




More information about the arvados-commits mailing list