Difference between revisions of "Apps Code"

From Hubitat Documentation
Jump to: navigation, search
(→‎Installing custom apps)
(Add ALT text)
Line 2: Line 2:
  
 
<big>The Hubitat community has developed some great apps to help you automate your devices in new, cool ways.</big>
 
<big>The Hubitat community has developed some great apps to help you automate your devices in new, cool ways.</big>
 +
 +
'''NOTE:''' Third-party code is not offically supported by Hubitat. Support may (or may not) be provided by the developer.
  
 
===<big>Installing custom apps</big>===
 
===<big>Installing custom apps</big>===
  
 
#<big>The developer of the app will normally post a link to their app code. Follow their directions to get to the source code.</big>
 
#<big>The developer of the app will normally post a link to their app code. Follow their directions to get to the source code.</big>
−
#<big>Typically developers will use GitHub to host code. When copying the code, choose the '''RAW''' button so that you are getting the raw form of the code, with no HTML formatting.</big>[[File:GitHub raw button v2.png|none|thumb|600x600px|link=https://docs.hubitat.com/images/5/5c/GitHub_raw_button_v2.png |alt=Located at the top of the GitHub window for the code you want to copy, there is a button labelled "RAW". This will ensure you are copying the raw form of the code, with no HTML formatting.]]
+
#<big>Often, developers will use GitHub to host code. When copying the code, select the '''Raw''' button so that you are getting the plain-text form of the code, with no HTML formatting.</big>[[File:GitHub raw button v2.png|none|thumb|600x600px|link=https://docs.hubitat.com/images/5/5c/GitHub_raw_button_v2.png |alt=Screenshot of "Raw" button on GitHub, located towards the top right]]
 
#<big>'''Select All''' the raw code, and then '''Copy''' the code.</big>
 
#<big>'''Select All''' the raw code, and then '''Copy''' the code.</big>
−
#<big>From the home page of your hub, select '''Apps Code''' in the side bar.</big>
+
#<big>From the home page of your hub, select '''Apps Code''' in the side bar. ''NOTE: If you do not see '''Apps Code''', expand the '''Developer Tools''' section to expose Apps Code and other developer/code links.''</big>
−
#<big>Select the '''+New App''' button in the upper right corner of the Apps Code page.</big>[[File:New User App dialogue 2.0.png|none|thumb|600x600px|link=https://docs.hubitat.com/images/6/61/New_User_App_dialogue_2.0.png |alt=The button to create a new custom app is located at the top-right of the "Apps Code" page on your hub]]
+
#<big>Select the '''+New App''' button in the upper right corner of the Apps Code page.</big>[[File:New User App dialogue 2.0.png|none|thumb|600x600px|link=https://docs.hubitat.com/images/6/61/New_User_App_dialogue_2.0.png |alt=Screenshot of "New App" button on Apps Code page]]
−
#<big>In the blank text field, paste the code. Alternatively, you can select the '''Import''' button and past a URL to the developers code in raw text format.</big>[[File:Import user app code URL 2.0.png|none|thumb|600x600px|link=https://docs.hubitat.com/images/7/79/Import_user_app_code_URL_2.0.png |alt=Pressing the "Import" button at the top of the custom App code page will allow you to enter the URL which points directly to the URL of the developers code in raw text format]]
+
#<big>In the blank text field, paste the code. Alternatively, you can select the '''Import''' button and past a URL to the developers code in raw text format.</big>[[File:Import user app code URL 2.0.png|none|thumb|600x600px|link=https://docs.hubitat.com/images/7/79/Import_user_app_code_URL_2.0.png |alt=Screenshot of "Import" button in Apps Code code section (type or paste URL containing raw/plain-text code)]]
−
#<big>Select the '''Save''' button in the top right. When '''modified''' goes away, your app is saved.</big>[[File:User app code unsaved 2.0.png|none|thumb|600x600px|link=https://docs.hubitat.com/images/5/5c/User_app_code_unsaved_2.0.png |alt=When first pasting or importing new custom apps code, or when making any change to existing custom apps code, "Modified" will be shown to the left of the "Import" button at the top of the custom apps code page. Save the code by pressing the "Save" button. The "Save" button is fourth from the right, at the top of the custom apps code page.]]
+
#<big>Select the '''Save''' button in the top right. When '''modified''' goes away, your app is saved.</big>[[File:User app code unsaved 2.0.png|none|thumb|600x600px|link=https://docs.hubitat.com/images/5/5c/User_app_code_unsaved_2.0.png |alt=Screenshot: Select "Save" button after copying/pasting, importing, or modifying code (red "modified" indicator will also be displayed)]]
  
