Multi-touch gesture-based interface for network design and management

• US 9,189,144 B2
• Filed: 06/18/2012
• Issued: 11/17/2015
• Est. Priority Date: 06/18/2012
• Status: Active Grant

• Current Assignee: Cisco Technology, Inc. (Cisco Systems, Inc.)
• Original Assignee: Cisco Technology, Inc. (Cisco Systems, Inc.)
• Inventors: Maunder, Richard
• Primary Examiner(s): Eisen, Alexander
• Assistant Examiner(s): Patel, Sanjiv D
• Application Number:
  US13/526,090
• Publication Number:
  US 20130335339A1
• Time in Patent Office: 1,247 Days
• Field of Search: 345173-178, 715/769
• US Class Current: 1/1
• CPC Class Codes: G06F 2203/04808 Several contacts: gestures triggering a specific function, e.g. scrolling, zooming, right-click, when the user establishes several contacts with the surface simultaneously; e.g. using several fingers or a combination of fingers and pen
• CPC Class Codes: G06F 3/04817 using icons graphical or visual programming using iconic symbols G06F8/34
• CPC Class Codes: G06F 3/04842 Selection of displayed objects or displayed text elements G06F3/0482 takes precedence
• CPC Class Codes: G06F 3/0486 Drag-and-drop
• CPC Class Codes: G06F 3/0488 using a touch-screen or digitiser, e.g. input of commands through traced gestures

Abstract

Methods, computing devices, and computer-readable media are provided for interpreting gestures and triggering actions on a graph when the gestures are detected. The triggered actions may include the addition or deletion of nodes, connections between nodes, or connections between node ports; the expansion or collapse of a set of nodes; or the copying of nodes. The input may describe an action of selecting, dragging, holding, flicking, shaking, pinching, unpinching, or spinning a graphical object such as a node or a connection. Gesture interpretation logic determines whether the input matches a stored or known gesture. If the input matches a gesture, then the gesture interpretation logic may perform an action mapped to the gesture instead of or in addition to the normal action that would otherwise be caused by each individual input.

Claims

1. A method comprising:

generating a network topology graph comprising a first set of one or more graph nodes and a second set of one or more graph nodes, wherein the graph nodes represent network elements;

receiving, at a touch-sensitive display, touch input that selects and drags the first set on the network topology graph;

wherein the touch input drags the first set within a threshold distance of the second set or a particular connection to the second set and holds the first set within the threshold distance for a threshold amount of time;

in response to the touch input, adding or removing a graphical representation of a connection between the first set and the second set on the network topology graph;

wherein the first set remains selected for dragging by the touch input to enable another action;

maintaining the added or removed graphical representation of the connection between the first set and the second set on the network topology graph, while the touch input continues to drag the first set away from the second set to a third set or a distinct connection to the third set and holds the first set within the threshold distance for the threshold amount of time;

in response to the continued touch input, adding or removing a second graphical representation of a second connection between the first set and third set on the network topology graph while maintaining the added or removed graphical representation of the connection between the first set and the second set;

wherein the method is performed by one or more computing devices.

2. The method of claim 1, wherein the touch input drags the first set within the threshold distance of the second set and holds the first set within the threshold distance for the threshold amount of time, the method further comprising, in response to the touch input, adding the connection between the first set and the second set, wherein the graphical representation of the connection comprises a graphical indication that the connection was added.

3. The method of claim 2, wherein the first set comprises a first graph node and a second graph node;

wherein the touch input includes multi-touch input that holds the first graph node while the second graph node is selected by only tapping the second graph node.

4. The method of claim 2,

wherein the touch input dragging the first set within a particular threshold distance of the second set causes a first port of a first plurality of ports of the first set and a second port of a second plurality of ports of the second set to become visible;

wherein the touch input aligns the first port with the second port, and

wherein the added connection is between the first port and the second port.

5. The method of claim 4, wherein the touch input that aligns the first port with the second port comprises multi-touch input that spins the first set.

6. The method of claim 2, wherein the connection is added between a first port of a first plurality of ports of the first set and a second port of a second plurality of ports of the second set, further comprising:

selecting the second port based at least in part on a distance between the second port and the first set; and

selecting the first port based on a characteristic of the second port.

