Method for providing composite user interface controls and an online storefront for same

• US 9,773,264 B2
• Filed: 03/26/2013
• Issued: 09/26/2017
• Est. Priority Date: 03/26/2013
• Status: Active Grant

• Current Assignee: Malikie Innovations Limited (Key Patent Innovations Limited)
• Original Assignee: Blackberry Limited
• Inventors: Brown, Michael Stephen, Dent, Terrill Mark, Kalu, Kalu Onuka, Wood, Ryan Gregory, Bloom, Spencer William, Kupfer, Sandra Marcela
• Primary Examiner(s): Hayes, John
• Assistant Examiner(s): Winter, John M
• Application Number:
  US13/850,819
• Publication Number:
  US 20140297516A1
• Time in Patent Office: 1,645 Days
• Field of Search: None
• CPC Class Codes: G06F 3/04817 using icons graphical or visual programming using iconic symbols G06F8/34
• CPC Class Codes: G06F 9/451 Execution arrangements for user interfaces
• CPC Class Codes: G06F 9/45529 Embedded in an application, e.g. JavaScript in a Web browser
• CPC Class Codes: G06Q 20/00 Payment architectures, schemes or protocols apparatus for performing or posting payment transactions G07F7/08, G07F19/00; electronic cash registers G07G1/12
• CPC Class Codes: G06Q 30/0601 Electronic shopping [e-shopping]

Abstract

The present disclosure provides a method for providing composite user interface controls and a library or online storefront for same. In one aspect, there is provided a method for a client computer of sharing a custom control, comprising: receiving by a browser an encrypted custom control comprising a number of user interface elements which are positioned in a specified manner with respect to each other, wherein each of the user interface elements has one or more properties; receiving by the browser a decryption key; and decrypting by the browser the encrypted custom control using the decryption key.

Claims

1. A method of delivering custom user interface (UI) controls for use in mobile device application development, comprising:

displaying on a display of a client device an editor user interface for mobile device application development, wherein the editor user interface from comprises a webpage provided in an Internet browser;

receiving by the client device a request to evaluate a custom UI control;

sending a request for the custom UI control to a server;

in response to the request;

changing the editor user interface from an edit mode to a preview mode;

receiving an encrypted custom UI control and a decryption key for decrypting the encrypted custom UI control from the server, the encrypted custom UI control comprising a number of UI user interface elements which are positioned in a specified manner with respect to each other, wherein each of the user interface elements has one or more properties;

receiving a decryption key;

embedding the decryption key in the editor user interface to protect the decryption key from user access;

updating a control panel of the editor user interface to include an icon representing the custom UI control;

in response to receiving input to add an instance of the custom UI control to a page of a mobile device application under development displayed within the editor user interface;

decrypting the encrypted custom UI control using the decryption key in real-time, and rendering and displaying the decrypted custom UI control within the page of the mobile device application under development displayed within the editor user interface in real-time, wherein interaction with the custom UI control within the page of the mobile device application and publishing of the mobile device application is permitted but exporting of the mobile device application under development is prevented in the preview mode, wherein access to code defining the custom UI control and any media assets is prevented while in the preview mode displaying a prompt to purchase the custom UI control in response to input to export the mobile device application under development; and

in response to a successful transaction purchasing the custom UI control, changing the editor user interface from an edit mode to a preview mode; and

receiving an unencrypted custom UI control from the server including full access to the code defining the custom UI control and any media assets.

2. The method of claim 1, wherein the input to add the instance of the custom UI control is a drag and drop action.

3. The method of claim 1, wherein the user interface elements are Qt Modeling (QML) objects, wherein rendering and displaying by the browser comprises:

transcoding by the browser the QML objects into JavaScript objects;

transcoding the JavaScript objects into HyperText Markup Language (HTML) objects;

styling by the browser the HTML objects using Cascading Style Sheets (CSS) to emulate the QML objects; and

displaying by the browser the stylized HTML objects.

4. The method of claim 1, further comprising:

displaying by the browser a storefront including a listing of one or more custom UI controls, wherein the receiving and decrypting occur in response to receiving input to evaluate the UI custom control from the listing of one or more custom UI controls in the storefront.

