diff options
Diffstat (limited to 'gn2/wqflask/templates/collections/list.html')
| -rw-r--r-- | gn2/wqflask/templates/collections/list.html | 189 |
1 files changed, 189 insertions, 0 deletions
diff --git a/gn2/wqflask/templates/collections/list.html b/gn2/wqflask/templates/collections/list.html new file mode 100644 index 00000000..c553717f --- /dev/null +++ b/gn2/wqflask/templates/collections/list.html @@ -0,0 +1,189 @@ +{% extends "base.html" %} +{%from "oauth2/display_error.html" import display_error%} +{% block title %}Your Collections{% endblock %} +{% block css %} + <link rel="stylesheet" type="text/css" href="{{ url_for('css', filename='DataTables/css/jquery.dataTables.css') }}" /> + <link rel="stylesheet" type="text/css" href="{{ url_for('js', filename='DataTablesExtensions/buttonsBootstrap/css/buttons.bootstrap.css') }}" /> + <link rel="stylesheet" type="text/css" href="/static/new/css/show_trait.css" /> +{% endblock %} +{% block content %} +<!-- Start of body --> + <div class="container"> + {{flash_me()}} + + {% if g.user_session.logged_in %} + <h1>Collections owned by {% if g.user_session.user_name %}{{ g.user_session.user_name }}{% else %}{{ g.user_session.user_email }} {% endif %}</h1> + {% else %} + <h1>Your Collections</h1> + {% endif %} + + <div> + <button class="btn btn-default" id="select_all"><span class="glyphicon glyphicon-ok"></span> Select All</button> + <button class="btn btn-default" id="deselect_all"><span class="glyphicon glyphicon-remove"></span> Deselect All</button> + <button class="btn btn-default" id="invert"><span class="glyphicon glyphicon-resize-vertical"></span> Invert</button> + <button class="btn btn-danger" id="remove_collections" data-url="/collections/delete">Remove Collections</button> + <input type="text" id="searchbox" class="form-control" style="width: 200px; display: inline;" placeholder="Search This Table For ..."> + <input type="text" id="select_top" class="form-control" style="width: 200px; display: inline;" placeholder="Select Top ..."> + <br> + <form id="collections_form" action="javascript:void(0);" method="post" enctype="multipart/form-data"> + <input type="hidden" name="uc_id" id="uc_id" value="" /> + <div style="margin-top: 10px; display: inline-block;"><button class="btn btn-default" id="import_collection" data-url="/collections/import"> Import Collection</button> <input type="file" name="import_file" id="import_file" size="20" style="display: inline-block;"></input></div> + </form> + </div> + <br> + <div id="collections_list" style="width:50%; margin-top: 10px; margin-bottom: 10px;"> + {%if anon_collections_error is defined%} + {{display_error("Anonymous Collections", anon_collections_error)}} + {%endif%} + {%if anon_collections | length > 0%} + <table class="table-hover table-striped cell-border" id='anon_trait_table' + style="float: left;"> + <caption>Anonymous Collections</caption> + <thead> + <tr> + <th></th> + <th>Index</th> + <th>Name</th> + <th>Created</th> + <th>Last Changed</th> + <th># Records</th> + </tr> + </thead> + + <tbody> + {% for uc in anon_collections %} + <tr class="collection_line"> + <td align="center" style="padding: 0px;"><INPUT TYPE="checkbox" NAME="collection" class="checkbox trait_checkbox" VALUE="{{ uc.id }}"></td> + <td align="right">{{ loop.index }} + <td><a class="collection_name" href="{{ url_for('view_collection', uc_id=uc.id) }}">{{ uc.name }}</a></td> + <td>{{ uc.created_timestamp }}</td> + <td>{{ uc.changed_timestamp }}</td> + <td align="right">{{ uc.num_members }}</td> + </tr> + {% endfor %} + </tbody> + </table> + {%endif%} + {% if collections|length > 0 %} + {% if (anon_collections | length > 0) and (collections | length > 0) %} + <hr /> + {%endif%} + <table class="table-hover table-striped cell-border" id='trait_table' style="float: left;"> + <caption>User Collections</caption> + <thead> + <tr> + <th></th> + <th>Index</th> + <th>Name</th> + <th>Created</th> + <th>Last Changed</th> + <th># Records</th> + </tr> + </thead> + + <tbody> + {% for uc in collections %} + <tr class="collection_line"> + <td align="center" style="padding: 0px;"><INPUT TYPE="checkbox" NAME="collection" class="checkbox trait_checkbox" VALUE="{{ uc.id }}"></td> + <td align="right">{{ loop.index }} + <td><a class="collection_name" href="{{ url_for('view_collection', uc_id=uc.id) }}">{{ uc.name }}</a></td> + <td>{{ uc.created_timestamp }}</td> + <td>{{ uc.changed_timestamp }}</td> + <td align="right">{{ uc.num_members }}</td> + </tr> + {% endfor %} + </tbody> + </table> + {% else %} + You have no collections yet. + {% endif %} + </div> + </div> + +<!-- End of body --> + +{% endblock %} + +{% block js %} + <script language="javascript" type="text/javascript" src="{{ url_for('js', filename='js_alt/timeago.min.js') }}"></script> + <script language="javascript" type="text/javascript" src="{{ url_for('js', filename='js_alt/md5.min.js') }}"></script> + <script language="javascript" type="text/javascript" src="{{ url_for('js', filename='DataTables/js/jquery.dataTables.min.js') }}"></script> + <script language="javascript" type="text/javascript" src="{{ url_for('js', filename='jszip/jszip.min.js') }}"></script> + <script language="javascript" type="text/javascript" src="{{ url_for('js', filename='DataTablesExtensions/plugins/sorting/natural.js') }}"></script> + <script language="javascript" type="text/javascript" src="{{ url_for('js', filename='DataTablesExtensions/buttons/js/dataTables.buttons.min.js') }}"></script> + <script type="text/javascript" src="/static/new/javascript/search_results.js"></script> + <script type="text/javascript" src="/static/new/javascript/table_functions.js"></script> + <script type="text/javascript" src="/static/new/javascript/create_datatable.js"></script> + <script> + $(document).ready( function () { + tableId = "trait_table"; + + columnDefs = [ + { "type": "natural", "width": "3%", "targets": 0, "orderable": false}, + { "type": "natural", "width": "8%", "targets": 1}, + { "type": "natural", "width": "20%", "targets": 2}, + { "type": "natural", "width": "25%", "targets": 3}, + { "type": "natural", "width": "25%", "targets": 4}, + { "type": "natural", "width": "15%", "targets": 5} + ]; + + create_table("anon_trait_table", [], columnDefs) + create_table(tableId, [], columnDefs) + + submit_special = function(url) { + $("#collections_form").attr("action", url); + return $("#collections_form").submit(); + }; + + add_collection = function(trait_data, textStatus, jqXHR) { + var traits_hash = md5(trait_data.toString()); + + $.ajax({ + type: "POST", + url: "/collections/store_trait_list", + data: { + hash: traits_hash, + traits: trait_data.toString() + } + }); + + return $.colorbox({ + href: "/collections/add?hash=" + traits_hash + }); + } + + $("#import_collection").on("click", function() { + var fd = new FormData(); + var files = $('#import_file')[0].files; + if(files.length > 0){ + fd.append('import_file', files[0]) + $.ajax({ + type: "POST", + url: "/collections/import", + data: fd, + dataType: "json", + contentType: false, + processData: false, + success: add_collection + }); + } else { + alert("No file selected") + } + }); + + + $("#remove_collections").on("click", function() { + url = $(this).data("url") + collections = [] + $(".trait_checkbox:checked").each(function() { + collections.push($(this).val()); + }); + collections_string = collections.join(":") + $("input[name=uc_id]").val(collections_string) + return submit_special(url) + }); + + }); + + </script> +{% endblock %} |