7. The method of claim 2, further comprising, in response to holding the first set within the threshold distance and for the threshold amount of time, providing another graphical indication as positive feedback that the connection was added other than the graphical representation of the connection.

8. The method of claim 1, wherein the touch input comprises a first move that drags the first set within the threshold distance of the second set and holds the first set within the threshold distance for the threshold amount of time, and wherein the touch input comprises a second move that drags the first set away from the second set, the method comprising, in response to the first move, adding the connection between the first set and the second set, and, in response to the second move, adding the graphical representation of the connection to the network topology graph, wherein the graphical representation of the connection spans from the first set to the second set on the network topology graph.

9. The method of claim 1, wherein the connection is a first new connection, wherein the touch input drags the first set over the particular connection to the second set comprising a previous connection between the second set and a third set of one or more graph nodes and holds the first set over the previous connection for the threshold amount of time, and, in response, inserting the first set between the second set and the third set on the network topology graph by replacing the previous connection with both the first new connection between the first set and the second set and a second new connection between the third set and the first set.

10. The method of claim 9, wherein the first set comprises a first graph node and a second graph node;

wherein the touch input includes multi-touch input that holds the first graph node while the second graph node is selected.

11. The method of claim 1, wherein the threshold amount of time comprises at least half a second.

13. The method of claim 11, wherein the set comprises a first graph node and a second graph node, and wherein the touch input selecting the set includes multi-touch input that holds the first graph node while the second graph node is selected.

12. A method comprising:

generating a network topology graph comprising a set of two or more graph nodes, wherein graph nodes in the set represent network elements;

receiving, at a touch-sensitive display, a first touch input selecting the set;

receiving a multi-touch input comprising a second touch input moving toward or away from a third touch input;

in response to the multi-touch input, expanding or collapsing the set on the network topology graph;

wherein collapsing the set comprises replacing separately selectable graphical representations of the two or more graph nodes with a single selectable graphical representation of the two or more graph nodes, and wherein expanding the set comprises replacing the single selectable graphical representation of the set with the separately selectable graphical representations of each of the two or more graph nodes;

wherein the network topology graph further comprises at least one node external to the set;

wherein expanding the set enables adding or removing a graphical representation of a connection between the at least one graph node external to the set and at least one of the separately selectable graphical representations of the two or more graph nodes;

wherein the method is performed by one or more computing devices.

14. A method comprising:

generating a network topology graph comprising a set of one or more graph nodes, wherein graph nodes in the set represent network elements;

receiving, at a touch-sensitive display, multi-touch input comprising a first touch input and a second touch input;

wherein the first touch input selects and drags the set while the second touch input flicks the set;

in response to the multi-touch input, copying the set on the network topology graph;

receiving at the touch-sensitive display, a third touch input that flicks the set, while the first touch input continues to drag the set;

in response to the first touch input in combination with the third touch input, copying the set on the network topology graph to a different location;

wherein the method is performed by one or more computing devices.

15. One or more non-transitory computer-readable storage media storing instructions, the instructions which, when executed by one or more processors, cause performance of:

generating a network topology graph comprising a first set of one or more graph nodes and a second set of one or more graph nodes, wherein the graph nodes represent network elements;

receiving, at a computing device having a touch-sensitive display, touch input that selects and drags the first set on the network topology graph;

wherein the touch input drags the first set within a threshold distance of the second set or a particular connection to the second set and holds the first set within the threshold distance for a non-instantaneous threshold amount of time;

in response to the touch input, adding or removing a graphical representation of a connection between the first set and the second set on the network topology graph

wherein the first set remains selected for dragging by the touch input to enable another action;

maintaining the added or removed graphical representation of the connection between the first set and the second set on the network topology graph, while the touch input continues to drag the first set away from the second set to a third set or a distinct connection to the third set and holds the first set within the threshold distance for the threshold amount of time;

in response to the continued touch input, adding or removing a second graphical representation of a second connection between the first set and third set on the network topology graph while maintaining the added or removed graphical representation of the connection between the first set and the second set.

16. The one or more non-transitory computer-readable storage media of claim 15, wherein the touch input drags the first set within the threshold distance of the second set and holds the first set within the threshold distance for the threshold amount of time, wherein the instructions, when executed, further cause, in response to the touch input, adding the connection between the first set and the second set, wherein the graphical representation of the connection comprises a graphical indication that the connection was added.

