-
Notifications
You must be signed in to change notification settings - Fork 13
Video Demo 1
Eric edited this page Jun 23, 2015
·
1 revision
This is the first demo video for Add URL To Window Title Add-On. This steps through a basic example and will help you learn how to configure custom Auto-Type Rules. You can watch the video at YouTube.
I have taken the time to fully caption this video. If English is not your native language you can translate from the caption file below in SubStation Alpha format. If you make a full translation or find an error, please feel free to submit an issue.
[Script Info]
; This is a Sub Station Alpha v4 script.
Title: Add URL To Window Title Demo 1
ScriptType: v4.00
Collisions: Normal
PlayDepth: 0
[V4 Styles]
Format: Name, Fontname, Fontsize, PrimaryColour, SecondaryColour, TertiaryColour, BackColour, Bold, Italic, BorderStyle, Outline, Shadow, Alignment, MarginL, MarginR, MarginV, AlphaLevel, Encoding
Style: Default,arial,20,-1,-256,-16777216,-16777216,-1,0,1,2,1,2,10,10,10,0,1
Style: Top-Center,arial,20,-1,-256,-16777216,-16777216,-1,0,1,2,1,6,10,10,10,0,1
[Events]
Format: Marked, Start, End, Style, Name, MarginL, MarginR, MarginV, Effect, Text
Dialogue: Marked=0,0:00:03.51,0:00:07.71,Default,NTP,0000,0000,0000,!Effect,This is the first introductory demo for the Add URL to Window Title Firefox Add-On
Dialogue: Marked=0,0:00:07.93,0:00:11.30,Default,NTP,0000,0000,0000,!Effect,Here we have a demo site with a traditional logon prompt
Dialogue: Marked=0,0:00:11.70,0:00:14.80,Top-Center,NTP,0000,0000,0000,!Effect,We'll start by logging in manually to understand the login process flow
Dialogue: Marked=0,0:00:15.10,0:00:18.30,Top-Center,NTP,0000,0000,0000,!Effect,Using only the keyboard, first we type in the email address in the "email" input field
Dialogue: Marked=0,0:00:18.50,0:00:21.30,Top-Center,NTP,0000,0000,0000,!Effect,Then we type the "tab" key to move to the password field
Dialogue: Marked=0,0:00:22.70,0:00:27.70,Top-Center,NTP,0000,0000,0000,!Effect,Then we type in the password in the "password" field and type the enter key to submit
Dialogue: Marked=0,0:00:32.13,0:00:38.33,Default,NTP,0000,0000,0000,!Effect,In this demo after logging in, we arrive at a simple success page which echoes back the credentials entered on the logon form
Dialogue: Marked=0,0:00:38.73,0:00:44.23,Default,NTP,0000,0000,0000,!Effect,Now, let's enable the add-on and see how it can help us utilize KeePass to automate this login process.
Dialogue: Marked=0,0:00:47.43,0:00:49.93,Default,NTP,0000,0000,0000,!Effect,We are now back at the logon page for our demo site
Dialogue: Marked=0,0:00:50.13,0:00:54.83,Default,NTP,0000,0000,0000,!Effect,Look up at the top of the screen and notice that there is now a change in the browser window's title bar
Dialogue: Marked=0,0:00:55.03,0:01:00.73,Default,NTP,0000,0000,0000,!Effect,The URL (address) of the website has now been added to the web site's title information by the add-on
Dialogue: Marked=0,0:01:02.83,0:01:07.03,Default,NTP,0000,0000,0000,!Effect,Now we will configure KeePass to store the credentials and automate the logon process
Dialogue: Marked=0,0:01:07.23,0:01:09.93,Default,NTP,0000,0000,0000,!Effect,In KeePass we will create a new entry for the demo site
Dialogue: Marked=0,0:01:12.43,0:01:19.43,Default,NTP,0000,0000,0000,!Effect,Let's fill in this entry with the name of the site, the email address (for the username), the password, and the URL
Dialogue: Marked=0,0:01:31.41,0:01:34.61,Default,NTP,0000,0000,0000,!Effect,Remember to save your changes in KeePass before continuing.
Dialogue: Marked=0,0:01:36.11,0:01:38.61,Default,NTP,0000,0000,0000,!Effect,Back in the browser go into the email input field
Dialogue: Marked=0,0:01:38.81,0:01:41.51,Top-Center,NTP,0000,0000,0000,!Effect,We can now use the KeePass global auto-type shortcut
Dialogue: Marked=0,0:01:41.61,0:01:44.11,Top-Center,NTP,0000,0000,0000,!Effect,which we have set to Control + Alt + A
Dialogue: Marked=0,0:01:44.21,0:01:47.11,Default,NTP,0000,0000,0000,!Effect,This will then automatically type the logon sequence for us
Dialogue: Marked=0,0:01:47.31,0:01:50.89,Default,NTP,0000,0000,0000,!Effect,Note that when <PACKET> is shown on screen, it means "@"
Dialogue: Marked=0,0:01:52.43,0:01:54.53,Default,NTP,0000,0000,0000,!Effect,Let's switch back to KeePass for a minute
Dialogue: Marked=0,0:01:54.73,0:01:57.43,Default,NTP,0000,0000,0000,!Effect,to see how the global auto-type shortcut is configured
Dialogue: Marked=0,0:01:58.03,0:02:01.43,Default,NTP,0000,0000,0000,!Effect,In KeePass use the "Tools" menu to go to the "Options" screen
Dialogue: Marked=0,0:02:02.63,0:02:05.63,Default,NTP,0000,0000,0000,!Effect,Go to the "Integration" tab on the "Options" screen
Dialogue: Marked=0,0:02:06.21,0:02:08.33,Default,NTP,0000,0000,0000,!Effect,Here we can see the System-wide hot keys
Dialogue: Marked=0,0:02:08.53,0:02:11.13,Default,NTP,0000,0000,0000,!Effect,The Global auto-type option defines the key sequence used
Dialogue: Marked=0,0:02:11.23,0:02:16.03,Default,NTP,0000,0000,0000,!Effect,to start typing a KeePass entry if it match's the title of the active window (e.g., Browser)
Dialogue: Marked=0,0:02:18.96,0:02:22.76,Default,NTP,0000,0000,0000,!Effect,Now let's see what happens if we disable the add-on and try to auto-type
Dialogue: Marked=0,0:02:24.06,0:02:27.36,Default,NTP,0000,0000,0000,!Effect,Notice the URL is no longer present in the browser's title bar
Dialogue: Marked=0,0:02:28.03,0:02:30.23,Default,NTP,0000,0000,0000,!Effect,We go to the email input field as we did earlier
Dialogue: Marked=0,0:02:30.43,0:02:33.13,Top-Center,NTP,0000,0000,0000,!Effect,And we type the global auto-type key sequence
Dialogue: Marked=0,0:02:33.23,0:02:35.53,Top-Center,NTP,0000,0000,0000,!Effect,Nothing happens, it does not auto-type
Dialogue: Marked=0,0:02:36.33,0:02:38.73,Default,NTP,0000,0000,0000,!Effect,Notice that the entry in KeePass is called "Demo 1"
Dialogue: Marked=0,0:02:38.93,0:02:40.33,Default,NTP,0000,0000,0000,!Effect,this is not part of the title
Dialogue: Marked=0,0:02:40.43,0:02:44.33,Default,NTP,0000,0000,0000,!Effect,and therefore, there is nothing in the window title for KeePass to match
Dialogue: Marked=0,0:02:46.80,0:02:49.80,Default,NTP,0000,0000,0000,!Effect,Let's re-enable the add-on and continue
Dialogue: Marked=0,0:02:52.10,0:02:54.10,Default,NTP,0000,0000,0000,!Effect,What happens if we accidentally go to the "search" field
Dialogue: Marked=0,0:02:54.30,0:02:56.60,Default,NTP,0000,0000,0000,!Effect,instead of the "email" field and we try to do an auto-type?
Dialogue: Marked=0,0:03:01.98,0:03:04.38,Top-Center,NTP,0000,0000,0000,!Effect,The auto-type sequence was triggered,
Dialogue: Marked=0,0:03:04.58,0:03:06.28,Top-Center,NTP,0000,0000,0000,!Effect,but was it correct?
Dialogue: Marked=0,0:03:06.48,0:03:09.08,Default,NTP,0000,0000,0000,!Effect,As you can see, the password was auto-typed into the "username" field
Dialogue: Marked=0,0:03:09.98,0:03:12.08,Default,NTP,0000,0000,0000,!Effect,and the password field is blank
Dialogue: Marked=0,0:03:13.55,0:03:15.35,Default,NTP,0000,0000,0000,!Effect,Let's go back and see what happened.
Dialogue: Marked=0,0:03:16.59,0:03:18.79,Default,NTP,0000,0000,0000,!Effect,KeePass has no way to know where it is in the window
Dialogue: Marked=0,0:03:18.99,0:03:22.09,Default,NTP,0000,0000,0000,!Effect,it has no ability to know which field does or does not have focus
Dialogue: Marked=0,0:03:22.33,0:03:24.89,Default,NTP,0000,0000,0000,!Effect,In this case, because the "search" field had focus
Dialogue: Marked=0,0:03:24.99,0:03:27.79,Default,NTP,0000,0000,0000,!Effect,the auto-type started here instead of the "email" field
Dialogue: Marked=0,0:03:27.89,0:03:30.49,Default,NTP,0000,0000,0000,!Effect,and the credentials were therefore entered into the wrong place
Dialogue: Marked=0,0:03:30.69,0:03:33.29,Default,NTP,0000,0000,0000,!Effect,However, we can use advanced features of the add-on
Dialogue: Marked=0,0:03:33.49,0:03:35.89,Default,NTP,0000,0000,0000,!Effect,to prevent this type of mistake
Dialogue: Marked=0,0:03:36.09,0:03:38.09,Default,NTP,0000,0000,0000,!Effect,Let's go to the add-on's configuration
Dialogue: Marked=0,0:03:38.29,0:03:41.29,Default,NTP,0000,0000,0000,!Effect,and enable "Show the field attributes when a text field has focus?"
Dialogue: Marked=0,0:03:43.51,0:03:45.41,Default,NTP,0000,0000,0000,!Effect,Let's see what's different now
Dialogue: Marked=0,0:03:45.96,0:03:47.51,Default,NTP,0000,0000,0000,!Effect,When you click on an input field
Dialogue: Marked=0,0:03:47.71,0:03:50.71,Default,NTP,0000,0000,0000,!Effect,there is now additional information added to the window's title
Dialogue: Marked=0,0:03:50.91,0:03:54.31,Default,NTP,0000,0000,0000,!Effect,The window's title now shows the "name" and "id" attributes for the "search" field"
Dialogue: Marked=0,0:03:54.51,0:03:56.91,Default,NTP,0000,0000,0000,!Effect,Whenever you are in an input field, it has focus
Dialogue: Marked=0,0:03:57.11,0:04:00.61,Default,NTP,0000,0000,0000,!Effect,Therefore, the input field's "id" and "name" attributes will be added
Dialogue: Marked=0,0:04:00.88,0:04:04.68,Default,NTP,0000,0000,0000,!Effect,When no field has focus, the title will just show the URL as before
Dialogue: Marked=0,0:04:13.17,0:04:16.17,Top-Center,NTP,0000,0000,0000,!Effect,To get a better understanding of where this information is coming from
Dialogue: Marked=0,0:04:16.37,0:04:19.17,Top-Center,NTP,0000,0000,0000,!Effect,we will use the built in browser developer's tools.
Dialogue: Marked=0,0:04:19.50,0:04:21.47,Default,NTP,0000,0000,0000,!Effect,Let's select the "search field"
Dialogue: Marked=0,0:04:21.67,0:04:23.97,Top-Center,NTP,0000,0000,0000,!Effect,in the HTML source we can see this is an input field
Dialogue: Marked=0,0:04:24.17,0:04:26.27,Top-Center,NTP,0000,0000,0000,!Effect,with the name set to "q" and there is no id attribute
Dialogue: Marked=0,0:04:26.47,0:04:28.47,Top-Center,NTP,0000,0000,0000,!Effect,Therefore, when the search field has focus
Dialogue: Marked=0,0:04:28.67,0:04:31.77,Default,NTP,0000,0000,0000,!Effect,this information will be added to the window's title
Dialogue: Marked=0,0:04:38.30,0:04:40.40,Default,NTP,0000,0000,0000,!Effect,Now let's select the "email" field
Dialogue: Marked=0,0:04:42.89,0:04:47.59,Top-Center,NTP,0000,0000,0000,!Effect,Here we see the input field has a name="loginname" and an id="email-field"
Dialogue: Marked=0,0:04:53.69,0:04:57.49,Top-Center,NTP,0000,0000,0000,!Effect,Now if we actually click inside of the field and give it focus
Dialogue: Marked=0,0:04:57.69,0:05:01.69,Default,NTP,0000,0000,0000,!Effect,we see that the same "name" and "id" information is added to the window's title
Dialogue: Marked=0,0:05:01.89,0:05:04.49,Default,NTP,0000,0000,0000,!Effect,It most cases this information should be sufficient
Dialogue: Marked=0,0:05:04.69,0:05:07.09,Default,NTP,0000,0000,0000,!Effect,to uniquely identify a given input field
Dialogue: Marked=0,0:05:08.08,0:05:11.09,Default,NTP,0000,0000,0000,!Effect,You may be asking, so what's the big deal?
Dialogue: Marked=0,0:05:11.50,0:05:14.20,Default,NTP,0000,0000,0000,!Effect,We can now use this extra information to help KeePass
Dialogue: Marked=0,0:05:14.60,0:05:17.20,Default,NTP,0000,0000,0000,!Effect,ensure it starts auto-typing in the correct field
Dialogue: Marked=0,0:05:17.40,0:05:19.30,Default,NTP,0000,0000,0000,!Effect,Notice how the title is updated
Dialogue: Marked=0,0:05:19.50,0:05:21.10,Default,NTP,0000,0000,0000,!Effect,when the email field is selected
Dialogue: Marked=0,0:05:23.40,0:05:25.80,Default,NTP,0000,0000,0000,!Effect,Let's go to KeePass and update our configuration
Dialogue: Marked=0,0:05:26.00,0:05:29.10,Default,NTP,0000,0000,0000,!Effect,we will open and modify our existing entry for "Demo 1"
Dialogue: Marked=0,0:05:32.65,0:05:35.25,Default,NTP,0000,0000,0000,!Effect,We do not need to make any changes on the main "Entry" tab
Dialogue: Marked=0,0:05:35.45,0:05:37.65,Default,NTP,0000,0000,0000,!Effect,Instead, switch to the "Auto-Type" tab
Dialogue: Marked=0,0:05:37.85,0:05:40.55,Default,NTP,0000,0000,0000,!Effect,We will make some changes to the default configuration
Dialogue: Marked=0,0:05:40.95,0:05:44.45,Default,NTP,0000,0000,0000,!Effect,We will override the default auto-type sequence
Dialogue: Marked=0,0:05:44.65,0:05:47.65,Default,NTP,0000,0000,0000,!Effect,we only want auto-type to be allowed for our custom rule(s)
Dialogue: Marked=0,0:05:47.85,0:05:51.55,Default,NTP,0000,0000,0000,!Effect,I like to put a reminder here, as the override cannot be blank
Dialogue: Marked=0,0:05:53.55,0:05:56.55,Default,NTP,0000,0000,0000,!Effect,Now we click the "Add" button to enter a custom rule
Dialogue: Marked=0,0:05:56.75,0:05:58.55,Default,NTP,0000,0000,0000,!Effect,In the "Target Window" field,
Dialogue: Marked=0,0:05:58.75,0:06:02.25,Default,NTP,0000,0000,0000,!Effect,select the entry which matches the browser window's title
Dialogue: Marked=0,0:06:02.45,0:06:06.15,Default,NTP,0000,0000,0000,!Effect,You could leave this as is, but its best to make a few small edits
Dialogue: Marked=0,0:06:06.35,0:06:08.25,Default,NTP,0000,0000,0000,!Effect,Since we are matching based on the URL
Dialogue: Marked=0,0:06:08.45,0:06:11.16,Default,NTP,0000,0000,0000,!Effect,we can replace the title with a wild card symbol (*)
Dialogue: Marked=0,0:06:11.56,0:06:12.86,Default,NTP,0000,0000,0000,!Effect,Similarly, at the end
Dialogue: Marked=0,0:06:13.06,0:06:15.56,Default,NTP,0000,0000,0000,!Effect,we can replace the browser name with a wild card
Dialogue: Marked=0,0:06:15.76,0:06:17.36,Default,NTP,0000,0000,0000,!Effect,This is especially useful
Dialogue: Marked=0,0:06:17.56,0:06:19.66,Default,NTP,0000,0000,0000,!Effect,if you use multiple Firefox derivatives,
Dialogue: Marked=0,0:06:19.86,0:06:21.76,Default,NTP,0000,0000,0000,!Effect,such as Cyberfox or Comodo IceDragon
Dialogue: Marked=0,0:06:22.06,0:06:24.26,Default,NTP,0000,0000,0000,!Effect,Now matching is dependent
Dialogue: Marked=0,0:06:24.46,0:06:26.06,Default,NTP,0000,0000,0000,!Effect,only on the part of the title
Dialogue: Marked=0,0:06:26.26,0:06:28.46,Default,NTP,0000,0000,0000,!Effect,which is controlled by the add-on
Dialogue: Marked=0,0:06:29.66,0:06:32.06,Default,NTP,0000,0000,0000,!Effect,Because we changed the default key-sequence
Dialogue: Marked=0,0:06:32.26,0:06:34.56,Default,NTP,0000,0000,0000,!Effect,we must manually enter it in the custom rule
Dialogue: Marked=0,0:06:34.76,0:06:36.16,Default,NTP,0000,0000,0000,!Effect,which in this case is
Dialogue: Marked=0,0:06:36.36,0:06:38.06,Default,NTP,0000,0000,0000,!Effect,the username, followed by a tab,
Dialogue: Marked=0,0:06:38.26,0:06:41.08,Default,NTP,0000,0000,0000,!Effect,then the password and the enter key
Dialogue: Marked=0,0:06:48.98,0:06:50.58,Default,NTP,0000,0000,0000,!Effect,Click the "OK" button to continue
Dialogue: Marked=0,0:06:53.26,0:06:54.76,Default,NTP,0000,0000,0000,!Effect,On the "Edit Entry" screen
Dialogue: Marked=0,0:06:54.96,0:06:56.86,Default,NTP,0000,0000,0000,!Effect,you can now see that we have
Dialogue: Marked=0,0:06:57.06,0:06:58.76,Default,NTP,0000,0000,0000,!Effect,overridden the default rule
Dialogue: Marked=0,0:06:58.96,0:07:00.06,Default,NTP,0000,0000,0000,!Effect,and created a custom rule,
Dialogue: Marked=0,0:07:00.16,0:07:01.96,Default,NTP,0000,0000,0000,!Effect,which will only match when
Dialogue: Marked=0,0:07:02.16,0:07:04.06,Default,NTP,0000,0000,0000,!Effect,the email field is selected.
Dialogue: Marked=0,0:07:04.26,0:07:06.26,Default,NTP,0000,0000,0000,!Effect,Let's save our changes in KeePass
Dialogue: Marked=0,0:07:06.46,0:07:08.86,Default,NTP,0000,0000,0000,!Effect,and see how this works on the demo site
Dialogue: Marked=0,0:07:13.13,0:07:15.86,Default,NTP,0000,0000,0000,!Effect,Notice that currently the "search" field is selected
Dialogue: Marked=0,0:07:16.16,0:07:19.26,Default,NTP,0000,0000,0000,!Effect,What happens when we type the global auto-type shortcut?
Dialogue: Marked=0,0:07:19.46,0:07:21.76,Default,NTP,0000,0000,0000,!Effect,Auto-Type does not start typing the username
Dialogue: Marked=0,0:07:21.96,0:07:24.46,Default,NTP,0000,0000,0000,!Effect,and instead types our reminder message!
Dialogue: Marked=0,0:07:24.66,0:07:27.56,Default,NTP,0000,0000,0000,!Effect,This prevents typing our username or password in the wrong field
Dialogue: Marked=0,0:07:27.76,0:07:29.56,Default,NTP,0000,0000,0000,!Effect,Now, let's select the "email" field
Dialogue: Marked=0,0:07:29.76,0:07:31.76,Default,NTP,0000,0000,0000,!Effect,and try to auto-type
Dialogue: Marked=0,0:07:34.46,0:07:36.46,Top-Center,NTP,0000,0000,0000,!Effect,This time, we get a pop up
Dialogue: Marked=0,0:07:36.66,0:07:38.56,Top-Center,NTP,0000,0000,0000,!Effect,asking us to select an auto-type entry
Dialogue: Marked=0,0:07:38.76,0:07:41.76,Default,NTP,0000,0000,0000,!Effect,This is because there is a default rule and our custom rule
Dialogue: Marked=0,0:07:41.96,0:07:43.46,Default,NTP,0000,0000,0000,!Effect,If we select our custom rule,
Dialogue: Marked=0,0:07:43.66,0:07:47.66,Default,NTP,0000,0000,0000,!Effect,then it will auto-type our username and password as expected
Dialogue: Marked=0,0:07:48.80,0:07:50.10,Default,NTP,0000,0000,0000,!Effect,Using a similar strategy
Dialogue: Marked=0,0:07:50.30,0:07:53.10,Default,NTP,0000,0000,0000,!Effect,now you can create auto-type rules for all of your sites
Dialogue: Marked=0,0:07:53.30,0:07:55.70,Default,NTP,0000,0000,0000,!Effect,By configuring custom auto-type rules
Dialogue: Marked=0,0:07:55.90,0:07:58.90,Default,NTP,0000,0000,0000,!Effect,using combinations of URL and input field attributes,
Dialogue: Marked=0,0:07:59.10,0:08:02.80,Default,NTP,0000,0000,0000,!Effect,you can increase your efficiency and security