CommandFusion Wiki

Documentation Resources

User Tools

Site Tools



This shows you the differences between two versions of the page.

Link to this comparison view

software:modules-and-examples:password-protection-demo [2013/05/09 01:50]
software:modules-and-examples:password-protection-demo [2013/08/07 03:45] (current)
jarrod [Step One - Set the Serial Join]
Line 1: Line 1:
-====== Password Protection ​Example ​======+====== Password ​Lock/Protection ​Module ​======
-Customers often ask for a way to password protect their system ​so that if the iPhone is lostno one can walk up to their house and use it.\\ +Customers often ask for a way to password protect their system ​for many different reasons. It may be that you want some security in case you lose your phoneor that you simply want to lockout access to certain areas of your interface.
-Of course the chances ​of this happening are slim to none, but none-the-less,​ here is a way to do it that will work with ANY system.+
-===== Downloads ​===== +We have developed a module and demo project to help achieve this in your GUI. 
-  - {{:​software:​gui-designer:​example-gui-projects:​|}}+ 
 +===== Password Lock Module ​===== 
 +{{url>​http://​​embed/​rgg8UtLFt8o 560px,315px noscroll noborder alignment|Password Lock iViewer Module}} 
 +We are going to have a quick look at how to implement some basic password protection to your GUI. This is done using our new password lock JavaScript module.  
 +This module adds a simple password validation to block entry to a page.  
 +You could use this to block access to any part of a GUI you design in guiDesigner. It might be to block access to CCTV feeds or alarm system controls. In our demonstration,​ we are using this functionality to lockout access to parental controls. 
 +{{:​software:​modules-and-examples:​startup_portrait.png?​direct&​300|}} {{:​software:​modules-and-examples:​welcome_portrait.png?​direct&​300|}} 
 +==== Download ==== 
 +[[https://​​CommandFusion/​DemoUserInterfaces/​raw/​master/​PasswordLock/​|Download the Module]]. 
 +==== Step 1 - Set the Serial Join ==== 
 +Open up the ''​PassLock.js''​ file and edit the (2) serial join so it is the same as the (3)serial join of the (1)text object of where the entered code will be shown (Where the asterisks show up in the video). By default it is set to ''​s1''​. 
 +==== Step 2 - Add Script ==== 
 +Add the ''​PassLock.js''​ script to your project via the [[software:​gui-designer:​script-manager|Script Manager]]. 
 +==== Step 3 - Global Tokens ==== 
 +Open the Global Token Manager by right clicking on your gui file in the [[software:​gui-designer:​project-tree|project tree]] and selecting ''​Global Token Manager''​  
 +Edit the two available global tokens: 
 +  ​* Password: The is the password that must be entered correctly to activate the page flip 
 +  * PassSuccessPage:​ This is the page that the GUI will flip to when the password is entered correctly 
 +==== Step 4 Configure Buttons ==== 
 +In our demo project the buttons are already there and are configured for you. If you want to make your own keypad - you will need to tell the module which button is which. This is done by entering a JavaScript action in the button properties. 
 +So if the button has a JavaScript action of ''​PassLock.keyPress(5);''​ then that means that this button is the number 5. You will need to do this for all the number 0-9. 
 +The only other call that you have the configure is ''​PassLock.clear();''​. This clears any numbers already entered. 
 +For the most up to date version of this module, you can visit our [[https://​​CommandFusion/​DemoUserInterfaces/​tree/​master/​PasswordLock|Demo User Interfaces repo on GitHub]]. 
 +====== Another Approach ====== 
 Note: You must enter your registration code into the GUI when open in guiDesigner otherwise page flips will not work. Note: You must enter your registration code into the GUI when open in guiDesigner otherwise page flips will not work.
software/modules-and-examples/password-protection-demo.1368064241.txt.gz · Last modified: 2013/05/09 01:50 by aaron