Friction field for fluid margin panning in a webpage
A cursor in a viewable portion of a webpage, or pan region, visually encounters a friction field when the cursor enters a margin of the viewable portion. As a user moves the cursor into the margin of the viewable portion, the movement of the displayed position of the cursor is limited as if the cursor is being restricted by a friction field in the margin. Also, as the cursor enters the margin of the viewable portion of the webpage, the webpage scrolls in the opposite direction of movement of the cursor. The amount of scroll of the webpage is proportional to a distance the cursor is away from an inner edge of the margin. When a user no longer attempts to move the cursor in the margin, the cursor fluidly drifts back toward a center of the viewable portion and so that scrolling of the webpage pauses.
1. A method to view a webpage, the method comprising:
determining a position of a cursor maneuvered by continually displacing the cursor according to a first displacement vector received from a physically actuated cursor positioning device;
calculating a friction value to be applied to the cursor equal to zero, corresponding to the position of the cursor when the cursor is in a viewable portion of the webpage in a graphical window on a display and outside a margin of the viewable portion of the webpage, the margin being an area adjacent boundaries of the graphical window
calculating a non-zero friction value to be applied to the cursor, corresponding to the position of the cursor when the cursor is in the margin of the viewable portion of the webpage, and increasing as the cursor moves further into the margin of the viewable portion of the webpage toward one or more of the boundaries of the graphical window;
calculating a scroll value that indicates an amount of scroll to provide the webpage, the scroll value increasing as the cursor moves further into the margin of the viewable portion of the webpage toward one or more of the boundaries of the graphical window;
calculating a direction of scroll that indicates a direction of scroll in a direction opposite the direction of the first displacement vector;
calculating a second displacement vector, the second displacement vector defining a displacement of the cursor in the direction of scroll, with an amount of displacement equal to the scroll value multiplied by the friction value;
calculating a summed displacement vector as a summation of the first displacement vector and the second displacement vector;
updating the position of the cursor by applying the summed displacement vector to a current position of the cursor;
displaying the webpage scrolled based on the scroll value and the direction of scroll; and
displaying the cursor at the updated cursor position.
2. The method of claim 1 , further comprising receiving a signal that indicates a requested position of the cursor in the viewable portion of the webpage.
3. The method of claim 2 , wherein the signal that indicates the requested position of the cursor in the viewable portion of the webpage corresponds to a position of a stick in a controller.
4. The method of claim 3 , wherein the cursor is positioned in the margin of the viewable portion of the webpage, and wherein the cursor is displaced away from one or more of the boundaries of the graphical window and out of the margin when the stick returns to a default position.
5. The method of claim 1 , wherein the method is performed by a browser having processor readable instructions.
6. The method of claim 5 , wherein the browser having processor readable instructions is executed by a processor in a console that provides at least a video game.
7. The method of claim 6 , wherein calculating the friction value and calculating the scroll value occur when a frame of the video game is updated by the console.
8. The method of claim 1 , wherein the viewable portion of the webpage is a viewport.
9. An apparatus comprising;
a user controlled cursor positioning device;
at least one processor readable memory;
a browser, stored in the one or more processor readable memory, having processor readable instructions to position a webpage in a graphical window on a display; and
at least one processor that executes the processor readable instructions of the browser to:
receive a first displacement vector from the user controlled cursor positioning device;
determine a position of the cursor maneuvered by continually displacing the cursor according to the first displacement vector;
calculate a friction value to be applied to the cursor equal to zero, corresponding to the position of the cursor when the cursor is in a viewable portion of the webpage in the graphical window, and outside a margin of the viewable portion of the webpage, the margin being an area adjacent boundaries of the graphical window;
calculate a non-zero friction value to be applied to the cursor, corresponding to the position of the cursor when the cursor is in the margin of the viewable portion of the web page, and increasing as the cursor moves further into the margin of the viewable portion of the webpage toward one or more of the boundaries of the graphical window;
calculate a scroll value that indicates an amount of scroll to provide the webpage, the scroll value increasing as the cursor moves further into the margin of the viewable portion of the webpage toward one or more of the boundaries of the graphical window;
calculate a direction of scroll that indicates a direction of scroll in a direction opposite the direction of the first displacement vector;
calculate a second displacement vector, the second displacement vector defining a displacement of the cursor in the direction of scroll, with an amount of displacement equal to the scroll value multiplied by the friction value;
calculate a summed displacement vector as a summation of the first displacement vector and the second displacement vector;
update the position of the cursor by applying the summed displacement vector to a current position of the cursor;
display the webpage scrolled based on the scroll value and the direction of scroll; and
display the cursor at the updated cursor position.
10. The apparatus of claim 9 , wherein the apparatus includes a console to provide a video game; and wherein the position of the cursor and the scroll value are updated in a frame of the video game.
11. The apparatus of claim 10 , wherein the user controlled cursor positioning device includes a stick that provides the first displacement vector when the stick is positioned a predetermined distance from a default position.
12. The apparatus of claim 11 , wherein calculating the non-zero friction value includes calculating a first non-zero friction value when the cursor is in one of a vertical margin of the viewable portion of the webpage and a horizontal margin of the viewable portion of the webpage.
13. The apparatus of claim 12 , wherein calculating the non-zero friction value includes calculating a second non-zero friction value when the cursor is in a diagonal margin portion of the viewable portion of the webpage.
14. The apparatus of claim 13 , wherein the first and second non-zero friction values are normalized over a first and second predetermined number of pixels.