Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Binary file modified .DS_Store
Binary file not shown.
22 changes: 14 additions & 8 deletions guideframe_demos/guideframe_code_demo/guideframe_code_demo.md
Original file line number Diff line number Diff line change
Expand Up @@ -14,13 +14,13 @@ All the python script requires is the relevant imports as seen at the top of the
Let's examine steps 1 and 2 to illustrate the syntax of a GuideFrame step. Each step takes a number as an argument in addition to a lambda function and an opptional argument for the order of the voicever relative to the interactions. In the case of step 1, lambda is set to none in order to hang on the main webpage while the voiceover is performed. Step 2 features a call to the click button by span text function to click the agree button.

## Step 6
Lets skip to step 14 to demonstrate the ability to pass multiple actions. In this case, we're filling review fields on the test site. A user can pass as many actions to a step as they wish and GuideFrame will iterate them.
Lets skip to step 14 to demonstrate the ability to pass multiple actions. In this case, we're filling review fields on the test site. A user can pass as many actions to a step as they wish and GuideFrame will iterate through them.

## Step 7
Once a user has defined all of their guide steps within a function, they can simply call this function within main. The user should then pass the number of steps to the assemble function from the GuideFrame library. This function carries out the assembly of all generated audio and video segments. Now that we've got a high level understanding of GuideFrame, let's take a look at the underlying code.
Once a user has defined all of their guide steps within a function, they should call it within main. They should then pass the number of steps to the assemble function. This function carries out the assembly of all generated audio and video segments. Now that we've got a high level understanding of GuideFrame, let's take a look at the underlying code.

## Step 8
Let's start off by examining one of the selenium functions. The selenium file acts as an SDK which allows user's to more easily create individual interactions. There are numerous actions available but for this demonstration we'll use a small subset. The first one we'll look at is the open link in new tab function. Like many of these functions, its wrapped in a try block with exception handling. This ensures any failures propagate up to the GitHub action. The function takes the webdriver and a h ref as an argument. The h ref is then passed to selenium's native functions. It opens the link and then switches to the most recently opened tab.
Let's start off by examining one of the selenium functions. The selenium file acts as an SDK which allows users to more easily create individual interactions. There are numerous actions available but for this demonstration we'll use a small subset. The first one we'll look at is the open link in new tab function. Like most of these functions, its wrapped in a try block with exception handling. The function takes the webdriver and a h ref as an argument. The h ref is then passed to selenium's native functions. It opens the link and then switches to the most recently opened tab.

## Step 9
Lets demonstrate it by using the magento test site. We'll use the function to open the test site in a new tab and switch to it.
Expand All @@ -44,7 +44,7 @@ The final function we'll examine allows a user to hover over elements. This func
When defining this particular step, we also pass sleep functions to allow space between selections.

## Step 16
Now that we've demonstrated some of the functions, lets dive a little deeper into the core logic that makes this possible. The utils file contains much of the logic relating to the guide steps themselves. The function seen here uses script arguments to assign appropriate variables.
Now that we've demonstrated some of the functions, lets dive a little deeper into the code that makes this possible. The utils file contains much of the logic relating to the guide steps themselves. The function seen here uses script arguments to extract environment variables.

## Step 17
This pair of functions simply serve to extract the scripts name for use in additional logic.
Expand All @@ -71,16 +71,22 @@ The assemble function takes the steps number and uses it to loop through all of
Finally, a cleanup loop removes all of the files generated through this process.

## Step 25
The final layer of guideframe is its use as a git hub action. This allows users to run guideframe on repository updates in order to ensure new render on changes. This removes the need for local rendering by an engineer. It also ensures that breaking changes to guideframe or the product it demos are easily caught.
The final layer of guideframe is its use as a git hub action. This allows users to run guideframe on repository updates.

## Step 26
This render workflow activates on push events. It spins up an ubuntu git hub runner and installs the requirements needed to run guideframe. The pip install commands here don't install the guideframe package. This is because this workflow runs within the source repository. Within the template repository, these python installations are replaced with pip install guideframe.
This render workflow activates on push events. It spins up an ubuntu git hub runner and installs the requirements needed to run guideframe. Note the pip install commands here don't install the guideframe package. This is because this workflow runs within the source repository. Within the template repository, these python installations are replaced with pip install guideframe.

## Step 27
Once the environment is set up, the virtual display is started. The tutors test is then run before a final step uploads this output as an artifact. This allows the user to download the final mp4 from the workflow. This then completes the full GuideFrame pipeline.
Once the environment is set up, the virtual display is started. The tutors demo is then run before a final step uploads this output as an artifact. This allows the user to download the final mp4 from the workflow.

## Step 28
This concludes the walkthrough. Be sure to check out the project on GitHub or PyPy.
This concludes the code walkthrough. GuideFrame is available on GitHub via the link seen here.

## Step 29
It can also be found here on PyPi.

## Step 30
And finally, the official documentation can be found here. Thanks for watching!



Expand Down
30 changes: 26 additions & 4 deletions guideframe_demos/guideframe_code_demo/guideframe_code_demo.py
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
def guideframe_script():
try:
'''
Setup - Setup driver and Open Tutors.dev and set window size etc
Setup - Setup driver, Open GuideFrame repo and set window size etc
'''
env_settings = get_env_settings() # Getting the environment settings
driver_location = env_settings["driver_location"] # Getting the driver location from the settings
Expand Down Expand Up @@ -286,15 +286,37 @@ def guideframe_script():
order="action-before-vo"
)

#-------------------Conclusion-------------------#

'''
Step 28 - End of script
Step 28 - GitHub page
'''
guide_step(
28,
lambda: open_url(driver, "https://github.com/chipspeak/GuideFrame"),
order="action-before-vo"
)

'''
Step 29 - PyPi page
'''
guide_step(
29,
lambda: open_url(driver, "https://pypi.org/project/guideframe/"),
order="action-before-vo"
)


'''
Step 30 - Docs page
'''
guide_step(
30,
lambda: open_url(driver, "https://chipspeak.github.io/GuideFrame/"),
order="action-before-vo"
)

#-------------------Walkthrough Complete-------------------#

finally:
print("Script complete -> moving to assembly")
driver.quit()
Expand All @@ -303,4 +325,4 @@ def guideframe_script():
# Main function to run the test and assemble the clips (now passing the number of steps to the assembly function)
if __name__ == "__main__":
guideframe_script()
assemble(28)
assemble(30)