−
<big>You may experience an error in this step. If you do, your app will not save and it will not work. Please contact the developer of the app in the Hubitat Community forum. It is usually best if you take a screen shot of the error to help them diagnose the problem. Once the code is fixed, come back and try again.</big>
+
<big>You may experience an error in this step. If you do, your app will not save and it will not work. Please contact the developer of the app in the Hubitat Community forum (or troubleshoot the code yourself if is your own). It is usually best if you take a screen shot of the error to help them diagnose the problem. Once the code is fixed, come back and try again.</big>
  
 
'''<big>Enabling OAuth</big>'''
 
'''<big>Enabling OAuth</big>'''
  
−
<big>Not all user apps will require OAuth (Open Authorization). Consult the app developers documentation for instruction.</big>
+
<big>Not all user apps will require OAuth (Open Authorization). Consult the app developers documentation for instruction. If it does require enabling OAuth, follow the steps below.</big>
  
−
#<big>After saving your user app code, select the '''Enable OAuth''' button and then '''Update''' to automatically generate the keys</big>.[[File:Enable OAuth 2.0.png|none|thumb|600x600px|link=https://docs.hubitat.com/images/d/d4/Enable_OAuth_2.0.png |alt=If a custom app requires OAuth, which stands for (Open Authorization), an OAuth button will become available after the custom apps code has been saved. The OAuth button will be located third from the right at the top of the custom apps code page. Pressing the OAuth button will open a pop-up window. In the OAuth pop-up window, there is an "Enable OAuth in App" button at the top-left of this pop-up window. Pressing this button will generate an Open Authorization key for the custom app. Press the "Update" button at the lower right of the pop-up window.]][[File:OAuth initial dialogue 2.0.png|none|thumb|600x600px|link=https://docs.hubitat.com/images/6/63/OAuth_initial_dialogue_2.0.png |alt=If it becomes necessary to update the OAuth keys for a custom app which required Open Authorization, press the OAuth button located third from the right at the top of the custom apps code page. Pressing the OAuth button will open a pop-up window. In the OAuth pop-up window, press the "Update" button at the lower right of the pop-up window.]]
+
#<big>After saving your user app code, select the '''Enable OAuth''' button and then '''Update''' to automatically generate the keys</big>.[[File:Enable OAuth 2.0.png|none|thumb|600x600px|link=https://docs.hubitat.com/images/d/d4/Enable_OAuth_2.0.png |alt=Screenshot: "Enable OAuth in App" button]][[File:OAuth initial dialogue 2.0.png|none|thumb|600x600px|link=https://docs.hubitat.com/images/6/63/OAuth_initial_dialogue_2.0.png |alt=Screenshot: "Update" button in OAuth dialog (to generate  keys)]]
  
