WEB APPLICATION HOME BUTTON
Background
[0001] More recently, industry has begun to focus on the notion of integrating
web applications or websites with a user's computer desktop environment or
"desktop". There are, however, challenges associated with doing so. For example,
today it is difficult for websites to define the boundaries of their sites for the
purpose of desktop integration. Thus, end-users are left to define the boundaries
through client-side script that they develop themselves. This can be problematic
because an end-user may not necessarily know how a particular web site is
constructed. For example, the end user may not necessarily know all of the links,
relationships between web properties, or other nuances employed by a website to
provide functionality to the user. Accordingly, the end-user's script may not
appreciate these links or nuances and, hence, can lead to an undesirable or broken
user experience.
[0002] In addition, users today face what is known as a dual boot problem.
Specifically, users are forced to boot their personal computers, start their browsers,
and finally launch a particular web application that they wish to work within. This
problem is compounded by the fact that browsers can provide too many distractions
for users, such as those that appear in a browser's chrome, and do not allow the
users to simply concentrate on a particular task at hand associated with a web
application.
Summary
[0003] This Summary is provided to introduce a selection of concepts in a
simplified form that are further described below in the Detailed Description. This
Summary is not intended to identify key features or essential features of the
claimed subject matter, nor is it intended to be used to limit the scope of the
claimed subject matter.
[0004] Various embodiments provide a mechanism to allow end users to install
web applications and websites onto a client device, such as a client device desktop.
In accordance with one or more embodiments, client-side code can be utilized to
allow developers associated with a website to define boundaries associated with
user interaction, and have those boundaries enforced by a run-time engine. In at
least some embodiments, developers can provide, through JavaScript code, various
configurations for the creation of a start menu shortcut, navigation, and so-called
jumplist integration, as well as a number of other features.
Brief Description of the Drawings
[0005] The same numbers are used throughout the drawings to reference like
features.
[0006] Fig. 1 illustrates an operating environment in which various principles
described herein can be employed in accordance with one or more embodiments.
[0007] Fig. 2 illustrates a web application window in accordance with one or
more embodiments.
[0008] Fig. 3 illustrates a JavaScript API in accordance with one or more
embodiments.
[0009] Fig. 4 is a flow diagram that describes steps in an installation method in
accordance with one or more embodiments.
[0010] Fig. 5 is a flow diagram that describes steps in a web application
interaction method in accordance with one or more embodiments.
[0011] Fig. 6 illustrates a portion of a client desktop in accordance with one or
more embodiments.
[0012] Fig. 7 illustrates a JavaScript API in accordance with one or more
embodiments.
[0013] Fig. 8 illustrates dynamic interaction between a website and a custom
jumplist in accordance with one or more embodiments.
[0014] Fig. 9 illustrates a portion of a client desktop in accordance with one or
more embodiments.
[0015] Fig. 10 illustrates a portion of a client desktop in accordance with one or
more embodiments.
[0016] Fig. 11 is a flow diagram that describes steps in an installation method in
accordance with one or more embodiments.
[0017] Fig. 12 is a flow diagram that describes steps of a method in accordance
with one or more embodiments.
[0018] Fig. 13 is a flow diagram that describes steps in a method in accordance
with one or more embodiments.
[0019] Fig. 14 illustrates a client desktop in accordance with one or more
embodiments.
[0020] Fig. 15 diagrammatically illustrates a drag and a drop operation in
accordance with one or more embodiments.
[0021] Fig. 16 is a flow diagram that describes steps in an installation method in
accordance with one or more embodiments.
[0022] Fig. 17 illustrates a client desktop in accordance with one or more
embodiments.
[0023] Fig. 18 is a flow diagram that describes steps in an installation method in
accordance with one or more embodiments.
[0024] Fig. 19 illustrates a client desktop in accordance with one or more
embodiments.
[0025] Fig. 20 is a flow diagram that describes steps in a method in accordance
with one or more embodiments.
[0026] Fig. 1 illustrates a client desktop in accordance with one or more
embodiments.
[0027] Fig. 22 illustrates a relationship between a browser displaying a website,
a credentials store, an associated web application, and a web application credentials
store, in accordance with one or more embodiments.
[0028] Fig. 23 is a flow diagram that describes steps in a method in accordance
with one or more embodiments.
[0029] Fig. 24 is a flow diagram that describes steps in a method in accordance
with one or more embodiments.
[0030] Fig. 25 illustrates an example of multiple web application instances in
accordance with one or more embodiments.
[0031] Fig. 26 illustrates a client desktop in accordance with one or more
embodiments.
[0032] Fig. 27 is a flow diagram that describes steps in a method in accordance
with one or more embodiments.
[0033] Fig. 28 is a flow diagram that describes steps in a method in accordance
with one or more embodiments.
[0034] Fig. 29 illustrates a client desktop in accordance with one or more
embodiments.
[0035] Fig. 30 illustrates a client desktop in accordance with one or more
embodiments.
[0036] Fig. 31 illustrates a client desktop in accordance with one or more
embodiments.
[0037] Fig. 32 is a flow diagram that describes steps in a method in accordance
with one or more embodiments.
[0038] Fig. 33 is a flow diagram that describes steps in a method in accordance
with one or more embodiments.
[0039] Fig. 34 is a flow diagram that describes steps in a method in accordance
with one or more embodiments.
[0040] Fig. 35 illustrates a relationship between a web application and a browser
in accordance with one or more embodiments.
[0041] Fig. 36 is a flow diagram that describes steps in a method in accordance
with one or more embodiments.
[0042] Fig. 37 is a flow diagram that describes steps in a method in accordance
with one or more embodiments.
[0043] Fig. 38 illustrates an example of a transient web application in
accordance with one or more embodiments.
[0044] Fig. 39 illustrates a site mode browser in accordance with one or more
embodiments.
[0045] Fig. 40 is a flow diagram that describes steps in a method in accordance
with one or more embodiments.
[0046] Fig. 4 1 illustrates an example system that can be utilized to implement
one or more embodiments.
Detailed Description
Overview
[0047] Various embodiments provide a mechanism to allow end users to install
web applications and websites onto a client device, such as a client device desktop.
In accordance with one or more embodiments, client-side code can be utilized to
allow developers associated with a website to define boundaries associated with
user interaction, and have those boundaries enforced by a run-time engine. In at
least some embodiments, developers can provide, through JavaScript code, various
configurations for the creation of a start menu shortcut, navigation, and so-called
jumplist integration, as well as other features.
[0048] Boundaries can be thought of as a developer-defined experience that
relates to how functionality is exposed to an end-user. Boundaries are associated
with website domains, such as top-level domains and sub-domains that might be
associated with separate applications, or a subset of websites that are hosted on a
domain. Hence, the boundaries can be defined by a set of domains, sub-domains,
folders, sub-sites, protocols, hosts, paths, and the like, that are utilized to make a
particular web application work.
[0049] In one or more embodiments, websites can opt into the functionality
described above and below. In this case, developers can provide code which, in
some instances is expressed in JavaScript, which defines the boundaries of the
user's experience with their website. Alternately or additionally, websites that do
not opt into the functionality described above and below can have a default
experience provided for them.
[0050] In the discussion that follows, a section entitled "Operating
Environment" is provided and describes one environment in which one or more
embodiments can be employed. Following this, a section entitled "Integration
Infrastructure" describes infrastructure that enables web applications to be
integrated onto a client device in accordance with one or more embodiments. Next,
a section entitled "Jumplist Integration" describes how so-called jumplists can be
integrated in accordance with one or more embodiments. Next, a section entitled
"Taskbar Pinning" describes how web applications can be pinned to a taskbar in
accordance with one or more embodiments. Following this, a section entitled
"Associating Credentials and Login Sessions" describes how credentials and login
sessions can be associated in accordance with one or more embodiments. Next, a
section entitled "Creating and Launching a Web Application with Associated
Credentials" describes how a web application can be created and launched in
accordance with one or more embodiments. Following this, a section entitled
"Web Application Task Sessions" describes the notion of task sessions in
accordance with one or more embodiments. Next, a section entitled "Transitioning
Between a Web Application and a Browser" describes how transitions can occur
between a web application and a browser in accordance with one or more
embodiments. Following this, a section entitled "Creating a Transient Web
Application from a Browser" describes how a transient web application can be
created from a browser in accordance with one or more embodiments. Next, a
section entitled "Converting a Transient Web Application into an Installed Web
Application" describes how a transient web application can be converted into an
installed web application in accordance with one or more embodiments. Following
this, a section entitled "Web Application Super Home Button" describes a home
button associated with a web application in accordance with one or more
embodiments. Last, a section entitled "Example System" describes an example
system that can be utilized to implement one or more embodiments.
[0051] Consider now an example operating environment in which one or more
embodiments can be implemented.
Operating Environment
[0052] Fig. 1 illustrates an operating environment in accordance with one or
more embodiments, generally at 100. Environment 100 includes a computing
device 102 having one or more processors 104, one or more computer-readable
storage media 106 and one or more applications 108 that reside on the computerreadable
storage media and which are executable by the processor(s). The
computer-readable storage media can include, by way of example and not
limitation, all forms of volatile and non-volatile memory and/or storage media that
are typically associated with a computing device. Such media can include ROM,
RAM, flash memory, hard disk, removable media and the like. One specific
example of a computing device is shown and described below in Fig. 41.
[0053] In addition, computing device 102 includes a software application in the
form of a web browser 110. Any suitable web browser can be used examples of
which are available from the assignee of this document and others. In addition,
computer-readable storage media 106 can include a web application mode browser
111 that operates as described above and below. The web application mode
browser 111 serves as a runtime engine that receives and makes API calls from and
to websites respectively, oversees web application installation processes, enforces
boundaries, and enables functionality as described above and below. In operation,
the web application mode browser is a pared down version of a full browser, with
many of the normal browser functionalities turned off. In some instances, the web
application mode browser can be thought of as a "chrome-less" browser that does
not include many of the usual browser controls. Some commands may, however,
be exposed through a miniature control bar. The web application mode browser
thus removes many of the distractions for a user and permits a directed, websitedefined
user experience in which the websites can control how the user interacts
with their web application.
[0054] In operation, the web application mode browser can be considered to
reside logically between a website and the client device's operating system. Thus,
the web application mode browser receives calls from websites and can,
responsively, make operating system calls to affect the functionality described
herein. Likewise, the web application mode browser can receive calls from the
operating system, that will affect the functionality of the website. For example, the
operating system exposes APIs that enable interaction with a desktop's task bar.
The web application mode browser can receive calls from a website and,
responsively, can make API calls that enable task bar functionality as will become
apparent below.
[0055] Web application mode browser 111 can be implemented as a standalone
component. Alternately or additionally, the web application mode browser 111 can
be implemented as part of applications 108 and/or browser 110.
[0056] In addition, environment 100 includes a network 112, such as the
Internet, and one or more web sites 114 from and to which content can be received
and sent. Such content can include content, such as web applications, that is
integrated onto the client desktop or otherwise useable through the client device, as
described above and below.
[0057] Computing device 102 can be embodied as any suitable computing
device such as, by way of example and not limitation, a desktop computer, a
portable computer, a handheld computer such as a personal digital assistant (PDA),
cell phone, and the like.
[0058] Having described an example operating environment, consider now a
discussion of infrastructure that allows web applications to be integrated onto a
client device.
Integration Infrastructure
[0059] In accordance with one or more embodiments, websites can opt into
domain navigation that is provided as part of a more general "site mode"
experience. Domain navigation enables websites to customize the behavior of their
existing websites when users access links inside and outside of specific domains.
When accessing links inside developer-specified boundaries, content can be
rendered and consumed within a web application window that is rendered by the
web application mode browser as part of an associated web application. When
accessing links outside of the developer-specified boundaries, associated content
can be rendered and consumed inside of a default browser that is outside of the web
application mode browser. This allows a website to define what domains should be
treated as an extension of the website, and which should not.
[0060] In one or more embodiments, navigation domains can be defined by web
developers and identify links whose content is displayed by the web application
mode browser as part of the integrated website, or outside of the web application
mode browser in the default browser. In addition, default domain parameters can
be defined that are used to associate a collection of web application pages together.
[0061] As an example, consider the following in-line domain page definition:
*contoso.crm.dynamics.com\*;*.microsoft.com\*;
[0062] This domain page definition will allow URIs of the form just below to be
displayed in the same desktop web application window:
sales contoso.crm.dynamics.com\*
hr.contoso.crm.dynamics\*
*.microsoft.com\crm[0063] Likewise, this domain page definition will force other URIs to be
displayed outside of the desktop web application window, even if the link
references are inside a page within the desktop web application window:
www.bing.com
home.live.com
[0064] In the above domain page definition, wild cards are utilized inside the
web application installation API. This API is typically called by the website when
the user selects a website integration link provided by the website. This API can
populate a web application file or ".webapp" file with information and content in
the desktop, task bar, or start menu, or any other suitable location that will be used
to launch a website shortcut. It is to be appreciated and understood that any
suitable file extension can be used to designate a web application file. The
navigation domains and other boundary information are stored within the .webapp
file.
[0065] When the .webapp file is launched, navigation domains therewithin are
enforced by the web application mode browser 111. Links selected by the user or
accessed by the website continue to execute inside the web application window as
long as they match the wildcard domains. However, when a website is detected
that is outside of the defined navigation domains, a default browser is instantiated
or otherwise used, and content associated with the website is displayed outside of
the web application window and inside the default browser.
[0066] As an example, consider Fig. 2, which illustrates a web application
window 200 having a navigation domain set ofa.com (202), b.com (204) and
d.com (206), which implies that all pages from these domains are displayed inside
the web application window 200. When pages from c.com (208) or e.com (210)
are accessed from within the web application window 200, they are displayed in the
default browser window and not in the web application window 200.
[0067] Fig. 3 illustrates a JavaScript API in accordance with one or more
embodiments at 300. The illustrated JavaScript API enables a website to integrate
a web application with a client desktop. The API defines the navigation domains
that will be enforced by the web application or run-time engine. In this example,
the navigation domains are described using wild-card expressions as illustrated
above. This API enables population or updating of a .webapp application file 302
with content and information on the client device and stores the navigation domains
and other information in it. These navigation domains are enforced when the web
application is launched.
[0068] In the illustrated and described embodiment, .webapp application file 302
includes information that the website has defined for its site mode configuration.
This information includes a start URL which is the initial page that is displayed by
the web application mode browser, all of the navigation domains that the website
has specified, a web application title, and a so-called favicon. Other information
can be included, as will be described below.
[0069] Now, once the web application is launched on client side, the web
application mode browser reads the web application file and enforces the
boundaries defined therein. As noted above, because the web application
experience is defined by developers who are knowledgeable of a particular website
and its nuances, a complete and integrated user experience can be provided.
[0070] Fig. 4 is a flow diagram that describes steps in an installation method in
accordance with one or more embodiments. The method can be performed by any
suitable hardware, software, firmware, or combination thereof. In at least some
embodiments, aspects of the method are performed by software executing on a
client device.
[0071] Step 400 selects a website integration feature. The step can be performed
in any suitable way. Typically, the step is performed when a user selects an
instrumentality or otherwise takes an action to initiate a web application installation
process. For example, a user might select a link that enables him to integrate the
web application. Specific examples of how this can be done are provided below.
[0072] Step 402 creates, on the client device, a web application file - here
designated ".webapp" file. This file, as initially created, can constitute an artifact
or shell that can subsequently be populated with content and information received
from or on behalf of the website. Step 404 populates the web application file with
web application content. This step can be performed in any suitable way. For
example, this step can be performed through the use of a JavaScript API examples
of which are provided above and below. Alternately or additionally, this step can
be performed through the use of markup, such as HTML.
[0073] Having created the web application file on the client and populated it
with content, the web application can now be launched and interacted with.
[0074] Fig. 5 is a flow diagram that describes steps in a web application
interaction method in accordance with one or more embodiments. The method can
be performed by any suitable hardware, software, firmware, or combination
thereof. In at least some embodiments, aspects of the method are performed by
software executing on a client, and software executing at a server supporting a
website. Accordingly, one column of the diagram is designated "Client" to
designate those steps performed by or at the client by, for example, a web
application mode browser, and one column is designated "Website" to designate
those steps performed by or on behalf of the website.
[0075] Step 500 receives a user selection of a site mode. This step can be
performed in any suitable way. For example, a shortcut installed on the client
desktop can be utilized to receive a site mode selection. Responsive to receiving
the site mode selection, step 502 requests a start URL. The start URL can be found
in the web application file described above.
[0076] Step 504 receives the start URL request. Step 506 returns associated web
resources, including content associated with the start URL, to the client.
[0077] Step 508 receives the associated web resources and step 510 renders the
web resources in a web application window. As described above, the web
application window is rendered by the web application mode browser. Step 512
receives a user interaction with respect to the resources rendered in the web
application window. The user interaction can include any suitable type of user
interaction. For example, the user interaction may include a navigation activity that
originates from within the web application window. Step 514 ascertains whether
the user interaction is within the boundaries defined by the web application file. If
the user interaction is within the boundaries defined by the web application file,
step 516 renders content associated with the user interaction in the web application
window. If, on the other hand, the user interaction is not within the boundaries
defined by the web application file, step 518 renders content associated with the
user interaction in a default web browser.
[0078] In this manner, boundaries defined by website developers for particular
websites can be enforced to ensure that the user experience is preserved as desired
by the developers. For example, the website defined Start URL is the home page,
and subsequent access to the home page in web application mode navigates to the
Start URL, rather than the user's originally defined browser home page. This
allows for quick access to the web application specific page, instead of some
unrelated home page. This alleviates end-users from having to define their own
site-specific experiences which may or may not work accurately. As such, a
complete, integrated, and intelligently-managed experience can be provided for
end-users.
[0079] Having described an example installation and interaction experience,
consider now the notion of jumplist integration.
Jumplist Integration
[0080] In one or more embodiments, developers can enable websites to define a
series of so-called jumplist tasks during desktop integration that can be used to
interact with the websites. In addition, in at least some embodiments websites can
create and update custom jumplists.
[0081] A jumplist can be thought of as a list that constitutes a set of relevant
tasks or content that is presented to the user. Through jumplists, websites can
promote a distillation of relevant and useful information to users. Jumplists are
related to the capabilities or functionalities of a particular web application. For
example, a jumplist for an e-mail application might include tasks that give the user
the ability to open a contact, create a new e-mail message, and the like. In some
instances, jumplists can include a list of relevant and most-often used commands
and data.
[0082] In one or more embodiments, jumplist functionality can be implemented
to include both static elements and dynamic elements.
[0083] Developers can define the static elements during the web application
installation process that populates the web application file, as described above.
Settings associated with the static elements can be stored inside the web application
file. In one or more embodiments, the settings can include a list name and
associated tasks. In at least some instances, the static elements can constitute
elements that represent commonly-used functionality.
[0084] Settings associated with the dynamic elements can be driven by website
pages that run inside the web application window. These settings include settings
that dynamically expose discernible indicia for a user. For example, one setting
can add an item to a custom jumplist, and one setting can display an overlay icon,
examples of which are provided below. In at least some embodiments, dynamic
settings can be cleared each time the web application is launched and can be
configured by web application script code.
[0085] As an example of a custom jumplist in accordance with one embodiment,
consider Fig. 6, which illustrates a portion of a client desktop generally at 600. A
custom jumplist 602 is exposed in accordance with one or more embodiments.
Here, static elements are illustrated at 604 and dynamic elements are illustrated at
606. In this example, the static elements list name is "Tasks" and the tasks or static
elements include "New E-mail Message", "New Appointment", "New Contact",
and "New Task". The dynamic elements list name is "Today" and the tasks or
dynamic elements include, in this example, reminders that are generated from a
user's calendar. The dynamic elements are dynamically populated by an associated
website. So, in this example, the dynamic elements or content are associated with
providing notifications to the user, typically independent of a user's action.
[0086] As noted above, jumplists can be defined during the desktop integration
process. The tasks and the jumplist definition can be stored inside the web
application file. As an example, consider Fig. 7 which illustrates a JavaScript API
in accordance with one or more embodiments at 700. The illustrated JavaScript
API enables a website to integrate with a client desktop and to define a jumplist.
This JavaScript API can be the same as or similar to the one described with respect
to Fig. 3, except for the presence of "custom task" and "customJumpList." For
brevity, some of the Fig. 3 content has been omitted. In at least some
embodiments, initial creation of a static list of jumplist tasks can be defined by
markup, e.g. using HTML tags, that are defined inside an HTML document.
[0087] For example, consider the example just below that uses meta tags to
describe the static list functionality:

