CINXE.COM

Embedded ChatBot Chat Widget Example · GitHub

<!DOCTYPE html> <html lang="en" data-color-mode="auto" data-light-theme="light" data-dark-theme="dark" data-a11y-animated-images="system" data-a11y-link-underlines="true" > <head> <meta charset="utf-8"> <link rel="dns-prefetch" href="https://github.githubassets.com"> <link rel="dns-prefetch" href="https://avatars.githubusercontent.com"> <link rel="dns-prefetch" href="https://github-cloud.s3.amazonaws.com"> <link rel="dns-prefetch" href="https://user-images.githubusercontent.com/"> <link rel="preconnect" href="https://github.githubassets.com" crossorigin> <link rel="preconnect" href="https://avatars.githubusercontent.com"> <link crossorigin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/light-3e154969b9f9.css" /><link crossorigin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/dark-9c5b7a476542.css" /><link data-color-theme="dark_dimmed" crossorigin="anonymous" media="all" rel="stylesheet" data-href="https://github.githubassets.com/assets/dark_dimmed-afda8eb0fb33.css" /><link data-color-theme="dark_high_contrast" crossorigin="anonymous" media="all" rel="stylesheet" data-href="https://github.githubassets.com/assets/dark_high_contrast-2494e44ccdc5.css" /><link data-color-theme="dark_colorblind" crossorigin="anonymous" media="all" rel="stylesheet" data-href="https://github.githubassets.com/assets/dark_colorblind-56fff47acadc.css" /><link data-color-theme="light_colorblind" crossorigin="anonymous" media="all" rel="stylesheet" data-href="https://github.githubassets.com/assets/light_colorblind-71cd4cc132ec.css" /><link data-color-theme="light_high_contrast" crossorigin="anonymous" media="all" rel="stylesheet" data-href="https://github.githubassets.com/assets/light_high_contrast-fd5499848985.css" /><link data-color-theme="light_tritanopia" crossorigin="anonymous" media="all" rel="stylesheet" data-href="https://github.githubassets.com/assets/light_tritanopia-31d17ba3e139.css" /><link data-color-theme="dark_tritanopia" crossorigin="anonymous" media="all" rel="stylesheet" data-href="https://github.githubassets.com/assets/dark_tritanopia-68d6b2c79663.css" /> <link crossorigin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/primer-primitives-4cf0d59ab51a.css" /> <link crossorigin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/primer-af846850481e.css" /> <link crossorigin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/global-8b10f05a77e6.css" /> <link crossorigin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/github-2f6e722088eb.css" /> <script type="application/json" id="client-env">{"locale":"en","featureFlags":["copilot_new_references_ui","copilot_beta_features_opt_in","copilot_chat_static_thread_suggestions","copilot_conversational_ux_history_refs","copilot_implicit_context","copilot_smell_icebreaker_ux","experimentation_azure_variant_endpoint","failbot_handle_non_errors","geojson_azure_maps","ghost_pilot_confidence_truncation_25","ghost_pilot_confidence_truncation_40","hovercard_accessibility","issues_react_new_timeline","issues_react_avatar_refactor","issues_react_remove_placeholders","issues_react_blur_item_picker_on_close","marketing_pages_search_explore_provider","react_keyboard_shortcuts_dialog","remove_child_patch","sample_network_conn_type","site_metered_billing_update","issues_react_first_time_contribution_banner","lifecycle_label_name_updates"]}</script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/wp-runtime-6657579a8825.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_dompurify_dist_purify_js-b73fdff77a4e.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_oddbird_popover-polyfill_dist_popover_js-aff936e590ed.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_arianotify-polyfill_ariaNotify-polyfill_js-node_modules_github_mi-247092-740e4ddd559d.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/ui_packages_failbot_failbot_ts-93b6a0551aa9.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/environment-cd35650c2e9c.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_primer_behaviors_dist_esm_index_mjs-4aa4b0e95669.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_selector-observer_dist_index_esm_js-f690fd9ae3d5.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_relative-time-element_dist_index_js-6d3967acd51c.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_combobox-nav_dist_index_js-node_modules_github_g-emoji-element_di-6ce195-53781cbc550f.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_auto-complete-element_dist_index_js-node_modules_github_catalyst_-6afc16-3cdfa69a0406.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_text-expander-element_dist_index_js-f5498b8d4e5d.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_filter-input-element_dist_index_js-node_modules_github_remote-inp-b5f1d7-492b5042c841.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_mini-throttle_dist_index_js-node_modules_stacktrace-parser_dist_s-1f651a-1e3d784c897c.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_file-attachment-element_dist_index_js-node_modules_primer_view-co-7671f1-dc6cac136d88.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/github-elements-71486356f507.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/element-registry-e3ab8405ef80.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_braintree_browser-detection_dist_browser-detection_js-node_modules_githu-bb80ec-634de60bacfa.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_lit-html_lit-html_js-ce7225a304c5.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_hydro-analytics-client_dist_analytics-client_js-node_modules_gith-f3aee1-e6893db9c19e.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_mini-throttle_dist_index_js-node_modules_morphdom_dist_morphdom-e-7c534c-f8a5485c982a.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_turbo_dist_turbo_es2017-esm_js-858e043fcf76.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_remote-form_dist_index_js-node_modules_delegated-events_dist_inde-893f9f-6cf3320416b8.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_scroll-anchoring_dist_scroll-anchoring_esm_js-node_modules_stacktrace-pa-a71630-6f3c4f0189d8.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_color-convert_index_js-0e07cc183eed.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_quote-selection_dist_index_js-node_modules_github_session-resume_-0b5e12-889cec8cf448.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/ui_packages_updatable-content_updatable-content_ts-eae9df0dd562.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/app_assets_modules_github_behaviors_task-list_ts-app_assets_modules_github_sso_ts-ui_packages-900dde-18d1c91a7872.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/app_assets_modules_github_sticky-scroll-into-view_ts-7cbef09a422c.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/app_assets_modules_github_behaviors_ajax-error_ts-app_assets_modules_github_behaviors_include-d0d0a6-0e9fa537dc4f.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/app_assets_modules_github_behaviors_commenting_edit_ts-app_assets_modules_github_behaviors_ht-83c235-c89801ebbe15.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/behaviors-a6e4c4c86bfa.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_delegated-events_dist_index_js-node_modules_github_catalyst_lib_index_js-f6223d90c7ba.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/notifications-global-3366f6b6298e.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_delegated-events_dist_index_js-node_modules_github_hotkey_dist_index_js-d92e69b3521a.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_mini-throttle_dist_index_js-node_modules_github_remote-form_dist_-e6e00d-5e6fcc2d213d.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/ui_packages_form-utils_form-utils_ts-ui_packages_input-navigation-behavior_input-navigation-b-a97423-97468312ad00.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/app_assets_modules_github_diffs_blob-lines_ts-app_assets_modules_github_diffs_linkable-line-n-b8c0ea-77a5219efe36.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/gist-0633f0ca324a.js"></script> <title>Embedded ChatBot Chat Widget Example · GitHub</title> <meta name="route-pattern" content="/:user_id/:gist_id(.:format)" data-turbo-transient> <meta name="route-controller" content="gists_gists" data-turbo-transient> <meta name="route-action" content="show" data-turbo-transient> <meta name="current-catalog-service-hash" content="56253a530ab9027b25719525dcbe6007461a3202218f6f5dfce5a601c121cbcb"> <meta name="request-id" content="8D32:1A406:1017F4:125754:674AE40A" data-pjax-transient="true"/><meta name="html-safe-nonce" content="f11fdb06e84d973dfc5b1e9ebd289f2655c10f8174b463aa9248b0fbcdc86939" data-pjax-transient="true"/><meta name="visitor-payload" content="eyJyZWZlcnJlciI6IiIsInJlcXVlc3RfaWQiOiI4RDMyOjFBNDA2OjEwMTdGNDoxMjU3NTQ6Njc0QUU0MEEiLCJ2aXNpdG9yX2lkIjoiMjExOTg5OTI5OTU4MzgxMjYxOCIsInJlZ2lvbl9lZGdlIjoic291dGhlYXN0YXNpYSIsInJlZ2lvbl9yZW5kZXIiOiJzb3V0aGVhc3Rhc2lhIn0=" data-pjax-transient="true"/><meta name="visitor-hmac" content="f4f3898a9c4f8fb4975ccc95bf091d0d0409e7c152badfa70067f4aeef361bb6" data-pjax-transient="true"/> <meta name="github-keyboard-shortcuts" content="copilot" data-turbo-transient="true" /> <meta name="selected-link" value="gist_code" data-turbo-transient> <link rel="assets" href="https://github.githubassets.com/"> <meta name="google-site-verification" content="Apib7-x98H0j5cPqHWwSMm6dNU4GmODRoqxLiDzdx9I"> <meta name="octolytics-url" content="https://collector.github.com/github/collect" /> <meta name="analytics-location" content="/&lt;user-name&gt;/&lt;gist-id&gt;" data-turbo-transient="true" /> <meta name="user-login" content=""> <meta name="viewport" content="width=device-width"> <meta name="description" content="Embedded ChatBot Chat Widget Example. GitHub Gist: instantly share code, notes, and snippets."> <link rel="search" type="application/opensearchdescription+xml" href="/opensearch-gist.xml" title="Gist"> <link rel="fluid-icon" href="https://gist.github.com/fluidicon.png" title="GitHub"> <meta property="fb:app_id" content="1401488693436528"> <meta name="apple-itunes-app" content="app-id=1477376905, app-argument=https://gist.github.com/humannus/ad5c4f407a81cbe6f0a5a8014c7315a9" /> <meta name="twitter:image" content="https://github.githubassets.com/assets/gist-og-image-54fd7dc0713e.png" /><meta name="twitter:site" content="@github" /><meta name="twitter:card" content="summary_large_image" /><meta name="twitter:title" content="Embedded ChatBot Chat Widget Example" /><meta name="twitter:description" content="Embedded ChatBot Chat Widget Example. GitHub Gist: instantly share code, notes, and snippets." /> <meta property="og:image" content="https://github.githubassets.com/assets/gist-og-image-54fd7dc0713e.png" /><meta property="og:image:alt" content="Embedded ChatBot Chat Widget Example. GitHub Gist: instantly share code, notes, and snippets." /><meta property="og:site_name" content="Gist" /><meta property="og:type" content="article" /><meta property="og:title" content="Embedded ChatBot Chat Widget Example" /><meta property="og:url" content="https://gist.github.com/humannus/ad5c4f407a81cbe6f0a5a8014c7315a9" /><meta property="og:description" content="Embedded ChatBot Chat Widget Example. GitHub Gist: instantly share code, notes, and snippets." /><meta property="article:author" content="262588213843476" /><meta property="article:publisher" content="262588213843476" /> <meta name="hostname" content="gist.github.com"> <meta name="expected-hostname" content="gist.github.com"> <meta http-equiv="x-pjax-version" content="0361a11d6ba7285e98ad3340b1de5998c1adf9be672ff350e645684a12c5ff34" data-turbo-track="reload"> <meta http-equiv="x-pjax-csp-version" content="ace39c3b6632770952207593607e6e0be0db363435a8b877b1f96abe6430f345" data-turbo-track="reload"> <meta http-equiv="x-pjax-css-version" content="3adbaefc258174e49a9472f62ba4ed262e7c0112f9e7266a3e927bd7b898716f" data-turbo-track="reload"> <meta http-equiv="x-pjax-js-version" content="58069173ba3ee40a605f317588f70346d3cda2c3c32d767dd6d2909bbe343612" data-turbo-track="reload"> <meta name="turbo-cache-control" content="no-preview" data-turbo-transient=""> <link href="/humannus.atom" rel="alternate" title="atom" type="application/atom+xml"> <link crossorigin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/gist-622547bb175b.css" /> <meta name="turbo-body-classes" content="logged-out env-production page-responsive"> <meta name="browser-stats-url" content="https://api.github.com/_private/browser/stats"> <meta name="browser-errors-url" content="https://api.github.com/_private/browser/errors"> <link rel="mask-icon" href="https://github.githubassets.com/assets/pinned-octocat-093da3e6fa40.svg" color="#000000"> <link rel="alternate icon" class="js-site-favicon" type="image/png" href="https://github.githubassets.com/favicons/favicon.png"> <link rel="icon" class="js-site-favicon" type="image/svg+xml" href="https://github.githubassets.com/favicons/favicon.svg" data-base-href="https://github.githubassets.com/favicons/favicon"> <meta name="theme-color" content="#1e2327"> <meta name="color-scheme" content="light dark" /> </head> <body class="logged-out env-production page-responsive" style="word-wrap: break-word;"> <div data-turbo-body class="logged-out env-production page-responsive" style="word-wrap: break-word;"> <div class="position-relative header-wrapper js-header-wrapper "> <a href="#start-of-content" data-skip-target-assigned="false" class="px-2 py-4 color-bg-accent-emphasis color-fg-on-emphasis show-on-focus js-skip-to-content">Skip to content</a> <span data-view-component="true" class="progress-pjax-loader Progress position-fixed width-full"> <span style="width: 0%;" data-view-component="true" class="Progress-item progress-pjax-loader-bar left-0 top-0 color-bg-accent-emphasis"></span> </span> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/primer-react-765944243383.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/react-core-cd0a67881543.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/react-lib-7b7b5264f6c1.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/octicons-react-45c3a19dd792.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_tanstack_query-core_build_modern_queryClient_js-e40bb86d3e93.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_emotion_is-prop-valid_dist_emotion-is-prop-valid_esm_js-node_modules_emo-37e3d5-31653d7f2342.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_mini-throttle_dist_index_js-node_modules_stacktrace-parser_dist_s-e7dcdd-285fc29e9fa5.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_oddbird_popover-polyfill_dist_popover-fn_js-4896ddd4b7bb.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/keyboard-shortcuts-dialog-f3cc184507a7.js"></script> <link crossorigin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/primer-react.9fa170e9435ed4b922b9.module.css" /> <react-partial partial-name="keyboard-shortcuts-dialog" data-ssr="false" data-attempted-ssr="false" > <script type="application/json" data-target="react-partial.embeddedData">{"props":{"docsUrl":"https://docs.github.com/get-started/accessibility/keyboard-shortcuts"}}</script> <div data-target="react-partial.reactRoot"></div> </react-partial> <div class="Header js-details-container Details flex-wrap flex-md-nowrap p-responsive" role="banner" > <div class="Header-item d-none d-md-flex"> <a class="Header-link" data-hotkey="g d" aria-label="Gist Homepage " href="/"> <svg aria-hidden="true" height="24" viewBox="0 0 24 24" version="1.1" width="24" data-view-component="true" class="octicon octicon-mark-github v-align-middle d-inline-block d-md-none"> <path d="M12.5.75C6.146.75 1 5.896 1 12.25c0 5.089 3.292 9.387 7.863 10.91.575.101.79-.244.79-.546 0-.273-.014-1.178-.014-2.142-2.889.532-3.636-.704-3.866-1.35-.13-.331-.69-1.352-1.18-1.625-.402-.216-.977-.748-.014-.762.906-.014 1.553.834 1.769 1.179 1.035 1.74 2.688 1.25 3.349.948.1-.747.402-1.25.733-1.538-2.559-.287-5.232-1.279-5.232-5.678 0-1.25.445-2.285 1.178-3.09-.115-.288-.517-1.467.115-3.048 0 0 .963-.302 3.163 1.179.92-.259 1.897-.388 2.875-.388.977 0 1.955.13 2.875.388 2.2-1.495 3.162-1.179 3.162-1.179.633 1.581.23 2.76.115 3.048.733.805 1.179 1.825 1.179 3.09 0 4.413-2.688 5.39-5.247 5.678.417.36.776 1.05.776 2.128 0 1.538-.014 2.774-.014 3.162 0 .302.216.662.79.547C20.709 21.637 24 17.324 24 12.25 24 5.896 18.854.75 12.5.75Z"></path> </svg> <svg aria-hidden="true" height="24" viewBox="0 0 68 24" version="1.1" width="68" data-view-component="true" class="octicon octicon-logo-github v-align-middle d-none d-md-inline-block"> <path d="M27.8 17.908h-.03c.013 0 .022.014.035.017l.01-.002-.016-.015Zm.005.017c-.14.001-.49.073-.861.073-1.17 0-1.575-.536-1.575-1.234v-4.652h2.385c.135 0 .24-.12.24-.283V9.302c0-.133-.12-.252-.24-.252H25.37V5.913c0-.119-.075-.193-.21-.193h-3.24c-.136 0-.21.074-.21.193V9.14s-1.636.401-1.741.416a.255.255 0 0 0-.195.253v2.021c0 .164.12.282.255.282h1.665v4.876c0 3.627 2.55 3.998 4.29 3.998.796 0 1.756-.252 1.906-.327.09-.03.135-.134.135-.238v-2.23a.264.264 0 0 0-.219-.265Zm35.549-3.272c0-2.69-1.095-3.047-2.25-2.928-.9.06-1.62.505-1.62.505v5.232s.735.506 1.83.536c1.545.044 2.04-.506 2.04-3.345ZM67 14.415c0 5.099-1.665 6.555-4.576 6.555-2.46 0-3.78-1.233-3.78-1.233s-.06.683-.135.773c-.045.089-.12.118-.21.118h-2.22c-.15 0-.286-.119-.286-.252l.03-16.514a.26.26 0 0 1 .255-.252h3.196a.26.26 0 0 1 .255.252v5.604s1.23-.788 3.03-.788l-.015-.03c1.8 0 4.456.67 4.456 5.767ZM53.918 9.05h-3.15c-.165 0-.255.119-.255.282v8.086s-.826.58-1.95.58c-1.126 0-1.456-.506-1.456-1.62v-7.06a.262.262 0 0 0-.255-.254h-3.21a.262.262 0 0 0-.256.253v7.596c0 3.27 1.846 4.087 4.381 4.087 2.085 0 3.78-1.145 3.78-1.145s.076.58.12.67c.03.074.136.133.24.133h2.011a.243.243 0 0 0 .255-.253l.03-11.103c0-.133-.12-.252-.285-.252Zm-35.556-.015h-3.195c-.135 0-.255.134-.255.297v10.91c0 .297.195.401.45.401h2.88c.3 0 .375-.134.375-.401V9.287a.262.262 0 0 0-.255-.252ZM16.787 4.01c-1.155 0-2.07.907-2.07 2.051 0 1.145.915 2.051 2.07 2.051a2.04 2.04 0 0 0 2.04-2.05 2.04 2.04 0 0 0-2.04-2.052Zm24.74-.372H38.36a.262.262 0 0 0-.255.253v6.08H33.14v-6.08a.262.262 0 0 0-.255-.253h-3.196a.262.262 0 0 0-.255.253v16.514c0 .133.135.252.255.252h3.196a.262.262 0 0 0 .255-.253v-7.06h4.966l-.03 7.06c0 .134.12.253.255.253h3.195a.262.262 0 0 0 .255-.253V3.892a.262.262 0 0 0-.255-.253Zm-28.31 7.313v8.532c0 .06-.015.163-.09.193 0 0-1.875 1.323-4.966 1.323C4.426 21 0 19.84 0 12.2S3.87 2.986 7.651 3c3.27 0 4.59.728 4.8.862.06.075.09.134.09.208l-.63 2.646c0 .134-.134.297-.3.253-.54-.164-1.35-.49-3.255-.49-2.205 0-4.575.623-4.575 5.543s2.25 5.5 3.87 5.5c1.38 0 1.875-.164 1.875-.164V13.94H7.321c-.165 0-.285-.12-.285-.253v-2.735c0-.134.12-.252.285-.252h5.61c.166 0 .286.118.286.252Z"></path> </svg> <svg aria-hidden="true" height="24" viewBox="0 0 38 24" version="1.1" width="38" data-view-component="true" class="octicon octicon-logo-gist v-align-middle d-none d-md-inline-block"> <path d="M7.05 13.095v-1.5h5.28v8.535c-1.17.555-2.925.96-5.385.96C1.665 21.09 0 17.055 0 12.045S1.695 3 6.945 3c2.43 0 3.96.495 4.92.99v1.575c-1.83-.75-3-1.095-4.92-1.095-3.855 0-5.22 3.315-5.22 7.59s1.365 7.575 5.205 7.575c1.335 0 2.97-.105 3.795-.51v-6.03H7.05Zm16.47 1.035h.045c3.33.3 4.125 1.425 4.125 3.345 0 1.815-1.14 3.615-4.71 3.615-1.125 0-2.745-.285-3.495-.585v-1.41c.705.255 1.83.54 3.495.54 2.43 0 3.09-1.035 3.09-2.13 0-1.065-.33-1.815-2.655-2.01-3.39-.3-4.095-1.5-4.095-3.12 0-1.665 1.08-3.465 4.38-3.465 1.095 0 2.34.135 3.375.585v1.41c-.915-.3-1.83-.54-3.405-.54-2.325 0-2.82.855-2.82 2.01 0 1.035.42 1.56 2.67 1.755Zm12.87-4.995v1.275h-3.63v7.305c0 1.425.795 2.01 2.25 2.01.3 0 .63 0 .915-.045v1.335c-.255.045-.75.075-1.035.075-1.965 0-3.75-.9-3.75-3.195v-7.5H28.8v-.72l2.34-.66V5.85l1.62-.465v3.75h3.63ZM16.635 9.09v9.615c0 .81.285 1.05 1.005 1.05v1.335c-1.71 0-2.58-.705-2.58-2.58V9.09h1.575Zm.375-3.495c0 .66-.51 1.17-1.17 1.17a1.14 1.14 0 0 1-1.155-1.17c0-.66.48-1.17 1.155-1.17s1.17.51 1.17 1.17Z"></path> </svg> </a> </div> <div class="Header-item d-md-none"> <button aria-label="Toggle navigation" aria-expanded="false" type="button" data-view-component="true" class="Header-link js-details-target btn-link"> <svg aria-hidden="true" height="24" viewBox="0 0 24 24" version="1.1" width="24" data-view-component="true" class="octicon octicon-three-bars"> <path d="M3.75 5.25a.75.75 0 0 0 0 1.5h16.5a.75.75 0 0 0 0-1.5H3.75Zm0 6a.75.75 0 0 0 0 1.5h16.5a.75.75 0 0 0 0-1.5H3.75Zm0 6a.75.75 0 0 0 0 1.5h16.5a.75.75 0 0 0 0-1.5H3.75Z"></path> </svg> </button> </div> <div class="Header-item Header-item--full js-site-search flex-column flex-md-row width-full flex-order-2 flex-md-order-none mr-0 mr-md-3 mt-3 mt-md-0 Details-content--hidden-not-important d-md-flex"> <div class="header-search flex-self-stretch flex-md-self-auto mr-0 mr-md-3 mb-3 mb-md-0"> <!-- '"` --><!-- </textarea></xmp> --></option></form><form class="position-relative js-quicksearch-form" role="search" aria-label="Site" data-turbo="false" action="/search" accept-charset="UTF-8" method="get"> <div class="header-search-wrapper form-control input-sm js-chromeless-input-container"> <input type="text" class="form-control input-sm js-site-search-focus header-search-input" data-hotkey="s,/" name="q" aria-label="Search" placeholder="Search…" autocorrect="off" autocomplete="off" autocapitalize="off"> </div> </form></div> <nav aria-label="Global" class="d-flex flex-column flex-md-row flex-self-stretch flex-md-self-auto"> <a class="Header-link mr-0 mr-md-3 py-2 py-md-0 border-top border-md-top-0 border-white-fade" data-ga-click="Header, go to all gists, text:all gists" href="/discover">All gists</a> <a class="Header-link mr-0 mr-md-3 py-2 py-md-0 border-top border-md-top-0 border-white-fade" data-ga-click="Header, go to GitHub, text:Back to GitHub" href="https://github.com">Back to GitHub</a> <a class="Header-link d-block d-md-none mr-0 mr-md-3 py-2 py-md-0 border-top border-md-top-0 border-white-fade" data-ga-click="Header, sign in" data-hydro-click="{&quot;event_type&quot;:&quot;authentication.click&quot;,&quot;payload&quot;:{&quot;location_in_page&quot;:&quot;gist header&quot;,&quot;repository_id&quot;:null,&quot;auth_type&quot;:&quot;LOG_IN&quot;,&quot;originating_url&quot;:&quot;https://gist.github.com/humannus/ad5c4f407a81cbe6f0a5a8014c7315a9&quot;,&quot;user_id&quot;:null}}" data-hydro-click-hmac="40dba81a3a294ad167e68f5a19fdae402d40b5404d507e46613d8e86c6f98489" href="https://gist.github.com/auth/github?return_to=https%3A%2F%2Fgist.github.com%2Fhumannus%2Fad5c4f407a81cbe6f0a5a8014c7315a9"> Sign in </a> <a class="Header-link d-block d-md-none mr-0 mr-md-3 py-2 py-md-0 border-top border-md-top-0 border-white-fade" data-ga-click="Header, sign up" data-hydro-click="{&quot;event_type&quot;:&quot;authentication.click&quot;,&quot;payload&quot;:{&quot;location_in_page&quot;:&quot;gist header&quot;,&quot;repository_id&quot;:null,&quot;auth_type&quot;:&quot;SIGN_UP&quot;,&quot;originating_url&quot;:&quot;https://gist.github.com/humannus/ad5c4f407a81cbe6f0a5a8014c7315a9&quot;,&quot;user_id&quot;:null}}" data-hydro-click-hmac="cd388a400abc55c2528e4d00b6b538e7d90ad55e6ba646ca0d22e1c22c5ef677" href="/join?return_to=https%3A%2F%2Fgist.github.com%2Fhumannus%2Fad5c4f407a81cbe6f0a5a8014c7315a9&amp;source=header-gist"> Sign up </a></nav> </div> <div class="Header-item Header-item--full flex-justify-center d-md-none position-relative"> <a class="Header-link" data-hotkey="g d" aria-label="Gist Homepage " href="/"> <svg aria-hidden="true" height="24" viewBox="0 0 24 24" version="1.1" width="24" data-view-component="true" class="octicon octicon-mark-github v-align-middle d-inline-block d-md-none"> <path d="M12.5.75C6.146.75 1 5.896 1 12.25c0 5.089 3.292 9.387 7.863 10.91.575.101.79-.244.79-.546 0-.273-.014-1.178-.014-2.142-2.889.532-3.636-.704-3.866-1.35-.13-.331-.69-1.352-1.18-1.625-.402-.216-.977-.748-.014-.762.906-.014 1.553.834 1.769 1.179 1.035 1.74 2.688 1.25 3.349.948.1-.747.402-1.25.733-1.538-2.559-.287-5.232-1.279-5.232-5.678 0-1.25.445-2.285 1.178-3.09-.115-.288-.517-1.467.115-3.048 0 0 .963-.302 3.163 1.179.92-.259 1.897-.388 2.875-.388.977 0 1.955.13 2.875.388 2.2-1.495 3.162-1.179 3.162-1.179.633 1.581.23 2.76.115 3.048.733.805 1.179 1.825 1.179 3.09 0 4.413-2.688 5.39-5.247 5.678.417.36.776 1.05.776 2.128 0 1.538-.014 2.774-.014 3.162 0 .302.216.662.79.547C20.709 21.637 24 17.324 24 12.25 24 5.896 18.854.75 12.5.75Z"></path> </svg> <svg aria-hidden="true" height="24" viewBox="0 0 68 24" version="1.1" width="68" data-view-component="true" class="octicon octicon-logo-github v-align-middle d-none d-md-inline-block"> <path d="M27.8 17.908h-.03c.013 0 .022.014.035.017l.01-.002-.016-.015Zm.005.017c-.14.001-.49.073-.861.073-1.17 0-1.575-.536-1.575-1.234v-4.652h2.385c.135 0 .24-.12.24-.283V9.302c0-.133-.12-.252-.24-.252H25.37V5.913c0-.119-.075-.193-.21-.193h-3.24c-.136 0-.21.074-.21.193V9.14s-1.636.401-1.741.416a.255.255 0 0 0-.195.253v2.021c0 .164.12.282.255.282h1.665v4.876c0 3.627 2.55 3.998 4.29 3.998.796 0 1.756-.252 1.906-.327.09-.03.135-.134.135-.238v-2.23a.264.264 0 0 0-.219-.265Zm35.549-3.272c0-2.69-1.095-3.047-2.25-2.928-.9.06-1.62.505-1.62.505v5.232s.735.506 1.83.536c1.545.044 2.04-.506 2.04-3.345ZM67 14.415c0 5.099-1.665 6.555-4.576 6.555-2.46 0-3.78-1.233-3.78-1.233s-.06.683-.135.773c-.045.089-.12.118-.21.118h-2.22c-.15 0-.286-.119-.286-.252l.03-16.514a.26.26 0 0 1 .255-.252h3.196a.26.26 0 0 1 .255.252v5.604s1.23-.788 3.03-.788l-.015-.03c1.8 0 4.456.67 4.456 5.767ZM53.918 9.05h-3.15c-.165 0-.255.119-.255.282v8.086s-.826.58-1.95.58c-1.126 0-1.456-.506-1.456-1.62v-7.06a.262.262 0 0 0-.255-.254h-3.21a.262.262 0 0 0-.256.253v7.596c0 3.27 1.846 4.087 4.381 4.087 2.085 0 3.78-1.145 3.78-1.145s.076.58.12.67c.03.074.136.133.24.133h2.011a.243.243 0 0 0 .255-.253l.03-11.103c0-.133-.12-.252-.285-.252Zm-35.556-.015h-3.195c-.135 0-.255.134-.255.297v10.91c0 .297.195.401.45.401h2.88c.3 0 .375-.134.375-.401V9.287a.262.262 0 0 0-.255-.252ZM16.787 4.01c-1.155 0-2.07.907-2.07 2.051 0 1.145.915 2.051 2.07 2.051a2.04 2.04 0 0 0 2.04-2.05 2.04 2.04 0 0 0-2.04-2.052Zm24.74-.372H38.36a.262.262 0 0 0-.255.253v6.08H33.14v-6.08a.262.262 0 0 0-.255-.253h-3.196a.262.262 0 0 0-.255.253v16.514c0 .133.135.252.255.252h3.196a.262.262 0 0 0 .255-.253v-7.06h4.966l-.03 7.06c0 .134.12.253.255.253h3.195a.262.262 0 0 0 .255-.253V3.892a.262.262 0 0 0-.255-.253Zm-28.31 7.313v8.532c0 .06-.015.163-.09.193 0 0-1.875 1.323-4.966 1.323C4.426 21 0 19.84 0 12.2S3.87 2.986 7.651 3c3.27 0 4.59.728 4.8.862.06.075.09.134.09.208l-.63 2.646c0 .134-.134.297-.3.253-.54-.164-1.35-.49-3.255-.49-2.205 0-4.575.623-4.575 5.543s2.25 5.5 3.87 5.5c1.38 0 1.875-.164 1.875-.164V13.94H7.321c-.165 0-.285-.12-.285-.253v-2.735c0-.134.12-.252.285-.252h5.61c.166 0 .286.118.286.252Z"></path> </svg> <svg aria-hidden="true" height="24" viewBox="0 0 38 24" version="1.1" width="38" data-view-component="true" class="octicon octicon-logo-gist v-align-middle d-none d-md-inline-block"> <path d="M7.05 13.095v-1.5h5.28v8.535c-1.17.555-2.925.96-5.385.96C1.665 21.09 0 17.055 0 12.045S1.695 3 6.945 3c2.43 0 3.96.495 4.92.99v1.575c-1.83-.75-3-1.095-4.92-1.095-3.855 0-5.22 3.315-5.22 7.59s1.365 7.575 5.205 7.575c1.335 0 2.97-.105 3.795-.51v-6.03H7.05Zm16.47 1.035h.045c3.33.3 4.125 1.425 4.125 3.345 0 1.815-1.14 3.615-4.71 3.615-1.125 0-2.745-.285-3.495-.585v-1.41c.705.255 1.83.54 3.495.54 2.43 0 3.09-1.035 3.09-2.13 0-1.065-.33-1.815-2.655-2.01-3.39-.3-4.095-1.5-4.095-3.12 0-1.665 1.08-3.465 4.38-3.465 1.095 0 2.34.135 3.375.585v1.41c-.915-.3-1.83-.54-3.405-.54-2.325 0-2.82.855-2.82 2.01 0 1.035.42 1.56 2.67 1.755Zm12.87-4.995v1.275h-3.63v7.305c0 1.425.795 2.01 2.25 2.01.3 0 .63 0 .915-.045v1.335c-.255.045-.75.075-1.035.075-1.965 0-3.75-.9-3.75-3.195v-7.5H28.8v-.72l2.34-.66V5.85l1.62-.465v3.75h3.63ZM16.635 9.09v9.615c0 .81.285 1.05 1.005 1.05v1.335c-1.71 0-2.58-.705-2.58-2.58V9.09h1.575Zm.375-3.495c0 .66-.51 1.17-1.17 1.17a1.14 1.14 0 0 1-1.155-1.17c0-.66.48-1.17 1.155-1.17s1.17.51 1.17 1.17Z"></path> </svg> </a> </div> <div class="Header-item f4 mr-0" role="navigation" aria-label="Sign in or sign up"> <a class="Header-link no-underline mr-3" data-ga-click="Header, sign in" data-hydro-click="{&quot;event_type&quot;:&quot;authentication.click&quot;,&quot;payload&quot;:{&quot;location_in_page&quot;:&quot;gist header&quot;,&quot;repository_id&quot;:null,&quot;auth_type&quot;:&quot;LOG_IN&quot;,&quot;originating_url&quot;:&quot;https://gist.github.com/humannus/ad5c4f407a81cbe6f0a5a8014c7315a9&quot;,&quot;user_id&quot;:null}}" data-hydro-click-hmac="40dba81a3a294ad167e68f5a19fdae402d40b5404d507e46613d8e86c6f98489" href="https://gist.github.com/auth/github?return_to=https%3A%2F%2Fgist.github.com%2Fhumannus%2Fad5c4f407a81cbe6f0a5a8014c7315a9"> Sign&nbsp;in </a> <a class="Header-link d-inline-block no-underline border color-border-default rounded px-2 py-1" data-ga-click="Header, sign up" data-hydro-click="{&quot;event_type&quot;:&quot;authentication.click&quot;,&quot;payload&quot;:{&quot;location_in_page&quot;:&quot;gist header&quot;,&quot;repository_id&quot;:null,&quot;auth_type&quot;:&quot;SIGN_UP&quot;,&quot;originating_url&quot;:&quot;https://gist.github.com/humannus/ad5c4f407a81cbe6f0a5a8014c7315a9&quot;,&quot;user_id&quot;:null}}" data-hydro-click-hmac="cd388a400abc55c2528e4d00b6b538e7d90ad55e6ba646ca0d22e1c22c5ef677" href="/join?return_to=https%3A%2F%2Fgist.github.com%2Fhumannus%2Fad5c4f407a81cbe6f0a5a8014c7315a9&amp;source=header-gist"> Sign&nbsp;up </a> </div> </div> <div hidden="hidden" data-view-component="true" class="js-stale-session-flash stale-session-flash flash flash-warn flash-full"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-alert"> <path d="M6.457 1.047c.659-1.234 2.427-1.234 3.086 0l6.082 11.378A1.75 1.75 0 0 1 14.082 15H1.918a1.75 1.75 0 0 1-1.543-2.575Zm1.763.707a.25.25 0 0 0-.44 0L1.698 13.132a.25.25 0 0 0 .22.368h12.164a.25.25 0 0 0 .22-.368Zm.53 3.996v2.5a.75.75 0 0 1-1.5 0v-2.5a.75.75 0 0 1 1.5 0ZM9 11a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z"></path> </svg> <span class="js-stale-session-flash-signed-in" hidden>You signed in with another tab or window. <a class="Link--inTextBlock" href="">Reload</a> to refresh your session.</span> <span class="js-stale-session-flash-signed-out" hidden>You signed out in another tab or window. <a class="Link--inTextBlock" href="">Reload</a> to refresh your session.</span> <span class="js-stale-session-flash-switched" hidden>You switched accounts on another tab or window. <a class="Link--inTextBlock" href="">Reload</a> to refresh your session.</span> <button id="icon-button-b8886357-c60e-400f-93dc-5c06839c9a5e" aria-labelledby="tooltip-39de97bf-54ac-4dd9-9e14-3e079efe34eb" type="button" data-view-component="true" class="Button Button--iconOnly Button--invisible Button--medium flash-close js-flash-close"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-x Button-visual"> <path d="M3.72 3.72a.75.75 0 0 1 1.06 0L8 6.94l3.22-3.22a.749.749 0 0 1 1.275.326.749.749 0 0 1-.215.734L9.06 8l3.22 3.22a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L8 9.06l-3.22 3.22a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042L6.94 8 3.72 4.78a.75.75 0 0 1 0-1.06Z"></path> </svg> </button><tool-tip id="tooltip-39de97bf-54ac-4dd9-9e14-3e079efe34eb" for="icon-button-b8886357-c60e-400f-93dc-5c06839c9a5e" popover="manual" data-direction="s" data-type="label" data-view-component="true" class="sr-only position-absolute">Dismiss alert</tool-tip> </div> </div> <div id="start-of-content" class="show-on-focus"></div> <div id="js-flash-container" class="flash-container" data-turbo-replace> <template class="js-flash-template"> <div class="flash flash-full {{ className }}"> <div > <button autofocus class="flash-close js-flash-close" type="button" aria-label="Dismiss this message"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-x"> <path d="M3.72 3.72a.75.75 0 0 1 1.06 0L8 6.94l3.22-3.22a.749.749 0 0 1 1.275.326.749.749 0 0 1-.215.734L9.06 8l3.22 3.22a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L8 9.06l-3.22 3.22a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042L6.94 8 3.72 4.78a.75.75 0 0 1 0-1.06Z"></path> </svg> </button> <div aria-atomic="true" role="alert" class="js-flash-alert"> <div>{{ message }}</div> </div> </div> </div> </template> </div> <div class="application-main " data-commit-hovercards-enabled data-discussion-hovercards-enabled data-issue-and-pr-hovercards-enabled > <div itemscope itemtype="http://schema.org/Code"> <main id="gist-pjax-container"> <div class="gist-detail-intro gist-banner pb-3"> <div class="text-center container-lg px-3"> <p class="lead"> Instantly share code, notes, and snippets. </p> </div> </div> <div class="gisthead pagehead pb-0 pt-3 mb-4"> <div class="px-0"> <div class="mb-3 d-flex px-3 px-md-3 px-lg-5"> <div class="flex-auto min-width-0 width-fit mr-3"> <div class="d-flex"> <div class="d-none d-md-block"> <a class="mr-2 flex-shrink-0" data-hovercard-type="user" data-hovercard-url="/users/humannus/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="/humannus"><img class="avatar avatar-user" src="https://avatars.githubusercontent.com/u/47784589?s=64&amp;v=4" width="32" height="32" alt="@humannus" /></a> </div> <div class="d-flex flex-column width-full"> <div class="d-flex flex-row width-full"> <h1 class="wb-break-word f3 text-normal mb-md-0 mb-1"> <span class="author"><a data-hovercard-type="user" data-hovercard-url="/users/humannus/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="/humannus">humannus</a></span><!-- --><span class="mx-1 color-fg-muted">/</span><!-- --><strong itemprop="name" class="css-truncate-target mr-1" style="max-width: 410px"><a href="/humannus/ad5c4f407a81cbe6f0a5a8014c7315a9">index.html</a></strong> </h1> </div> <div class="note m-0"> Last active <relative-time tense="past" datetime="2024-10-09T06:58:35Z" data-view-component="true">October 9, 2024 06:58</relative-time> </div> </div> </div> </div> <ul class="d-md-flex pagehead-actions float-none mr-2"> </ul> <div class="d-inline-block d-md-none ml-auto"> <action-menu data-select-variant="none" data-view-component="true" class="flex-self-start ml-auto d-inline-block"> <focus-group direction="vertical" mnemonics retain> <button id="gist_options-button" popovertarget="gist_options-overlay" aria-controls="gist_options-list" aria-haspopup="true" aria-labelledby="tooltip-f741d703-9523-4d9c-9e74-68ef53b61153" type="button" data-view-component="true" class="Button Button--iconOnly Button--secondary Button--small"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-kebab-horizontal Button-visual"> <path d="M8 9a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3ZM1.5 9a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Zm13 0a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Z"></path> </svg> </button><tool-tip id="tooltip-f741d703-9523-4d9c-9e74-68ef53b61153" for="gist_options-button" popover="manual" data-direction="s" data-type="label" data-view-component="true" class="sr-only position-absolute">Show Gist options</tool-tip> <anchored-position id="gist_options-overlay" anchor="gist_options-button" align="start" side="outside-bottom" anchor-offset="normal" popover="auto" data-view-component="true"> <div data-view-component="true" class="Overlay Overlay--size-auto"> <div data-view-component="true" class="Overlay-body Overlay-body--paddingNone"> <action-list> <div data-view-component="true"> <ul aria-labelledby="gist_options-button" id="gist_options-list" role="menu" data-view-component="true" class="ActionListWrap--inset ActionListWrap"> <li rel="nofollow" data-hydro-click="{&quot;event_type&quot;:&quot;clone_or_download.click&quot;,&quot;payload&quot;:{&quot;feature_clicked&quot;:&quot;DOWNLOAD_ZIP&quot;,&quot;git_repository_type&quot;:&quot;GIST&quot;,&quot;gist_id&quot;:133204825,&quot;originating_url&quot;:&quot;https://gist.github.com/humannus/ad5c4f407a81cbe6f0a5a8014c7315a9&quot;,&quot;user_id&quot;:null}}" data-hydro-click-hmac="8032ff90cd2d6e155c95175043c6b1b0fa5a768af359c79f59b7b2974349a523" data-ga-click="Gist, download zip, location:gist overview" data-targets="action-list.items" data-item-id="download_from_gist_options" role="none" data-view-component="true" class="ActionListItem"> <a tabindex="-1" id="item-faac332b-2371-4a31-81d9-2732b5996d1e" href="/humannus/ad5c4f407a81cbe6f0a5a8014c7315a9/archive/4d74154904e7b8333b94363b1ea835ce7c062cb2.zip" role="menuitem" data-view-component="true" class="ActionListContent"> <span data-view-component="true" class="ActionListItem-label"> Download ZIP </span> </a> </li> </ul> </div></action-list> </div> </div></anchored-position> </focus-group> </action-menu> </div> <ul class="d-md-flex d-none pagehead-actions float-none"> <li> <a id="gist-star-button" href="/login?return_to=https%3A%2F%2Fgist.github.com%2Fhumannus%2Fad5c4f407a81cbe6f0a5a8014c7315a9" rel="nofollow" data-hydro-click="{&quot;event_type&quot;:&quot;authentication.click&quot;,&quot;payload&quot;:{&quot;location_in_page&quot;:&quot;gist star button&quot;,&quot;repository_id&quot;:null,&quot;auth_type&quot;:&quot;LOG_IN&quot;,&quot;originating_url&quot;:&quot;https://gist.github.com/humannus/ad5c4f407a81cbe6f0a5a8014c7315a9&quot;,&quot;user_id&quot;:null}}" data-hydro-click-hmac="a70de4a667f36fd86b1c63c7f29621889c9f9caa3c8ea4748513eb0c10997aa0" aria-label="You must be signed in to star a gist" data-view-component="true" class="btn-with-count Button--secondary Button--small Button"> <span class="Button-content"> <span class="Button-visual Button-leadingVisual"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-star"> <path d="M8 .25a.75.75 0 0 1 .673.418l1.882 3.815 4.21.612a.75.75 0 0 1 .416 1.279l-3.046 2.97.719 4.192a.751.751 0 0 1-1.088.791L8 12.347l-3.766 1.98a.75.75 0 0 1-1.088-.79l.72-4.194L.818 6.374a.75.75 0 0 1 .416-1.28l4.21-.611L7.327.668A.75.75 0 0 1 8 .25Zm0 2.445L6.615 5.5a.75.75 0 0 1-.564.41l-3.097.45 2.24 2.184a.75.75 0 0 1 .216.664l-.528 3.084 2.769-1.456a.75.75 0 0 1 .698 0l2.77 1.456-.53-3.084a.75.75 0 0 1 .216-.664l2.24-2.183-3.096-.45a.75.75 0 0 1-.564-.41L8 2.694Z"></path> </svg> </span> <span class="Button-label">Star</span> <span class="Button-visual Button-trailingVisual"> <span class="sr-only">(<span aria-hidden="true" title="0" data-view-component="true" class="Counter">0</span>)</span> <span aria-hidden="true" title="0" data-view-component="true" class="Counter">0</span> </span> </span> </a><tool-tip id="tooltip-1e951a80-a0b4-432e-9498-065fe8303b98" for="gist-star-button" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">You must be signed in to star a gist</tool-tip> </li> <li> <a id="gist-fork-button" href="/login?return_to=https%3A%2F%2Fgist.github.com%2Fhumannus%2Fad5c4f407a81cbe6f0a5a8014c7315a9" rel="nofollow" data-hydro-click="{&quot;event_type&quot;:&quot;authentication.click&quot;,&quot;payload&quot;:{&quot;location_in_page&quot;:&quot;gist fork button&quot;,&quot;repository_id&quot;:null,&quot;auth_type&quot;:&quot;LOG_IN&quot;,&quot;originating_url&quot;:&quot;https://gist.github.com/humannus/ad5c4f407a81cbe6f0a5a8014c7315a9&quot;,&quot;user_id&quot;:null}}" data-hydro-click-hmac="a73195feb84213fa1b7d6b68779a8e010171292802ec0323d9b1ef24d61dd813" aria-label="You must be signed in to fork a gist" data-view-component="true" class="btn-with-count Button--secondary Button--small Button"> <span class="Button-content"> <span class="Button-visual Button-leadingVisual"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-repo-forked"> <path d="M5 5.372v.878c0 .414.336.75.75.75h4.5a.75.75 0 0 0 .75-.75v-.878a2.25 2.25 0 1 1 1.5 0v.878a2.25 2.25 0 0 1-2.25 2.25h-1.5v2.128a2.251 2.251 0 1 1-1.5 0V8.5h-1.5A2.25 2.25 0 0 1 3.5 6.25v-.878a2.25 2.25 0 1 1 1.5 0ZM5 3.25a.75.75 0 1 0-1.5 0 .75.75 0 0 0 1.5 0Zm6.75.75a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5Zm-3 8.75a.75.75 0 1 0-1.5 0 .75.75 0 0 0 1.5 0Z"></path> </svg> </span> <span class="Button-label">Fork</span> <span class="Button-visual Button-trailingVisual"> <span class="sr-only">(<span aria-hidden="true" title="0" data-view-component="true" class="Counter">0</span>)</span> <span aria-hidden="true" title="0" data-view-component="true" class="Counter">0</span> </span> </span> </a><tool-tip id="tooltip-87db6ea3-6a7a-4be1-ae2c-7910a58b6c35" for="gist-fork-button" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">You must be signed in to fork a gist</tool-tip> </li> </ul> </div> <ul class="d-flex d-md-none px-3 mb-2 pagehead-actions float-none" > <li> <div data-view-component="true" class="flex-items-center d-inline-flex"> <action-menu data-menu-input="gist-share-url-sized-down" data-select-variant="single" data-dynamic-label="" data-view-component="true" class="flex-shrink-0"> <focus-group direction="vertical" mnemonics retain> <button id="action-menu-c7fcb416-61d6-4a08-87ac-aee81da07ff6-button" popovertarget="action-menu-c7fcb416-61d6-4a08-87ac-aee81da07ff6-overlay" aria-controls="action-menu-c7fcb416-61d6-4a08-87ac-aee81da07ff6-list" aria-haspopup="true" type="button" data-view-component="true" class="rounded-right-0 border-right-0 Button--secondary Button--small Button"> <span class="Button-content"> <span class="Button-label">Embed</span> </span> <span class="Button-visual Button-trailingAction"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-triangle-down"> <path d="m4.427 7.427 3.396 3.396a.25.25 0 0 0 .354 0l3.396-3.396A.25.25 0 0 0 11.396 7H4.604a.25.25 0 0 0-.177.427Z"></path> </svg> </span> </button> <anchored-position id="action-menu-c7fcb416-61d6-4a08-87ac-aee81da07ff6-overlay" anchor="action-menu-c7fcb416-61d6-4a08-87ac-aee81da07ff6-button" align="start" side="outside-bottom" anchor-offset="normal" popover="auto" data-view-component="true"> <div data-view-component="true" class="Overlay Overlay--size-auto"> <div data-view-component="true" class="Overlay-body Overlay-body--paddingNone"> <action-list> <div data-view-component="true"> <ul aria-labelledby="action-menu-c7fcb416-61d6-4a08-87ac-aee81da07ff6-button" id="action-menu-c7fcb416-61d6-4a08-87ac-aee81da07ff6-list" role="menu" data-view-component="true" class="ActionListWrap--inset ActionListWrap"> <li data-targets="action-list.items" role="none" data-view-component="true" class="ActionListItem"> <button value="&lt;script src=&quot;https://gist.github.com/humannus/ad5c4f407a81cbe6f0a5a8014c7315a9.js&quot;&gt;&lt;/script&gt;" tabindex="-1" data-hydro-click="{&quot;event_type&quot;:&quot;clone_or_download.click&quot;,&quot;payload&quot;:{&quot;feature_clicked&quot;:&quot;EMBED&quot;,&quot;git_repository_type&quot;:&quot;GIST&quot;,&quot;gist_id&quot;:133204825,&quot;originating_url&quot;:&quot;https://gist.github.com/humannus/ad5c4f407a81cbe6f0a5a8014c7315a9&quot;,&quot;user_id&quot;:null}}" data-hydro-click-hmac="6f4fb6dbac795384e33425176e93c7d1394facdc10f3153dc27e1c4c1fe3ec20" id="item-3366867a-d286-4d16-9410-739f2610e891" type="button" role="menuitemradio" aria-checked="true" data-view-component="true" class="ActionListContent"> <span class="ActionListItem-visual ActionListItem-action--leading"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-check ActionListItem-singleSelectCheckmark"> <path d="M13.78 4.22a.75.75 0 0 1 0 1.06l-7.25 7.25a.75.75 0 0 1-1.06 0L2.22 9.28a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L6 10.94l6.72-6.72a.75.75 0 0 1 1.06 0Z"></path> </svg> </span> <span data-view-component="true" class="ActionListItem-descriptionWrap"> <span data-view-component="true" class="ActionListItem-label"> Embed </span> <span data-view-component="true" class="ActionListItem-description">Embed this gist in your website.</span> </span></button> </li> <li data-targets="action-list.items" role="none" data-view-component="true" class="ActionListItem"> <button value="https://gist.github.com/humannus/ad5c4f407a81cbe6f0a5a8014c7315a9" tabindex="-1" data-hydro-click="{&quot;event_type&quot;:&quot;clone_or_download.click&quot;,&quot;payload&quot;:{&quot;feature_clicked&quot;:&quot;SHARE&quot;,&quot;git_repository_type&quot;:&quot;GIST&quot;,&quot;gist_id&quot;:133204825,&quot;originating_url&quot;:&quot;https://gist.github.com/humannus/ad5c4f407a81cbe6f0a5a8014c7315a9&quot;,&quot;user_id&quot;:null}}" data-hydro-click-hmac="03a624c2099e286927fd3f277039ed3661ce7b8bfec39eed55b6355883f15ba6" id="item-07b9809a-809c-4c6d-8433-176fabdaf118" type="button" role="menuitemradio" aria-checked="false" data-view-component="true" class="ActionListContent"> <span class="ActionListItem-visual ActionListItem-action--leading"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-check ActionListItem-singleSelectCheckmark"> <path d="M13.78 4.22a.75.75 0 0 1 0 1.06l-7.25 7.25a.75.75 0 0 1-1.06 0L2.22 9.28a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L6 10.94l6.72-6.72a.75.75 0 0 1 1.06 0Z"></path> </svg> </span> <span data-view-component="true" class="ActionListItem-descriptionWrap"> <span data-view-component="true" class="ActionListItem-label"> Share </span> <span data-view-component="true" class="ActionListItem-description">Copy sharable link for this gist.</span> </span></button> </li> <li data-targets="action-list.items" role="none" data-view-component="true" class="ActionListItem"> <button value="https://gist.github.com/ad5c4f407a81cbe6f0a5a8014c7315a9.git" tabindex="-1" data-hydro-click="{&quot;event_type&quot;:&quot;clone_or_download.click&quot;,&quot;payload&quot;:{&quot;feature_clicked&quot;:&quot;USE_HTTPS&quot;,&quot;git_repository_type&quot;:&quot;GIST&quot;,&quot;gist_id&quot;:133204825,&quot;originating_url&quot;:&quot;https://gist.github.com/humannus/ad5c4f407a81cbe6f0a5a8014c7315a9&quot;,&quot;user_id&quot;:null}}" data-hydro-click-hmac="8de5d072d18b03c3564c50238e6d736c8c9a08926b4e5afb869c84503642efa2" id="item-71303812-6fd0-4510-a73e-c2d4678dfc37" type="button" role="menuitemradio" aria-checked="false" data-view-component="true" class="ActionListContent"> <span class="ActionListItem-visual ActionListItem-action--leading"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-check ActionListItem-singleSelectCheckmark"> <path d="M13.78 4.22a.75.75 0 0 1 0 1.06l-7.25 7.25a.75.75 0 0 1-1.06 0L2.22 9.28a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L6 10.94l6.72-6.72a.75.75 0 0 1 1.06 0Z"></path> </svg> </span> <span data-view-component="true" class="ActionListItem-descriptionWrap"> <span data-view-component="true" class="ActionListItem-label"> Clone via HTTPS </span> <span data-view-component="true" class="ActionListItem-description">Clone using the web URL.</span> </span></button> </li> <li role="presentation" aria-hidden="true" data-view-component="true" class="ActionList-sectionDivider"></li> <li target="_blank" rel="noopener noreferrer" data-targets="action-list.items" role="none" data-view-component="true" class="ActionListItem"> <a tabindex="-1" id="item-5a3d65de-85e4-49fd-8d21-c762d0b822a5" href="https://docs.github.com/articles/which-remote-url-should-i-use" role="menuitemradio" aria-checked="false" data-view-component="true" class="ActionListContent ActionListContent--visual16"> <span class="ActionListItem-visual ActionListItem-action--leading"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-check ActionListItem-singleSelectCheckmark"> <path d="M13.78 4.22a.75.75 0 0 1 0 1.06l-7.25 7.25a.75.75 0 0 1-1.06 0L2.22 9.28a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L6 10.94l6.72-6.72a.75.75 0 0 1 1.06 0Z"></path> </svg> </span> <span class="ActionListItem-visual ActionListItem-visual--leading"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-question"> <path d="M0 8a8 8 0 1 1 16 0A8 8 0 0 1 0 8Zm8-6.5a6.5 6.5 0 1 0 0 13 6.5 6.5 0 0 0 0-13ZM6.92 6.085h.001a.749.749 0 1 1-1.342-.67c.169-.339.436-.701.849-.977C6.845 4.16 7.369 4 8 4a2.756 2.756 0 0 1 1.637.525c.503.377.863.965.863 1.725 0 .448-.115.83-.329 1.15-.205.307-.47.513-.692.662-.109.072-.22.138-.313.195l-.006.004a6.24 6.24 0 0 0-.26.16.952.952 0 0 0-.276.245.75.75 0 0 1-1.248-.832c.184-.264.42-.489.692-.661.103-.067.207-.132.313-.195l.007-.004c.1-.061.182-.11.258-.161a.969.969 0 0 0 .277-.245C8.96 6.514 9 6.427 9 6.25a.612.612 0 0 0-.262-.525A1.27 1.27 0 0 0 8 5.5c-.369 0-.595.09-.74.187a1.01 1.01 0 0 0-.34.398ZM9 11a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z"></path> </svg> </span> <span data-view-component="true" class="ActionListItem-label"> Learn more about clone URLs </span> </a> </li> </ul> </div></action-list> </div> </div></anchored-position> </focus-group> </action-menu> <primer-text-field class="FormControl width-full FormControl--fullWidth"> <label for="gist-share-url-sized-down" class="sr-only FormControl-label"> Clone this repository at &amp;lt;script src=&amp;quot;https://gist.github.com/humannus/ad5c4f407a81cbe6f0a5a8014c7315a9.js&amp;quot;&amp;gt;&amp;lt;/script&amp;gt; </label> <div class="FormControl-input-wrap FormControl-input-wrap--small"> <input id="gist-share-url-sized-down" aria-label="Clone this repository at &amp;lt;script src=&amp;quot;https://gist.github.com/humannus/ad5c4f407a81cbe6f0a5a8014c7315a9.js&amp;quot;&amp;gt;&amp;lt;/script&amp;gt;" value="&lt;script src=&quot;https://gist.github.com/humannus/ad5c4f407a81cbe6f0a5a8014c7315a9.js&quot;&gt;&lt;/script&gt;" readonly="readonly" data-autoselect="true" data-target="primer-text-field.inputElement " aria-describedby="validation-8a74a652-e7c3-4a8e-9345-aa6d32bd3b8e" class="form-control FormControl-monospace FormControl-input FormControl-small rounded-left-0 rounded-right-0 border-right-0" type="text" name="gist-share-url-sized-down" /> </div> <div class="FormControl-inlineValidation" id="validation-8a74a652-e7c3-4a8e-9345-aa6d32bd3b8e" hidden="hidden"> <span class="FormControl-inlineValidation--visual" data-target="primer-text-field.validationSuccessIcon" hidden><svg aria-hidden="true" height="12" viewBox="0 0 12 12" version="1.1" width="12" data-view-component="true" class="octicon octicon-check-circle-fill"> <path d="M6 0a6 6 0 1 1 0 12A6 6 0 0 1 6 0Zm-.705 8.737L9.63 4.403 8.392 3.166 5.295 6.263l-1.7-1.702L2.356 5.8l2.938 2.938Z"></path> </svg></span> <span class=" FormControl-inlineValidation--visual" data-target="primer-text-field.validationErrorIcon"><svg aria-hidden="true" height="12" viewBox="0 0 12 12" version="1.1" width="12" data-view-component="true" class="octicon octicon-alert-fill"> <path d="M4.855.708c.5-.896 1.79-.896 2.29 0l4.675 8.351a1.312 1.312 0 0 1-1.146 1.954H1.33A1.313 1.313 0 0 1 .183 9.058ZM7 7V3H5v4Zm-1 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z"></path> </svg></span> <span></span> </div> </primer-text-field> <span data-view-component="true"> <clipboard-copy id="clipboard-button" aria-label="Copy" for="gist-share-url-sized-down" data-hydro-click="{&quot;event_type&quot;:&quot;clone_or_download.click&quot;,&quot;payload&quot;:{&quot;feature_clicked&quot;:&quot;COPY_URL&quot;,&quot;git_repository_type&quot;:&quot;GIST&quot;,&quot;gist_id&quot;:133204825,&quot;originating_url&quot;:&quot;https://gist.github.com/humannus/ad5c4f407a81cbe6f0a5a8014c7315a9&quot;,&quot;user_id&quot;:null}}" data-hydro-click-hmac="cd4af0ed788ba99c36e7f6f32b16cb3ed4027393fed68bf09f59658639a5a81b" type="button" data-view-component="true" class="rounded-left-0 Button--secondary Button--small Button"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-copy"> <path d="M0 6.75C0 5.784.784 5 1.75 5h1.5a.75.75 0 0 1 0 1.5h-1.5a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h7.5a.25.25 0 0 0 .25-.25v-1.5a.75.75 0 0 1 1.5 0v1.5A1.75 1.75 0 0 1 9.25 16h-7.5A1.75 1.75 0 0 1 0 14.25Z"></path><path d="M5 1.75C5 .784 5.784 0 6.75 0h7.5C15.216 0 16 .784 16 1.75v7.5A1.75 1.75 0 0 1 14.25 11h-7.5A1.75 1.75 0 0 1 5 9.25Zm1.75-.25a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h7.5a.25.25 0 0 0 .25-.25v-7.5a.25.25 0 0 0-.25-.25Z"></path> </svg> <svg style="display: none;" aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-check color-fg-success"> <path d="M13.78 4.22a.75.75 0 0 1 0 1.06l-7.25 7.25a.75.75 0 0 1-1.06 0L2.22 9.28a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L6 10.94l6.72-6.72a.75.75 0 0 1 1.06 0Z"></path> </svg> </clipboard-copy> <div aria-live="polite" aria-atomic="true" class="sr-only" data-clipboard-copy-feedback></div> </span> </div> </li> <li> <button href="https://desktop.github.com" data-hydro-click="{&quot;event_type&quot;:&quot;clone_or_download.click&quot;,&quot;payload&quot;:{&quot;feature_clicked&quot;:&quot;OPEN_IN_DESKTOP&quot;,&quot;git_repository_type&quot;:&quot;GIST&quot;,&quot;gist_id&quot;:133204825,&quot;originating_url&quot;:&quot;https://gist.github.com/humannus/ad5c4f407a81cbe6f0a5a8014c7315a9&quot;,&quot;user_id&quot;:null}}" data-hydro-click-hmac="e2d8ee33637083786cb362685a11bb24c2ee7a9432a1d7148c113e891164e0d1" data-platforms="windows,mac" id="icon-button-762982a7-d489-46eb-ae9a-90c40d450e44" aria-labelledby="tooltip-bd0c05e6-12ad-4213-8af6-4100e286a430" type="button" data-view-component="true" class="Button Button--iconOnly Button--secondary Button--small js-remove-unless-platform"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-desktop-download Button-visual"> <path d="m4.927 5.427 2.896 2.896a.25.25 0 0 0 .354 0l2.896-2.896A.25.25 0 0 0 10.896 5H8.75V.75a.75.75 0 1 0-1.5 0V5H5.104a.25.25 0 0 0-.177.427Z"></path><path d="M1.573 2.573a.25.25 0 0 0-.073.177v7.5a.25.25 0 0 0 .25.25h12.5a.25.25 0 0 0 .25-.25v-7.5a.25.25 0 0 0-.25-.25h-3a.75.75 0 1 1 0-1.5h3A1.75 1.75 0 0 1 16 2.75v7.5A1.75 1.75 0 0 1 14.25 12h-3.727c.099 1.041.52 1.872 1.292 2.757A.75.75 0 0 1 11.25 16h-6.5a.75.75 0 0 1-.565-1.243c.772-.885 1.192-1.716 1.292-2.757H1.75A1.75 1.75 0 0 1 0 10.25v-7.5A1.75 1.75 0 0 1 1.75 1h3a.75.75 0 0 1 0 1.5h-3a.25.25 0 0 0-.177.073ZM6.982 12a5.72 5.72 0 0 1-.765 2.5h3.566a5.72 5.72 0 0 1-.765-2.5H6.982Z"></path> </svg> </button><tool-tip id="tooltip-bd0c05e6-12ad-4213-8af6-4100e286a430" for="icon-button-762982a7-d489-46eb-ae9a-90c40d450e44" popover="manual" data-direction="s" data-type="label" data-view-component="true" class="sr-only position-absolute">Save humannus/ad5c4f407a81cbe6f0a5a8014c7315a9 to your computer and use it in GitHub Desktop.</tool-tip> </li> </ul> <div class="d-flex flex-md-row flex-column px-0 pr-md-3 px-lg-5"> <div class="flex-md-order-1 flex-order-2 flex-auto"> <nav class="UnderlineNav box-shadow-none px-3 px-lg-0" aria-label="Gist" data-pjax="#gist-pjax-container"> <div class="UnderlineNav-body"> <a class="js-selected-navigation-item selected UnderlineNav-item" data-pjax="true" data-hotkey="g c" aria-current="page" data-selected-links="gist_code /humannus/ad5c4f407a81cbe6f0a5a8014c7315a9" href="/humannus/ad5c4f407a81cbe6f0a5a8014c7315a9"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-code UnderlineNav-octicon"> <path d="m11.28 3.22 4.25 4.25a.75.75 0 0 1 0 1.06l-4.25 4.25a.749.749 0 0 1-1.275-.326.749.749 0 0 1 .215-.734L13.94 8l-3.72-3.72a.749.749 0 0 1 .326-1.275.749.749 0 0 1 .734.215Zm-6.56 0a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042L2.06 8l3.72 3.72a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L.47 8.53a.75.75 0 0 1 0-1.06Z"></path> </svg> Code </a> <a class="js-selected-navigation-item UnderlineNav-item" data-pjax="true" data-hotkey="g r" data-selected-links="gist_revisions /humannus/ad5c4f407a81cbe6f0a5a8014c7315a9/revisions" href="/humannus/ad5c4f407a81cbe6f0a5a8014c7315a9/revisions"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-git-commit UnderlineNav-octicon"> <path d="M11.93 8.5a4.002 4.002 0 0 1-7.86 0H.75a.75.75 0 0 1 0-1.5h3.32a4.002 4.002 0 0 1 7.86 0h3.32a.75.75 0 0 1 0 1.5Zm-1.43-.75a2.5 2.5 0 1 0-5 0 2.5 2.5 0 0 0 5 0Z"></path> </svg> Revisions <span title="3" data-view-component="true" class="Counter">3</span> </a> </div> </nav> </div> <div class="d-md-flex d-none flex-items-center flex-md-order-2 flex-order-1" data-multiple> <div data-view-component="true" class="flex-items-center d-inline-flex"> <action-menu data-menu-input="gist-share-url-original" data-select-variant="single" data-dynamic-label="" data-view-component="true" class="flex-shrink-0"> <focus-group direction="vertical" mnemonics retain> <button id="action-menu-ace8e75c-f908-4447-bccc-df4451cc5539-button" popovertarget="action-menu-ace8e75c-f908-4447-bccc-df4451cc5539-overlay" aria-controls="action-menu-ace8e75c-f908-4447-bccc-df4451cc5539-list" aria-haspopup="true" type="button" data-view-component="true" class="rounded-right-0 border-right-0 Button--secondary Button--small Button"> <span class="Button-content"> <span class="Button-label">Embed</span> </span> <span class="Button-visual Button-trailingAction"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-triangle-down"> <path d="m4.427 7.427 3.396 3.396a.25.25 0 0 0 .354 0l3.396-3.396A.25.25 0 0 0 11.396 7H4.604a.25.25 0 0 0-.177.427Z"></path> </svg> </span> </button> <anchored-position id="action-menu-ace8e75c-f908-4447-bccc-df4451cc5539-overlay" anchor="action-menu-ace8e75c-f908-4447-bccc-df4451cc5539-button" align="start" side="outside-bottom" anchor-offset="normal" popover="auto" data-view-component="true"> <div data-view-component="true" class="Overlay Overlay--size-auto"> <div data-view-component="true" class="Overlay-body Overlay-body--paddingNone"> <action-list> <div data-view-component="true"> <ul aria-labelledby="action-menu-ace8e75c-f908-4447-bccc-df4451cc5539-button" id="action-menu-ace8e75c-f908-4447-bccc-df4451cc5539-list" role="menu" data-view-component="true" class="ActionListWrap--inset ActionListWrap"> <li data-targets="action-list.items" role="none" data-view-component="true" class="ActionListItem"> <button value="&lt;script src=&quot;https://gist.github.com/humannus/ad5c4f407a81cbe6f0a5a8014c7315a9.js&quot;&gt;&lt;/script&gt;" tabindex="-1" data-hydro-click="{&quot;event_type&quot;:&quot;clone_or_download.click&quot;,&quot;payload&quot;:{&quot;feature_clicked&quot;:&quot;EMBED&quot;,&quot;git_repository_type&quot;:&quot;GIST&quot;,&quot;gist_id&quot;:133204825,&quot;originating_url&quot;:&quot;https://gist.github.com/humannus/ad5c4f407a81cbe6f0a5a8014c7315a9&quot;,&quot;user_id&quot;:null}}" data-hydro-click-hmac="6f4fb6dbac795384e33425176e93c7d1394facdc10f3153dc27e1c4c1fe3ec20" id="item-da220a66-5aef-439d-a3a2-22ba7e7a1bcf" type="button" role="menuitemradio" aria-checked="true" data-view-component="true" class="ActionListContent"> <span class="ActionListItem-visual ActionListItem-action--leading"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-check ActionListItem-singleSelectCheckmark"> <path d="M13.78 4.22a.75.75 0 0 1 0 1.06l-7.25 7.25a.75.75 0 0 1-1.06 0L2.22 9.28a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L6 10.94l6.72-6.72a.75.75 0 0 1 1.06 0Z"></path> </svg> </span> <span data-view-component="true" class="ActionListItem-descriptionWrap"> <span data-view-component="true" class="ActionListItem-label"> Embed </span> <span data-view-component="true" class="ActionListItem-description">Embed this gist in your website.</span> </span></button> </li> <li data-targets="action-list.items" role="none" data-view-component="true" class="ActionListItem"> <button value="https://gist.github.com/humannus/ad5c4f407a81cbe6f0a5a8014c7315a9" tabindex="-1" data-hydro-click="{&quot;event_type&quot;:&quot;clone_or_download.click&quot;,&quot;payload&quot;:{&quot;feature_clicked&quot;:&quot;SHARE&quot;,&quot;git_repository_type&quot;:&quot;GIST&quot;,&quot;gist_id&quot;:133204825,&quot;originating_url&quot;:&quot;https://gist.github.com/humannus/ad5c4f407a81cbe6f0a5a8014c7315a9&quot;,&quot;user_id&quot;:null}}" data-hydro-click-hmac="03a624c2099e286927fd3f277039ed3661ce7b8bfec39eed55b6355883f15ba6" id="item-b351ec0d-b1a7-4d5e-87fa-85e6d4081918" type="button" role="menuitemradio" aria-checked="false" data-view-component="true" class="ActionListContent"> <span class="ActionListItem-visual ActionListItem-action--leading"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-check ActionListItem-singleSelectCheckmark"> <path d="M13.78 4.22a.75.75 0 0 1 0 1.06l-7.25 7.25a.75.75 0 0 1-1.06 0L2.22 9.28a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L6 10.94l6.72-6.72a.75.75 0 0 1 1.06 0Z"></path> </svg> </span> <span data-view-component="true" class="ActionListItem-descriptionWrap"> <span data-view-component="true" class="ActionListItem-label"> Share </span> <span data-view-component="true" class="ActionListItem-description">Copy sharable link for this gist.</span> </span></button> </li> <li data-targets="action-list.items" role="none" data-view-component="true" class="ActionListItem"> <button value="https://gist.github.com/ad5c4f407a81cbe6f0a5a8014c7315a9.git" tabindex="-1" data-hydro-click="{&quot;event_type&quot;:&quot;clone_or_download.click&quot;,&quot;payload&quot;:{&quot;feature_clicked&quot;:&quot;USE_HTTPS&quot;,&quot;git_repository_type&quot;:&quot;GIST&quot;,&quot;gist_id&quot;:133204825,&quot;originating_url&quot;:&quot;https://gist.github.com/humannus/ad5c4f407a81cbe6f0a5a8014c7315a9&quot;,&quot;user_id&quot;:null}}" data-hydro-click-hmac="8de5d072d18b03c3564c50238e6d736c8c9a08926b4e5afb869c84503642efa2" id="item-5b18dfb6-26e7-454f-8381-95271d12c183" type="button" role="menuitemradio" aria-checked="false" data-view-component="true" class="ActionListContent"> <span class="ActionListItem-visual ActionListItem-action--leading"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-check ActionListItem-singleSelectCheckmark"> <path d="M13.78 4.22a.75.75 0 0 1 0 1.06l-7.25 7.25a.75.75 0 0 1-1.06 0L2.22 9.28a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L6 10.94l6.72-6.72a.75.75 0 0 1 1.06 0Z"></path> </svg> </span> <span data-view-component="true" class="ActionListItem-descriptionWrap"> <span data-view-component="true" class="ActionListItem-label"> Clone via HTTPS </span> <span data-view-component="true" class="ActionListItem-description">Clone using the web URL.</span> </span></button> </li> <li role="presentation" aria-hidden="true" data-view-component="true" class="ActionList-sectionDivider"></li> <li target="_blank" rel="noopener noreferrer" data-targets="action-list.items" role="none" data-view-component="true" class="ActionListItem"> <a tabindex="-1" id="item-58b6d2f8-2338-4fd0-a7a6-b79759183e23" href="https://docs.github.com/articles/which-remote-url-should-i-use" role="menuitemradio" aria-checked="false" data-view-component="true" class="ActionListContent ActionListContent--visual16"> <span class="ActionListItem-visual ActionListItem-action--leading"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-check ActionListItem-singleSelectCheckmark"> <path d="M13.78 4.22a.75.75 0 0 1 0 1.06l-7.25 7.25a.75.75 0 0 1-1.06 0L2.22 9.28a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L6 10.94l6.72-6.72a.75.75 0 0 1 1.06 0Z"></path> </svg> </span> <span class="ActionListItem-visual ActionListItem-visual--leading"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-question"> <path d="M0 8a8 8 0 1 1 16 0A8 8 0 0 1 0 8Zm8-6.5a6.5 6.5 0 1 0 0 13 6.5 6.5 0 0 0 0-13ZM6.92 6.085h.001a.749.749 0 1 1-1.342-.67c.169-.339.436-.701.849-.977C6.845 4.16 7.369 4 8 4a2.756 2.756 0 0 1 1.637.525c.503.377.863.965.863 1.725 0 .448-.115.83-.329 1.15-.205.307-.47.513-.692.662-.109.072-.22.138-.313.195l-.006.004a6.24 6.24 0 0 0-.26.16.952.952 0 0 0-.276.245.75.75 0 0 1-1.248-.832c.184-.264.42-.489.692-.661.103-.067.207-.132.313-.195l.007-.004c.1-.061.182-.11.258-.161a.969.969 0 0 0 .277-.245C8.96 6.514 9 6.427 9 6.25a.612.612 0 0 0-.262-.525A1.27 1.27 0 0 0 8 5.5c-.369 0-.595.09-.74.187a1.01 1.01 0 0 0-.34.398ZM9 11a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z"></path> </svg> </span> <span data-view-component="true" class="ActionListItem-label"> Learn more about clone URLs </span> </a> </li> </ul> </div></action-list> </div> </div></anchored-position> </focus-group> </action-menu> <primer-text-field class="FormControl width-full FormControl--fullWidth"> <label for="gist-share-url-original" class="sr-only FormControl-label"> Clone this repository at &amp;lt;script src=&amp;quot;https://gist.github.com/humannus/ad5c4f407a81cbe6f0a5a8014c7315a9.js&amp;quot;&amp;gt;&amp;lt;/script&amp;gt; </label> <div class="FormControl-input-wrap FormControl-input-wrap--small"> <input id="gist-share-url-original" aria-label="Clone this repository at &amp;lt;script src=&amp;quot;https://gist.github.com/humannus/ad5c4f407a81cbe6f0a5a8014c7315a9.js&amp;quot;&amp;gt;&amp;lt;/script&amp;gt;" value="&lt;script src=&quot;https://gist.github.com/humannus/ad5c4f407a81cbe6f0a5a8014c7315a9.js&quot;&gt;&lt;/script&gt;" readonly="readonly" data-autoselect="true" data-target="primer-text-field.inputElement " aria-describedby="validation-1e331a62-7d30-411f-9180-905ca1474c2f" class="form-control FormControl-monospace FormControl-input FormControl-small rounded-left-0 rounded-right-0 border-right-0" type="text" name="gist-share-url-original" /> </div> <div class="FormControl-inlineValidation" id="validation-1e331a62-7d30-411f-9180-905ca1474c2f" hidden="hidden"> <span class="FormControl-inlineValidation--visual" data-target="primer-text-field.validationSuccessIcon" hidden><svg aria-hidden="true" height="12" viewBox="0 0 12 12" version="1.1" width="12" data-view-component="true" class="octicon octicon-check-circle-fill"> <path d="M6 0a6 6 0 1 1 0 12A6 6 0 0 1 6 0Zm-.705 8.737L9.63 4.403 8.392 3.166 5.295 6.263l-1.7-1.702L2.356 5.8l2.938 2.938Z"></path> </svg></span> <span class=" FormControl-inlineValidation--visual" data-target="primer-text-field.validationErrorIcon"><svg aria-hidden="true" height="12" viewBox="0 0 12 12" version="1.1" width="12" data-view-component="true" class="octicon octicon-alert-fill"> <path d="M4.855.708c.5-.896 1.79-.896 2.29 0l4.675 8.351a1.312 1.312 0 0 1-1.146 1.954H1.33A1.313 1.313 0 0 1 .183 9.058ZM7 7V3H5v4Zm-1 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z"></path> </svg></span> <span></span> </div> </primer-text-field> <span data-view-component="true"> <clipboard-copy id="clipboard-button" aria-label="Copy" for="gist-share-url-original" data-hydro-click="{&quot;event_type&quot;:&quot;clone_or_download.click&quot;,&quot;payload&quot;:{&quot;feature_clicked&quot;:&quot;COPY_URL&quot;,&quot;git_repository_type&quot;:&quot;GIST&quot;,&quot;gist_id&quot;:133204825,&quot;originating_url&quot;:&quot;https://gist.github.com/humannus/ad5c4f407a81cbe6f0a5a8014c7315a9&quot;,&quot;user_id&quot;:null}}" data-hydro-click-hmac="cd4af0ed788ba99c36e7f6f32b16cb3ed4027393fed68bf09f59658639a5a81b" type="button" data-view-component="true" class="rounded-left-0 Button--secondary Button--small Button"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-copy"> <path d="M0 6.75C0 5.784.784 5 1.75 5h1.5a.75.75 0 0 1 0 1.5h-1.5a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h7.5a.25.25 0 0 0 .25-.25v-1.5a.75.75 0 0 1 1.5 0v1.5A1.75 1.75 0 0 1 9.25 16h-7.5A1.75 1.75 0 0 1 0 14.25Z"></path><path d="M5 1.75C5 .784 5.784 0 6.75 0h7.5C15.216 0 16 .784 16 1.75v7.5A1.75 1.75 0 0 1 14.25 11h-7.5A1.75 1.75 0 0 1 5 9.25Zm1.75-.25a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h7.5a.25.25 0 0 0 .25-.25v-7.5a.25.25 0 0 0-.25-.25Z"></path> </svg> <svg style="display: none;" aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-check color-fg-success"> <path d="M13.78 4.22a.75.75 0 0 1 0 1.06l-7.25 7.25a.75.75 0 0 1-1.06 0L2.22 9.28a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L6 10.94l6.72-6.72a.75.75 0 0 1 1.06 0Z"></path> </svg> </clipboard-copy> <div aria-live="polite" aria-atomic="true" class="sr-only" data-clipboard-copy-feedback></div> </span> </div> <div class="ml-2"> <button href="https://desktop.github.com" data-hydro-click="{&quot;event_type&quot;:&quot;clone_or_download.click&quot;,&quot;payload&quot;:{&quot;feature_clicked&quot;:&quot;OPEN_IN_DESKTOP&quot;,&quot;git_repository_type&quot;:&quot;GIST&quot;,&quot;gist_id&quot;:133204825,&quot;originating_url&quot;:&quot;https://gist.github.com/humannus/ad5c4f407a81cbe6f0a5a8014c7315a9&quot;,&quot;user_id&quot;:null}}" data-hydro-click-hmac="e2d8ee33637083786cb362685a11bb24c2ee7a9432a1d7148c113e891164e0d1" data-platforms="windows,mac" id="icon-button-fb8146ac-ac65-4973-b4d7-7e923dcfe8dd" aria-labelledby="tooltip-4eef75c3-08be-4d2a-a876-d6d8af8a1dca" type="button" data-view-component="true" class="Button Button--iconOnly Button--secondary Button--small js-remove-unless-platform"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-desktop-download Button-visual"> <path d="m4.927 5.427 2.896 2.896a.25.25 0 0 0 .354 0l2.896-2.896A.25.25 0 0 0 10.896 5H8.75V.75a.75.75 0 1 0-1.5 0V5H5.104a.25.25 0 0 0-.177.427Z"></path><path d="M1.573 2.573a.25.25 0 0 0-.073.177v7.5a.25.25 0 0 0 .25.25h12.5a.25.25 0 0 0 .25-.25v-7.5a.25.25 0 0 0-.25-.25h-3a.75.75 0 1 1 0-1.5h3A1.75 1.75 0 0 1 16 2.75v7.5A1.75 1.75 0 0 1 14.25 12h-3.727c.099 1.041.52 1.872 1.292 2.757A.75.75 0 0 1 11.25 16h-6.5a.75.75 0 0 1-.565-1.243c.772-.885 1.192-1.716 1.292-2.757H1.75A1.75 1.75 0 0 1 0 10.25v-7.5A1.75 1.75 0 0 1 1.75 1h3a.75.75 0 0 1 0 1.5h-3a.25.25 0 0 0-.177.073ZM6.982 12a5.72 5.72 0 0 1-.765 2.5h3.566a5.72 5.72 0 0 1-.765-2.5H6.982Z"></path> </svg> </button><tool-tip id="tooltip-4eef75c3-08be-4d2a-a876-d6d8af8a1dca" for="icon-button-fb8146ac-ac65-4973-b4d7-7e923dcfe8dd" popover="manual" data-direction="s" data-type="label" data-view-component="true" class="sr-only position-absolute">Save humannus/ad5c4f407a81cbe6f0a5a8014c7315a9 to your computer and use it in GitHub Desktop.</tool-tip> </div> <div class="ml-2"> <a class="btn btn-sm" rel="nofollow" data-hydro-click="{&quot;event_type&quot;:&quot;clone_or_download.click&quot;,&quot;payload&quot;:{&quot;feature_clicked&quot;:&quot;DOWNLOAD_ZIP&quot;,&quot;git_repository_type&quot;:&quot;GIST&quot;,&quot;gist_id&quot;:133204825,&quot;originating_url&quot;:&quot;https://gist.github.com/humannus/ad5c4f407a81cbe6f0a5a8014c7315a9&quot;,&quot;user_id&quot;:null}}" data-hydro-click-hmac="8032ff90cd2d6e155c95175043c6b1b0fa5a768af359c79f59b7b2974349a523" data-ga-click="Gist, download zip, location:gist overview" href="/humannus/ad5c4f407a81cbe6f0a5a8014c7315a9/archive/4d74154904e7b8333b94363b1ea835ce7c062cb2.zip">Download ZIP</a> </div> </div> </div> </div> </div> <div class="container-lg px-3"> <div class="repository-content gist-content" > <div> <div itemprop="about"> Embedded ChatBot Chat Widget Example </div> <div class="js-gist-file-update-container js-task-list-container"> <div id="file-index-html" class="file my-2"> <div class="file-header d-flex flex-md-items-center flex-items-start"> <div class="file-actions flex-order-2 pt-0"> <a href="/humannus/ad5c4f407a81cbe6f0a5a8014c7315a9/raw/4d74154904e7b8333b94363b1ea835ce7c062cb2/index.html" data-view-component="true" class="Button--secondary Button--small Button"> <span class="Button-content"> <span class="Button-label">Raw</span> </span> </a> </div> <div class="file-info pr-4 d-flex flex-md-items-center flex-items-start flex-order-1 flex-auto"> <span class="mr-1"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-code-square color-fg-muted"> <path d="M0 1.75C0 .784.784 0 1.75 0h12.5C15.216 0 16 .784 16 1.75v12.5A1.75 1.75 0 0 1 14.25 16H1.75A1.75 1.75 0 0 1 0 14.25Zm1.75-.25a.25.25 0 0 0-.25.25v12.5c0 .138.112.25.25.25h12.5a.25.25 0 0 0 .25-.25V1.75a.25.25 0 0 0-.25-.25Zm7.47 3.97a.75.75 0 0 1 1.06 0l2 2a.75.75 0 0 1 0 1.06l-2 2a.749.749 0 0 1-1.275-.326.749.749 0 0 1 .215-.734L10.69 8 9.22 6.53a.75.75 0 0 1 0-1.06ZM6.78 6.53 5.31 8l1.47 1.47a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215l-2-2a.75.75 0 0 1 0-1.06l2-2a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042Z"></path> </svg> </span> <a class="wb-break-all" href="#file-index-html"> <strong class="user-select-contain gist-blob-name css-truncate-target"> index.html </strong> </a> </div> </div> <div itemprop="text" class="Box-body p-0 blob-wrapper data type-html gist-border-0"> <div class="js-check-bidi js-blob-code-container blob-code-content"> <template class="js-file-alert-template"> <div data-view-component="true" class="flash flash-warn flash-full d-flex flex-items-center"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-alert"> <path d="M6.457 1.047c.659-1.234 2.427-1.234 3.086 0l6.082 11.378A1.75 1.75 0 0 1 14.082 15H1.918a1.75 1.75 0 0 1-1.543-2.575Zm1.763.707a.25.25 0 0 0-.44 0L1.698 13.132a.25.25 0 0 0 .22.368h12.164a.25.25 0 0 0 .22-.368Zm.53 3.996v2.5a.75.75 0 0 1-1.5 0v-2.5a.75.75 0 0 1 1.5 0ZM9 11a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z"></path> </svg> <span> This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. <a class="Link--inTextBlock" href="https://github.co/hiddenchars" target="_blank">Learn more about bidirectional Unicode characters</a> </span> <div data-view-component="true" class="flash-action"> <a href="{{ revealButtonHref }}" data-view-component="true" class="btn-sm btn"> Show hidden characters </a> </div> </div></template> <template class="js-line-alert-template"> <span aria-label="This line has hidden Unicode characters" data-view-component="true" class="line-alert tooltipped tooltipped-e"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-alert"> <path d="M6.457 1.047c.659-1.234 2.427-1.234 3.086 0l6.082 11.378A1.75 1.75 0 0 1 14.082 15H1.918a1.75 1.75 0 0 1-1.543-2.575Zm1.763.707a.25.25 0 0 0-.44 0L1.698 13.132a.25.25 0 0 0 .22.368h12.164a.25.25 0 0 0 .22-.368Zm.53 3.996v2.5a.75.75 0 0 1-1.5 0v-2.5a.75.75 0 0 1 1.5 0ZM9 11a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z"></path> </svg> </span></template> <table data-hpc class="highlight tab-size js-file-line-container js-code-nav-container js-tagsearch-file" data-tab-size="8" data-paste-markdown-skip data-tagsearch-lang="HTML" data-tagsearch-path="index.html"> <tr> <td id="file-index-html-L1" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="1"></td> <td id="file-index-html-LC1" class="blob-code blob-code-inner js-file-line"><span class=pl-kos>&lt;</span><span class=pl-ent>html</span><span class=pl-kos>&gt;</span></td> </tr> <tr> <td id="file-index-html-L2" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="2"></td> <td id="file-index-html-LC2" class="blob-code blob-code-inner js-file-line"><span class=pl-kos>&lt;</span><span class=pl-ent>head</span><span class=pl-kos>&gt;</span></td> </tr> <tr> <td id="file-index-html-L3" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="3"></td> <td id="file-index-html-LC3" class="blob-code blob-code-inner js-file-line"> <span class=pl-kos>&lt;</span><span class=pl-ent>title</span><span class=pl-kos>&gt;</span>Chat Widget Embedded example | ChatBot.com<span class=pl-kos>&lt;/</span><span class=pl-ent>title</span><span class=pl-kos>&gt;</span></td> </tr> <tr> <td id="file-index-html-L4" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="4"></td> <td id="file-index-html-LC4" class="blob-code blob-code-inner js-file-line"> <span class=pl-kos>&lt;</span><span class=pl-ent>meta</span> <span class=pl-c1>charset</span>=&quot;<span class=pl-s>utf-8</span>&quot;<span class=pl-kos>&gt;</span></td> </tr> <tr> <td id="file-index-html-L5" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="5"></td> <td id="file-index-html-LC5" class="blob-code blob-code-inner js-file-line"> <span class=pl-kos>&lt;</span><span class=pl-ent>meta</span> <span class=pl-c1>name</span>=&quot;<span class=pl-s>viewport</span>&quot; <span class=pl-c1>content</span>=&quot;<span class=pl-s>width=device-width, initial-scale=1</span>&quot;<span class=pl-kos>&gt;</span></td> </tr> <tr> <td id="file-index-html-L6" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="6"></td> <td id="file-index-html-LC6" class="blob-code blob-code-inner js-file-line"> <span class=pl-kos>&lt;</span><span class=pl-ent>link</span> <span class=pl-c1>href</span>=&quot;<span class=pl-s>https://fonts.googleapis.com/css?family=Open+Sans</span>&quot; <span class=pl-c1>rel</span>=&quot;<span class=pl-s>stylesheet</span>&quot;<span class=pl-kos>&gt;</span></td> </tr> <tr> <td id="file-index-html-L7" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="7"></td> <td id="file-index-html-LC7" class="blob-code blob-code-inner js-file-line"> <span class=pl-kos>&lt;</span><span class=pl-ent>style</span> <span class=pl-c1>type</span>=&quot;<span class=pl-s>text/css</span>&quot;<span class=pl-kos>&gt;</span></td> </tr> <tr> <td id="file-index-html-L8" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="8"></td> <td id="file-index-html-LC8" class="blob-code blob-code-inner js-file-line"> body {</td> </tr> <tr> <td id="file-index-html-L9" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="9"></td> <td id="file-index-html-LC9" class="blob-code blob-code-inner js-file-line"> background: #FFFFFF;</td> </tr> <tr> <td id="file-index-html-L10" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="10"></td> <td id="file-index-html-LC10" class="blob-code blob-code-inner js-file-line"> }</td> </tr> <tr> <td id="file-index-html-L11" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="11"></td> <td id="file-index-html-LC11" class="blob-code blob-code-inner js-file-line"> </td> </tr> <tr> <td id="file-index-html-L12" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="12"></td> <td id="file-index-html-LC12" class="blob-code blob-code-inner js-file-line"> * {</td> </tr> <tr> <td id="file-index-html-L13" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="13"></td> <td id="file-index-html-LC13" class="blob-code blob-code-inner js-file-line"> font-family: &#39;Open Sans&#39;, sans-serif;</td> </tr> <tr> <td id="file-index-html-L14" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="14"></td> <td id="file-index-html-LC14" class="blob-code blob-code-inner js-file-line"> box-sizing: border-box;</td> </tr> <tr> <td id="file-index-html-L15" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="15"></td> <td id="file-index-html-LC15" class="blob-code blob-code-inner js-file-line"> color: #22272D;</td> </tr> <tr> <td id="file-index-html-L16" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="16"></td> <td id="file-index-html-LC16" class="blob-code blob-code-inner js-file-line"> padding: 0;</td> </tr> <tr> <td id="file-index-html-L17" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="17"></td> <td id="file-index-html-LC17" class="blob-code blob-code-inner js-file-line"> margin: 0;</td> </tr> <tr> <td id="file-index-html-L18" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="18"></td> <td id="file-index-html-LC18" class="blob-code blob-code-inner js-file-line"> }</td> </tr> <tr> <td id="file-index-html-L19" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="19"></td> <td id="file-index-html-LC19" class="blob-code blob-code-inner js-file-line"> </td> </tr> <tr> <td id="file-index-html-L20" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="20"></td> <td id="file-index-html-LC20" class="blob-code blob-code-inner js-file-line"> h1 {</td> </tr> <tr> <td id="file-index-html-L21" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="21"></td> <td id="file-index-html-LC21" class="blob-code blob-code-inner js-file-line"> width: 100%;</td> </tr> <tr> <td id="file-index-html-L22" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="22"></td> <td id="file-index-html-LC22" class="blob-code blob-code-inner js-file-line"> font-weight: bold;</td> </tr> <tr> <td id="file-index-html-L23" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="23"></td> <td id="file-index-html-LC23" class="blob-code blob-code-inner js-file-line"> }</td> </tr> <tr> <td id="file-index-html-L24" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="24"></td> <td id="file-index-html-LC24" class="blob-code blob-code-inner js-file-line"> </td> </tr> <tr> <td id="file-index-html-L25" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="25"></td> <td id="file-index-html-LC25" class="blob-code blob-code-inner js-file-line"> iframe {</td> </tr> <tr> <td id="file-index-html-L26" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="26"></td> <td id="file-index-html-LC26" class="blob-code blob-code-inner js-file-line"> border: 0;</td> </tr> <tr> <td id="file-index-html-L27" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="27"></td> <td id="file-index-html-LC27" class="blob-code blob-code-inner js-file-line"> }</td> </tr> <tr> <td id="file-index-html-L28" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="28"></td> <td id="file-index-html-LC28" class="blob-code blob-code-inner js-file-line"> </td> </tr> <tr> <td id="file-index-html-L29" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="29"></td> <td id="file-index-html-LC29" class="blob-code blob-code-inner js-file-line"> section {</td> </tr> <tr> <td id="file-index-html-L30" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="30"></td> <td id="file-index-html-LC30" class="blob-code blob-code-inner js-file-line"> max-width: 1000px;</td> </tr> <tr> <td id="file-index-html-L31" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="31"></td> <td id="file-index-html-LC31" class="blob-code blob-code-inner js-file-line"> display: grid;</td> </tr> <tr> <td id="file-index-html-L32" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="32"></td> <td id="file-index-html-LC32" class="blob-code blob-code-inner js-file-line"> grid-template-columns: 420px 1fr;</td> </tr> <tr> <td id="file-index-html-L33" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="33"></td> <td id="file-index-html-LC33" class="blob-code blob-code-inner js-file-line"> gap: 24px;</td> </tr> <tr> <td id="file-index-html-L34" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="34"></td> <td id="file-index-html-LC34" class="blob-code blob-code-inner js-file-line"> padding: 24px;</td> </tr> <tr> <td id="file-index-html-L35" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="35"></td> <td id="file-index-html-LC35" class="blob-code blob-code-inner js-file-line"> margin: 0 auto;</td> </tr> <tr> <td id="file-index-html-L36" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="36"></td> <td id="file-index-html-LC36" class="blob-code blob-code-inner js-file-line"> justify-items: center;</td> </tr> <tr> <td id="file-index-html-L37" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="37"></td> <td id="file-index-html-LC37" class="blob-code blob-code-inner js-file-line"> }</td> </tr> <tr> <td id="file-index-html-L38" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="38"></td> <td id="file-index-html-LC38" class="blob-code blob-code-inner js-file-line"> </td> </tr> <tr> <td id="file-index-html-L39" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="39"></td> <td id="file-index-html-LC39" class="blob-code blob-code-inner js-file-line"> section &gt; .container {</td> </tr> <tr> <td id="file-index-html-L40" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="40"></td> <td id="file-index-html-LC40" class="blob-code blob-code-inner js-file-line"> display: flex;</td> </tr> <tr> <td id="file-index-html-L41" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="41"></td> <td id="file-index-html-LC41" class="blob-code blob-code-inner js-file-line"> flex-wrap: wrap;</td> </tr> <tr> <td id="file-index-html-L42" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="42"></td> <td id="file-index-html-LC42" class="blob-code blob-code-inner js-file-line"> gap: 1rem;</td> </tr> <tr> <td id="file-index-html-L43" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="43"></td> <td id="file-index-html-LC43" class="blob-code blob-code-inner js-file-line"> }</td> </tr> <tr> <td id="file-index-html-L44" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="44"></td> <td id="file-index-html-LC44" class="blob-code blob-code-inner js-file-line"> </td> </tr> <tr> <td id="file-index-html-L45" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="45"></td> <td id="file-index-html-LC45" class="blob-code blob-code-inner js-file-line"> section &gt; .container &gt; div {</td> </tr> <tr> <td id="file-index-html-L46" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="46"></td> <td id="file-index-html-LC46" class="blob-code blob-code-inner js-file-line"> width: 100%;</td> </tr> <tr> <td id="file-index-html-L47" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="47"></td> <td id="file-index-html-LC47" class="blob-code blob-code-inner js-file-line"> display: flex;</td> </tr> <tr> <td id="file-index-html-L48" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="48"></td> <td id="file-index-html-LC48" class="blob-code blob-code-inner js-file-line"> flex-wrap: wrap;</td> </tr> <tr> <td id="file-index-html-L49" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="49"></td> <td id="file-index-html-LC49" class="blob-code blob-code-inner js-file-line"> border: 1px solid #F2F2F2;</td> </tr> <tr> <td id="file-index-html-L50" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="50"></td> <td id="file-index-html-LC50" class="blob-code blob-code-inner js-file-line"> border-radius: 20px;</td> </tr> <tr> <td id="file-index-html-L51" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="51"></td> <td id="file-index-html-LC51" class="blob-code blob-code-inner js-file-line"> padding: 24px;</td> </tr> <tr> <td id="file-index-html-L52" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="52"></td> <td id="file-index-html-LC52" class="blob-code blob-code-inner js-file-line"> gap: 1rem;</td> </tr> <tr> <td id="file-index-html-L53" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="53"></td> <td id="file-index-html-LC53" class="blob-code blob-code-inner js-file-line"> }</td> </tr> <tr> <td id="file-index-html-L54" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="54"></td> <td id="file-index-html-LC54" class="blob-code blob-code-inner js-file-line"> </td> </tr> <tr> <td id="file-index-html-L55" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="55"></td> <td id="file-index-html-LC55" class="blob-code blob-code-inner js-file-line"> section div p {</td> </tr> <tr> <td id="file-index-html-L56" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="56"></td> <td id="file-index-html-LC56" class="blob-code blob-code-inner js-file-line"> width: 100%;</td> </tr> <tr> <td id="file-index-html-L57" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="57"></td> <td id="file-index-html-LC57" class="blob-code blob-code-inner js-file-line"> border-radius: 20px;</td> </tr> <tr> <td id="file-index-html-L58" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="58"></td> <td id="file-index-html-LC58" class="blob-code blob-code-inner js-file-line"> background: #F2F2F2;</td> </tr> <tr> <td id="file-index-html-L59" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="59"></td> <td id="file-index-html-LC59" class="blob-code blob-code-inner js-file-line"> padding: 6px;</td> </tr> <tr> <td id="file-index-html-L60" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="60"></td> <td id="file-index-html-LC60" class="blob-code blob-code-inner js-file-line"> }</td> </tr> <tr> <td id="file-index-html-L61" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="61"></td> <td id="file-index-html-LC61" class="blob-code blob-code-inner js-file-line"> </td> </tr> <tr> <td id="file-index-html-L62" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="62"></td> <td id="file-index-html-LC62" class="blob-code blob-code-inner js-file-line"> #widget {</td> </tr> <tr> <td id="file-index-html-L63" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="63"></td> <td id="file-index-html-LC63" class="blob-code blob-code-inner js-file-line"> width: 100%;</td> </tr> <tr> <td id="file-index-html-L64" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="64"></td> <td id="file-index-html-LC64" class="blob-code blob-code-inner js-file-line"> min-width: 420px;</td> </tr> <tr> <td id="file-index-html-L65" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="65"></td> <td id="file-index-html-LC65" class="blob-code blob-code-inner js-file-line"> min-height: 710px;</td> </tr> <tr> <td id="file-index-html-L66" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="66"></td> <td id="file-index-html-LC66" class="blob-code blob-code-inner js-file-line"> height: auto;</td> </tr> <tr> <td id="file-index-html-L67" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="67"></td> <td id="file-index-html-LC67" class="blob-code blob-code-inner js-file-line"> }</td> </tr> <tr> <td id="file-index-html-L68" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="68"></td> <td id="file-index-html-LC68" class="blob-code blob-code-inner js-file-line"> </td> </tr> <tr> <td id="file-index-html-L69" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="69"></td> <td id="file-index-html-LC69" class="blob-code blob-code-inner js-file-line"> @media only screen and (max-width: 768px) {</td> </tr> <tr> <td id="file-index-html-L70" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="70"></td> <td id="file-index-html-LC70" class="blob-code blob-code-inner js-file-line"> section {</td> </tr> <tr> <td id="file-index-html-L71" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="71"></td> <td id="file-index-html-LC71" class="blob-code blob-code-inner js-file-line"> grid-template-columns: 1fr;</td> </tr> <tr> <td id="file-index-html-L72" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="72"></td> <td id="file-index-html-LC72" class="blob-code blob-code-inner js-file-line"> }</td> </tr> <tr> <td id="file-index-html-L73" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="73"></td> <td id="file-index-html-LC73" class="blob-code blob-code-inner js-file-line"> }</td> </tr> <tr> <td id="file-index-html-L74" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="74"></td> <td id="file-index-html-LC74" class="blob-code blob-code-inner js-file-line"> <span class=pl-kos>&lt;/</span><span class=pl-ent>style</span><span class=pl-kos>&gt;</span></td> </tr> <tr> <td id="file-index-html-L75" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="75"></td> <td id="file-index-html-LC75" class="blob-code blob-code-inner js-file-line"><span class=pl-kos>&lt;/</span><span class=pl-ent>head</span><span class=pl-kos>&gt;</span></td> </tr> <tr> <td id="file-index-html-L76" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="76"></td> <td id="file-index-html-LC76" class="blob-code blob-code-inner js-file-line"><span class=pl-kos>&lt;</span><span class=pl-ent>body</span><span class=pl-kos>&gt;</span></td> </tr> <tr> <td id="file-index-html-L77" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="77"></td> <td id="file-index-html-LC77" class="blob-code blob-code-inner js-file-line"> <span class=pl-kos>&lt;</span><span class=pl-ent>section</span><span class=pl-kos>&gt;</span></td> </tr> <tr> <td id="file-index-html-L78" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="78"></td> <td id="file-index-html-LC78" class="blob-code blob-code-inner js-file-line"> <span class=pl-kos>&lt;</span><span class=pl-ent>div</span> <span class=pl-c1>id</span>=&quot;<span class=pl-s>widget</span>&quot;<span class=pl-kos>&gt;</span><span class=pl-kos>&lt;/</span><span class=pl-ent>div</span><span class=pl-kos>&gt;</span></td> </tr> <tr> <td id="file-index-html-L79" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="79"></td> <td id="file-index-html-LC79" class="blob-code blob-code-inner js-file-line"> <span class=pl-kos>&lt;</span><span class=pl-ent>div</span> <span class=pl-c1>class</span>=&quot;<span class=pl-s>container</span>&quot;<span class=pl-kos>&gt;</span></td> </tr> <tr> <td id="file-index-html-L80" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="80"></td> <td id="file-index-html-LC80" class="blob-code blob-code-inner js-file-line"> <span class=pl-kos>&lt;</span><span class=pl-ent>div</span><span class=pl-kos>&gt;</span></td> </tr> <tr> <td id="file-index-html-L81" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="81"></td> <td id="file-index-html-LC81" class="blob-code blob-code-inner js-file-line"> <span class=pl-kos>&lt;</span><span class=pl-ent>img</span> <span class=pl-c1>width</span>=&quot;<span class=pl-s>120</span>&quot; <span class=pl-c1>alt</span>=&quot;<span class=pl-s>ChatBot logo</span>&quot; <span class=pl-c1>src</span>=&quot;<span class=pl-s>https://www.chatbot.com/chatbot-logo.svg</span>&quot; /&gt;</td> </tr> <tr> <td id="file-index-html-L82" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="82"></td> <td id="file-index-html-LC82" class="blob-code blob-code-inner js-file-line"> <span class=pl-kos>&lt;</span><span class=pl-ent>h1</span><span class=pl-kos>&gt;</span>Embedded Chat Widget<span class=pl-kos>&lt;/</span><span class=pl-ent>h1</span><span class=pl-kos>&gt;</span></td> </tr> <tr> <td id="file-index-html-L83" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="83"></td> <td id="file-index-html-LC83" class="blob-code blob-code-inner js-file-line"> <span class=pl-kos>&lt;</span><span class=pl-ent>div</span><span class=pl-kos>&gt;</span></td> </tr> <tr> <td id="file-index-html-L84" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="84"></td> <td id="file-index-html-LC84" class="blob-code blob-code-inner js-file-line"> This is an example of the implementation of an embedded Chat Widget. You can find and reuse the code used on this page. It can be found on our <span class=pl-kos>&lt;</span><span class=pl-ent>strong</span><span class=pl-kos>&gt;</span><span class=pl-kos>&lt;</span><span class=pl-ent>a</span> <span class=pl-c1>href</span>=&quot;<span class=pl-s>https://gist.github.com/humannus/ad5c4f407a81cbe6f0a5a8014c7315a9</span>&quot; <span class=pl-c1>target</span>=&quot;<span class=pl-s>_blank</span>&quot;<span class=pl-kos>&gt;</span>GitHub Repository<span class=pl-kos>&lt;/</span><span class=pl-ent>a</span><span class=pl-kos>&gt;</span><span class=pl-kos>&lt;/</span><span class=pl-ent>strong</span><span class=pl-kos>&gt;</span>. A tutorial covering the implementation process is <span class=pl-kos>&lt;</span><span class=pl-ent>strong</span><span class=pl-kos>&gt;</span><span class=pl-kos>&lt;</span><span class=pl-ent>a</span> <span class=pl-c1>href</span>=&quot;<span class=pl-s>https://www.chatbot.com/help/install-chatbot/widget-installation/#how-to-embed-chat-widget-on-a-website</span>&quot; <span class=pl-c1>target</span>=&quot;<span class=pl-s>_blank</span>&quot;<span class=pl-kos>&gt;</span>available here<span class=pl-kos>&lt;/</span><span class=pl-ent>a</span><span class=pl-kos>&gt;</span><span class=pl-kos>&lt;/</span><span class=pl-ent>strong</span><span class=pl-kos>&gt;</span>.</td> </tr> <tr> <td id="file-index-html-L85" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="85"></td> <td id="file-index-html-LC85" class="blob-code blob-code-inner js-file-line"> <span class=pl-kos>&lt;/</span><span class=pl-ent>div</span><span class=pl-kos>&gt;</span></td> </tr> <tr> <td id="file-index-html-L86" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="86"></td> <td id="file-index-html-LC86" class="blob-code blob-code-inner js-file-line"> <span class=pl-kos>&lt;/</span><span class=pl-ent>div</span><span class=pl-kos>&gt;</span></td> </tr> <tr> <td id="file-index-html-L87" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="87"></td> <td id="file-index-html-LC87" class="blob-code blob-code-inner js-file-line"> <span class=pl-kos>&lt;</span><span class=pl-ent>div</span><span class=pl-kos>&gt;</span></td> </tr> <tr> <td id="file-index-html-L88" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="88"></td> <td id="file-index-html-LC88" class="blob-code blob-code-inner js-file-line"> <span class=pl-kos>&lt;</span><span class=pl-ent>p</span><span class=pl-kos>&gt;</span><span class=pl-kos>&lt;/</span><span class=pl-ent>p</span><span class=pl-kos>&gt;</span><span class=pl-kos>&lt;</span><span class=pl-ent>p</span><span class=pl-kos>&gt;</span><span class=pl-kos>&lt;/</span><span class=pl-ent>p</span><span class=pl-kos>&gt;</span><span class=pl-kos>&lt;</span><span class=pl-ent>p</span><span class=pl-kos>&gt;</span><span class=pl-kos>&lt;/</span><span class=pl-ent>p</span><span class=pl-kos>&gt;</span><span class=pl-kos>&lt;</span><span class=pl-ent>p</span><span class=pl-kos>&gt;</span><span class=pl-kos>&lt;/</span><span class=pl-ent>p</span><span class=pl-kos>&gt;</span></td> </tr> <tr> <td id="file-index-html-L89" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="89"></td> <td id="file-index-html-LC89" class="blob-code blob-code-inner js-file-line"> <span class=pl-kos>&lt;/</span><span class=pl-ent>div</span><span class=pl-kos>&gt;</span></td> </tr> <tr> <td id="file-index-html-L90" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="90"></td> <td id="file-index-html-LC90" class="blob-code blob-code-inner js-file-line"> <span class=pl-kos>&lt;</span><span class=pl-ent>div</span><span class=pl-kos>&gt;</span></td> </tr> <tr> <td id="file-index-html-L91" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="91"></td> <td id="file-index-html-LC91" class="blob-code blob-code-inner js-file-line"> <span class=pl-kos>&lt;</span><span class=pl-ent>p</span><span class=pl-kos>&gt;</span><span class=pl-kos>&lt;/</span><span class=pl-ent>p</span><span class=pl-kos>&gt;</span><span class=pl-kos>&lt;</span><span class=pl-ent>p</span><span class=pl-kos>&gt;</span><span class=pl-kos>&lt;/</span><span class=pl-ent>p</span><span class=pl-kos>&gt;</span><span class=pl-kos>&lt;</span><span class=pl-ent>p</span><span class=pl-kos>&gt;</span><span class=pl-kos>&lt;/</span><span class=pl-ent>p</span><span class=pl-kos>&gt;</span><span class=pl-kos>&lt;</span><span class=pl-ent>p</span><span class=pl-kos>&gt;</span><span class=pl-kos>&lt;/</span><span class=pl-ent>p</span><span class=pl-kos>&gt;</span></td> </tr> <tr> <td id="file-index-html-L92" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="92"></td> <td id="file-index-html-LC92" class="blob-code blob-code-inner js-file-line"> <span class=pl-kos>&lt;/</span><span class=pl-ent>div</span><span class=pl-kos>&gt;</span></td> </tr> <tr> <td id="file-index-html-L93" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="93"></td> <td id="file-index-html-LC93" class="blob-code blob-code-inner js-file-line"> <span class=pl-kos>&lt;</span><span class=pl-ent>div</span><span class=pl-kos>&gt;</span></td> </tr> <tr> <td id="file-index-html-L94" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="94"></td> <td id="file-index-html-LC94" class="blob-code blob-code-inner js-file-line"> <span class=pl-kos>&lt;</span><span class=pl-ent>p</span><span class=pl-kos>&gt;</span><span class=pl-kos>&lt;/</span><span class=pl-ent>p</span><span class=pl-kos>&gt;</span><span class=pl-kos>&lt;</span><span class=pl-ent>p</span><span class=pl-kos>&gt;</span><span class=pl-kos>&lt;/</span><span class=pl-ent>p</span><span class=pl-kos>&gt;</span><span class=pl-kos>&lt;</span><span class=pl-ent>p</span><span class=pl-kos>&gt;</span><span class=pl-kos>&lt;/</span><span class=pl-ent>p</span><span class=pl-kos>&gt;</span><span class=pl-kos>&lt;</span><span class=pl-ent>p</span><span class=pl-kos>&gt;</span><span class=pl-kos>&lt;/</span><span class=pl-ent>p</span><span class=pl-kos>&gt;</span></td> </tr> <tr> <td id="file-index-html-L95" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="95"></td> <td id="file-index-html-LC95" class="blob-code blob-code-inner js-file-line"> <span class=pl-kos>&lt;/</span><span class=pl-ent>div</span><span class=pl-kos>&gt;</span></td> </tr> <tr> <td id="file-index-html-L96" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="96"></td> <td id="file-index-html-LC96" class="blob-code blob-code-inner js-file-line"> <span class=pl-kos>&lt;/</span><span class=pl-ent>div</span><span class=pl-kos>&gt;</span></td> </tr> <tr> <td id="file-index-html-L97" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="97"></td> <td id="file-index-html-LC97" class="blob-code blob-code-inner js-file-line"> <span class=pl-kos>&lt;/</span><span class=pl-ent>section</span><span class=pl-kos>&gt;</span></td> </tr> <tr> <td id="file-index-html-L98" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="98"></td> <td id="file-index-html-LC98" class="blob-code blob-code-inner js-file-line"> </td> </tr> <tr> <td id="file-index-html-L99" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="99"></td> <td id="file-index-html-LC99" class="blob-code blob-code-inner js-file-line"> <span class=pl-c>&lt;!-- Replace the below code with your chat widget code --&gt;</span></td> </tr> <tr> <td id="file-index-html-L100" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="100"></td> <td id="file-index-html-LC100" class="blob-code blob-code-inner js-file-line"> <span class=pl-kos>&lt;</span><span class=pl-ent>script</span> <span class=pl-c1>type</span>=&quot;<span class=pl-s>text/javascript</span>&quot;<span class=pl-kos>&gt;</span></td> </tr> <tr> <td id="file-index-html-L101" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="101"></td> <td id="file-index-html-LC101" class="blob-code blob-code-inner js-file-line"> <span class=pl-smi>window</span><span class=pl-kos>.</span><span class=pl-c1>__ow</span> <span class=pl-c1>=</span> <span class=pl-smi>window</span><span class=pl-kos>.</span><span class=pl-c1>__ow</span> <span class=pl-c1>||</span> <span class=pl-kos>{</span><span class=pl-kos>}</span><span class=pl-kos>;</span></td> </tr> <tr> <td id="file-index-html-L102" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="102"></td> <td id="file-index-html-LC102" class="blob-code blob-code-inner js-file-line"> <span class=pl-smi>window</span><span class=pl-kos>.</span><span class=pl-c1>__ow</span><span class=pl-kos>.</span><span class=pl-c1>organizationId</span> <span class=pl-c1>=</span> <span class=pl-s>&quot;b9c3b2e3-c30b-4ffd-9456-2ef926ae2abd&quot;</span><span class=pl-kos>;</span></td> </tr> <tr> <td id="file-index-html-L103" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="103"></td> <td id="file-index-html-LC103" class="blob-code blob-code-inner js-file-line"> <span class=pl-smi>window</span><span class=pl-kos>.</span><span class=pl-c1>__ow</span><span class=pl-kos>.</span><span class=pl-c1>template_id</span> <span class=pl-c1>=</span> <span class=pl-s>&quot;6039c5f3-63b8-4599-8f53-8253192eff7d&quot;</span><span class=pl-kos>;</span></td> </tr> <tr> <td id="file-index-html-L104" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="104"></td> <td id="file-index-html-LC104" class="blob-code blob-code-inner js-file-line"> <span class=pl-smi>window</span><span class=pl-kos>.</span><span class=pl-c1>__ow</span><span class=pl-kos>.</span><span class=pl-c1>integration_name</span> <span class=pl-c1>=</span> <span class=pl-s>&quot;manual_settings&quot;</span><span class=pl-kos>;</span></td> </tr> <tr> <td id="file-index-html-L105" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="105"></td> <td id="file-index-html-LC105" class="blob-code blob-code-inner js-file-line"> <span class=pl-smi>window</span><span class=pl-kos>.</span><span class=pl-c1>__ow</span><span class=pl-kos>.</span><span class=pl-c1>product_name</span> <span class=pl-c1>=</span> <span class=pl-s>&quot;chatbot&quot;</span><span class=pl-kos>;</span></td> </tr> <tr> <td id="file-index-html-L106" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="106"></td> <td id="file-index-html-LC106" class="blob-code blob-code-inner js-file-line"> <span class=pl-kos>;</span><span class=pl-kos>(</span><span class=pl-k>function</span><span class=pl-kos>(</span><span class=pl-s1>n</span><span class=pl-kos>,</span><span class=pl-s1>t</span><span class=pl-kos>,</span><span class=pl-s1>c</span><span class=pl-kos>)</span><span class=pl-kos>{</span><span class=pl-k>function</span> <span class=pl-en>i</span><span class=pl-kos>(</span><span class=pl-s1>n</span><span class=pl-kos>)</span><span class=pl-kos>{</span><span class=pl-k>return</span> <span class=pl-s1>e</span><span class=pl-kos>.</span><span class=pl-c1>_h</span>?<span class=pl-s1>e</span><span class=pl-kos>.</span><span class=pl-c1>_h</span><span class=pl-kos>.</span><span class=pl-en>apply</span><span class=pl-kos>(</span><span class=pl-c1>null</span><span class=pl-kos>,</span><span class=pl-s1>n</span><span class=pl-kos>)</span>:<span class=pl-s1>e</span><span class=pl-kos>.</span><span class=pl-c1>_q</span><span class=pl-kos>.</span><span class=pl-en>push</span><span class=pl-kos>(</span><span class=pl-s1>n</span><span class=pl-kos>)</span><span class=pl-kos>}</span><span class=pl-k>var</span> <span class=pl-s1>e</span><span class=pl-c1>=</span><span class=pl-kos>{</span><span class=pl-c1>_q</span>:<span class=pl-kos>[</span><span class=pl-kos>]</span><span class=pl-kos>,</span><span class=pl-c1>_h</span>:<span class=pl-c1>null</span><span class=pl-kos>,</span><span class=pl-c1>_v</span>:<span class=pl-s>&quot;2.0&quot;</span><span class=pl-kos>,</span><span class=pl-en>on</span>:<span class=pl-k>function</span><span class=pl-kos>(</span><span class=pl-kos>)</span><span class=pl-kos>{</span><span class=pl-en>i</span><span class=pl-kos>(</span><span class=pl-kos>[</span><span class=pl-s>&quot;on&quot;</span><span class=pl-kos>,</span><span class=pl-s1>c</span><span class=pl-kos>.</span><span class=pl-en>call</span><span class=pl-kos>(</span><span class=pl-smi>arguments</span><span class=pl-kos>)</span><span class=pl-kos>]</span><span class=pl-kos>)</span><span class=pl-kos>}</span><span class=pl-kos>,</span><span class=pl-en>once</span>:<span class=pl-k>function</span><span class=pl-kos>(</span><span class=pl-kos>)</span><span class=pl-kos>{</span><span class=pl-en>i</span><span class=pl-kos>(</span><span class=pl-kos>[</span><span class=pl-s>&quot;once&quot;</span><span class=pl-kos>,</span><span class=pl-s1>c</span><span class=pl-kos>.</span><span class=pl-en>call</span><span class=pl-kos>(</span><span class=pl-smi>arguments</span><span class=pl-kos>)</span><span class=pl-kos>]</span><span class=pl-kos>)</span><span class=pl-kos>}</span><span class=pl-kos>,</span><span class=pl-en>off</span>:<span class=pl-k>function</span><span class=pl-kos>(</span><span class=pl-kos>)</span><span class=pl-kos>{</span><span class=pl-en>i</span><span class=pl-kos>(</span><span class=pl-kos>[</span><span class=pl-s>&quot;off&quot;</span><span class=pl-kos>,</span><span class=pl-s1>c</span><span class=pl-kos>.</span><span class=pl-en>call</span><span class=pl-kos>(</span><span class=pl-smi>arguments</span><span class=pl-kos>)</span><span class=pl-kos>]</span><span class=pl-kos>)</span><span class=pl-kos>}</span><span class=pl-kos>,</span><span class=pl-en>get</span>:<span class=pl-k>function</span><span class=pl-kos>(</span><span class=pl-kos>)</span><span class=pl-kos>{</span><span class=pl-k>if</span><span class=pl-kos>(</span><span class=pl-c1>!</span><span class=pl-s1>e</span><span class=pl-kos>.</span><span class=pl-c1>_h</span><span class=pl-kos>)</span><span class=pl-k>throw</span> <span class=pl-k>new</span> <span class=pl-v>Error</span><span class=pl-kos>(</span><span class=pl-s>&quot;[OpenWidget] You can&#39;t use getters before load.&quot;</span><span class=pl-kos>)</span><span class=pl-kos>;</span><span class=pl-k>return</span> <span class=pl-en>i</span><span class=pl-kos>(</span><span class=pl-kos>[</span><span class=pl-s>&quot;get&quot;</span><span class=pl-kos>,</span><span class=pl-s1>c</span><span class=pl-kos>.</span><span class=pl-en>call</span><span class=pl-kos>(</span><span class=pl-smi>arguments</span><span class=pl-kos>)</span><span class=pl-kos>]</span><span class=pl-kos>)</span><span class=pl-kos>}</span><span class=pl-kos>,</span><span class=pl-en>call</span>:<span class=pl-k>function</span><span class=pl-kos>(</span><span class=pl-kos>)</span><span class=pl-kos>{</span><span class=pl-en>i</span><span class=pl-kos>(</span><span class=pl-kos>[</span><span class=pl-s>&quot;call&quot;</span><span class=pl-kos>,</span><span class=pl-s1>c</span><span class=pl-kos>.</span><span class=pl-en>call</span><span class=pl-kos>(</span><span class=pl-smi>arguments</span><span class=pl-kos>)</span><span class=pl-kos>]</span><span class=pl-kos>)</span><span class=pl-kos>}</span><span class=pl-kos>,</span><span class=pl-en>init</span>:<span class=pl-k>function</span><span class=pl-kos>(</span><span class=pl-kos>)</span><span class=pl-kos>{</span><span class=pl-k>var</span> <span class=pl-s1>n</span><span class=pl-c1>=</span><span class=pl-s1>t</span><span class=pl-kos>.</span><span class=pl-en>createElement</span><span class=pl-kos>(</span><span class=pl-s>&quot;script&quot;</span><span class=pl-kos>)</span><span class=pl-kos>;</span><span class=pl-s1>n</span><span class=pl-kos>.</span><span class=pl-c1>async</span><span class=pl-c1>=</span><span class=pl-c1>!</span><span class=pl-c1>0</span><span class=pl-kos>,</span><span class=pl-s1>n</span><span class=pl-kos>.</span><span class=pl-c1>type</span><span class=pl-c1>=</span><span class=pl-s>&quot;text/javascript&quot;</span><span class=pl-kos>,</span><span class=pl-s1>n</span><span class=pl-kos>.</span><span class=pl-c1>src</span><span class=pl-c1>=</span><span class=pl-s>&quot;https://cdn.openwidget.com/openwidget.js&quot;</span><span class=pl-kos>,</span><span class=pl-s1>t</span><span class=pl-kos>.</span><span class=pl-c1>head</span><span class=pl-kos>.</span><span class=pl-en>appendChild</span><span class=pl-kos>(</span><span class=pl-s1>n</span><span class=pl-kos>)</span><span class=pl-kos>}</span><span class=pl-kos>}</span><span class=pl-kos>;</span><span class=pl-c1>!</span><span class=pl-s1>n</span><span class=pl-kos>.</span><span class=pl-c1>__ow</span><span class=pl-kos>.</span><span class=pl-c1>asyncInit</span><span class=pl-c1>&amp;&amp;</span><span class=pl-s1>e</span><span class=pl-kos>.</span><span class=pl-en>init</span><span class=pl-kos>(</span><span class=pl-kos>)</span><span class=pl-kos>,</span><span class=pl-s1>n</span><span class=pl-kos>.</span><span class=pl-c1>OpenWidget</span><span class=pl-c1>=</span><span class=pl-s1>n</span><span class=pl-kos>.</span><span class=pl-c1>OpenWidget</span><span class=pl-c1>||</span><span class=pl-s1>e</span><span class=pl-kos>}</span><span class=pl-kos>(</span><span class=pl-smi>window</span><span class=pl-kos>,</span><span class=pl-smi>document</span><span class=pl-kos>,</span><span class=pl-kos>[</span><span class=pl-kos>]</span><span class=pl-kos>.</span><span class=pl-c1>slice</span><span class=pl-kos>)</span><span class=pl-kos>)</span></td> </tr> <tr> <td id="file-index-html-L107" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="107"></td> <td id="file-index-html-LC107" class="blob-code blob-code-inner js-file-line"> <span class=pl-smi>window</span><span class=pl-kos>.</span><span class=pl-c1>__ow</span><span class=pl-kos>.</span><span class=pl-c1>custom_container</span> <span class=pl-c1>=</span> <span class=pl-smi>document</span><span class=pl-kos>.</span><span class=pl-en>getElementById</span><span class=pl-kos>(</span><span class=pl-s>&#39;widget&#39;</span><span class=pl-kos>)</span><span class=pl-kos>;</span></td> </tr> <tr> <td id="file-index-html-L108" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="108"></td> <td id="file-index-html-LC108" class="blob-code blob-code-inner js-file-line"> </td> </tr> <tr> <td id="file-index-html-L109" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="109"></td> <td id="file-index-html-LC109" class="blob-code blob-code-inner js-file-line"> <span class=pl-c>// [note]: open chat widget window after load</span></td> </tr> <tr> <td id="file-index-html-L110" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="110"></td> <td id="file-index-html-LC110" class="blob-code blob-code-inner js-file-line"> <span class=pl-v>OpenWidget</span><span class=pl-kos>.</span><span class=pl-en>on</span><span class=pl-kos>(</span><span class=pl-s>&quot;ready&quot;</span><span class=pl-kos>,</span> <span class=pl-v>OpenWidget</span><span class=pl-kos>.</span><span class=pl-en>call</span><span class=pl-kos>(</span><span class=pl-s>&quot;maximize&quot;</span><span class=pl-kos>)</span><span class=pl-kos>)</span><span class=pl-kos>;</span></td> </tr> <tr> <td id="file-index-html-L111" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="111"></td> <td id="file-index-html-LC111" class="blob-code blob-code-inner js-file-line"> <span class=pl-kos>&lt;/</span><span class=pl-ent>script</span><span class=pl-kos>&gt;</span></td> </tr> <tr> <td id="file-index-html-L112" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="112"></td> <td id="file-index-html-LC112" class="blob-code blob-code-inner js-file-line"> <span class=pl-c>&lt;!-- Replace the above code with your chat widget code --&gt;</span></td> </tr> <tr> <td id="file-index-html-L113" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="113"></td> <td id="file-index-html-LC113" class="blob-code blob-code-inner js-file-line"><span class=pl-kos>&lt;/</span><span class=pl-ent>body</span><span class=pl-kos>&gt;</span></td> </tr> <tr> <td id="file-index-html-L114" class="blob-num js-line-number js-code-nav-line-number js-blob-rnum" data-line-number="114"></td> <td id="file-index-html-LC114" class="blob-code blob-code-inner js-file-line"><span class=pl-kos>&lt;/</span><span class=pl-ent>html</span><span class=pl-kos>&gt;</span></td> </tr> </table> </div> </div> </div> </div> <a name="comments"></a> <div class="js-quote-selection-container" data-quote-markdown=".js-comment-body"> <div class="js-discussion " > <div class="ml-md-6 pl-md-3 ml-0 pl-0"> <!-- Rendered timeline since 2024-10-08 23:58:35 --> <div id="partial-timeline-marker" class="js-timeline-marker js-updatable-content" data-last-modified="Wed, 09 Oct 2024 06:58:35 GMT" > </div> </div> <div class="discussion-timeline-actions"> <div data-view-component="true" class="flash flash-warn mt-3"> <a rel="nofollow" class="btn btn-primary" data-hydro-click="{&quot;event_type&quot;:&quot;authentication.click&quot;,&quot;payload&quot;:{&quot;location_in_page&quot;:&quot;signed out comment&quot;,&quot;repository_id&quot;:null,&quot;auth_type&quot;:&quot;SIGN_UP&quot;,&quot;originating_url&quot;:&quot;https://gist.github.com/humannus/ad5c4f407a81cbe6f0a5a8014c7315a9&quot;,&quot;user_id&quot;:null}}" data-hydro-click-hmac="2740b1089f2cc1418015edb61445f997e10bffe3a8f5a24d75ac382cc72fb14c" href="/join?source=comment-gist">Sign up for free</a> <strong>to join this conversation on GitHub</strong>. Already have an account? <a rel="nofollow" class="Link--inTextBlock" data-hydro-click="{&quot;event_type&quot;:&quot;authentication.click&quot;,&quot;payload&quot;:{&quot;location_in_page&quot;:&quot;signed out comment&quot;,&quot;repository_id&quot;:null,&quot;auth_type&quot;:&quot;LOG_IN&quot;,&quot;originating_url&quot;:&quot;https://gist.github.com/humannus/ad5c4f407a81cbe6f0a5a8014c7315a9&quot;,&quot;user_id&quot;:null}}" data-hydro-click-hmac="07af34ecfe8d23068a7ee528d0dc457dcfd62905d00d6084194f642bf2558359" data-test-selector="comments-sign-in-link" href="/login?return_to=https%3A%2F%2Fgist.github.com%2Fhumannus%2Fad5c4f407a81cbe6f0a5a8014c7315a9">Sign in to comment</a> </div> </div> </div> </div> </div> </div> </div><!-- /.container --> </main> </div> </div> <footer class="footer pt-8 pb-6 f6 color-fg-muted p-responsive" role="contentinfo" > <h2 class='sr-only'>Footer</h2> <div class="d-flex flex-justify-center flex-items-center flex-column-reverse flex-lg-row flex-wrap flex-lg-nowrap"> <div class="d-flex flex-items-center flex-shrink-0 mx-2"> <a aria-label="Homepage" title="GitHub" class="footer-octicon mr-2" href="https://github.com"> <svg aria-hidden="true" height="24" viewBox="0 0 24 24" version="1.1" width="24" data-view-component="true" class="octicon octicon-mark-github"> <path d="M12.5.75C6.146.75 1 5.896 1 12.25c0 5.089 3.292 9.387 7.863 10.91.575.101.79-.244.79-.546 0-.273-.014-1.178-.014-2.142-2.889.532-3.636-.704-3.866-1.35-.13-.331-.69-1.352-1.18-1.625-.402-.216-.977-.748-.014-.762.906-.014 1.553.834 1.769 1.179 1.035 1.74 2.688 1.25 3.349.948.1-.747.402-1.25.733-1.538-2.559-.287-5.232-1.279-5.232-5.678 0-1.25.445-2.285 1.178-3.09-.115-.288-.517-1.467.115-3.048 0 0 .963-.302 3.163 1.179.92-.259 1.897-.388 2.875-.388.977 0 1.955.13 2.875.388 2.2-1.495 3.162-1.179 3.162-1.179.633 1.581.23 2.76.115 3.048.733.805 1.179 1.825 1.179 3.09 0 4.413-2.688 5.39-5.247 5.678.417.36.776 1.05.776 2.128 0 1.538-.014 2.774-.014 3.162 0 .302.216.662.79.547C20.709 21.637 24 17.324 24 12.25 24 5.896 18.854.75 12.5.75Z"></path> </svg> </a> <span> &copy; 2024 GitHub,&nbsp;Inc. </span> </div> <nav aria-label="Footer"> <h3 class="sr-only" id="sr-footer-heading">Footer navigation</h3> <ul class="list-style-none d-flex flex-justify-center flex-wrap mb-2 mb-lg-0" aria-labelledby="sr-footer-heading"> <li class="mx-2"> <a data-analytics-event="{&quot;category&quot;:&quot;Footer&quot;,&quot;action&quot;:&quot;go to Terms&quot;,&quot;label&quot;:&quot;text:terms&quot;}" href="https://docs.github.com/site-policy/github-terms/github-terms-of-service" data-view-component="true" class="Link--secondary Link">Terms</a> </li> <li class="mx-2"> <a data-analytics-event="{&quot;category&quot;:&quot;Footer&quot;,&quot;action&quot;:&quot;go to privacy&quot;,&quot;label&quot;:&quot;text:privacy&quot;}" href="https://docs.github.com/site-policy/privacy-policies/github-privacy-statement" data-view-component="true" class="Link--secondary Link">Privacy</a> </li> <li class="mx-2"> <a data-analytics-event="{&quot;category&quot;:&quot;Footer&quot;,&quot;action&quot;:&quot;go to security&quot;,&quot;label&quot;:&quot;text:security&quot;}" href="https://github.com/security" data-view-component="true" class="Link--secondary Link">Security</a> </li> <li class="mx-2"> <a data-analytics-event="{&quot;category&quot;:&quot;Footer&quot;,&quot;action&quot;:&quot;go to status&quot;,&quot;label&quot;:&quot;text:status&quot;}" href="https://www.githubstatus.com/" data-view-component="true" class="Link--secondary Link">Status</a> </li> <li class="mx-2"> <a data-analytics-event="{&quot;category&quot;:&quot;Footer&quot;,&quot;action&quot;:&quot;go to docs&quot;,&quot;label&quot;:&quot;text:docs&quot;}" href="https://docs.github.com/" data-view-component="true" class="Link--secondary Link">Docs</a> </li> <li class="mx-2"> <a data-analytics-event="{&quot;category&quot;:&quot;Footer&quot;,&quot;action&quot;:&quot;go to contact&quot;,&quot;label&quot;:&quot;text:contact&quot;}" href="https://support.github.com?tags=dotcom-footer" data-view-component="true" class="Link--secondary Link">Contact</a> </li> <li class="mx-2" > <cookie-consent-link> <button type="button" class="Link--secondary underline-on-hover border-0 p-0 color-bg-transparent" data-action="click:cookie-consent-link#showConsentManagement" data-analytics-event="{&quot;location&quot;:&quot;footer&quot;,&quot;action&quot;:&quot;cookies&quot;,&quot;context&quot;:&quot;subfooter&quot;,&quot;tag&quot;:&quot;link&quot;,&quot;label&quot;:&quot;cookies_link_subfooter_footer&quot;}" > Manage cookies </button> </cookie-consent-link> </li> <li class="mx-2"> <cookie-consent-link> <button type="button" class="Link--secondary underline-on-hover border-0 p-0 color-bg-transparent" data-action="click:cookie-consent-link#showConsentManagement" data-analytics-event="{&quot;location&quot;:&quot;footer&quot;,&quot;action&quot;:&quot;dont_share_info&quot;,&quot;context&quot;:&quot;subfooter&quot;,&quot;tag&quot;:&quot;link&quot;,&quot;label&quot;:&quot;dont_share_info_link_subfooter_footer&quot;}" > Do not share my personal information </button> </cookie-consent-link> </li> </ul> </nav> </div> </footer> <ghcc-consent id="ghcc" class="position-fixed bottom-0 left-0" style="z-index: 999999" data-initial-cookie-consent-allowed="" data-cookie-consent-required="false"></ghcc-consent> <div id="ajax-error-message" class="ajax-error-message flash flash-error" hidden> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-alert"> <path d="M6.457 1.047c.659-1.234 2.427-1.234 3.086 0l6.082 11.378A1.75 1.75 0 0 1 14.082 15H1.918a1.75 1.75 0 0 1-1.543-2.575Zm1.763.707a.25.25 0 0 0-.44 0L1.698 13.132a.25.25 0 0 0 .22.368h12.164a.25.25 0 0 0 .22-.368Zm.53 3.996v2.5a.75.75 0 0 1-1.5 0v-2.5a.75.75 0 0 1 1.5 0ZM9 11a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z"></path> </svg> <button type="button" class="flash-close js-ajax-error-dismiss" aria-label="Dismiss error"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-x"> <path d="M3.72 3.72a.75.75 0 0 1 1.06 0L8 6.94l3.22-3.22a.749.749 0 0 1 1.275.326.749.749 0 0 1-.215.734L9.06 8l3.22 3.22a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L8 9.06l-3.22 3.22a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042L6.94 8 3.72 4.78a.75.75 0 0 1 0-1.06Z"></path> </svg> </button> You can’t perform that action at this time. </div> <template id="site-details-dialog"> <details class="details-reset details-overlay details-overlay-dark lh-default color-fg-default hx_rsm" open> <summary role="button" aria-label="Close dialog"></summary> <details-dialog class="Box Box--overlay d-flex flex-column anim-fade-in fast hx_rsm-dialog hx_rsm-modal"> <button class="Box-btn-octicon m-0 btn-octicon position-absolute right-0 top-0" type="button" aria-label="Close dialog" data-close-dialog> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-x"> <path d="M3.72 3.72a.75.75 0 0 1 1.06 0L8 6.94l3.22-3.22a.749.749 0 0 1 1.275.326.749.749 0 0 1-.215.734L9.06 8l3.22 3.22a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L8 9.06l-3.22 3.22a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042L6.94 8 3.72 4.78a.75.75 0 0 1 0-1.06Z"></path> </svg> </button> <div class="octocat-spinner my-6 js-details-dialog-spinner"></div> </details-dialog> </details> </template> <div class="Popover js-hovercard-content position-absolute" style="display: none; outline: none;"> <div class="Popover-message Popover-message--bottom-left Popover-message--large Box color-shadow-large" style="width:360px;"> </div> </div> <template id="snippet-clipboard-copy-button"> <div class="zeroclipboard-container position-absolute right-0 top-0"> <clipboard-copy aria-label="Copy" class="ClipboardButton btn js-clipboard-copy m-2 p-0" data-copy-feedback="Copied!" data-tooltip-direction="w"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-copy js-clipboard-copy-icon m-2"> <path d="M0 6.75C0 5.784.784 5 1.75 5h1.5a.75.75 0 0 1 0 1.5h-1.5a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h7.5a.25.25 0 0 0 .25-.25v-1.5a.75.75 0 0 1 1.5 0v1.5A1.75 1.75 0 0 1 9.25 16h-7.5A1.75 1.75 0 0 1 0 14.25Z"></path><path d="M5 1.75C5 .784 5.784 0 6.75 0h7.5C15.216 0 16 .784 16 1.75v7.5A1.75 1.75 0 0 1 14.25 11h-7.5A1.75 1.75 0 0 1 5 9.25Zm1.75-.25a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h7.5a.25.25 0 0 0 .25-.25v-7.5a.25.25 0 0 0-.25-.25Z"></path> </svg> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-check js-clipboard-check-icon color-fg-success d-none m-2"> <path d="M13.78 4.22a.75.75 0 0 1 0 1.06l-7.25 7.25a.75.75 0 0 1-1.06 0L2.22 9.28a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L6 10.94l6.72-6.72a.75.75 0 0 1 1.06 0Z"></path> </svg> </clipboard-copy> </div> </template> <template id="snippet-clipboard-copy-button-unpositioned"> <div class="zeroclipboard-container"> <clipboard-copy aria-label="Copy" class="ClipboardButton btn btn-invisible js-clipboard-copy m-2 p-0 d-flex flex-justify-center flex-items-center" data-copy-feedback="Copied!" data-tooltip-direction="w"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-copy js-clipboard-copy-icon"> <path d="M0 6.75C0 5.784.784 5 1.75 5h1.5a.75.75 0 0 1 0 1.5h-1.5a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h7.5a.25.25 0 0 0 .25-.25v-1.5a.75.75 0 0 1 1.5 0v1.5A1.75 1.75 0 0 1 9.25 16h-7.5A1.75 1.75 0 0 1 0 14.25Z"></path><path d="M5 1.75C5 .784 5.784 0 6.75 0h7.5C15.216 0 16 .784 16 1.75v7.5A1.75 1.75 0 0 1 14.25 11h-7.5A1.75 1.75 0 0 1 5 9.25Zm1.75-.25a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h7.5a.25.25 0 0 0 .25-.25v-7.5a.25.25 0 0 0-.25-.25Z"></path> </svg> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-check js-clipboard-check-icon color-fg-success d-none"> <path d="M13.78 4.22a.75.75 0 0 1 0 1.06l-7.25 7.25a.75.75 0 0 1-1.06 0L2.22 9.28a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L6 10.94l6.72-6.72a.75.75 0 0 1 1.06 0Z"></path> </svg> </clipboard-copy> </div> </template> </div> <div id="js-global-screen-reader-notice" class="sr-only mt-n1" aria-live="polite" aria-atomic="true" ></div> <div id="js-global-screen-reader-notice-assertive" class="sr-only mt-n1" aria-live="assertive" aria-atomic="true"></div> </body> </html>

Pages: 1 2 3 4 5 6 7 8 9 10