17. The one or more non-transitory computer-readable storage media of claim 16, wherein the first set comprises a first graph node and a second graph node;

wherein the touch input includes multi-touch input that holds the first graph node while the second graph node is selected by only tapping the second graph node.

18. The one or more non-transitory computer-readable storage media of claim 16,

wherein the touch input dragging the first set within a particular threshold distance of the second set causes a first port of a first plurality of ports of the first set and a second port of a second plurality of ports of the second set to become visible;

wherein the touch input aligns the first port, and

wherein the added connection is between the first port and the second port.

19. The one or more non-transitory computer-readable storage media of claim 18, wherein the touch input that aligns the first port with the second port comprises multi-touch input that spins the first set.

20. The one or more non-transitory computer-readable storage media of claim 16, wherein the connection is added between a first port of a first plurality of ports of the first set and a second port of a second plurality of ports of the second set, wherein the instructions, when executed, further cause:

selecting the second port based at least in part on a distance between the second port and the first set; and

selecting the first port based on a characteristic of the second port.

21. The one or more non-transitory computer-readable storage media of claim 15, wherein the touch input comprises a first move that drags the first set within the threshold distance of the second set and holds the first set within the threshold distance for the threshold amount of time, and wherein the touch input comprises a second move that drags the first set away from the second set, wherein the instructions, when executed, further cause, in response to the first move, adding the connection between the first set and the second set, and, in response to the second move, adding the graphical representation of the connection to the network topology graph, wherein the graphical representation of the connection spans from the first set to the second set on the network topology graph.

22. The one or more non-transitory computer-readable storage media of claim 15, wherein the connection is a first new connection, wherein the touch input drags the first set over the particular connection to the second set comprising a previous connection between the second set and a third set of one or more graph nodes and holds the first set over the previous connection for the threshold amount of time, wherein the instructions, when executed, further cause, in response, inserting the first set between the second set and the third set on the network topology graph by replacing the previous connection with both the first new connection between the first set and the second set and a second new connection between the third set and the first set.

23. The one or more non-transitory computer-readable storage media of claim 22, wherein the first set comprises a first graph node and a second graph node;

wherein the touch input includes multi-touch input that holds the first graph node while the second graph node is selected.

24. One or more non-transitory computer-readable storage media storing instructions, the instructions which, when executed by one or more processors, cause performance of:

generating a network topology graph comprising a set of two or more graph nodes, wherein graph nodes in the set represent network elements;

receiving, at a computing device having a touch-sensitive display, a first touch input selecting the set;

receiving a multi-touch input comprising a second touch input moving toward or away from a third touch input;

in response to the multi-touch input, expanding or collapsing the set on the network topology graph;

wherein collapsing the set comprises replacing separately selectable graphical representations of the two or more graph nodes with a single selectable graphical representation of the two or more graph nodes, and wherein expanding the set comprises replacing the single selectable graphical representation of the set with the separately selectable graphical representations of each of the two or more graph nodes;

wherein the network topology graph further comprises at least one node external to the set;

wherein expanding the set enables adding or removing a graphical representation of a connection between the at least one graph node external to the set and at least one of the separately selectable graphical representations of the two or more graph nodes.

25. The one or more non-transitory computer-readable storage media of claim 24, wherein the set comprises a first graph node and a second graph node, and wherein the touch input selecting the first set includes multi-touch input that holds the first graph node while the second graph node is selected.

26. One or more non-transitory computer-readable storage media storing instructions, the instructions which, when executed by one or more processors, cause performance of:

generating a network topology graph comprising a set of one or more graph nodes, wherein graph nodes in the set represent network elements;

receiving, at a computing device having a touch-sensitive display, multi-touch input comprising a first touch input and a second touch input;

wherein the first touch input selects and drags the set while the second touch input flicks the set;

in response to the multi-touch input, copying the set on the network topology graph;

receiving at the touch-sensitive display, a third touch input that flicks the set, while the first touch input continues to drag the set;

in response to the first touch input in combination with the third touch input, copying the set on the network topology graph to a different location.