[0088] When a task is executed, in one or more embodiments, there are a couple
options. For example, the URL associated with the task can be opened inside the
same web application/browser window that contains the currently viewed webpage.
Alternately or additionally, a new page can be launched. Alternately or
additionally, a new pop-up window can be displayed.
[0089] After these parameters are defined and read by the system, they can be
used when the user installs the web site on their desktop, as by adding it to the Start
Menu or pinning it to the task bar as described below. At the same time, in at least
some embodiments, there is a set of dynamic values that can be manipulated by
website client code on the jumplist.
[0090] "Custom task" is utilized by the website to define static tasks as
described above. In this example, the static task is a new message static task. This
API creates a .webapp application file 702 on the desktop and stores the navigation
domains (as in the Fig. 3 example) and other information, such as information
associated with jumplists.
[0091] In the illustrated and described embodiment, .webapp application file 702
includes information that the website has defined for its site mode configuration.
This information includes a start URL, all of the navigation domains that the
website has specified (not specifically illustrated), a web application title, and a socalled
favicon. Other information includes the custom task associated with a new
message mentioned above, and a "custom list". In this example, the custom list
element is a dynamic element that can be dynamically populated by the website
when the web application is running on the client. Here, the "friends" designation
comprises a header that is associated with dynamic content. So, in this instance,
the dynamic content is associated with providing notifications to the user when
their friends are online. Here, the custom list is a separate API that does not reside
in the web application. The custom task, however, resides in the web application.
[0092] In operation, items associated with the static elements can be pre-fetched
and cached for when the web application is running. Items associated with the
dynamic elements, on the other hand, can be provided by the website on-the-fly
when the web application is running. As an implementation example of how items
associated with the dynamic elements can be provided to the web application onthe-
fly, consider Fig. 8.
[0093] Fig. 8 illustrates how a website is able to dynamically interact with the
custom jumplist to allow the user to know that a message has arrived. In this
example, JavaScript 800 illustrates how a website can send updates to a page that is
hosted in the web application mode browser. Client-side code that is executed in
the browser is responsible for receiving updates, updating the content on screen,
and sending a request to the jumplist to update its list. In this example, the website
is able to push information to the jumplist to provide a real time experience. Here,
when a new message is received by the website, e.g. New MessageO and New
Message 1, a JavaScript call can be made from the web application to update
jumplist 802. In at least some embodiments, a notification can appear in task bar
804 to inform the user that relevant information has been received. Notification
can appear in any suitable location in the task bar and can comprise any suitable
type of notification. For example, the notification can appear in or around icon 806
that is associated with the web application. Alternately or additionally, the
notification can flash so as to catch the user's eye.
[0094] As an example, consider Fig. 9. There, a portion of a client desktop is
illustrated generally at 900. A task bar 901 includes an icon 902 associated with a
current web application. Notice here, that an overlay icon 904 has been rendered
within icon 902. In this example, a user has received a new message, and the
website has called into the web application, as described above, to cause overly
icon 904 to be rendered within icon 902. This provides notification to the user that
a new message has arrived. Responsive to seeing the overly icon 904, the user can
access jumplist 905 to expose elements 908 which indicates an appointment that is
currently happening or about to happen. Notice also that elements 906 are exposed
as well. JavaScript excerpt 910 illustrates one example of code that can be used to
update the overlay icon.
[0095] Dynamic interaction between the website and a web application can
occur in various other ways. For example, in at least some embodiments a preview
window can be pushed from the website to the jumplist responsive to a user's
action with respect to the web site. In the illustrated and described embodiment,
the preview window is a miniature view provided by the web site. The preview
window can be provided responsive to any suitable type of user action. For
example, in at least some embodiments, a preview window can be pushed from the
website to the jumplist responsive to a mouse hover over a task bar icon associated
with the web site. Alternately or additionally, a preview window can be provided
by placing a cursor over the web application's task bar icon and left clicking.
[0096] As an example, consider Fig. 10. There, a portion of a client desktop is
illustrated generally at 1000. A task bar 1001 includes an icon 1002 associated
with a current web application. Notice here, that the user has placed their cursor
over icon 1002. Responsive ly, a preview window 1004 has been rendered. In
operation, responsive to the user's action of placing their cursor over the icon, an
event is transmitted to the web page. Responsive to receiving the event, the web
page can then dynamically provide the preview, or cause a cached preview window
to be rendered.
[0097] In at least some embodiments, the preview window can also be used by
the website to define toolbar buttons and associated behaviors. For example, in the
illustrated and described embodiment, the web application comprises a media
player application and three toolbar buttons appear in a user interface
instrumentality 1006 that is overlaid over preview window 1004. The buttons
include a pause button, a stop button, and a play button. In at least some
embodiments, the toolbar buttons can be implemented using client-side code that
avoids having to interact with a remote server. For example, individual buttons can
be registered for a particular web page. Each button is configured and assigned an
ID. One "listener" is registered for all button events. When a button is pressed, an
event is generated and communicated back to the browser which then propagates
the event to the registered event listener. The event contains the button that was
pressed. This enables disambiguation between buttons.
Implementation Example
[0098] In an implementation example, web developers can use the following
JavaScript functions to update a custom list in the jumplist, and to update the task
bar overlay icon:
List Creation Behavior
[0099] This defines a list name that is the title of the custom list. This value will
be displayed as a list header. Optionally, an item list containing the name of the
item, the URI value for that item, and an image associated with that item can be
provided to populate the list initially. This functionality can be supported when the
browser is started in the web application mode.
List Update Behavior
[00100] A list item value is provided to update a specific list item. The list item
value includes a name for the item, a URI value for that item, and an image
associated with the item. This functionality can be supported when the browser is
started in the web application mode.
Set Overlay Icon
[00101] A URI value is specified that points to the icon that will be used as an
overlay for the existing task bar icon. This functionality can be supported when the
browser is started in the web application mode.
Set Preview Image
[00102] A URI that points to an image that should be used as the pictorial
representation for the taskbar preview image (or thumbbar preview). The preview is
displayed when the user clicks with the left mouse button on the taskbar icon.
Clear Overlay Icon
[00103] This removes existing overly icons on the task bar icon. This
functionality can be supported when the browser is started in the web application
mode.
[00104] Web developers can use the following JavaScript functions to define and
modify a set of tool bar buttons that are displayed in the task bar preview window
of a specific website.
Toolbar Button Installation
[00105] A list of button IDs are specified with a tool tip and image URL. The
event is passed to the website for processing when the user selects a tool bar button.
The website can then disambiguate between button events. This call is performed
at least once when the site mode window is opened in order for the buttons to be
displayed. This functionality is supported when the browser is started in the web
application mode.
Update Image
[00106] This identifies the state and visibility of the button ID that is specified.
The states can be enabled or disabled. In at least some embodiments, by default,
the buttons are enabled. The view can be either show or hide. By default, defined
buttons are visible. This functionality is supported when the browser is started in
web application mode.
[00107] Fig. 11 is a flow diagram that describes steps in an installation method in
accordance with one or more embodiments. The method can be performed by any
suitable hardware, software, firmware, or combination thereof. In at least some
embodiments, aspects of the method are performed by software executing on a
client device.
[00108] Step 1100 selects a website integration feature. The step can be
performed in any suitable way. Typically, the step is performed when a user selects
an instrumentality or otherwise takes an action to initiate a web application
installation process. For example, a user might select a link that enables him to
integrate the web application. Specific examples of how this can be done are
provided below.
[00109] Step 1102 creates, on the client device, a web application file - here
designated ".webapp" file. This file, as initially created, can constitute an artifact
or shell that can subsequently be populated with content and information received
from or on behalf of the website. Step 1104 populates the web application file with
web application content including, in this example, a jumplist. This step can be
performed in any suitable way. For example, this step can be performed through
the use of a JavaScript API an example of which is described above. Alternately or
additionally, aspects of this step can be performed through the use of markup, such
as HTML.
[00110] Having created and populated the web application file on the client, the
web application can now be launched at any suitable time.
[00111] Fig. 12 is a flow diagram that describes steps of a method in accordance
with one or more embodiments. The steps can be executed in connection with any
suitable hardware, software, firmware, or combination thereof. In at least some
embodiments, the method can be performed by software executing on a client in
association with software executing on a server.
[00112] Step 1200 receives a user action associated with a jumplist. Any suitable
user action can be received, examples of which are provided above. For example,
in at least some embodiments, the user action can be received with respect to a
specifically displayed jumplist or a jumplist that is not displayed. Alternately or
additionally, the user action can be received with respect to a displayed icon that is
associated with a web application. The icon can be displayed, for example, in a
desktop task bar or any other suitable location. Examples of such actions are
provided above.
[00113] Step 1202 presents content associated with the user action. For example,
content presented may comprise the jumplist itself. The jumplist can be presented
responsive to any suitable type of user action, examples of which are provided
above. The content presented may also comprise content other than the jumplist
itself. For example, a custom preview window can be presented responsive to a
user action such as, for example, left clicking on a task bar icon. For example, a
user might select to create or compose a new email message.
[00114] Fig. 13 is a flow diagram that describes steps in a method in accordance
with one or more embodiments. The method can be performed by any suitable
hardware, software, firmware, or combination thereof. In at least some
embodiments, aspects of the method are performed by software executing on a
client, and software executing at a server supporting a website. Accordingly, one
column of the diagram is designated "Client" to designate those steps performed by
or at the client, and one column is designated "Website" to designate those steps
performed by or on behalf of the website.
[00115] Step 1300 receives information associated with a dynamic jumplist item.
Any suitable jumplist item can serve as the basis upon which information is
received, examples of which are provided above. Step 1302 generates a
notification and step 1304 transmits the notification to a client device executing a
web application.
[00116] Step 1306 receives the notification and step 1308 provides a discernible
notification for the user. Any suitable type of discernible notification can be
provided. For example, in at least some embodiments the discernible notification
can be a visually-discernible notification such as an overlay icon or a flashing web
application icon. Alternately or additionally, the discernible notification can
comprise an audibly-discernible notification such as a bell or buzzer.
[001 17] Having considered various embodiments associated with jumplist
integration, consider now a discussion of how websites can become "pinned" to a
desktop feature, such as a task bar, in accordance with one or more embodiments.
Taskbar Pinning
[00118] There are various ways in which a web application can become
integrated with a client desktop or task bar. In at least some embodiments, a web
application can be integrated with the desktop through a drag and drop operation.
Alternately or additionally, web applications can be integrated via a web browser's
menu selections. Alternately or additionally, a web application can be integrated
by an associated website itself. Each of these embodiments is discussed under its
own heading below.
Integration through Drag and Drop Operations
[00119] In one or more embodiments, a web application can be integrated with
the desktop or task bar through a drag and drop operation. As an example, consider
Fig. 14. There, a client desktop is shown generally at 1400. A web browser
window 1402 includes an address bar 1404 with a web site URL displayed therein.
In association with the URL, an icon, termed a "favicon" 1406, is shown. In
addition, desktop 1400 includes a task bar 1408.
[00120] Fig. 15 diagrammatically illustrates a drag and a drop operation in
accordance with one or more embodiments. In this example, a cursor has been
placed over favicon 1406. By left clicking on the favicon and dragging it along to
task bar 1408, the associated web application - in this case a message board
application - can be pinned to the desktop's task bar 1408. The drag and drop
operation starts the integration process of integrating the web application as
described above, thus pinning it to the task bar.
[00121] In one or more implementations, if the webpage associated with the web
application has a tab opened in the browser, after the favicon is dropped on the task
bar, the associated tab can disappear from the browser's window. Alternately or
additionally, the tab might not be removed but instead the content of the tab might
be replaced with a "New Tab" page. In instances in which a single tab is open in a
browser window, the browser window will disappear after the favicon is pinned to
the task bar. At this point, the tab that contained in the original site can be removed
before the browser closes but after the web application is pinned. In addition, in at
least some embodiments, when the drag operation enters the task bar, a tool tip in
the form of "Pin to Taskbar" can be presented to inform the user of the pinning
functionality.
[00122] Further, the state of the website or web application that was pinned to the
task bar can be migrated to a newly-displayed window when the web application is
instantiated for the first time. This will allow the user to not have to re-enter
credentials to the site in order to be able to use the application.
[00123] Having pinned a website or web application to the task bar and
completed the installation process as described above, the web application can now
be launched from the taskbar by simply clicking on the associated favicon.
[00124] Fig. 16 is a flow diagram that describes steps in an installation method in
accordance with one or more embodiments. The method can be performed by any
suitable hardware, software, firmware, or combination thereof. In at least some
embodiments, aspects of the method are performed by software executing on a
client.
[00125] Step 1600 receives an indication of a drag and drop operation associated
with web application installation. The step can be performed in any suitable way.
In the embodiment described just above, the step is performed when a user drags
and drops an icon such as a favicon, associated with a website, to indicate to the
website a desire to integrate an associated web application with their desktop. For
example, a user might drag and drop the favicon to the task bar, quick launch area
or some other location on the desktop, such as the desktop canvass. Step 1602
creates a web application file responsive to the drag and drop operation. In the
illustrated and described embodiment, the web application file that is initially
created is an artifact or shell that does not yet contain information from the
associated web site such as jumplist tasks, start URLs, favicons or other properties
such as static jumplist tasks, an alternate start URL, alternate favicon and the like.
These can be added later through new markup and/or JavaScript APIs as described
above. It is to be appreciated and understood that techniques other than those that
employ a JavaScript API can be utilized without departing from the spirit and scope
of the claimed subject matter.
Integration through Browser Menu Selections
[00126] In one or more embodiments, web applications can be integrated via a
web browser's menu selections. As an example, consider Fig. 17. There, a client
desktop is shown generally at 1700. A web browser window 1702 includes an
address bar 1704 with a URL displayed. In addition, desktop 1700 includes a task
bar 1706. A browser menu item 1708 in the form of a page menu is shown. By
dropping down the page menu to expose menu selections 1710, a menu item or
selection "Add to Start Menu" is displayed. By selecting this option, a website or
web application can be added to the desktop's start menu and the installation
process can be initiated as described above. Alternately or additionally, an "Add to
Task Bar" menu item or selection can be displayed to enable initiation of the
installation process.
[00127] Fig. 18 is a flow diagram that describes steps in an installation method in
accordance with one or more embodiments. The method can be performed by any
suitable hardware, software, firmware, or combination thereof. In at least some
embodiments, aspects of the method are performed by software executing on a
client.
[00128] Step 1800 receives a browser menu selection. The step can be performed
in any suitable way. In the embodiment described just above, this step is performed
when a user navigates to a particular website, drops down a browser menu to
expose menu selections, and then takes an action by selecting a menu item
associated with initiating installation of a web application associated with the
website.
[00129] Step 1802 creates a web application file responsive to receiving the
browser menu selection. In the illustrated and described embodiment, the web
application file that is initially created is an artifact or shell that does not yet
contain information from the associated web site such as jumplist tasks, start URLs,
favicons and the like. These can be added later through new markup and/or
JavaScript APIs as described above. It is to be appreciated and understood that
techniques other than those that employ a JavaScript API can be utilized without
departing from the spirit and scope of the claimed subject matter.
Integration through Associated Website
[00130] In one or more embodiments, integration of a web application with a
desktop can occur from a webpage. In these embodiments, a particular website can
opt into integration activities by using code, such as JavaScript, to integrate the web
application into the desktop. This allows the website to be in control of integration
initiation instrumentalities.
[00131] As an example, consider Fig. 19. There, a client desktop is shown
generally at 1900. A web browser window 1902 includes an address bar 1904 with
a URL displayed therein. In addition, desktop 1900 includes a task bar 1906.
Further, a webpage displayed within browser window 1902 includes a link 1908
entitled "Add to Desktop". By clicking on this link, a user can initiate a web
application installation process as described above.
[00132] In at least some embodiments, after link selection takes place, a modal
confirmation dialog can be presented that explains the user action that the user is
taking and where to access their newly-created shortcut. This confirmation dialog
can present, to the user, the source URL of the page that is being presented. The
URL that is displayed can contain the full path of the website. This can allow the
user to verify that the website they wish to install is being served from the correct
site. This can mitigate situations associated with malicious subdirectories.
[00133] In various implementations, the URL of the website that is to be
integrated with the desktop is checked to confirm that it is on the same domain as
the webpage that contains it. If not, an error can be displayed and the operation can
fail. After the user confirms operation, the dialog can be removed and the web
application window can be displayed with the correct URL.
[00134] Fig. 20 is a flow diagram that describes steps in an installation method in
accordance with one or more embodiments. The method can be performed by any
suitable hardware, software, firmware, or combination thereof. In at least some
embodiments, aspects of the method are performed by software executing on a
client.
[00135] Step 2000 displays a webpage with an integration link. The step can be
performed in any suitable way, an example of which is provided above. Step 2002
receives a selection of the integration link. Step 2004 creates a web application file
responsive to receiving the link selection. In the illustrated and described
embodiment, the web application file that is initially created is an artifact or shell
that does not yet contain information from the associated web site such as jumplist
tasks, start URLs, favicons and the like. These can be added later through new
markup and/or JavaScript APIs as described above. It is to be appreciated and
understood that techniques other than those that employ a JavaScript API can be
utilized without departing from the spirit and scope of the claimed subject matter.
[00136] In at least some embodiments, a visual representation of multiple
windows or tabs associated with a web application can be provided for the user. As
an example, consider Fig. 21. There, a desktop 2100 includes a task bar 2102
having a web application icon pinned thereon. A cursor has been used to launch
the web application by clicking on the icon. Assume, in this example, a user has
navigated to multiple pages using the web application's starting page. The web
application can enable a visualization that shows a collection 2 104 of web pages to
which the user has navigated. Specifically, in this example, collection 2104
includes a starting page 2106 for the web application, and subsequent pages 2108
and 2 110 to which the user has navigated from the starting page.
[00137] Having considered various web application integration techniques,
consider now a discussion of how user credentials can be associated with login
sessions for a web application.
Associating Credentials and Login Sessions
[00138] Various embodiments enable one or more web applications that are
associated with websites that utilize login or credential information to be integrated
in a manner that preserves login or credential information across different instances
of a web application.
[00139] When a browser navigates to a website that utilizes login or credential
information, the login or credential information can be manually entered or
retrieved from a credentials store. The credentials store can contain user login
information such as, by way of example and not limitation, a username and
password or a user's credentials for a particular URL. The same URL or website
may have multiple entries, each associated with a different user. Similarly, the
credentials store can contain user login information or credentials for multiple
URLs.
[00140] In at least some embodiments, a web application associated with a
website that a user is logged into can be integrated on the desktop and interacted
with as described above. When such a web application is integrated, a process
determines what website the web application is associated with, as well as the user
who is logged onto the website. The process searches the credentials store for
associated login information and/or credentials. The process can then create an
association between the user, the created web application, and the relevant
credentials.
[00141] As an example, consider Fig. 22, which illustrates a relationship between
a website, a credentials store and a web application in accordance with one or more
embodiments. Browser 2200 displays a website that utilizes login information. In
addition to displaying a URL, an icon 2210 is displayed which can be selected to
facilitate the integration of a web application as described above. Credentials store
2220 includes entries that contain login information for multiple websites. One
such entry is shown at 2230. Here, the entry includes a website URL, a user name,
and a password. While Fig. 22 shows the login information as including a user
name and password, it is to be appreciated and understood that other forms of login
information or credentials can be employed.
[00142] In one or more embodiments, icon 2210 can be selected and dragged and
dropped onto task bar 2235, as described above and shown by icon 2240. This
procedure initiates the integration of the web application associated with the
website. After the selection is received, a process determines which user is
currently logged onto the web site and searches credentials store 2220 for
associated credentials. It is to be appreciated and understood, however, that
associated credentials can be determined and/or obtained in other ways without
departing from the spirit of the claimed subject matter.
[00143] Upon obtaining the user's credentials and/or login information, an
association is made between the credentials and the web application in a web
application credentials store 2250. Web application credentials store 2250 can
contain one or more entries containing data relevant to the association between
websites, web applications and pertinent credentials.
[00144] For example, Fig. 22 illustrates an entry 2260 which is shown as
containing login information pertaining to website "a.com" for user jsmith. In
addition to the URL, username, and password information, entry 2260 also includes
an Application ID or "AppID" which can be used to associate the web application
with the corresponding credentials. Web application credentials store 2250 also
contains a second entry 2270 for the same website "a.com" but a different user,
bsmith. This mechanism allows for associating individual web applications from
the same website with different users and their associated credentials.
[00145] While not illustrated in Fig. 22, various forms of user login information
and/or credentials can be associated with a web application. For example, in one
embodiment, an association can contain a pointer or reference back to information
in credentials store 2220. In another embodiment, web application credentials store
2250 can include information copied from the credentials store. In yet another
embodiment, credentials separate from, or in addition to, usernames and passwords
can be associated with a web application. For example, biometric information
might form the basis of an association that is created in the web application
credentials store.
[00146] Having described the relationship between a website, a credentials store
and a web application, consider now how a web application can be integrated for a
website that employs associated credentials.
Creating and Launching a Web Application with Associated
Credentials
[00147] Fig. 23 illustrates a flow diagram that describes steps in a method in
accordance with one or more embodiments. The method can be performed by any
suitable hardware, software, firmware, or combination thereof. In at least some
embodiments, aspects of the method are performed by software executing on a
client.
[00148] Step 2300 receives a selection of a website integration feature. Examples
of how this can be done are provided above. As described above, the website
integration feature is associated with installation of a web application on a client's
desktop. Responsive to receiving selection of the website integration feature, step
2302 initiates an installation process to install a web application on a client's
desktop, as described above. Specifically, initiation of this process on the client
can include creating the web application file as described above. Step 2304 obtains
session information associated with a current web session associated with the
website. This step can be performed in any suitable way. For example, in one
embodiment, session information can be obtained using a shared memory
component between a browser rendering content associated with the website and
the installation process. In another embodiment, a website can automatically
forward session information after the website integration feature is selected. In yet
another embodiment, session information can be stored by a browser and
subsequently queried.
[00149] Responsive to obtaining session information, step 2306 obtains
credentials related to the session information. In one embodiment, a credentials
store can be queried for login and/or credentials related to a website into which the
user is logged. For example, a credentials store can be queried for a username and
password associated with the website and user of the current session. Step 2308
associates credentials and/or login information related to the session information
with a web application. This step can be performed in any suitable way. For
example, the credentials can be copied to a web application credentials store for
future reference. Alternately or additionally, a pointer or reference to the
credentials in a credentials store can be placed in the web application credentials
store. An identification number can be generated based at least in part upon session
information and/or credentials to create a unique ID for each instance of a web
application and the related credentials and/or login information. This information
can be added to the web application credentials store entry to associate the acquired
credentials and/or login information with a web application. It is to be appreciated
and understood, however, that any suitable technique can be employed to associate
credentials with a web application without departing from the spirit and scope of
the claimed subject matter.
[00150] As described above, a unique ID for each web application instance
allows for multiple instances of web applications to be associated with the same
URL or web site, with each instance being associated with different user
credentials.
[00151] Fig. 24 is a flow diagram that describes steps in a method in accordance
with one or more embodiments. The method can be performed by any suitable
hardware, software, firmware, or combination thereof. In at least some
embodiments, aspects of the method are performed by software executing on a
client.
[00152] Step 2400 receives selection of a web application to launch. This step
can be performed in any suitable way. For example, an icon selection can be made
from a task bar on which the icon is pinned, as described above. Alternately or
additionally, a selection from a desktop start menu or a system tool bar can be
made. Upon receiving selection of the web application to launch, step 2402
retrieves credentials associated with the web application. For example, in one or
more embodiments, an AppID can be used to reference a web application
credentials store to retrieve login information for a user who is currently logged in.
Step 2404 retrieves a URL and/or a FormID associated with the web application
and related credentials. Upon acquiring the information described in steps 2402
and 2404, step 2406 autonomously logs into the associated website without user
intervention. After logging into the website, step 2408 navigates to the start URL,
as previously described above.
[00153] Having described how a web application associated with credentials is
integrated and launched, consider now a discussion of multiple instances of web
applications with associated credentials.
Multiple Instances of Web Applications with Associated Credentials
[00154] Fig. 25 illustrates an example of multiple web application instances that
are associated with credentials. Web application credentials store 2500 includes
data pertaining to a web application and associated credentials for a website.
Included in the web application credentials store 2500 are entries 2510 and 2520,
each for a different user. As illustrated in Fig. 25, entry 2510 pertains to website
"a.com", and contains additional information, such as user name jsmith and
password bulldogs, which are used to log onto the associated website. Entry 2510
includes an AppID, which is used to associate the entry with web application 2530.
Entry 2520 also pertains to website "a.com", but contains login information for user
bsmith, and is associated with web application 2540. While Fig. 25 illustrates an
entry to contain a URL/FormID, username, password, and AppID, it is to be
appreciated and understood that different forms of associations and credential
information can be used without departing from the spirit of the claimed subject
matter. Thus, two or more data entries in the web application credentials store can
contain data identifying different web applications that are integrated on the client's
desktop and each have different user credentials that are associated with the same
website.
[00155] In one or more embodiments, one or more web applications that are
associated with the same web site can exist or be activated simultaneously. For
example, a software module can be configured to enable a web application to be
launched via a desktop tool bar and to use the associated credentials to
automatically log the associated user into the website when the web application is
launched. In addition to launching a single web application, the software module
can be configured to enable a second web application to be launched using different
user credentials for either the same website, or a different website when the second
web application is selected to be launched.
[00156] For example, the two web applications 2530, 2540 of Fig. 25 are
activated at the same time. As described above, each pertains to website "a.com",
but has different credentials associated with them. As web application 2530 is
selected and launched, it automatically logs onto website "a.com" using credentials
associated with user jsmith. Similarly, when web application 2540 is selected and
launched, it logs onto website "a.com" using credentials associated with user
bsmith. Thus, multiple instances of web applications associated with the same
website can be simultaneously activated and associated with different credentials.
[00157] Having described the notion of creating and launching a web application
with associated credentials, consider now a discussion of web application task
sessions.
Web Application Task Sessions
[00158] In one or more embodiments, task sessions can be created to enable state
information associated with a web application to be saved to the system. State
information can include, by way of example and not limitation, session cookies,
JavaScript state, DOM state, form state, tab and window positioning, window sizes,
URLs, history and the like.
[00159] Because state information associated with a particular task session is
saved, a web application can be closed and later re-opened to restore or re-hydrate
the state information for the web application. State information can be saved
either automatically or through a manual selection process.
[00160] As an example, consider Fig. 26. There, a desktop 2600 includes a web
application window 2602 that is being utilized to plan a trip. Desktop 2600 also
includes a task bar 2604 and a jumplist 2606. A web application directory 2608
provides a storage facility that can be utilized to store task session state
information. In the illustrated and described embodiment, the web application
directory 2608 is created in the system's user space. In this example, the user has
two task sessions that have been saved - one associated with a Puerto Rico trip and
one associated with an Alaska trip.
[00161] In operation, when a user interacts with a web application, the user can
elect, through any suitable instrumentality, to create and save a task session. In the
illustrated example, jumplist 2606 has a menu item "Tasks" that includes two
entries. The first entry "New Task Session" enables the user to create a new task
session. The second entry "Save Current Task" enables the user to save the current
task. By saving the current task, state information associated with the task is
persisted to the web application directory 2608. A menu item entitled "Open Task
Sessions" contains entries that enable a user to restore or re-hydrate previous task
sessions that have been persisted to the web application directory 2608. Here there
are the two previously-mentioned, previously-saved task sessions - Puerto Rico trip
and Alaska trip.
[00162] As noted from the above example, multiple task sessions can be created
and saved for individual web applications. When a task session is saved, an
application ID associated with the web application can be saved with the task
session. The application ID can then be used to determine which web application is
to consume the information associated with the saved task session.
[00163] Any suitable techniques and approaches can be utilized to enable task
sessions to be created and saved. In at least some embodiments, the system can
leverage or otherwise utilize a crash recovery system associated with the system's
web browser. In this instance, crash recovery functionality can be triggered when,
for example, a user elects to save a current task or to create a new task session. The
crash recovery functionality can create an "appdata" file that resides in the user's
application data directory and which can be used to save the information associated
with the task session. Specific operation of crash recovery systems will be
understood by those of skill in the art. Accordingly, for the sake of brevity, such
systems are not described herein.
[00164] Fig. 27 is a flow diagram that describes steps in a method for saving task
session state information in accordance with one or more embodiments. The steps
can be executed in connection with any suitable hardware, software, firmware, or
combination thereof. In at least some embodiments, the method can be performed
by software executing on a client in association with software executing on a
server.
[00165] Step 2700 receives input associated with saving task session state
information. Any suitable input can be received. For example, the received input
can comprise input received from a user. Alternately or additionally, the input can
comprise some type of automatic, programmatic input. In at least some
embodiments, the user input can be received via a jumplist. Alternately or
additionally, the user input can be received via a shortcut. In the illustrated and
described embodiment, the user input indicates that a user wishes to save task
session state information associated with a web application. Step 2702 creates or
otherwise accesses a task session data structure in a web application directory. The
task session data structure is utilized to save task session state information. Step
2704 saves task session state information in the data structure. This step can be
performed in any suitable way. For example, this step can be performed when a
user elects to save the task session state information. Alternately or additionally,
this step can be performed periodically during a user's interaction with the web
application. In at least some embodiments, steps 2702 and 2704 can be performed
by utilizing a web browser's crash recovery system. It is to be appreciated and
understood, however, that other techniques can be utilized without departing from
the spirit and scope of the claimed subject matter.
[00166] Fig. 28 is a flow diagram that describes steps in a method for restoring a
task session whose state information has been saved, in accordance with one or
more embodiments. The steps can be executed in connection with any suitable
hardware, software, firmware, or combination thereof. In at least some
embodiments, the method can be performed by software executing on a client in
association with software executing on a server.
[00167] Step 2800 receives user input associated with restoring a task session
whose state information was previously saved. Step 2802 accesses a task session
data structure in a web application directory. As noted above, the task session's
state information is saved in the task session data structure. Step 2804 retrieves the
task session state information from the web application directory. Step 2806
launches an associated web application and restores the task session using the task
session state information retrieved from the web application directory.
[00168] Having described the notion of saving and re-using task session state
information, consider now how transitions can be performed between a web
application and a browser.
Transitioning Between a Web Application and a Browser
[00169] In one or more embodiments, a web application can transition to a
browser experience to be able to leverage browser capabilities that might not be
provided by a web application mode browser that enables the web application.
Recall that this is because in some embodiments, the web application mode
browser is a pared-down or chrome-less browser to enable developers to provide a
more site-specific experience. Such other capabilities that are excluded from the
web application mode browser can include, for example, favorites, tool bars, and/or
other add-ons.
[00170] In at least some embodiments, content and state associated with
individual tabs can be migrated from a web application to the web browser.
Alternately or additionally, content and state associated with multiple tabs and/or
the whole content and state of the web application can be migrated from the web
application to the web browser. Alternately or additionally, sessions associated
with individual tabs can be migrated from the web application to the browser.
[00171] Consider a situation in which a user has started a web application from
their desktop, has navigated within it, and opens one or more links in a new tab. As
an example, consider Fig. 29. There, a desktop 2900 includes a web application
window 2902 comprising part of a web application that is being utilized to plan a
trip. Desktop 2900 also includes a task bar 2904 from which the web application
was launched, as by clicking on an associated icon that has been pinned to the task
bar. The web application window 2902 includes three tabs 2906, 2908, and 2910.
In this instance, the user has selected tab 2906 and has a link "Click here to search
for flights" that the user can open.
[00172] Assume now that the user clicks on the associated link to open it and,
upon opening the link, decides that she would like to create a favorites item for the
website that is displayed in tab 2906. In this instance, the user can open a tool
menu 2912, or use some other user interface instrumentality, and select an option to
open the tab's contents in an associated web browser. As an example, consider Fig.
30 which uses like numbers from Fig. 29.
[00173] There, tool menu 2912 has been opened to expose its contents 3000. In
this example, two selections are available for the user - "Open Tab in Browser. .."
and "Open WebApp Content in Browser. ..". The first selection enables a user to
open the content of a selected tab in a web browser. When the selected tab is
opened in the web browser, the tab's content and state are migrated to the web
browser. The web browser can be one that has an open instance or, alternately, one
that is launched. The second selection enables the user to open the whole content
of the web application in the web browser. When this is done, the web
application's content and state are migrated to the web browser.
[00174] Any suitable techniques can be utilized to migrate content and state from
a web application tab or web application to the web browser. In at least some
embodiments, migration occurs through the use of the web browser's crash
recovery system, such as that described above. Specifically, when a user indicates
a desire to migrate content and state from a web application to a web browser,
content and state can be written to the system's disk, e.g. by writing an appdata file
that includes the relevant data that is to be migrated.
[00175] In addition, in at least some instances, shared memory can be utilized to
migrate information or data that is not typically utilized by the web browser's crash
recovery system. For example, data such as credentials and session cookies can be
stored in shared memory and the shared memory can be utilized to enable such data
to be used by the web browser.
[00176] Once the user selects a particular option displayed in the tool menu 2912,
the information or data can be migrated to a current or new instance of a web
browser, and the associated tab in the web application window 2902 can be closed.
In one or more embodiments, if the tab from which the information or data is being
migrated is the only tab open in the web application, the web application can be
closed after the migration is complete.
[00177] The above-described approach works well when the web application and
the web browser execute in different processes across a process boundary. That is,
the migration using the crash recovery system and the shared memory is well-suited
for crossing process boundaries. In some instances, however, process boundaries
need not necessarily be crossed. Rather, the web application and subsequent web
browser functionality can be exposed from within the same process. Specifically,
in this instance, a web browser user interface can be instantiated and used, in
connection with web application window 2902, and functionality that is not
available through the web application mode browser can be turned on and made
accessible through the web browser user interface. In operation, one way of
implementing this is as follows. The web application first generates some crash
recovery files. A new browser is initiated and loads crash recovery information
from the crash recovery files. This information is then used to configure the state
of the new browser. When the user works within the new browser, he or she will
have access to all of the browser functionality via the browser's standard user
interface.
[00178] Fig. 31 illustrates an embodiment in which the user has elected to
migrate content and state associated with a tab to a new browser instance. Like
numbers from the Fig. 29 example have been utilized. Here, assume that a user has
selected the "Open Tab in Browser" menu selection for tab 2906 (Fig. 30).
Responsively, that tab's content and state are migrated to a new instance of a web
browser whose associated user interface window is shown at 3100. User interface
window 3100 includes an address bar 3102 and a tab 3104 associated with the tab
that has been migrated from the web application. Notice in this example, that tab
2906 (Fig. 30) has been closed in the web application window 2902 but because
multiple tabs are open, the web application remains open.
[00179] Fig. 32 is a flow diagram that describes steps in a method in accordance
with one or more embodiments. The steps can be executed in connection with any
suitable hardware, software, firmware, or combination thereof. In at least some
embodiments, the method can be performed by software executing on a client in
association with software executing on a server.
[00180] Step 3200 receives user input associated with migrating web application
content and/or state to a web browser. Any suitable input can be received. For
example, in at least some embodiments, input can be received through a tool menu
that is exposed by the web application. Step 3202 migrates web application content
and/or state to the web browser. Any suitable techniques can be utilized to migrate
the web application content and/or state. In addition, content and/or state at any
suitable level of granularity can be migrated. For example, content and/or state
associated with individual tabs or multiple tabs of the web application can be
migrated. Alternately or additionally, the entire content of the web application can
be migrated. Further, in at least embodiments migration can occur across process
boundaries. Alternately or additionally, migration can occur within the same
process.
[00181] Fig. 33 is a flow diagram that describes steps in a method in accordance
with one or more embodiments. The steps can be executed in connection with any
suitable hardware, software, firmware, or combination thereof. In at least some
embodiments, the method can be performed by software executing on a client in
association with software executing on a server.
[00182] Step 3300 receives user input associated with migrating web application
content and/or state to a web browser. Any suitable input can be received. For
example, in at least some embodiments, input can be received through a tool menu
that is exposed by the web application. Step 3302 instantiates a web browser user
interface. Step 3304 exposes functionality using the web browser user interface.
Exposing the functionality includes enabling interaction with the web application
content through the web browser user interface. In at least some embodiments, the
exposed functionality includes functionality that is not available through the web
application or the web application mode browser and which can be used to interact
with the web application content. Examples of such functionality are provided
above. The method of Fig. 33 can be useful in situations where migration of web
application content and/or state occurs within the same process.
[00183] Fig. 34 is a flow diagram that describes steps in a method in accordance
with one or more embodiments. The steps can be executed in connection with any
suitable hardware, software, firmware, or combination thereof. In at least some
embodiments, the method can be performed by software executing on a client in
association with software executing on a server.
[00184] Step 3400 receives user input associated with migrating web application
content and/or state to a web browser. Any suitable input can be received. For
example, in at least some embodiments, input can be received through a tool menu
that is exposed by the web application. Step 3402 saves data associated with the
web application content. This step can be performed in any suitable way. For
example, in at least some embodiments, at least some of the data can be written to
the system's disk. Any suitable techniques can be utilized to write the data to the
system's disk. For example, in at least some embodiments, a web browser's crash
recovery system can be utilized to write the data to the system's disk. Further, in at
least some embodiments, step 3402 can be performed by using shared memory that
is shared between the web application and a web browser.
[00185] Step 3404 ascertains whether a web browser is open. If a web browser is
open, then step 3406 uses the saved data to present the web application content in
the web browser. If, on the other hand, the web browser is not open, step 3408
launches the web browser and returns to step 3406 to use the saved data to present
the web application content.
Creating a Transient Web Application from a Browser
[00186] Various embodiments enable creation of one or more so-called transient
web applications. In at least some embodiments, a transient web application can be
created without pinning the transient web application to a taskbar or otherwise
integrating the transient web application's associated files or indicia to a client's
desktop as described above. For example, the transient web application may not
have any user interface instrumentality integrated on the client's desktop that
provides a way to enable it to be launched or re-launched, such as a shortcut on a
start menu, a shortcut icon on the client's taskbar, and the like. In such instances,
however, a user can launch the transient web application from its associated web
site and can have access to the same functionality provided by the web application
had it been installed or integrated as described above. After using the transient web
application, it can then be closed by the user. In at least some embodiments, once a
transient web application has been closed, a user no longer has access to that
particular instance of the web application, thus rendering the transient web
application un-relaunchable from the client's desktop tool bar or start menu. One
way to do this is to delete the files or processes that were created for the web
application when the user initially launched it from the associated web site. In
some embodiments, a transient web application can be converted to an installed
web application, thus providing future access to the web application from the
client's desktop.
[00187] As an example, consider Fig. 35, which illustrates a relationship between
a transient web application and a browser. Here, browser 3500 enables access to
multiple web pages through a tabbed system, where tab 3510 is associated with
web site "Any Search Page" and tab 3520 is associated with "A Second Open
Page". In one or more embodiments, a transient web application can be created
from open web pages. In Fig. 35, a transient web application 3530 is generated or
created by a user selecting tab 3510 and dragging and dropping the selection
outside of browser 3500 on the desktop. When this happens, transient web
application files can be created in a temporary location.
[00188] It is to be appreciated and understood, however, that transient web
applications can be generated in other ways without departing from the spirit and
scope of the claimed subject matter. For example, browser 3500 can have a pull
down menu to facilitate selection of a web page and subsequent generation of an
associated transient web application.
[00189] In the context of this document, transient web applications are web
applications that are not installed on a client's system in the way that has been
described above in this document. However, web sites can still execute and
provide access to the same functionality in a transient web application that can be
executed in an installed web application. For example, a web site can modify a
transient web application's independent jumplist, set and clear overlay icons, and
the like. Alternately or additionally, a transient web application can support the
same behavior as an installed web application, such as providing independent
collections of tabs or windows that are opened from within the transient web
application, as described above.
[00190] Fig. 36 illustrates a flow diagram that describes steps in a method in
accordance with one or more embodiments. The method can be implemented in
connection with any suitable hardware, software, firmware, or combination thereof.
In at least some embodiments, aspects of the method can be implemented by a
suitably configured web browser and/or a software module on a client device, such
as in Fig. 1.
[00191] Step 3600 receives selection of a web site from which a web application
can be acquired. This can be accomplished in any suitable way, such as through
selection of a tab on a tabbed web browser, through a pull-down menu, and the like.
Upon receiving selection of a web site, step 3602 receives input to create a web
application as a transient web application on a client device. In one or more
embodiments, this can include receiving a message or call containing a request or
other information that can be used to generate a web application. In other
embodiments, this can include receiving input generated from a user dragging and
dropping some indicia associated with a web site. Step 3604 creates a transient
web application that is associated with the selected web site. In some
embodiments, creating a transient web application generates web application files
and/or processes without integrating them or any associated indicia on a client's
desktop or start menu. For example, the associated files can be saved in a
temporary file location that is different from locations in which integrated web
application files are placed. In addition, in at least some embodiments, creation of
the transient web application can include transferring the web site's state from the
browser to the transient web application.
[00192] Fig. 37 illustrates a flow diagram that describes steps in a method in
accordance with one or more embodiments. The method can be implemented in
connection with any suitable hardware, software, firmware, or combination thereof.
In at least some embodiments, aspects of the method can be implemented by a
suitably configured web browser and/or a software module, such as in Fig. 1.
[00193] Step 3700 receives input to close a transient web application. This step
can be performed in any suitable way. For example, in one embodiment, this can
include receiving input from a user selecting a close button on an open transient
web application. In another embodiment, this can include receiving input based on
a user selecting a close option on a transient web application pull-down menu.
Upon receipt of the input to close a transient web application, step 3702 closes the
transient web application. Closing a transient web application can include deleting
or removing the transient web application's associated files and processes. Thus,
upon closing the transient web application, a user no longer has access to its
functionality without either accessing it again as described above, or installing it as
a non-transient web application, described just below.
[00194] Having described creation and deletion of a transient web application,
consider now how a transient web application can be converted into a pinned or
installed web application in accordance with one or more embodiments.
Converting a Transient Web Application to an Installed Web
Application
[00195] In one or more embodiments, a transient web application can be
converted to an installed or integrated web application to allow for persistent access
after the web application has been closed. Once converted, the transient web
application can be considered as a non-transient web application.
[00196] Fig. 38 illustrates a transient web application that includes a jumplist.
Taskbar 3800 shows multiple programs that are open and running on a client
device. Transient web application 38 10 is a web application that originated from
program 3840. Associated with transient web application 3810 is a jumplist 3820.
As in the case of an installed or integrated web application, jumplist 3820 has all
the potential functionality associated with an installed web application. In addition,
jumplist 3820 contains item 3830 entitled "Pin this program to taskbar". Selecting
this option pins the web application to the client's taskbar, thus installing it and the
associated user interface instrumentality on the client's desktop as described above.
This enables the now non-transient web application to be re-launched from the
desktop. It is to be appreciated and understood, however, that any suitable
technique can be employed to convert a transient web application to a non-transient
web application without departing from the spirit and scope of the claimed subject
matter. For example, in some embodiments, a transient web application can be
added to a start menu of a client's desktop to integrate and install the web
application. In another embodiment, a transient web application may have a pull
down menu with an option to initiate the installation process. Needless to say,
numerous ways can be utilized to convert a transient web application into a nontransient
web application.
Web Application Super Home Button
[00197] When interacting with a web application, it is possible for a user to
navigate to a domain other than one directly associated with the website with which
the web application is associated. For example, a user may initiate an e-mail web
application and, by following external links, arrive at another site such as a news,
shopping, or entertainment site.
[00198] In one or more embodiments, a web application home button is provided
as part of the user interface experience. The web application home button serves
the couple purposes. First, the web application home button indicates that the
purpose of a particular web application mode browser (also referred to as a "site
mode browser") instance is for an associated web application. The web application
home button can use branding and other visual instrumentalities to convey this
information. Second, the web application home button enables users to quickly and
easily start back to the beginning of their web application experience by simply
clicking on the web application home button to access the start URL. This
alleviates having to close and re-launch a particular web application in order access
the start URL for the associated website. In at least some embodiments, by default,
the value associated with the start URL is ascertained from the page from which the
user drags and drops the favicon on the taskbar. Alternatively, web developers can
define an HTML tag that describes the start URL as part of their page. This allows
them to define an alternate start URL that is not the same as the page they are
currently viewing.
[00199] As an example, consider Fig. 39. There, a web application mode
browser 3900 includes an address bar 3902 in which an URL for a website appears.
In addition, a web application home button 3904 appears adjacent the back and
forward navigation buttons. As the user navigates to domains outside of the
website associated with the web application, they can, at any time, simply click on
the web application home button 3904 to navigate to the website's start URL as
described in the web application file.
[00200] Further, in at least some embodiments, and in order to convey to the user
their context within a web application and not a default browser, the navigational
back and forward buttons can take on the identity of the website by utilizing or
extracting a primary color of the site's brand through the web application home
button. In addition, an HTML tag can be utilized to enable websites to specify the
color of these buttons as part of their HTML page.
[00201] Fig. 40 is a flow diagram that describes steps a method in accordance
with one or more embodiments. The method can be implemented in connection
with any suitable hardware, software, firmware, or combination thereof. In at least
some embodiments, the method can be implemented by a site mode browser such
as that described above.
[00202] Step 4000 navigates a site mode browser to a website start URL
associated with a web application that is installed on a client device. This step can
be performed in any suitable way, examples of which are provided above. Step
4002 navigates to a different webpage. The webpage may or may not be associated
with the website associated with the start URL. Step 4004 receives selection of a
web application home button. Responsive to receiving selection of the web
application home button, step 4006 navigates the site mode browser to the website
start URL.
Example System
[00203] Fig. 4 1 illustrates an example computing device 4100 that can be used to
implement the various embodiments described above. Computing device 4100 can
be, for example, computing device 102 of Fig. 1 or any other suitable computing
device.
[00204] Computing device 4100 includes one or more processors or processing
units 4102, one or more memory and/or storage components 4104, one or more
input/output (I/O) devices 4106, and a bus 4108 that allows the various components
and devices to communicate with one another. Bus 4108 represents one or more of
any of several types of bus structures, including a memory bus or memory
controller, a peripheral bus, an accelerated graphics port, and a processor or local
bus using any of a variety of bus architectures. Bus 4108 can include wired and/or
wireless buses.
[00205] Memory/storage component 4104 represents one or more computer
storage media. Component 4104 can include volatile media (such as random
access memory (RAM)) and/or nonvolatile media (such as read only memory
(ROM), Flash memory, optical disks, magnetic disks, and so forth). Component
4104 can include fixed media (e.g., RAM, ROM, a fixed hard drive, etc.) as well as
removable media (e.g., a Flash memory drive, a removable hard drive, an optical
disk, and so forth).
[00206] One or more input/output devices 4106 allow a user to enter commands
and information to computing device 4100, and also allow information to be
presented to the user and/or other components or devices. Examples of input
devices include a keyboard, a cursor control device (e.g., a mouse), a microphone, a
scanner, and so forth. Examples of output devices include a display device (e.g., a
monitor or projector), speakers, a printer, a network card, and so forth.
[00207] Various techniques may be described herein in the general context of
software or program modules. Generally, software includes routines, programs,
objects, components, data structures, and so forth that perform particular tasks or
implement particular abstract data types. An implementation of these modules and
techniques may be stored on or transmitted across some form of computer readable
media. Computer readable media can be any available medium or media that can
be accessed by a computing device. By way of example, and not limitation,
computer readable media may comprise "computer-readable storage media".
[00208] "Computer-readable storage media" include volatile and non-volatile,
removable and non-removable media implemented in any method or technology for
storage of information such as computer readable instructions, data structures,
program modules, or other data. Computer-readable storage media include, but are
not limited to, RAM, ROM, EEPROM, flash memory or other memory technology,
CD-ROM, digital versatile disks (DVD) or other optical storage, magnetic
cassettes, magnetic tape, magnetic disk storage or other magnetic storage devices,
or any other medium which can be used to store the desired information and which
can be accessed by a computer.
Conclusion
[00209] Various embodiments provide a mechanism to allow end users to install
web applications and websites onto their desktop. In accordance with one or more
embodiments, client-side code can be utilized to allow developers associated with a
website to define boundaries associated with user interaction, and have those
boundaries enforced by a run-time engine. In at least some embodiments,
developers can provide, through JavaScript code, various configurations for the
creation of a start menu shortcut, navigation, and so-called jumplist integration, as
well as a variety of other functionality.
[00210] Although the subject matter has been described in language specific to
structural features and/or methodological acts, it is to be understood that the subject
matter defined in the appended claims is not necessarily limited to the specific
features or acts described above. Rather, the specific features and acts described
above are disclosed as example forms of implementing the claims.
Claims
1. A computer-implemented method comprising:
navigating a site mode browser to a website start URL associated with a web
application that is installed on a client device;
navigating the site mode browser to a webpage other than one associated
with the start URL;
receiving selection of a web application home button; and
responsive to receiving selection of the web application home button,
navigating the site mode browser to the website start URL.
2. The method of claim 1, wherein the web application home button is
configured to enable branding.
3. The method of claim 1,wherein the web application home button is
configured to enable branding using a primary color.
4. The method of claim 1,wherein the web application home button is
configured to be displayed adjacent navigation buttons associated with the site
mode browser.
5. The method of claim 1,wherein the web application home button is
configured to be displayed adjacent navigation buttons associated with the site
mode browser, wherein the navigation buttons utilize a primary color associated
with the website.
6. The method of claim 1,wherein the web application home button is
configured to be displayed adjacent back and forward navigation buttons associated
with the site mode browser.
7. The method of claim 1,wherein the website start URL is ascertained
from HTML.
8. One or more computer-readable storage media embodying computerexecutable
instructions which, when executed, implement a method comprising:
navigating a site mode browser to a website start URL associated with a web
application that is installed on a client device;
navigating the site mode browser to a webpage other than one associated
with the start URL;
receiving selection of a web application home button; and
responsive to receiving selection of the web application home button,
navigating the site mode browser to the website start URL.
9. The one or more computer-readable storage media of claim 8,
wherein the web application home button is configured to enable branding.
10. The one or more computer-readable storage media of claim 8,wherein
the web application home button is configured to enable branding using a primary
color.
11. The one or more computer-readable storage media of claim 8,wherein
the web application home button is configured to be displayed adjacent navigation
buttons associated with the site mode browser.
12. The one or more computer-readable storage media of claim 8,wherein
the web application home button is configured to be displayed adjacent navigation
buttons associated with the site mode browser, wherein the navigation buttons
utilize a primary color associated with the website.
13. The one or more computer-readable storage media of claim 8,wherein
the web application home button is configured to be displayed adjacent back and
forward navigation buttons associated with the site mode browser.
14. The one or more computer-readable storage media of claim 8,
wherein the web application home button is configured to be displayed adjacent
back and forward navigation buttons associated with the site mode browser,
wherein the back and forward navigation buttons utilize a primary color associated
with the website.
15. One or more computer-readable storage media embodying computerexecutable
instructions, which, when executed, implement a site mode browser
comprising:
one or more navigation buttons; and
a web application home button , wherein the web application home button is
associated with a client-installable web application and enables navigation to a start
URL associated with a web site associated with the web application.