−
*<big>If your client secret key becomes compromised, you may refresh it to protect the OAUTH2 endpoint security.</big>
+
*<big>If your client secret key becomes compromised, you may refresh it to protect the OAuth2 endpoint security.</big>
−
**<big>To refresh the client secret, open your user app code, select OAuth and check to box for '''Refresh Client Secret''', the select '''Update'''</big>[[File:OAuth refresh client secret 2.0.png|none|thumb|600x600px|link=https://docs.hubitat.com/images/2/26/OAuth_refresh_client_secret_2.0.png |alt=If your client secret key becomes compromised, you may refresh it in order to protect the OAuth 2 endpoint security. To refresh the client secret, press the OAuth button located third from the right at the top of the custom apps code page. Pressing the OAuth button will open a pop-up window. Just below the Client Secret field, select the check box for Refresh Client Secret, then press the Update button at the bottom of the OAuth pop-up window.]]
+
**<big>To refresh the client secret, open your user app code, select OAuth and check to box for '''Refresh Client Secret''', the select '''Update'''. If integrating with a third-party system, you may need to update the keys/URL in that system after doing this (consult documentation for that system if needed).</big>[[File:OAuth refresh client secret 2.0.png|none|thumb|600x600px|link=https://docs.hubitat.com/images/2/26/OAuth_refresh_client_secret_2.0.png |alt=Screenshot of "Refresh client secret" checkbox (to generate new keys)]]
  
 
'''<big>Loading Your User Developed App</big>'''
 
'''<big>Loading Your User Developed App</big>'''
Line 29: Line 31:
  
 
#<big>Select '''Apps''' from the sidebar.</big>
 
#<big>Select '''Apps''' from the sidebar.</big>
−
#<big>Select the '''+Add User App''' button.</big>[[File:Install Saved User App 2.0.png|none|thumb|600x600px|link=https://docs.hubitat.com/images/2/2a/Install_Saved_User_App_2.0.png |alt=With your user app code saved, press the "Add User App" button, which is second from the right at the top of the Apps page]]
+
#<big>Select the '''+Add User App''' button.</big>[[File:Install Saved User App 2.0.png|none|thumb|600x600px|link=https://docs.hubitat.com/images/2/2a/Install_Saved_User_App_2.0.png |alt=Screnshot of "Add User App" button on Apps page]]
−
#<big>Find your ''User App'' in the list and select it to instantly add it.</big>[[File:Install user app list 2.0.png|none|thumb|600x600px|link=https://docs.hubitat.com/images/c/c7/Install_user_app_list_2.0.png|alt=After pressing the "Add User App" button, a pop-up window labelled "Install New User App" will appear. Press the custom app in the list you want to install]]
+
#<big>Find your ''User App'' in the list and select it to instantly add it.</big>[[File:Install user app list 2.0.png|none|thumb|600x600px|link=https://docs.hubitat.com/images/c/c7/Install_user_app_list_2.0.png|alt=Screenshot of user app list, showing apps available for installation]]
−
 
 
−
<big>That's it! You're all set to create glorious home automations with your new app.</big>
 
  
−
*<big>Don't forget to thank the developer in the community forum for their hard work.</big>
+
<big>That's it! You're all set to create automations with your new app. (</big><big>Don't forget to thank the developer in the community forum for their hard work</big><big>!)</big>

Revision as of 00:23, 15 July 2022

Go to the top of the page

The Hubitat community has developed some great apps to help you automate your devices in new, cool ways.

NOTE: Third-party code is not offically supported by Hubitat. Support may (or may not) be provided by the developer.

Installing custom apps

  1. The developer of the app will normally post a link to their app code. Follow their directions to get to the source code.
  2. Often, developers will use GitHub to host code. When copying the code, select the Raw button so that you are getting the plain-text form of the code, with no HTML formatting.
    Screenshot of "Raw" button on GitHub, located towards the top right
  3. Select All the raw code, and then Copy the code.
  4. From the home page of your hub, select Apps Code in the side bar. NOTE: If you do not see Apps Code, expand the Developer Tools section to expose Apps Code and other developer/code links.
  5. Select the +New App button in the upper right corner of the Apps Code page.
    Screenshot of "New App" button on Apps Code page
  6. In the blank text field, paste the code. Alternatively, you can select the Import button and past a URL to the developers code in raw text format.
    Screenshot of "Import" button in Apps Code code section (type or paste URL containing raw/plain-text code)
  7. Select the Save button in the top right. When modified goes away, your app is saved.
    Screenshot: Select "Save" button after copying/pasting, importing, or modifying code (red "modified" indicator will also be displayed)

You may experience an error in this step. If you do, your app will not save and it will not work. Please contact the developer of the app in the Hubitat Community forum (or troubleshoot the code yourself if is your own). It is usually best if you take a screen shot of the error to help them diagnose the problem. Once the code is fixed, come back and try again.

Enabling OAuth

Not all user apps will require OAuth (Open Authorization). Consult the app developers documentation for instruction. If it does require enabling OAuth, follow the steps below.

  1. After saving your user app code, select the Enable OAuth button and then Update to automatically generate the keys.
    Screenshot: "Enable OAuth in App" button
    Screenshot: "Update" button in OAuth dialog (to generate keys)
  • If your client secret key becomes compromised, you may refresh it to protect the OAuth2 endpoint security.
    • To refresh the client secret, open your user app code, select OAuth and check to box for Refresh Client Secret, the select Update. If integrating with a third-party system, you may need to update the keys/URL in that system after doing this (consult documentation for that system if needed).
      Screenshot of "Refresh client secret" checkbox (to generate new keys)

Loading Your User Developed App

Once your app has successfully saved, you will need to load it to your hub before you can use it.

  1. Select Apps from the sidebar.
  2. Select the +Add User App button.
    Screnshot of "Add User App" button on Apps page
  3. Find your User App in the list and select it to instantly add it.
    Screenshot of user app list, showing apps available for installation

That's it! You're all set to create automations with your new app. (Don't forget to thank the developer in the community forum for their hard work!)

Retrieved from "https://docs.hubitat.com/index.php?title=Apps_Code&oldid=5660"