diff --git a/graphs/static/images/auto_1.png b/graphs/static/images/auto_1.png index 7469bd37..8758a8db 100644 Binary files a/graphs/static/images/auto_1.png and b/graphs/static/images/auto_1.png differ diff --git a/graphs/static/images/auto_2.png b/graphs/static/images/auto_2.png index 900dab6d..1fe2c937 100644 Binary files a/graphs/static/images/auto_2.png and b/graphs/static/images/auto_2.png differ diff --git a/graphs/static/images/auto_3.png b/graphs/static/images/auto_3.png index dd28e390..3e08e485 100644 Binary files a/graphs/static/images/auto_3.png and b/graphs/static/images/auto_3.png differ diff --git a/graphs/static/images/auto_4.png b/graphs/static/images/auto_4.png index 2c54e1eb..c1013cda 100644 Binary files a/graphs/static/images/auto_4.png and b/graphs/static/images/auto_4.png differ diff --git a/graphs/static/images/bambi.png b/graphs/static/images/bambi.png index 778b2d5f..2e94968b 100644 Binary files a/graphs/static/images/bambi.png and b/graphs/static/images/bambi.png differ diff --git a/graphs/static/images/edge_search.png b/graphs/static/images/edge_search.png index ac07cc5e..e59c7507 100644 Binary files a/graphs/static/images/edge_search.png and b/graphs/static/images/edge_search.png differ diff --git a/graphs/static/images/edge_search2.png b/graphs/static/images/edge_search2.png index 59ddb5e3..c3dbf00b 100644 Binary files a/graphs/static/images/edge_search2.png and b/graphs/static/images/edge_search2.png differ diff --git a/graphs/static/images/graph_search.png b/graphs/static/images/graph_search.png index e17a43c4..4e8765c5 100644 Binary files a/graphs/static/images/graph_search.png and b/graphs/static/images/graph_search.png differ diff --git a/graphs/static/images/graphs.png b/graphs/static/images/graphs.png index 0557a858..36fe4aae 100644 Binary files a/graphs/static/images/graphs.png and b/graphs/static/images/graphs.png differ diff --git a/graphs/static/images/in_search.png b/graphs/static/images/in_search.png index e2fef2a3..74d147d3 100644 Binary files a/graphs/static/images/in_search.png and b/graphs/static/images/in_search.png differ diff --git a/graphs/static/images/interact_1.png b/graphs/static/images/interact_1.png index c86fb44a..ad8e5e23 100644 Binary files a/graphs/static/images/interact_1.png and b/graphs/static/images/interact_1.png differ diff --git a/graphs/static/images/interact_2.png b/graphs/static/images/interact_2.png index 068facd4..c010ada5 100644 Binary files a/graphs/static/images/interact_2.png and b/graphs/static/images/interact_2.png differ diff --git a/graphs/static/images/interact_3.png b/graphs/static/images/interact_3.png index 4c1043dd..398064ba 100644 Binary files a/graphs/static/images/interact_3.png and b/graphs/static/images/interact_3.png differ diff --git a/graphs/static/images/interact_4.png b/graphs/static/images/interact_4.png index c86c6174..c9a521a5 100644 Binary files a/graphs/static/images/interact_4.png and b/graphs/static/images/interact_4.png differ diff --git a/graphs/static/images/log_in.png b/graphs/static/images/log_in.png index c92d524d..6d16b0b3 100644 Binary files a/graphs/static/images/log_in.png and b/graphs/static/images/log_in.png differ diff --git a/graphs/static/images/logged_in.png b/graphs/static/images/logged_in.png index bdd74841..796e40c9 100644 Binary files a/graphs/static/images/logged_in.png and b/graphs/static/images/logged_in.png differ diff --git a/graphs/static/images/search_edge.png b/graphs/static/images/search_edge.png index 1635bbdf..3e2cc611 100644 Binary files a/graphs/static/images/search_edge.png and b/graphs/static/images/search_edge.png differ diff --git a/graphs/static/images/view_graph.png b/graphs/static/images/view_graph.png index e3443a8e..1adcf8af 100644 Binary files a/graphs/static/images/view_graph.png and b/graphs/static/images/view_graph.png differ diff --git a/graphs/templates/graphs/help_tutorial.html b/graphs/templates/graphs/help_tutorial.html index c931e3e0..c28106c0 100644 --- a/graphs/templates/graphs/help_tutorial.html +++ b/graphs/templates/graphs/help_tutorial.html @@ -27,16 +27,16 @@ <h1>Tutorial on interacting with GraphSpace</h1> <h2 style="padding-top: 50px; margin-top: -40px;">Logging In</h2> <p>The <a href="{{url}}">welcome page</a> greets a user when the user visits GraphSpace. We assume that the user has already created an account and uploaded graphs via the upload page or the RESTful API.</p> <br> -<img width="70%" height="60%" align="middle" src="../../static/images/log_in.png"></img> +<img width="80%" height="80%" align="middle" src="../../static/images/log_in.png"></img> <br><br> <br> <p>The user logs in and is provided a link to the list of graphs that the user can access.</p> -<img width="70%" height="60%" align="middle" src="../../static/images/logged_in.png"></img> +<img width="80%" height="80%" align="middle" src="../../static/images/logged_in.png"></img> <br><br> <br> <p>Clicking on the link titled "Graphs" takes the user to a page that lists the graphs accessible by the user. In this example, this user owns 33 graphs and can access public graphs. No graphs are shared with this user.</p> -<img width="70%" height="60%" align="middle" src="../../static/images/graphs.png"></img> +<img width="80%" height="80%" align="middle" src="../../static/images/graphs.png"></img> <br><br> </div> @@ -44,11 +44,11 @@ <h2 style="padding-top: 50px; margin-top: -40px;">Logging In</h2> <h2 style="padding-top: 50px; margin-top: -40px;">Searching within Multiple Graphs</h2> <br> <p>The user searches this list for graphs that contain the protein CTNNB1 (the symbol for β-catenin, a transcriptional regulator in the Wnt signaling pathway) obtaining a reduced list of graphs. The selection of the button "Similar" means that the any protein whose label or identifies contains "CTNNB1" as a substring will match this search. This image shows the result of this search. There are six graphs owned by the user and two public graphs that contain this protein. Each link in the "Graph Id" column will take the user to a specific graph with the search term highlighted.</p> -<img width="70%" height="60%" align="middle" src="../../static/images/graph_search.png"></img> +<img width="80%" height="80%" align="middle" src="../../static/images/graph_search.png"></img> <br><br> <p>The user clicks on the graph with the id "KEGG-Wnt-signaling-pathway" and reaches the graph for the Wnt pathway with the searched node highlighted.</p> -<img width="70%" height="60%" align="middle" src="../../static/images/view_graph.png"></img> +<img width="80%" height="80%" align="middle" src="../../static/images/view_graph.png"></img> </div> @@ -56,52 +56,52 @@ <h2 style="padding-top: 50px; margin-top: -40px;">Searching within Multiple Grap <h2 style="padding-top: 50px; margin-top: -40px;">Searching within a Single Graph</h2> <br> <p>The same search interface greets the user on the page for this graph, which allows the user to add more search terms for nodes (Wnt in this example).</p> -<img width="70%" height="60%" align="middle" src="../../static/images/in_search.png"></img> +<img width="80%" height="80%" align="middle" src="../../static/images/in_search.png"></img> <br><br> <p>The user can also add search terms for edges ("Wnt:Fzd" in this example). Since the user has selected the "similar" option for the search, any edge whose tail node contains "Wnt" and whose head contains "Fzd" matches the query.</p> <br> -<img width="70%" height="60%" align="middle" src="../../static/images/search_edge.png"></img> +<img width="80%" height="80%" align="middle" src="../../static/images/search_edge.png"></img> <br><br> <p>By selecting an "Exact" option, the user can perform a new search for nodes that are an exact match to the query, which is "BAMBI" in this figure.</p> <br> -<img width="70%" height="60%" align="middle" src="../../static/images/bambi.png"></img> +<img width="80%" height="80%" align="middle" src="../../static/images/bambi.png"></img> <br><br> <p>Figure 9: GraphSpace also supports exact searches for edges.</p> <br> -<img width="70%" height="60%" align="middle" src="../../static/images/edge_search2.png"></img> +<img width="80%" height="80%" align="middle" src="../../static/images/edge_search2.png"></img> </div> <div id="graph_interaction"> <h2 style="padding-top: 50px; margin-top: -40px;">Interacting with a Graph</h2> <p>As its name suggests, the "Graph details" panel displays information about the entire graph, e.g., a legend of node and edge shapes and colors.</p> -<img width="70%" height="60%" align="middle" src="../../static/images/interact_1.png"></img> +<img width="80%" height="80%" align="middle" src="../../static/images/interact_1.png"></img> <br><br> <p>Clicking on a node pops up a panel with information on that node.</p> -<img width="70%" height="60%" align="middle" src="../../static/images/interact_2.png"></img> +<img width="80%" height="80%" align="middle" src="../../static/images/interact_2.png"></img> <br><br> <br> <p>Clicking on a edge pops up a panel with information on that edge. The information that appears in "Graph Details" and the pop-up panels must be included in the JSON for the graph uploaded by the user using the RESTful API.</p> -<img width="70%" height="60%" align="middle" src="../../static/images/interact_3.png"></img> +<img width="80%" height="80%" align="middle" src="../../static/images/interact_3.png"></img> <br><br> <p>A user can export a graph in PNG format and view the JSON string for the graph. GraphSpace does not support any other export formats since it relies on Cytoscape.js for this functionality, which implements only export to PNG format.</p> -<img width="70%" height="60%" align="middle" src="../../static/images/interact_4.png"></img> +<img width="80%" height="80%" align="middle" src="../../static/images/interact_4.png"></img> </div> <div id="auto_layouts"> <h2 style="padding-top: 50px; margin-top: -40px;">Automatic and Manual Layouts</h2> <p>The layout panel for a graph displays two alternatives: automatic and manual.</p> -<img width="70%" height="60%" align="middle" src="../../static/images/auto_1.png"></img> +<img width="80%" height="80%" align="middle" src="../../static/images/auto_1.png"></img> <br><br> <p>Clicking on the first choice reveals the name of layout algorithms supported by GraphSpace through its use of Cytoscape.js.</p> -<img width="70%" height="60%" align="middle" src="../../static/images/auto_2.png"></img> +<img width="80%" height="80%" align="middle" src="../../static/images/auto_2.png"></img> <br><br> <p>Clicking on the "Manual" tab shows that there are two "Private" layouts, meaning that the user has not yet shared them with any other user. The user has created them in earlier sessions by manually modifying the positions of nodes and edges created by some automatic layout algorithm and saving the layout. The icons next to each layout name provide (i) a direct link to this layout, (ii) allow the user to change its name, (iii) share it with other users who have access to this graph, (iv) delete this layout, and (v) make it the default layout, i.e., instruct GraphSpace to display this layout whenever a user visits the page for this graph.</p> -<img width="70%" height="60%" align="middle" src="../../static/images/auto_3.png"></img> +<img width="80%" height="80%" align="middle" src="../../static/images/auto_3.png"></img> <br><br> <p>The user selects to view the layout titled "manual-top-to-bottom".</p> -<img width="70%" height="60%" align="middle" src="../../static/images/auto_4.png"></img> +<img width="80%" height="80%" align="middle" src="../../static/images/auto_4.png"></img> <br><br> </div> </div> diff --git a/graphs/util/db.py b/graphs/util/db.py index be267581..4a19cd47 100644 --- a/graphs/util/db.py +++ b/graphs/util/db.py @@ -1703,6 +1703,7 @@ def find_edge(uid, gid, edge_to_find, search_type): print "No matching edges" else: + # Find node id's that are being searched for (source and target nodes) head_nodes = find_node(uid, gid, head_node, 'full_search') tail_nodes = find_node(uid, gid, tail_node, 'full_search') @@ -1717,7 +1718,7 @@ def find_edge(uid, gid, edge_to_find, search_type): try: # Aggregate all matching edges (DO THIS TWO TIMES SO ORDER OF HEAD OR TAIL NODE DOESN'T MATTER... THIS IS TO RESOLVE UNDIRECTED EDGE SEARCHING) - matching_edges = db_session.query(models.Edge).filter(models.Edge.head_node_id == head_node).filter(models.Edge.tail_node_id == tail_node).filter(models.Edge.user_id == uid).filter(models.Edge.graph_id == gid).all() + matching_edges = db_session.query(models.Edge).filter(models.Edge.head_node_id == head_nodes[j]).filter(models.Edge.tail_node_id == tail_nodes[i]).filter(models.Edge.user_id == uid).filter(models.Edge.graph_id == gid).all() edge_list += matching_edges # # Aggregate all matching edges (DO THIS TWO TIMES SO ORDER OF HEAD OR TAIL NODE DOESN'T MATTER... THIS IS TO RESOLVE UNDIRECTED EDGE SEARCHING) @@ -1749,7 +1750,6 @@ def find_node(uid, gid, node_to_find, search_type): # Create database connection db_session = data_connection.new_session() - print uid, gid, node_to_find, search_type try: id_list = [] @@ -1772,16 +1772,24 @@ def find_node(uid, gid, node_to_find, search_type): else: # Get all matching labels - label = db_session.query(models.Node.node_id).filter(models.Node.label == node_to_find).filter(models.Node.user_id == uid).filter(models.Node.graph_id == gid).first() + labels = db_session.query(models.Node.node_id).filter(models.Node.label == node_to_find).filter(models.Node.user_id == uid).filter(models.Node.graph_id == gid).all() # Get all matching ids - node_id = db_session.query(models.Node.node_id).filter(models.Node.node_id == node_to_find).filter(models.Node.user_id == uid).filter(models.Node.graph_id == gid).first() + node_ids = db_session.query(models.Node.node_id).filter(models.Node.node_id == node_to_find).filter(models.Node.user_id == uid).filter(models.Node.graph_id == gid).all() + + # if label != None and label not in id_list: + # id_list.append(label[0]) - if label != None and label not in id_list: - id_list.append(label[0]) + # if node_id != None and node_id not in id_list: + # id_list.append(node_id[0]) + + for label in labels: + if label not in id_list: + id_list.append(label[0]) - if node_id != None and node_id not in id_list: - id_list.append(node_id[0]) + for node_id in node_ids: + if node_id not in id_list: + id_list.append(node_id[0]) db_session.close() return id_list