5. The method of claim 1, wherein one or more properties of one or more of the user interface elements has a configurable value which may be defined as a complex expression, wherein each complex expression defines a relationship between a particular property of one of the user interface elements and one or more properties of one or more other user interface elements in the custom UI control.

6. The method of claim 5, wherein each complex expression defines a behavior of the custom UI control.

7. The method of claim 1, wherein some of the properties to the user interface elements are exposed as editable properties and the remainder of the properties to the user interface elements are locked.

8. The method of claim 1, wherein the user interface elements are QML objects.

9. The method of claim 1, wherein the user interface elements are the same or different.

10. The method of claim 1, wherein the user interface elements comprise a number of instances of the same user interface element.

11. An electronic device, comprising:

a processor;

a memory coupled to the processor, the memory storing executable instructions that, when executed by the processor, cause the processor, to;

display on a display of a client device an editor user interface for mobile device application development, wherein the editor user interface from comprises a webpage provided in an Internet browser;

receive by the client device a request to evaluate a custom UI control;

send a request for the custom UI control to a server;

in response to the request;

chance the editor user interface from an edit mode to a preview mode;

receive an encrypted custom UI control and a decryption key for decrypting the encrypted custom UI control from the server, the encrypted custom UI control comprising a number of UI user interface elements which are positioned in a specified manner with respect to each other, wherein each of the user interface elements has one or more properties;

receive a decryption key;

embed the decryption key in the editor user interface to protect the decryption key from user access;

update a control panel of the editor user interface to include an icon representing the custom UI control;

in response to receiving input to add an instance of the custom UI control to a page of a mobile device application under development displayed within the editor user interface;

decrypt the encrypted custom UI control using the decryption key in real-time, and render and display the decrypted custom UI control within the page of the mobile device application under development displayed within the editor user interface in real-time, wherein interaction with the custom UI control within the page of the mobile device application and publishing of the mobile device application is permitted but exporting of the mobile device application under development is prevented in the preview mode, wherein access to code defining the custom UI control and any media assets is prevented while in the preview mode display a prompt to purchase the custom UI control in response to input to export the mobile device application under development; and

in response to a successful transaction purchasing the custom UI control, change the editor user interface from an edit mode to a preview mode; and

receive an unencrypted custom UI control from the server including full access to the code defining the custom UI control and any media assets.

12. A non-transitory machine readable medium having tangibly stored thereon executable instructions for execution by a processor of an electronic device, wherein the executable instructions, when executed by the processor of the electronic device, cause the processor to:

display on a display of a client device an editor user interface for mobile device application development, wherein the editor user interface from comprises a webpage provided in an Internet browser;

receive by the client device a request to evaluate a custom UI control;

send a request for the custom UI control to a server;

in response to the request;

change the editor user interface from an edit mode to a preview mode;

receive an encrypted custom UI control and a decryption key for decrypting the encrypted custom UI control from the server, the encrypted custom UI control comprising a number of UI user interface elements which are positioned in a specified manner with respect to each other, wherein each of the user interface elements has one or more properties;

receive a decryption key;

embed the decryption key in the editor user interface to protect the decryption key from user access;

update a control panel of the editor user interface to include an icon representing the custom UI control;

in response to receiving input to add an instance of the custom UI control to a page of a mobile device application under development displayed within the editor user interface;

decrypt the encrypted custom UI control using the decryption key in real-time, and render and display the decrypted custom UI control within the page of the mobile device application under development displayed within the editor user interface in real-time, wherein interaction with the custom UI control within the page of the mobile device application and publishing of the mobile device application is permitted but exporting of the mobile device application under development is prevented in the preview mode, wherein access to code defining the custom UI control and any media assets is prevented while in the preview mode display a prompt to purchase the custom UI control in response to input to export the mobile device application under development; and

in response to a successful transaction purchasing the custom UI control, change the editor user interface from an edit mode to a preview mode; and

receive an unencrypted custom UI control from the server including full access to the code defining the custom UI control and any media assets.