├── preview.png ├── server ├── tether.min.css ├── shepherd.min.js ├── shepherd-theme-dark.css ├── shepherd-theme-square.css ├── shepherd-theme-default.css ├── shepherd-theme-square-dark.css └── tether.min.js ├── ISSUE_TEMPLATE.md ├── source ├── render_dynamicaction_starttour.sql ├── render_dynamicaction_newinstance.sql ├── render_dynamicaction_addstep.sql ├── dynamic_action_plugin_de_danielh_gt_starttour.sql └── dynamic_action_plugin_de_danielh_gt_addstep.sql ├── LICENSE ├── apexplugin.json └── README.md /preview.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Dani3lSun/apex-plugin-guidedtour/HEAD/preview.png -------------------------------------------------------------------------------- /server/tether.min.css: -------------------------------------------------------------------------------- 1 | .tether-element,.tether-element *,.tether-element :after,.tether-element :before,.tether-element:after,.tether-element:before{box-sizing:border-box}.tether-element{position:absolute;display:none}.tether-element.tether-open{display:block} -------------------------------------------------------------------------------- /ISSUE_TEMPLATE.md: -------------------------------------------------------------------------------- 1 | ### Expected behavior 2 | 3 | 4 | ### Actual behavior 5 | 6 | 7 | ### Steps to reproduce the issue 8 | 9 | 10 | ### APEX version (4.2.6 / 5.0.3) 11 | 12 | 13 | ### Used web server / version and platform (ORDS 3.0.3 / Tomcat 7 / Apache 2.4 / Linux x64) 14 | 15 | 16 | ### Used web browser / version and platform (Chrome 48 Mac / Firefox 44 Windows) 17 | -------------------------------------------------------------------------------- /source/render_dynamicaction_starttour.sql: -------------------------------------------------------------------------------- 1 | /*------------------------------------- 2 | * GuidedTour Functions 3 | * Version: 1.0.1 (24.10.2017) 4 | * Author: Daniel Hochleitner 5 | *------------------------------------- 6 | */ 7 | FUNCTION render_shepherdstarttour(p_dynamic_action IN apex_plugin.t_dynamic_action, 8 | p_plugin IN apex_plugin.t_plugin) 9 | RETURN apex_plugin.t_dynamic_action_render_result IS 10 | -- 11 | l_result apex_plugin.t_dynamic_action_render_result; 12 | -- 13 | BEGIN 14 | -- Debug 15 | IF apex_application.g_debug THEN 16 | apex_plugin_util.debug_dynamic_action(p_plugin => p_plugin, 17 | p_dynamic_action => p_dynamic_action); 18 | END IF; 19 | -- Add JS Code to Start new Stepherd Instance 20 | --apex_javascript.add_inline_code(p_code => 'tour.start();'); 21 | apex_javascript.add_onload_code(p_code => 'tour.start();'); 22 | -- 23 | l_result.javascript_function := 'function(){null}'; 24 | -- 25 | RETURN l_result; 26 | -- 27 | END render_shepherdstarttour; -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright (c) 2015 Daniel Hochleitner 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in 13 | all copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN 21 | THE SOFTWARE. -------------------------------------------------------------------------------- /apexplugin.json: -------------------------------------------------------------------------------- 1 | { 2 | "name" : "GuidedTour", 3 | "version" : "1.0.1", 4 | "description" : "It´s useful to guide your users through the application, or give your users a first run wizard to explain parts of your app.", 5 | "keywords" : ["guide", "tour", "shepherd", "firstrun"], 6 | "homepage" : "https://github.com/Dani3lSun/apex-plugin-guidedtour", 7 | "bugs" : { 8 | "url" : "https://github.com/Dani3lSun/apex-plugin-guidedtour/issues", 9 | "email" : "daniel@danielh.de" 10 | }, 11 | "license" : "MIT", 12 | "author" : { 13 | "name" : "Daniel Hochleitner", 14 | "email" : "daniel@danielh.de", 15 | "url" : "https://danielhochleitner.de", 16 | "twitter" : "Dani3lSun", 17 | "donationUrl" : "https://www.paypal.me/DanielHochleitnerIT/3" 18 | }, 19 | "repository" : { 20 | "type" : "git", 21 | "url" : "https://github.com/Dani3lSun/apex-plugin-guidedtour.git" 22 | }, 23 | "oracle" : { 24 | "versions" : ["11.2.0.1", "12.1.0.1"], 25 | "apex" : { 26 | "versions" : ["5.0.0"], 27 | "plugin" : { 28 | "internalName" : "DE.DANIELH.GT.NEWINSTANCE", 29 | "type" : "dynamic action", 30 | "demo" : "https://apex.oracle.com/pls/apex/f?p=APEXPLUGIN", 31 | "previewImage" : "https://raw.githubusercontent.com/Dani3lSun/apex-plugin-guidedtour/master/preview.png" 32 | } 33 | } 34 | } 35 | } 36 | -------------------------------------------------------------------------------- /source/render_dynamicaction_newinstance.sql: -------------------------------------------------------------------------------- 1 | /*------------------------------------- 2 | * GuidedTour Functions 3 | * Version: 1.0.1 (24.10.2017) 4 | * Author: Daniel Hochleitner 5 | *------------------------------------- 6 | */ 7 | FUNCTION render_shepherdnewinstance(p_dynamic_action IN apex_plugin.t_dynamic_action, 8 | p_plugin IN apex_plugin.t_plugin) 9 | RETURN apex_plugin.t_dynamic_action_render_result IS 10 | -- 11 | l_theme VARCHAR2(500) := p_dynamic_action.attribute_01; 12 | l_result apex_plugin.t_dynamic_action_render_result; 13 | -- 14 | BEGIN 15 | -- Debug 16 | IF apex_application.g_debug THEN 17 | apex_plugin_util.debug_dynamic_action(p_plugin => p_plugin, 18 | p_dynamic_action => p_dynamic_action); 19 | END IF; 20 | -- 21 | -- Shepherd Theme CSS 22 | IF l_theme = 'shepherd-theme-dark' THEN 23 | apex_css.add_file(p_name => 'shepherd-theme-dark', 24 | p_directory => p_plugin.file_prefix); 25 | ELSIF l_theme = 'shepherd-theme-default' THEN 26 | apex_css.add_file(p_name => 'shepherd-theme-default', 27 | p_directory => p_plugin.file_prefix); 28 | ELSIF l_theme = 'shepherd-theme-square' THEN 29 | apex_css.add_file(p_name => 'shepherd-theme-square', 30 | p_directory => p_plugin.file_prefix); 31 | ELSIF l_theme = 'shepherd-theme-square-dark' THEN 32 | apex_css.add_file(p_name => 'shepherd-theme-square-dark', 33 | p_directory => p_plugin.file_prefix); 34 | END IF; 35 | -- Tether CSS 36 | apex_css.add_file(p_name => 'tether.min', 37 | p_directory => p_plugin.file_prefix); 38 | -- 39 | -- Shepherd JS + Tether JS 40 | apex_javascript.add_library(p_name => 'tether.min', 41 | p_directory => p_plugin.file_prefix, 42 | p_version => NULL, 43 | p_skip_extension => FALSE); 44 | apex_javascript.add_library(p_name => 'shepherd.min', 45 | p_directory => p_plugin.file_prefix, 46 | p_version => NULL, 47 | p_skip_extension => FALSE); 48 | -- Add JS Code to Start new Stepherd Instance 49 | apex_javascript.add_inline_code(p_code => 'var tour = new Shepherd.Tour({defaults: { classes: ''' || 50 | l_theme || 51 | ''',scrollTo: true}});'); 52 | -- 53 | l_result.javascript_function := 'function(){null}'; 54 | l_result.attribute_01 := l_theme; 55 | RETURN l_result; 56 | -- 57 | END render_shepherdnewinstance; -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Oracle APEX DynamicAction Plugin - GuidedTour 2 | Dynamic Action Plugin using OpenSource JS framework "Stepherd". 3 | It´s useful to guide your users through the application, or give your users a first run wizard to explain parts of your app. 4 | (https://github.com/HubSpot/shepherd) 5 | 6 | This is not an single plugin, instead it contains 3 DA plugins. 7 | The Framework shepherd.js is splitted in 3 sections: 8 | - Initialize the guided tour 9 | - Add several tour steps 10 | - Start the guided tour 11 | 12 | So the plugins are exactly for this events: 13 | - GuidedTour (New Instance) 14 | - GuidedTour (Add Step) 15 | - GuidedTour (Start Tour) 16 | 17 | 18 | ## Changelog 19 | 20 | #### 1.0.1 - Added HTML escaping to Text inputs of Add Step Plugin 21 | 22 | #### 1.0 - Initial Release 23 | 24 | ## Install 25 | - Import plugin files "dynamic_action_plugin_de_danielh_gt_newinstance.sql / dynamic_action_plugin_de_danielh_gt_addstep.sql / dynamic_action_plugin_de_danielh_gt_starttour.sql" from source directory into your application 26 | - (Optional) Deploy the CSS/JS files from "server" directory on your webserver and change the "File Prefix" to webservers folder. 27 | 28 | ## Plugin Settings / How to use 29 | On target page create a single Dynamic Action, say "GuidedTour". 30 | Event should be set to "Page Load"! 31 | This DA has multiple true actions. 32 | 33 | #### GuidedTour (New Instance): 34 | Here you can choose 4 shepherd themes / templates for the look&feel. 35 | Use this true action, only once. Should have the smallest sequence of all true actions, so it is called first. 36 | 37 | #### GuidedTour (Add Step): 38 | This true action adds a step "popup". You can customize it with this values: 39 | - Step title 40 | - Step text 41 | - Button close text 42 | - Button next text 43 | - Position (botton/top/left/right) 44 | - Attach to CCS class: (shepherd is designed to attach the popup to a css class, for example ".t-Body-nav" for navigation menu or ".t-Body-actions" for the action menu on right side. for items use "#P1_ITEM_NAME". Without quotes!) 45 | 46 | This true action can be used multiple times. The order/sequences of the true actions are the order in which they are executed. 47 | 48 | #### GuidedTour (Start Tour): 49 | This true action starts the tour with all steps from before. Put it at the end of all true actions. 50 | 51 | ### On button click 52 | - Do all steps as it is described above except using "GuidedTour (Start Tour)" plugin. ("New Instance" and "Add Step" only) 53 | - new DA on button click - type execute Javascript (on page load false) 54 | 55 | JS Code: 56 | ```language-javascript 57 | tour.start(); 58 | ``` 59 | 60 | ## Demo Application 61 | https://apex.oracle.com/pls/apex/f?p=APEXPLUGIN 62 | 63 | ## Preview 64 | ![](https://github.com/Dani3lSun/apex-plugin-guidedtour/blob/master/preview.png) 65 | --- 66 | -------------------------------------------------------------------------------- /source/render_dynamicaction_addstep.sql: -------------------------------------------------------------------------------- 1 | /*------------------------------------- 2 | * GuidedTour Functions 3 | * Version: 1.0.1 (24.10.2017) 4 | * Author: Daniel Hochleitner 5 | *------------------------------------- 6 | */ 7 | FUNCTION render_shepherdaddstep(p_dynamic_action IN apex_plugin.t_dynamic_action, 8 | p_plugin IN apex_plugin.t_plugin) 9 | RETURN apex_plugin.t_dynamic_action_render_result IS 10 | -- 11 | l_step_name VARCHAR2(100) := p_dynamic_action.attribute_01; 12 | l_step_title VARCHAR2(100) := p_dynamic_action.attribute_02; 13 | l_step_text VARCHAR2(1000) := p_dynamic_action.attribute_03; 14 | l_attach_to_class VARCHAR2(200) := p_dynamic_action.attribute_04; 15 | l_btn_close_text VARCHAR2(50) := p_dynamic_action.attribute_05; 16 | l_btn_next_text VARCHAR2(50) := p_dynamic_action.attribute_06; 17 | l_position VARCHAR2(50) := p_dynamic_action.attribute_07; 18 | -- 19 | l_result apex_plugin.t_dynamic_action_render_result; 20 | -- 21 | BEGIN 22 | -- Debug 23 | IF apex_application.g_debug THEN 24 | apex_plugin_util.debug_dynamic_action(p_plugin => p_plugin, 25 | p_dynamic_action => p_dynamic_action); 26 | END IF; 27 | -- Escaping 28 | l_step_name := apex_escape.html(l_step_name); 29 | l_step_title := apex_escape.html(l_step_title); 30 | l_step_text := apex_escape.html(l_step_text); 31 | l_btn_close_text := apex_escape.html(l_btn_close_text); 32 | l_btn_next_text := apex_escape.html(l_btn_next_text); 33 | -- Add JS Code to Start new Stepherd Instance 34 | apex_javascript.add_inline_code(p_code => 'tour.addStep("' || l_step_name || 35 | '", {title: "' || l_step_title || 36 | '",text: "' || l_step_text || 37 | '",attachTo: "' || 38 | l_attach_to_class || ' ' || 39 | l_position || 40 | '",buttons: [{text: "' || 41 | l_btn_close_text || 42 | '",classes: "shepherd-button-secondary",action: function() {return tour.hide();}},{text: "' || 43 | l_btn_next_text || 44 | '",action: tour.next,classes: "shepherd-button-example-primary"}]});'); 45 | -- 46 | l_result.javascript_function := 'function(){null}'; 47 | l_result.attribute_01 := l_step_name; 48 | l_result.attribute_02 := l_step_title; 49 | l_result.attribute_03 := l_step_text; 50 | l_result.attribute_04 := l_attach_to_class; 51 | l_result.attribute_05 := l_btn_close_text; 52 | l_result.attribute_06 := l_btn_next_text; 53 | l_result.attribute_07 := l_position; 54 | -- 55 | RETURN l_result; 56 | -- 57 | END render_shepherdaddstep; -------------------------------------------------------------------------------- /source/dynamic_action_plugin_de_danielh_gt_starttour.sql: -------------------------------------------------------------------------------- 1 | set define off verify off feedback off 2 | whenever sqlerror exit sql.sqlcode rollback 3 | -------------------------------------------------------------------------------- 4 | -- 5 | -- ORACLE Application Express (APEX) export file 6 | -- 7 | -- You should run the script connected to SQL*Plus as the Oracle user 8 | -- APEX_050000 or as the owner (parsing schema) of the application. 9 | -- 10 | -- NOTE: Calls to apex_application_install override the defaults below. 11 | -- 12 | -------------------------------------------------------------------------------- 13 | begin 14 | wwv_flow_api.import_begin ( 15 | p_version_yyyy_mm_dd=>'2013.01.01' 16 | ,p_release=>'5.0.4.00.12' 17 | ,p_default_workspace_id=>42937890966776491 18 | ,p_default_application_id=>600 19 | ,p_default_owner=>'APEX_PLUGIN' 20 | ); 21 | end; 22 | / 23 | prompt --application/ui_types 24 | begin 25 | null; 26 | end; 27 | / 28 | prompt --application/shared_components/plugins/dynamic_action/de_danielh_gt_starttour 29 | begin 30 | wwv_flow_api.create_plugin( 31 | p_id=>wwv_flow_api.id(11086512692591284679) 32 | ,p_plugin_type=>'DYNAMIC ACTION' 33 | ,p_name=>'DE.DANIELH.GT.STARTTOUR' 34 | ,p_display_name=>'GuidedTour (Start Tour)' 35 | ,p_category=>'INIT' 36 | ,p_supported_ui_types=>'DESKTOP' 37 | ,p_plsql_code=>wwv_flow_utilities.join(wwv_flow_t_varchar2( 38 | ' /*-------------------------------------', 39 | ' * GuidedTour Functions', 40 | ' * Version: 1.0.1 (24.10.2017)', 41 | ' * Author: Daniel Hochleitner', 42 | ' *-------------------------------------', 43 | ' */', 44 | 'FUNCTION render_shepherdstarttour(p_dynamic_action IN apex_plugin.t_dynamic_action,', 45 | ' p_plugin IN apex_plugin.t_plugin)', 46 | ' RETURN apex_plugin.t_dynamic_action_render_result IS', 47 | ' --', 48 | ' l_result apex_plugin.t_dynamic_action_render_result;', 49 | ' --', 50 | 'BEGIN', 51 | ' -- Debug', 52 | ' IF apex_application.g_debug THEN', 53 | ' apex_plugin_util.debug_dynamic_action(p_plugin => p_plugin,', 54 | ' p_dynamic_action => p_dynamic_action);', 55 | ' END IF;', 56 | ' -- Add JS Code to Start new Stepherd Instance', 57 | ' --apex_javascript.add_inline_code(p_code => ''tour.start();'');', 58 | ' apex_javascript.add_onload_code(p_code => ''tour.start();'');', 59 | ' --', 60 | ' l_result.javascript_function := ''function(){null}'';', 61 | ' --', 62 | ' RETURN l_result;', 63 | ' --', 64 | 'END render_shepherdstarttour;')) 65 | ,p_render_function=>'render_shepherdstarttour' 66 | ,p_substitute_attributes=>true 67 | ,p_subscribe_plugin_settings=>true 68 | ,p_help_text=>wwv_flow_utilities.join(wwv_flow_t_varchar2( 69 | 'Dynamic Action Plugin using OpenSource JS framework "Stepherd"', 70 | 'This framework includes 3 DA Plugins.', 71 | 'Use all 3 on the same page, action is for example "page load"', 72 | '1) Shepherd (New Instance) - Creates a new Stepherd Instance/Tour - Here you can choose the look&feel template class / theme (use once per page)', 73 | '2) Shepherd (Add Step) - This Plugin adds one Step of the tour. Here you can choose title, text und position of the popup. Attached to an element css class. (can be used multiple times per page)', 74 | '3) Shepherd (Start Tour) - This plugin is the last, and starts the guided tour from step to step. (use once per page)', 75 | 'Original from: http://github.hubspot.com/shepherd/')) 76 | ,p_version_identifier=>'1.0.1' 77 | ,p_about_url=>'https://github.com/Dani3lSun/apex-plugin-guidedtour' 78 | ,p_files_version=>24 79 | ); 80 | end; 81 | / 82 | begin 83 | wwv_flow_api.import_end(p_auto_install_sup_obj => nvl(wwv_flow_application_install.get_auto_install_sup_obj, false), p_is_component_import => true); 84 | commit; 85 | end; 86 | / 87 | set verify on feedback on define on 88 | prompt ...done 89 | -------------------------------------------------------------------------------- /server/shepherd.min.js: -------------------------------------------------------------------------------- 1 | !function(e,t){"function"==typeof define&&define.amd?define(["tether"],t):"object"==typeof exports?module.exports=t(require("tether")):e.Shepherd=t(e.Tether)}(this,function(e){"use strict";function t(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function n(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(e.__proto__=t)}function i(e){var t=document.createElement("div");return t.innerHTML=e,t.children[0]}function o(e,t){var n=void 0;return"undefined"!=typeof e.matches?n=e.matches:"undefined"!=typeof e.matchesSelector?n=e.matchesSelector:"undefined"!=typeof e.msMatchesSelector?n=e.msMatchesSelector:"undefined"!=typeof e.webkitMatchesSelector?n=e.webkitMatchesSelector:"undefined"!=typeof e.mozMatchesSelector?n=e.mozMatchesSelector:"undefined"!=typeof e.oMatchesSelector&&(n=e.oMatchesSelector),n.call(e,t)}function r(e,t){if(null===e||"undefined"==typeof e)return e;if("object"==typeof e)return e;var n=e.split(" "),i=n.length,o=t.length;i>o&&(n[0]=n.slice(0,i-o+1).join(" "),n.splice(1,o));for(var r={},s=0;o>s;++s){var h=t[s];r[h]=n[s]}return r}var s=function(){function e(e,t){for(var n=0;n");var t=document.createElement("div");t.className="shepherd-content",this.el.appendChild(t);var n=document.createElement("header");if(t.appendChild(n),"undefined"!=typeof this.options.title&&(n.innerHTML+="

"+this.options.title+"

",this.el.className+=" shepherd-has-title"),this.options.showCancelLink){var o=i("✕");n.appendChild(o),this.el.className+=" shepherd-has-cancel-link",this.bindCancelLink(o)}"undefined"!=typeof this.options.text&&!function(){var n=i("
"),o=e.options.text;"function"==typeof o&&(o=o.call(e,n)),o instanceof HTMLElement?n.appendChild(o):("string"==typeof o&&(o=[o]),o.map(function(e){n.innerHTML+="

"+e+"

"})),t.appendChild(n)}();var r=document.createElement("footer");this.options.buttons&&!function(){var t=i("");e.options.buttons.map(function(n){var o=i("
  • "+n.text+"");t.appendChild(o),e.bindButtonEvents(n,o.querySelector("a"))}),r.appendChild(t)}(),t.appendChild(r),document.body.appendChild(this.el),this.setupTether(),this.options.advanceOn&&this.bindAdvance()}},{key:"bindCancelLink",value:function(e){var t=this;e.addEventListener("click",function(e){e.preventDefault(),t.cancel()})}},{key:"bindButtonEvents",value:function(e,t){var n=this;e.events=e.events||{},"undefined"!=typeof e.action&&(e.events.click=e.action);for(var i in e.events)if({}.hasOwnProperty.call(e.events,i)){var o=e.events[i];"string"==typeof o&&!function(){var e=o;o=function(){return n.tour.show(e)}}(),t.addEventListener(i,o)}this.on("destroy",function(){for(var n in e.events)if({}.hasOwnProperty.call(e.events,n)){var i=e.events[n];t.removeEventListener(n,i)}})}}]),c}(c),g=function(e){function i(){var e=this,n=void 0===arguments[0]?{}:arguments[0];t(this,i),h(Object.getPrototypeOf(i.prototype),"constructor",this).call(this,n),this.bindMethods(),this.options=n,this.steps=this.options.steps||[];var o=["complete","cancel","hide","start","show","active","inactive"];return o.map(function(t){!function(t){e.on(t,function(n){n=n||{},n.tour=e,v.trigger(t,n)})}(t)}),this}return n(i,e),s(i,[{key:"bindMethods",value:function(){var e=this,t=["next","back","cancel","complete","hide"];t.map(function(t){e[t]=e[t].bind(e)})}},{key:"addStep",value:function(e,t){return"undefined"==typeof t&&(t=e),t instanceof m?t.tour=this:(("string"==typeof e||"number"==typeof e)&&(t.id=e.toString()),t=d({},this.options.defaults,t),t=new m(this,t)),this.steps.push(t),this}},{key:"getById",value:function(e){for(var t=0;t'2013.01.01' 16 | ,p_release=>'5.0.4.00.12' 17 | ,p_default_workspace_id=>42937890966776491 18 | ,p_default_application_id=>600 19 | ,p_default_owner=>'APEX_PLUGIN' 20 | ); 21 | end; 22 | / 23 | prompt --application/ui_types 24 | begin 25 | null; 26 | end; 27 | / 28 | prompt --application/shared_components/plugins/dynamic_action/de_danielh_gt_addstep 29 | begin 30 | wwv_flow_api.create_plugin( 31 | p_id=>wwv_flow_api.id(11086497523853280640) 32 | ,p_plugin_type=>'DYNAMIC ACTION' 33 | ,p_name=>'DE.DANIELH.GT.ADDSTEP' 34 | ,p_display_name=>'GuidedTour (Add Step)' 35 | ,p_category=>'INIT' 36 | ,p_supported_ui_types=>'DESKTOP' 37 | ,p_plsql_code=>wwv_flow_utilities.join(wwv_flow_t_varchar2( 38 | '/*-------------------------------------', 39 | ' * GuidedTour Functions', 40 | ' * Version: 1.0.1 (24.10.2017)', 41 | ' * Author: Daniel Hochleitner', 42 | ' *-------------------------------------', 43 | '*/', 44 | 'FUNCTION render_shepherdaddstep(p_dynamic_action IN apex_plugin.t_dynamic_action,', 45 | ' p_plugin IN apex_plugin.t_plugin)', 46 | ' RETURN apex_plugin.t_dynamic_action_render_result IS', 47 | ' --', 48 | ' l_step_name VARCHAR2(100) := p_dynamic_action.attribute_01;', 49 | ' l_step_title VARCHAR2(100) := p_dynamic_action.attribute_02;', 50 | ' l_step_text VARCHAR2(1000) := p_dynamic_action.attribute_03;', 51 | ' l_attach_to_class VARCHAR2(200) := p_dynamic_action.attribute_04;', 52 | ' l_btn_close_text VARCHAR2(50) := p_dynamic_action.attribute_05;', 53 | ' l_btn_next_text VARCHAR2(50) := p_dynamic_action.attribute_06;', 54 | ' l_position VARCHAR2(50) := p_dynamic_action.attribute_07;', 55 | ' --', 56 | ' l_result apex_plugin.t_dynamic_action_render_result;', 57 | ' --', 58 | 'BEGIN', 59 | ' -- Debug', 60 | ' IF apex_application.g_debug THEN', 61 | ' apex_plugin_util.debug_dynamic_action(p_plugin => p_plugin,', 62 | ' p_dynamic_action => p_dynamic_action);', 63 | ' END IF;', 64 | ' -- Escaping', 65 | ' l_step_name := apex_escape.html(l_step_name);', 66 | ' l_step_title := apex_escape.html(l_step_title);', 67 | ' l_step_text := apex_escape.html(l_step_text);', 68 | ' l_btn_close_text := apex_escape.html(l_btn_close_text);', 69 | ' l_btn_next_text := apex_escape.html(l_btn_next_text);', 70 | ' -- Add JS Code to Start new Stepherd Instance', 71 | ' apex_javascript.add_inline_code(p_code => ''tour.addStep("'' || l_step_name ||', 72 | ' ''", {title: "'' || l_step_title ||', 73 | ' ''",text: "'' || l_step_text ||', 74 | ' ''",attachTo: "'' ||', 75 | ' l_attach_to_class || '' '' ||', 76 | ' l_position ||', 77 | ' ''",buttons: [{text: "'' ||', 78 | ' l_btn_close_text ||', 79 | ' ''",classes: "shepherd-button-secondary",action: function() {return tour.hide();}},{text: "'' ||', 80 | ' l_btn_next_text ||', 81 | ' ''",action: tour.next,classes: "shepherd-button-example-primary"}]});'');', 82 | ' --', 83 | ' l_result.javascript_function := ''function(){null}'';', 84 | ' l_result.attribute_01 := l_step_name;', 85 | ' l_result.attribute_02 := l_step_title;', 86 | ' l_result.attribute_03 := l_step_text;', 87 | ' l_result.attribute_04 := l_attach_to_class;', 88 | ' l_result.attribute_05 := l_btn_close_text;', 89 | ' l_result.attribute_06 := l_btn_next_text;', 90 | ' l_result.attribute_07 := l_position;', 91 | ' --', 92 | ' RETURN l_result;', 93 | ' --', 94 | 'END render_shepherdaddstep;')) 95 | ,p_render_function=>'render_shepherdaddstep' 96 | ,p_substitute_attributes=>true 97 | ,p_subscribe_plugin_settings=>true 98 | ,p_help_text=>wwv_flow_utilities.join(wwv_flow_t_varchar2( 99 | 'Dynamic Action Plugin using OpenSource JS framework "Stepherd"', 100 | 'This framework includes 3 DA Plugins.', 101 | 'Use all 3 on the same page, action is for example "page load"', 102 | '1) Shepherd (New Instance) - Creates a new Stepherd Instance/Tour - Here you can choose the look&feel template class / theme (use once per page)', 103 | '2) Shepherd (Add Step) - This Plugin adds one Step of the tour. Here you can choose title, text und position of the popup. Attached to an element css class. (can be used multiple times per page)', 104 | '3) Shepherd (Start Tour) - This plugin is the last, and starts the guided tour from step to step. (use once per page)', 105 | 'Original from: http://github.hubspot.com/shepherd/')) 106 | ,p_version_identifier=>'1.0.1' 107 | ,p_about_url=>'https://github.com/Dani3lSun/apex-plugin-guidedtour' 108 | ,p_files_version=>24 109 | ); 110 | wwv_flow_api.create_plugin_attribute( 111 | p_id=>wwv_flow_api.id(11086497759735280644) 112 | ,p_plugin_id=>wwv_flow_api.id(11086497523853280640) 113 | ,p_attribute_scope=>'COMPONENT' 114 | ,p_attribute_sequence=>1 115 | ,p_display_sequence=>10 116 | ,p_prompt=>'Step Name' 117 | ,p_attribute_type=>'TEXT' 118 | ,p_is_required=>true 119 | ,p_default_value=>'Step1' 120 | ,p_is_translatable=>true 121 | ,p_help_text=>'Give the step an name. this value would not be displayed.' 122 | ); 123 | wwv_flow_api.create_plugin_attribute( 124 | p_id=>wwv_flow_api.id(11086498073241280645) 125 | ,p_plugin_id=>wwv_flow_api.id(11086497523853280640) 126 | ,p_attribute_scope=>'COMPONENT' 127 | ,p_attribute_sequence=>2 128 | ,p_display_sequence=>20 129 | ,p_prompt=>'Step Title' 130 | ,p_attribute_type=>'TEXT' 131 | ,p_is_required=>true 132 | ,p_default_value=>'Title1' 133 | ,p_is_translatable=>true 134 | ,p_help_text=>'Visible title of the step.' 135 | ); 136 | wwv_flow_api.create_plugin_attribute( 137 | p_id=>wwv_flow_api.id(11086498551841280646) 138 | ,p_plugin_id=>wwv_flow_api.id(11086497523853280640) 139 | ,p_attribute_scope=>'COMPONENT' 140 | ,p_attribute_sequence=>3 141 | ,p_display_sequence=>30 142 | ,p_prompt=>'Step Text' 143 | ,p_attribute_type=>'TEXT' 144 | ,p_is_required=>true 145 | ,p_is_translatable=>true 146 | ,p_help_text=>'Visible Text of the step.' 147 | ); 148 | wwv_flow_api.create_plugin_attribute( 149 | p_id=>wwv_flow_api.id(11086498923070280646) 150 | ,p_plugin_id=>wwv_flow_api.id(11086497523853280640) 151 | ,p_attribute_scope=>'COMPONENT' 152 | ,p_attribute_sequence=>4 153 | ,p_display_sequence=>40 154 | ,p_prompt=>'Attach to CSS class' 155 | ,p_attribute_type=>'TEXT' 156 | ,p_is_required=>true 157 | ,p_is_translatable=>false 158 | ,p_examples=>wwv_flow_utilities.join(wwv_flow_t_varchar2( 159 | 'attached to item: #P100_ITEM_NAME', 160 | 'attached to menu bar: .t-NavigationBar-item', 161 | 'attached to report card: .t-Card')) 162 | ,p_help_text=>'css class the "popup" would be attached to.' 163 | ); 164 | wwv_flow_api.create_plugin_attribute( 165 | p_id=>wwv_flow_api.id(11086499334004280646) 166 | ,p_plugin_id=>wwv_flow_api.id(11086497523853280640) 167 | ,p_attribute_scope=>'COMPONENT' 168 | ,p_attribute_sequence=>5 169 | ,p_display_sequence=>50 170 | ,p_prompt=>'Button Close Text' 171 | ,p_attribute_type=>'TEXT' 172 | ,p_is_required=>true 173 | ,p_default_value=>'Close' 174 | ,p_is_translatable=>true 175 | ,p_help_text=>'Text/Label of the close button.' 176 | ); 177 | wwv_flow_api.create_plugin_attribute( 178 | p_id=>wwv_flow_api.id(11086499667009280647) 179 | ,p_plugin_id=>wwv_flow_api.id(11086497523853280640) 180 | ,p_attribute_scope=>'COMPONENT' 181 | ,p_attribute_sequence=>6 182 | ,p_display_sequence=>60 183 | ,p_prompt=>'Button Next Text' 184 | ,p_attribute_type=>'TEXT' 185 | ,p_is_required=>false 186 | ,p_default_value=>'Next' 187 | ,p_is_translatable=>false 188 | ,p_help_text=>wwv_flow_utilities.join(wwv_flow_t_varchar2( 189 | 'Text/Label of the next button.', 190 | 'For last step, the label could be "done" instead of "next."')) 191 | ); 192 | wwv_flow_api.create_plugin_attribute( 193 | p_id=>wwv_flow_api.id(11086500155199280647) 194 | ,p_plugin_id=>wwv_flow_api.id(11086497523853280640) 195 | ,p_attribute_scope=>'COMPONENT' 196 | ,p_attribute_sequence=>7 197 | ,p_display_sequence=>70 198 | ,p_prompt=>'Position' 199 | ,p_attribute_type=>'SELECT LIST' 200 | ,p_is_required=>false 201 | ,p_default_value=>'bottom' 202 | ,p_is_translatable=>false 203 | ,p_lov_type=>'STATIC' 204 | ,p_help_text=>'Position of the popup. Choose between top/bottom/left/right.' 205 | ); 206 | wwv_flow_api.create_plugin_attr_value( 207 | p_id=>wwv_flow_api.id(11086500524246280647) 208 | ,p_plugin_attribute_id=>wwv_flow_api.id(11086500155199280647) 209 | ,p_display_sequence=>10 210 | ,p_display_value=>'Bottom' 211 | ,p_return_value=>'bottom' 212 | ); 213 | wwv_flow_api.create_plugin_attr_value( 214 | p_id=>wwv_flow_api.id(11086501002903280649) 215 | ,p_plugin_attribute_id=>wwv_flow_api.id(11086500155199280647) 216 | ,p_display_sequence=>20 217 | ,p_display_value=>'Top' 218 | ,p_return_value=>'top' 219 | ); 220 | wwv_flow_api.create_plugin_attr_value( 221 | p_id=>wwv_flow_api.id(11086501542540280649) 222 | ,p_plugin_attribute_id=>wwv_flow_api.id(11086500155199280647) 223 | ,p_display_sequence=>30 224 | ,p_display_value=>'Left' 225 | ,p_return_value=>'left' 226 | ); 227 | wwv_flow_api.create_plugin_attr_value( 228 | p_id=>wwv_flow_api.id(11086502032499280650) 229 | ,p_plugin_attribute_id=>wwv_flow_api.id(11086500155199280647) 230 | ,p_display_sequence=>40 231 | ,p_display_value=>'Right' 232 | ,p_return_value=>'right' 233 | ); 234 | end; 235 | / 236 | begin 237 | wwv_flow_api.import_end(p_auto_install_sup_obj => nvl(wwv_flow_application_install.get_auto_install_sup_obj, false), p_is_component_import => true); 238 | commit; 239 | end; 240 | / 241 | set verify on feedback on define on 242 | prompt ...done 243 | -------------------------------------------------------------------------------- /server/shepherd-theme-dark.css: -------------------------------------------------------------------------------- 1 | .shepherd-element, .shepherd-element:after, .shepherd-element:before, .shepherd-element *, .shepherd-element *:after, .shepherd-element *:before { 2 | box-sizing: border-box; } 3 | 4 | .shepherd-element { 5 | position: absolute; 6 | display: none; } 7 | .shepherd-element.shepherd-open { 8 | display: block; } 9 | 10 | .shepherd-element.shepherd-theme-dark { 11 | max-width: 100%; 12 | max-height: 100%; } 13 | .shepherd-element.shepherd-theme-dark .shepherd-content { 14 | border-radius: 5px; 15 | position: relative; 16 | font-family: inherit; 17 | background: #232323; 18 | color: #eee; 19 | padding: 1em; 20 | font-size: 1.1em; 21 | line-height: 1.5em; } 22 | .shepherd-element.shepherd-theme-dark .shepherd-content:before { 23 | content: ""; 24 | display: block; 25 | position: absolute; 26 | width: 0; 27 | height: 0; 28 | border-color: transparent; 29 | border-width: 16px; 30 | border-style: solid; 31 | pointer-events: none; } 32 | .shepherd-element.shepherd-theme-dark.shepherd-element-attached-bottom.shepherd-element-attached-center .shepherd-content { 33 | margin-bottom: 16px; } 34 | .shepherd-element.shepherd-theme-dark.shepherd-element-attached-bottom.shepherd-element-attached-center .shepherd-content:before { 35 | top: 100%; 36 | left: 50%; 37 | margin-left: -16px; 38 | border-top-color: #232323; } 39 | .shepherd-element.shepherd-theme-dark.shepherd-element-attached-top.shepherd-element-attached-center .shepherd-content { 40 | margin-top: 16px; } 41 | .shepherd-element.shepherd-theme-dark.shepherd-element-attached-top.shepherd-element-attached-center .shepherd-content:before { 42 | bottom: 100%; 43 | left: 50%; 44 | margin-left: -16px; 45 | border-bottom-color: #232323; } 46 | .shepherd-element.shepherd-theme-dark.shepherd-element-attached-right.shepherd-element-attached-middle .shepherd-content { 47 | margin-right: 16px; } 48 | .shepherd-element.shepherd-theme-dark.shepherd-element-attached-right.shepherd-element-attached-middle .shepherd-content:before { 49 | left: 100%; 50 | top: 50%; 51 | margin-top: -16px; 52 | border-left-color: #232323; } 53 | .shepherd-element.shepherd-theme-dark.shepherd-element-attached-left.shepherd-element-attached-middle .shepherd-content { 54 | margin-left: 16px; } 55 | .shepherd-element.shepherd-theme-dark.shepherd-element-attached-left.shepherd-element-attached-middle .shepherd-content:before { 56 | right: 100%; 57 | top: 50%; 58 | margin-top: -16px; 59 | border-right-color: #232323; } 60 | .shepherd-element.shepherd-theme-dark.shepherd-element-attached-top.shepherd-element-attached-left.shepherd-target-attached-bottom .shepherd-content { 61 | margin-top: 16px; } 62 | .shepherd-element.shepherd-theme-dark.shepherd-element-attached-top.shepherd-element-attached-left.shepherd-target-attached-bottom .shepherd-content:before { 63 | bottom: 100%; 64 | left: 16px; 65 | border-bottom-color: #232323; } 66 | .shepherd-element.shepherd-theme-dark.shepherd-element-attached-top.shepherd-element-attached-right.shepherd-target-attached-bottom .shepherd-content { 67 | margin-top: 16px; } 68 | .shepherd-element.shepherd-theme-dark.shepherd-element-attached-top.shepherd-element-attached-right.shepherd-target-attached-bottom .shepherd-content:before { 69 | bottom: 100%; 70 | right: 16px; 71 | border-bottom-color: #232323; } 72 | .shepherd-element.shepherd-theme-dark.shepherd-element-attached-bottom.shepherd-element-attached-left.shepherd-target-attached-top .shepherd-content { 73 | margin-bottom: 16px; } 74 | .shepherd-element.shepherd-theme-dark.shepherd-element-attached-bottom.shepherd-element-attached-left.shepherd-target-attached-top .shepherd-content:before { 75 | top: 100%; 76 | left: 16px; 77 | border-top-color: #232323; } 78 | .shepherd-element.shepherd-theme-dark.shepherd-element-attached-bottom.shepherd-element-attached-right.shepherd-target-attached-top .shepherd-content { 79 | margin-bottom: 16px; } 80 | .shepherd-element.shepherd-theme-dark.shepherd-element-attached-bottom.shepherd-element-attached-right.shepherd-target-attached-top .shepherd-content:before { 81 | top: 100%; 82 | right: 16px; 83 | border-top-color: #232323; } 84 | .shepherd-element.shepherd-theme-dark.shepherd-element-attached-top.shepherd-element-attached-right.shepherd-target-attached-left .shepherd-content { 85 | margin-right: 16px; } 86 | .shepherd-element.shepherd-theme-dark.shepherd-element-attached-top.shepherd-element-attached-right.shepherd-target-attached-left .shepherd-content:before { 87 | top: 16px; 88 | left: 100%; 89 | border-left-color: #232323; } 90 | .shepherd-element.shepherd-theme-dark.shepherd-element-attached-top.shepherd-element-attached-left.shepherd-target-attached-right .shepherd-content { 91 | margin-left: 16px; } 92 | .shepherd-element.shepherd-theme-dark.shepherd-element-attached-top.shepherd-element-attached-left.shepherd-target-attached-right .shepherd-content:before { 93 | top: 16px; 94 | right: 100%; 95 | border-right-color: #232323; } 96 | .shepherd-element.shepherd-theme-dark.shepherd-element-attached-bottom.shepherd-element-attached-right.shepherd-target-attached-left .shepherd-content { 97 | margin-right: 16px; } 98 | .shepherd-element.shepherd-theme-dark.shepherd-element-attached-bottom.shepherd-element-attached-right.shepherd-target-attached-left .shepherd-content:before { 99 | bottom: 16px; 100 | left: 100%; 101 | border-left-color: #232323; } 102 | .shepherd-element.shepherd-theme-dark.shepherd-element-attached-bottom.shepherd-element-attached-left.shepherd-target-attached-right .shepherd-content { 103 | margin-left: 16px; } 104 | .shepherd-element.shepherd-theme-dark.shepherd-element-attached-bottom.shepherd-element-attached-left.shepherd-target-attached-right .shepherd-content:before { 105 | bottom: 16px; 106 | right: 100%; 107 | border-right-color: #232323; } 108 | 109 | .shepherd-element.shepherd-theme-dark { 110 | z-index: 9999; 111 | max-width: 24em; 112 | font-size: 1em; } 113 | .shepherd-element.shepherd-theme-dark.shepherd-element-attached-top.shepherd-element-attached-center.shepherd-has-title .shepherd-content:before, .shepherd-element.shepherd-theme-dark.shepherd-element-attached-top.shepherd-element-attached-right.shepherd-target-attached-bottom.shepherd-has-title .shepherd-content:before, .shepherd-element.shepherd-theme-dark.shepherd-element-attached-top.shepherd-element-attached-left.shepherd-target-attached-bottom.shepherd-has-title .shepherd-content:before { 114 | border-bottom-color: #303030; } 115 | .shepherd-element.shepherd-theme-dark.shepherd-has-title .shepherd-content header { 116 | background: #303030; 117 | padding: 1em; } 118 | .shepherd-element.shepherd-theme-dark.shepherd-has-title .shepherd-content header a.shepherd-cancel-link { 119 | padding: 0; 120 | margin-bottom: 0; } 121 | .shepherd-element.shepherd-theme-dark.shepherd-has-cancel-link .shepherd-content header h3 { 122 | float: left; } 123 | .shepherd-element.shepherd-theme-dark .shepherd-content { 124 | box-shadow: 0 0 1em rgba(0, 0, 0, 0.2); 125 | padding: 0; } 126 | .shepherd-element.shepherd-theme-dark .shepherd-content * { 127 | font-size: inherit; } 128 | .shepherd-element.shepherd-theme-dark .shepherd-content header { 129 | *zoom: 1; 130 | border-radius: 5px 5px 0 0; } 131 | .shepherd-element.shepherd-theme-dark .shepherd-content header:after { 132 | content: ""; 133 | display: table; 134 | clear: both; } 135 | .shepherd-element.shepherd-theme-dark .shepherd-content header h3 { 136 | margin: 0; 137 | line-height: 1; 138 | font-weight: normal; } 139 | .shepherd-element.shepherd-theme-dark .shepherd-content header a.shepherd-cancel-link { 140 | float: right; 141 | text-decoration: none; 142 | font-size: 1.25em; 143 | line-height: .8em; 144 | font-weight: normal; 145 | color: rgba(0, 0, 0, 0.5); 146 | opacity: 0.25; 147 | position: relative; 148 | top: .1em; 149 | padding: .8em; 150 | margin-bottom: -.8em; } 151 | .shepherd-element.shepherd-theme-dark .shepherd-content header a.shepherd-cancel-link:hover { 152 | opacity: 1; } 153 | .shepherd-element.shepherd-theme-dark .shepherd-content .shepherd-text { 154 | padding: 1em; } 155 | .shepherd-element.shepherd-theme-dark .shepherd-content .shepherd-text p { 156 | margin: 0 0 0.5em 0; 157 | line-height: 1.3em; } 158 | .shepherd-element.shepherd-theme-dark .shepherd-content .shepherd-text p:last-child { 159 | margin-bottom: 0; } 160 | .shepherd-element.shepherd-theme-dark .shepherd-content footer { 161 | padding: 0 1em 1em; } 162 | .shepherd-element.shepherd-theme-dark .shepherd-content footer .shepherd-buttons { 163 | text-align: right; 164 | list-style: none; 165 | padding: 0; 166 | margin: 0; } 167 | .shepherd-element.shepherd-theme-dark .shepherd-content footer .shepherd-buttons li { 168 | display: inline; 169 | padding: 0; 170 | margin: 0; } 171 | .shepherd-element.shepherd-theme-dark .shepherd-content footer .shepherd-buttons li .shepherd-button { 172 | display: inline-block; 173 | vertical-align: middle; 174 | *vertical-align: auto; 175 | *zoom: 1; 176 | *display: inline; 177 | border-radius: 3px; 178 | cursor: pointer; 179 | border: 0; 180 | margin: 0 0.5em 0 0; 181 | font-family: inherit; 182 | text-transform: uppercase; 183 | letter-spacing: .1em; 184 | font-size: .8em; 185 | line-height: 1em; 186 | padding: 0.75em 2em; 187 | background: #3288e6; 188 | color: #fff; } 189 | .shepherd-element.shepherd-theme-dark .shepherd-content footer .shepherd-buttons li .shepherd-button.shepherd-button-secondary { 190 | background: #eee; 191 | color: #888; } 192 | .shepherd-element.shepherd-theme-dark .shepherd-content footer .shepherd-buttons li:last-child .shepherd-button { 193 | margin-right: 0; } 194 | 195 | .shepherd-start-tour-button.shepherd-theme-dark { 196 | display: inline-block; 197 | vertical-align: middle; 198 | *vertical-align: auto; 199 | *zoom: 1; 200 | *display: inline; 201 | border-radius: 3px; 202 | cursor: pointer; 203 | border: 0; 204 | margin: 0 0.5em 0 0; 205 | font-family: inherit; 206 | text-transform: uppercase; 207 | letter-spacing: .1em; 208 | font-size: .8em; 209 | line-height: 1em; 210 | padding: 0.75em 2em; 211 | background: #3288e6; 212 | color: #fff; } 213 | -------------------------------------------------------------------------------- /server/shepherd-theme-square.css: -------------------------------------------------------------------------------- 1 | .shepherd-element, .shepherd-element:after, .shepherd-element:before, .shepherd-element *, .shepherd-element *:after, .shepherd-element *:before { 2 | box-sizing: border-box; } 3 | 4 | .shepherd-element { 5 | position: absolute; 6 | display: none; } 7 | .shepherd-element.shepherd-open { 8 | display: block; } 9 | 10 | .shepherd-element.shepherd-theme-square { 11 | max-width: 100%; 12 | max-height: 100%; } 13 | .shepherd-element.shepherd-theme-square .shepherd-content { 14 | border-radius: 5px; 15 | position: relative; 16 | font-family: inherit; 17 | background: #f6f6f6; 18 | color: #444; 19 | padding: 1em; 20 | font-size: 1.1em; 21 | line-height: 1.5em; } 22 | .shepherd-element.shepherd-theme-square .shepherd-content:before { 23 | content: ""; 24 | display: block; 25 | position: absolute; 26 | width: 0; 27 | height: 0; 28 | border-color: transparent; 29 | border-width: 16px; 30 | border-style: solid; 31 | pointer-events: none; } 32 | .shepherd-element.shepherd-theme-square.shepherd-element-attached-bottom.shepherd-element-attached-center .shepherd-content { 33 | margin-bottom: 16px; } 34 | .shepherd-element.shepherd-theme-square.shepherd-element-attached-bottom.shepherd-element-attached-center .shepherd-content:before { 35 | top: 100%; 36 | left: 50%; 37 | margin-left: -16px; 38 | border-top-color: #f6f6f6; } 39 | .shepherd-element.shepherd-theme-square.shepherd-element-attached-top.shepherd-element-attached-center .shepherd-content { 40 | margin-top: 16px; } 41 | .shepherd-element.shepherd-theme-square.shepherd-element-attached-top.shepherd-element-attached-center .shepherd-content:before { 42 | bottom: 100%; 43 | left: 50%; 44 | margin-left: -16px; 45 | border-bottom-color: #f6f6f6; } 46 | .shepherd-element.shepherd-theme-square.shepherd-element-attached-right.shepherd-element-attached-middle .shepherd-content { 47 | margin-right: 16px; } 48 | .shepherd-element.shepherd-theme-square.shepherd-element-attached-right.shepherd-element-attached-middle .shepherd-content:before { 49 | left: 100%; 50 | top: 50%; 51 | margin-top: -16px; 52 | border-left-color: #f6f6f6; } 53 | .shepherd-element.shepherd-theme-square.shepherd-element-attached-left.shepherd-element-attached-middle .shepherd-content { 54 | margin-left: 16px; } 55 | .shepherd-element.shepherd-theme-square.shepherd-element-attached-left.shepherd-element-attached-middle .shepherd-content:before { 56 | right: 100%; 57 | top: 50%; 58 | margin-top: -16px; 59 | border-right-color: #f6f6f6; } 60 | .shepherd-element.shepherd-theme-square.shepherd-element-attached-top.shepherd-element-attached-left.shepherd-target-attached-bottom .shepherd-content { 61 | margin-top: 16px; } 62 | .shepherd-element.shepherd-theme-square.shepherd-element-attached-top.shepherd-element-attached-left.shepherd-target-attached-bottom .shepherd-content:before { 63 | bottom: 100%; 64 | left: 16px; 65 | border-bottom-color: #f6f6f6; } 66 | .shepherd-element.shepherd-theme-square.shepherd-element-attached-top.shepherd-element-attached-right.shepherd-target-attached-bottom .shepherd-content { 67 | margin-top: 16px; } 68 | .shepherd-element.shepherd-theme-square.shepherd-element-attached-top.shepherd-element-attached-right.shepherd-target-attached-bottom .shepherd-content:before { 69 | bottom: 100%; 70 | right: 16px; 71 | border-bottom-color: #f6f6f6; } 72 | .shepherd-element.shepherd-theme-square.shepherd-element-attached-bottom.shepherd-element-attached-left.shepherd-target-attached-top .shepherd-content { 73 | margin-bottom: 16px; } 74 | .shepherd-element.shepherd-theme-square.shepherd-element-attached-bottom.shepherd-element-attached-left.shepherd-target-attached-top .shepherd-content:before { 75 | top: 100%; 76 | left: 16px; 77 | border-top-color: #f6f6f6; } 78 | .shepherd-element.shepherd-theme-square.shepherd-element-attached-bottom.shepherd-element-attached-right.shepherd-target-attached-top .shepherd-content { 79 | margin-bottom: 16px; } 80 | .shepherd-element.shepherd-theme-square.shepherd-element-attached-bottom.shepherd-element-attached-right.shepherd-target-attached-top .shepherd-content:before { 81 | top: 100%; 82 | right: 16px; 83 | border-top-color: #f6f6f6; } 84 | .shepherd-element.shepherd-theme-square.shepherd-element-attached-top.shepherd-element-attached-right.shepherd-target-attached-left .shepherd-content { 85 | margin-right: 16px; } 86 | .shepherd-element.shepherd-theme-square.shepherd-element-attached-top.shepherd-element-attached-right.shepherd-target-attached-left .shepherd-content:before { 87 | top: 16px; 88 | left: 100%; 89 | border-left-color: #f6f6f6; } 90 | .shepherd-element.shepherd-theme-square.shepherd-element-attached-top.shepherd-element-attached-left.shepherd-target-attached-right .shepherd-content { 91 | margin-left: 16px; } 92 | .shepherd-element.shepherd-theme-square.shepherd-element-attached-top.shepherd-element-attached-left.shepherd-target-attached-right .shepherd-content:before { 93 | top: 16px; 94 | right: 100%; 95 | border-right-color: #f6f6f6; } 96 | .shepherd-element.shepherd-theme-square.shepherd-element-attached-bottom.shepherd-element-attached-right.shepherd-target-attached-left .shepherd-content { 97 | margin-right: 16px; } 98 | .shepherd-element.shepherd-theme-square.shepherd-element-attached-bottom.shepherd-element-attached-right.shepherd-target-attached-left .shepherd-content:before { 99 | bottom: 16px; 100 | left: 100%; 101 | border-left-color: #f6f6f6; } 102 | .shepherd-element.shepherd-theme-square.shepherd-element-attached-bottom.shepherd-element-attached-left.shepherd-target-attached-right .shepherd-content { 103 | margin-left: 16px; } 104 | .shepherd-element.shepherd-theme-square.shepherd-element-attached-bottom.shepherd-element-attached-left.shepherd-target-attached-right .shepherd-content:before { 105 | bottom: 16px; 106 | right: 100%; 107 | border-right-color: #f6f6f6; } 108 | 109 | .shepherd-element.shepherd-theme-square { 110 | border-radius: 0; 111 | z-index: 9999; 112 | max-width: 24em; 113 | font-size: 1em; } 114 | .shepherd-element.shepherd-theme-square.shepherd-element-attached-top.shepherd-element-attached-center.shepherd-has-title .shepherd-content:before, .shepherd-element.shepherd-theme-square.shepherd-element-attached-top.shepherd-element-attached-right.shepherd-target-attached-bottom.shepherd-has-title .shepherd-content:before, .shepherd-element.shepherd-theme-square.shepherd-element-attached-top.shepherd-element-attached-left.shepherd-target-attached-bottom.shepherd-has-title .shepherd-content:before { 115 | border-bottom-color: #e6e6e6; } 116 | .shepherd-element.shepherd-theme-square.shepherd-has-title .shepherd-content header { 117 | background: #e6e6e6; 118 | padding: 1em; } 119 | .shepherd-element.shepherd-theme-square.shepherd-has-title .shepherd-content header a.shepherd-cancel-link { 120 | padding: 0; 121 | margin-bottom: 0; } 122 | .shepherd-element.shepherd-theme-square.shepherd-has-cancel-link .shepherd-content header h3 { 123 | float: left; } 124 | .shepherd-element.shepherd-theme-square .shepherd-content { 125 | box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.17); 126 | border-radius: 0; 127 | padding: 0; } 128 | .shepherd-element.shepherd-theme-square .shepherd-content * { 129 | font-size: inherit; } 130 | .shepherd-element.shepherd-theme-square .shepherd-content header { 131 | *zoom: 1; 132 | border-radius: 0; } 133 | .shepherd-element.shepherd-theme-square .shepherd-content header:after { 134 | content: ""; 135 | display: table; 136 | clear: both; } 137 | .shepherd-element.shepherd-theme-square .shepherd-content header h3 { 138 | margin: 0; 139 | line-height: 1; 140 | font-weight: normal; } 141 | .shepherd-element.shepherd-theme-square .shepherd-content header a.shepherd-cancel-link { 142 | float: right; 143 | text-decoration: none; 144 | font-size: 1.25em; 145 | line-height: .8em; 146 | font-weight: normal; 147 | color: rgba(0, 0, 0, 0.5); 148 | opacity: 0.25; 149 | position: relative; 150 | top: .1em; 151 | padding: .8em; 152 | margin-bottom: -.8em; } 153 | .shepherd-element.shepherd-theme-square .shepherd-content header a.shepherd-cancel-link:hover { 154 | opacity: 1; } 155 | .shepherd-element.shepherd-theme-square .shepherd-content .shepherd-text { 156 | padding: 1em; } 157 | .shepherd-element.shepherd-theme-square .shepherd-content .shepherd-text p { 158 | margin: 0 0 0.5em 0; 159 | line-height: 1.3em; } 160 | .shepherd-element.shepherd-theme-square .shepherd-content .shepherd-text p:last-child { 161 | margin-bottom: 0; } 162 | .shepherd-element.shepherd-theme-square .shepherd-content footer { 163 | padding: 0 1em 1em; } 164 | .shepherd-element.shepherd-theme-square .shepherd-content footer .shepherd-buttons { 165 | text-align: right; 166 | list-style: none; 167 | padding: 0; 168 | margin: 0; } 169 | .shepherd-element.shepherd-theme-square .shepherd-content footer .shepherd-buttons li { 170 | display: inline; 171 | padding: 0; 172 | margin: 0; } 173 | .shepherd-element.shepherd-theme-square .shepherd-content footer .shepherd-buttons li .shepherd-button { 174 | display: inline-block; 175 | vertical-align: middle; 176 | *vertical-align: auto; 177 | *zoom: 1; 178 | *display: inline; 179 | border-radius: 0; 180 | cursor: pointer; 181 | border: 0; 182 | margin: 0 0.5em 0 0; 183 | font-family: inherit; 184 | text-transform: uppercase; 185 | letter-spacing: .1em; 186 | font-size: .8em; 187 | line-height: 1em; 188 | padding: 0.75em 2em; 189 | background: #3288e6; 190 | color: #fff; } 191 | .shepherd-element.shepherd-theme-square .shepherd-content footer .shepherd-buttons li .shepherd-button.shepherd-button-secondary { 192 | background: #eee; 193 | color: #888; } 194 | .shepherd-element.shepherd-theme-square .shepherd-content footer .shepherd-buttons li:last-child .shepherd-button { 195 | margin-right: 0; } 196 | 197 | .shepherd-start-tour-button.shepherd-theme-square { 198 | display: inline-block; 199 | vertical-align: middle; 200 | *vertical-align: auto; 201 | *zoom: 1; 202 | *display: inline; 203 | border-radius: 0; 204 | cursor: pointer; 205 | border: 0; 206 | margin: 0 0.5em 0 0; 207 | font-family: inherit; 208 | text-transform: uppercase; 209 | letter-spacing: .1em; 210 | font-size: .8em; 211 | line-height: 1em; 212 | padding: 0.75em 2em; 213 | background: #3288e6; 214 | color: #fff; } 215 | -------------------------------------------------------------------------------- /server/shepherd-theme-default.css: -------------------------------------------------------------------------------- 1 | .shepherd-element, .shepherd-element:after, .shepherd-element:before, .shepherd-element *, .shepherd-element *:after, .shepherd-element *:before { 2 | box-sizing: border-box; } 3 | 4 | .shepherd-element { 5 | position: absolute; 6 | display: none; } 7 | .shepherd-element.shepherd-open { 8 | display: block; } 9 | 10 | .shepherd-element.shepherd-theme-default { 11 | max-width: 100%; 12 | max-height: 100%; } 13 | .shepherd-element.shepherd-theme-default .shepherd-content { 14 | border-radius: 5px; 15 | position: relative; 16 | font-family: inherit; 17 | background: #f6f6f6; 18 | color: #444; 19 | padding: 1em; 20 | font-size: 1.1em; 21 | line-height: 1.5em; } 22 | .shepherd-element.shepherd-theme-default .shepherd-content:before { 23 | content: ""; 24 | display: block; 25 | position: absolute; 26 | width: 0; 27 | height: 0; 28 | border-color: transparent; 29 | border-width: 16px; 30 | border-style: solid; 31 | pointer-events: none; } 32 | .shepherd-element.shepherd-theme-default.shepherd-element-attached-bottom.shepherd-element-attached-center .shepherd-content { 33 | margin-bottom: 16px; } 34 | .shepherd-element.shepherd-theme-default.shepherd-element-attached-bottom.shepherd-element-attached-center .shepherd-content:before { 35 | top: 100%; 36 | left: 50%; 37 | margin-left: -16px; 38 | border-top-color: #f6f6f6; } 39 | .shepherd-element.shepherd-theme-default.shepherd-element-attached-top.shepherd-element-attached-center .shepherd-content { 40 | margin-top: 16px; } 41 | .shepherd-element.shepherd-theme-default.shepherd-element-attached-top.shepherd-element-attached-center .shepherd-content:before { 42 | bottom: 100%; 43 | left: 50%; 44 | margin-left: -16px; 45 | border-bottom-color: #f6f6f6; } 46 | .shepherd-element.shepherd-theme-default.shepherd-element-attached-right.shepherd-element-attached-middle .shepherd-content { 47 | margin-right: 16px; } 48 | .shepherd-element.shepherd-theme-default.shepherd-element-attached-right.shepherd-element-attached-middle .shepherd-content:before { 49 | left: 100%; 50 | top: 50%; 51 | margin-top: -16px; 52 | border-left-color: #f6f6f6; } 53 | .shepherd-element.shepherd-theme-default.shepherd-element-attached-left.shepherd-element-attached-middle .shepherd-content { 54 | margin-left: 16px; } 55 | .shepherd-element.shepherd-theme-default.shepherd-element-attached-left.shepherd-element-attached-middle .shepherd-content:before { 56 | right: 100%; 57 | top: 50%; 58 | margin-top: -16px; 59 | border-right-color: #f6f6f6; } 60 | .shepherd-element.shepherd-theme-default.shepherd-element-attached-top.shepherd-element-attached-left.shepherd-target-attached-bottom .shepherd-content { 61 | margin-top: 16px; } 62 | .shepherd-element.shepherd-theme-default.shepherd-element-attached-top.shepherd-element-attached-left.shepherd-target-attached-bottom .shepherd-content:before { 63 | bottom: 100%; 64 | left: 16px; 65 | border-bottom-color: #f6f6f6; } 66 | .shepherd-element.shepherd-theme-default.shepherd-element-attached-top.shepherd-element-attached-right.shepherd-target-attached-bottom .shepherd-content { 67 | margin-top: 16px; } 68 | .shepherd-element.shepherd-theme-default.shepherd-element-attached-top.shepherd-element-attached-right.shepherd-target-attached-bottom .shepherd-content:before { 69 | bottom: 100%; 70 | right: 16px; 71 | border-bottom-color: #f6f6f6; } 72 | .shepherd-element.shepherd-theme-default.shepherd-element-attached-bottom.shepherd-element-attached-left.shepherd-target-attached-top .shepherd-content { 73 | margin-bottom: 16px; } 74 | .shepherd-element.shepherd-theme-default.shepherd-element-attached-bottom.shepherd-element-attached-left.shepherd-target-attached-top .shepherd-content:before { 75 | top: 100%; 76 | left: 16px; 77 | border-top-color: #f6f6f6; } 78 | .shepherd-element.shepherd-theme-default.shepherd-element-attached-bottom.shepherd-element-attached-right.shepherd-target-attached-top .shepherd-content { 79 | margin-bottom: 16px; } 80 | .shepherd-element.shepherd-theme-default.shepherd-element-attached-bottom.shepherd-element-attached-right.shepherd-target-attached-top .shepherd-content:before { 81 | top: 100%; 82 | right: 16px; 83 | border-top-color: #f6f6f6; } 84 | .shepherd-element.shepherd-theme-default.shepherd-element-attached-top.shepherd-element-attached-right.shepherd-target-attached-left .shepherd-content { 85 | margin-right: 16px; } 86 | .shepherd-element.shepherd-theme-default.shepherd-element-attached-top.shepherd-element-attached-right.shepherd-target-attached-left .shepherd-content:before { 87 | top: 16px; 88 | left: 100%; 89 | border-left-color: #f6f6f6; } 90 | .shepherd-element.shepherd-theme-default.shepherd-element-attached-top.shepherd-element-attached-left.shepherd-target-attached-right .shepherd-content { 91 | margin-left: 16px; } 92 | .shepherd-element.shepherd-theme-default.shepherd-element-attached-top.shepherd-element-attached-left.shepherd-target-attached-right .shepherd-content:before { 93 | top: 16px; 94 | right: 100%; 95 | border-right-color: #f6f6f6; } 96 | .shepherd-element.shepherd-theme-default.shepherd-element-attached-bottom.shepherd-element-attached-right.shepherd-target-attached-left .shepherd-content { 97 | margin-right: 16px; } 98 | .shepherd-element.shepherd-theme-default.shepherd-element-attached-bottom.shepherd-element-attached-right.shepherd-target-attached-left .shepherd-content:before { 99 | bottom: 16px; 100 | left: 100%; 101 | border-left-color: #f6f6f6; } 102 | .shepherd-element.shepherd-theme-default.shepherd-element-attached-bottom.shepherd-element-attached-left.shepherd-target-attached-right .shepherd-content { 103 | margin-left: 16px; } 104 | .shepherd-element.shepherd-theme-default.shepherd-element-attached-bottom.shepherd-element-attached-left.shepherd-target-attached-right .shepherd-content:before { 105 | bottom: 16px; 106 | right: 100%; 107 | border-right-color: #f6f6f6; } 108 | 109 | .shepherd-element.shepherd-theme-default { 110 | z-index: 9999; 111 | max-width: 24em; 112 | font-size: 1em; } 113 | .shepherd-element.shepherd-theme-default.shepherd-element-attached-top.shepherd-element-attached-center.shepherd-has-title .shepherd-content:before, .shepherd-element.shepherd-theme-default.shepherd-element-attached-top.shepherd-element-attached-right.shepherd-target-attached-bottom.shepherd-has-title .shepherd-content:before, .shepherd-element.shepherd-theme-default.shepherd-element-attached-top.shepherd-element-attached-left.shepherd-target-attached-bottom.shepherd-has-title .shepherd-content:before { 114 | border-bottom-color: #e6e6e6; } 115 | .shepherd-element.shepherd-theme-default.shepherd-has-title .shepherd-content header { 116 | background: #e6e6e6; 117 | padding: 1em; } 118 | .shepherd-element.shepherd-theme-default.shepherd-has-title .shepherd-content header a.shepherd-cancel-link { 119 | padding: 0; 120 | margin-bottom: 0; } 121 | .shepherd-element.shepherd-theme-default.shepherd-has-cancel-link .shepherd-content header h3 { 122 | float: left; } 123 | .shepherd-element.shepherd-theme-default .shepherd-content { 124 | box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.17); 125 | padding: 0; } 126 | .shepherd-element.shepherd-theme-default .shepherd-content * { 127 | font-size: inherit; } 128 | .shepherd-element.shepherd-theme-default .shepherd-content header { 129 | *zoom: 1; 130 | border-radius: 5px 5px 0 0; } 131 | .shepherd-element.shepherd-theme-default .shepherd-content header:after { 132 | content: ""; 133 | display: table; 134 | clear: both; } 135 | .shepherd-element.shepherd-theme-default .shepherd-content header h3 { 136 | margin: 0; 137 | line-height: 1; 138 | font-weight: normal; } 139 | .shepherd-element.shepherd-theme-default .shepherd-content header a.shepherd-cancel-link { 140 | float: right; 141 | text-decoration: none; 142 | font-size: 1.25em; 143 | line-height: .8em; 144 | font-weight: normal; 145 | color: rgba(0, 0, 0, 0.5); 146 | opacity: 0.25; 147 | position: relative; 148 | top: .1em; 149 | padding: .8em; 150 | margin-bottom: -.8em; } 151 | .shepherd-element.shepherd-theme-default .shepherd-content header a.shepherd-cancel-link:hover { 152 | opacity: 1; } 153 | .shepherd-element.shepherd-theme-default .shepherd-content .shepherd-text { 154 | padding: 1em; } 155 | .shepherd-element.shepherd-theme-default .shepherd-content .shepherd-text p { 156 | margin: 0 0 0.5em 0; 157 | line-height: 1.3em; } 158 | .shepherd-element.shepherd-theme-default .shepherd-content .shepherd-text p:last-child { 159 | margin-bottom: 0; } 160 | .shepherd-element.shepherd-theme-default .shepherd-content footer { 161 | padding: 0 1em 1em; } 162 | .shepherd-element.shepherd-theme-default .shepherd-content footer .shepherd-buttons { 163 | text-align: right; 164 | list-style: none; 165 | padding: 0; 166 | margin: 0; } 167 | .shepherd-element.shepherd-theme-default .shepherd-content footer .shepherd-buttons li { 168 | display: inline; 169 | padding: 0; 170 | margin: 0; } 171 | .shepherd-element.shepherd-theme-default .shepherd-content footer .shepherd-buttons li .shepherd-button { 172 | display: inline-block; 173 | vertical-align: middle; 174 | *vertical-align: auto; 175 | *zoom: 1; 176 | *display: inline; 177 | border-radius: 3px; 178 | cursor: pointer; 179 | border: 0; 180 | margin: 0 0.5em 0 0; 181 | font-family: inherit; 182 | text-transform: uppercase; 183 | letter-spacing: .1em; 184 | font-size: .8em; 185 | line-height: 1em; 186 | padding: 0.75em 2em; 187 | background: #3288e6; 188 | color: #fff; } 189 | .shepherd-element.shepherd-theme-default .shepherd-content footer .shepherd-buttons li .shepherd-button.shepherd-button-secondary { 190 | background: #eee; 191 | color: #888; } 192 | .shepherd-element.shepherd-theme-default .shepherd-content footer .shepherd-buttons li:last-child .shepherd-button { 193 | margin-right: 0; } 194 | 195 | .shepherd-start-tour-button.shepherd-theme-default { 196 | display: inline-block; 197 | vertical-align: middle; 198 | *vertical-align: auto; 199 | *zoom: 1; 200 | *display: inline; 201 | border-radius: 3px; 202 | cursor: pointer; 203 | border: 0; 204 | margin: 0 0.5em 0 0; 205 | font-family: inherit; 206 | text-transform: uppercase; 207 | letter-spacing: .1em; 208 | font-size: .8em; 209 | line-height: 1em; 210 | padding: 0.75em 2em; 211 | background: #3288e6; 212 | color: #fff; } 213 | -------------------------------------------------------------------------------- /server/shepherd-theme-square-dark.css: -------------------------------------------------------------------------------- 1 | .shepherd-element, .shepherd-element:after, .shepherd-element:before, .shepherd-element *, .shepherd-element *:after, .shepherd-element *:before { 2 | box-sizing: border-box; } 3 | 4 | .shepherd-element { 5 | position: absolute; 6 | display: none; } 7 | .shepherd-element.shepherd-open { 8 | display: block; } 9 | 10 | .shepherd-element.shepherd-theme-square-dark { 11 | max-width: 100%; 12 | max-height: 100%; } 13 | .shepherd-element.shepherd-theme-square-dark .shepherd-content { 14 | border-radius: 5px; 15 | position: relative; 16 | font-family: inherit; 17 | background: #232323; 18 | color: #eee; 19 | padding: 1em; 20 | font-size: 1.1em; 21 | line-height: 1.5em; } 22 | .shepherd-element.shepherd-theme-square-dark .shepherd-content:before { 23 | content: ""; 24 | display: block; 25 | position: absolute; 26 | width: 0; 27 | height: 0; 28 | border-color: transparent; 29 | border-width: 16px; 30 | border-style: solid; 31 | pointer-events: none; } 32 | .shepherd-element.shepherd-theme-square-dark.shepherd-element-attached-bottom.shepherd-element-attached-center .shepherd-content { 33 | margin-bottom: 16px; } 34 | .shepherd-element.shepherd-theme-square-dark.shepherd-element-attached-bottom.shepherd-element-attached-center .shepherd-content:before { 35 | top: 100%; 36 | left: 50%; 37 | margin-left: -16px; 38 | border-top-color: #232323; } 39 | .shepherd-element.shepherd-theme-square-dark.shepherd-element-attached-top.shepherd-element-attached-center .shepherd-content { 40 | margin-top: 16px; } 41 | .shepherd-element.shepherd-theme-square-dark.shepherd-element-attached-top.shepherd-element-attached-center .shepherd-content:before { 42 | bottom: 100%; 43 | left: 50%; 44 | margin-left: -16px; 45 | border-bottom-color: #232323; } 46 | .shepherd-element.shepherd-theme-square-dark.shepherd-element-attached-right.shepherd-element-attached-middle .shepherd-content { 47 | margin-right: 16px; } 48 | .shepherd-element.shepherd-theme-square-dark.shepherd-element-attached-right.shepherd-element-attached-middle .shepherd-content:before { 49 | left: 100%; 50 | top: 50%; 51 | margin-top: -16px; 52 | border-left-color: #232323; } 53 | .shepherd-element.shepherd-theme-square-dark.shepherd-element-attached-left.shepherd-element-attached-middle .shepherd-content { 54 | margin-left: 16px; } 55 | .shepherd-element.shepherd-theme-square-dark.shepherd-element-attached-left.shepherd-element-attached-middle .shepherd-content:before { 56 | right: 100%; 57 | top: 50%; 58 | margin-top: -16px; 59 | border-right-color: #232323; } 60 | .shepherd-element.shepherd-theme-square-dark.shepherd-element-attached-top.shepherd-element-attached-left.shepherd-target-attached-bottom .shepherd-content { 61 | margin-top: 16px; } 62 | .shepherd-element.shepherd-theme-square-dark.shepherd-element-attached-top.shepherd-element-attached-left.shepherd-target-attached-bottom .shepherd-content:before { 63 | bottom: 100%; 64 | left: 16px; 65 | border-bottom-color: #232323; } 66 | .shepherd-element.shepherd-theme-square-dark.shepherd-element-attached-top.shepherd-element-attached-right.shepherd-target-attached-bottom .shepherd-content { 67 | margin-top: 16px; } 68 | .shepherd-element.shepherd-theme-square-dark.shepherd-element-attached-top.shepherd-element-attached-right.shepherd-target-attached-bottom .shepherd-content:before { 69 | bottom: 100%; 70 | right: 16px; 71 | border-bottom-color: #232323; } 72 | .shepherd-element.shepherd-theme-square-dark.shepherd-element-attached-bottom.shepherd-element-attached-left.shepherd-target-attached-top .shepherd-content { 73 | margin-bottom: 16px; } 74 | .shepherd-element.shepherd-theme-square-dark.shepherd-element-attached-bottom.shepherd-element-attached-left.shepherd-target-attached-top .shepherd-content:before { 75 | top: 100%; 76 | left: 16px; 77 | border-top-color: #232323; } 78 | .shepherd-element.shepherd-theme-square-dark.shepherd-element-attached-bottom.shepherd-element-attached-right.shepherd-target-attached-top .shepherd-content { 79 | margin-bottom: 16px; } 80 | .shepherd-element.shepherd-theme-square-dark.shepherd-element-attached-bottom.shepherd-element-attached-right.shepherd-target-attached-top .shepherd-content:before { 81 | top: 100%; 82 | right: 16px; 83 | border-top-color: #232323; } 84 | .shepherd-element.shepherd-theme-square-dark.shepherd-element-attached-top.shepherd-element-attached-right.shepherd-target-attached-left .shepherd-content { 85 | margin-right: 16px; } 86 | .shepherd-element.shepherd-theme-square-dark.shepherd-element-attached-top.shepherd-element-attached-right.shepherd-target-attached-left .shepherd-content:before { 87 | top: 16px; 88 | left: 100%; 89 | border-left-color: #232323; } 90 | .shepherd-element.shepherd-theme-square-dark.shepherd-element-attached-top.shepherd-element-attached-left.shepherd-target-attached-right .shepherd-content { 91 | margin-left: 16px; } 92 | .shepherd-element.shepherd-theme-square-dark.shepherd-element-attached-top.shepherd-element-attached-left.shepherd-target-attached-right .shepherd-content:before { 93 | top: 16px; 94 | right: 100%; 95 | border-right-color: #232323; } 96 | .shepherd-element.shepherd-theme-square-dark.shepherd-element-attached-bottom.shepherd-element-attached-right.shepherd-target-attached-left .shepherd-content { 97 | margin-right: 16px; } 98 | .shepherd-element.shepherd-theme-square-dark.shepherd-element-attached-bottom.shepherd-element-attached-right.shepherd-target-attached-left .shepherd-content:before { 99 | bottom: 16px; 100 | left: 100%; 101 | border-left-color: #232323; } 102 | .shepherd-element.shepherd-theme-square-dark.shepherd-element-attached-bottom.shepherd-element-attached-left.shepherd-target-attached-right .shepherd-content { 103 | margin-left: 16px; } 104 | .shepherd-element.shepherd-theme-square-dark.shepherd-element-attached-bottom.shepherd-element-attached-left.shepherd-target-attached-right .shepherd-content:before { 105 | bottom: 16px; 106 | right: 100%; 107 | border-right-color: #232323; } 108 | 109 | .shepherd-element.shepherd-theme-square-dark { 110 | border-radius: 0; 111 | z-index: 9999; 112 | max-width: 24em; 113 | font-size: 1em; } 114 | .shepherd-element.shepherd-theme-square-dark.shepherd-element-attached-top.shepherd-element-attached-center.shepherd-has-title .shepherd-content:before, .shepherd-element.shepherd-theme-square-dark.shepherd-element-attached-top.shepherd-element-attached-right.shepherd-target-attached-bottom.shepherd-has-title .shepherd-content:before, .shepherd-element.shepherd-theme-square-dark.shepherd-element-attached-top.shepherd-element-attached-left.shepherd-target-attached-bottom.shepherd-has-title .shepherd-content:before { 115 | border-bottom-color: #303030; } 116 | .shepherd-element.shepherd-theme-square-dark.shepherd-has-title .shepherd-content header { 117 | background: #303030; 118 | padding: 1em; } 119 | .shepherd-element.shepherd-theme-square-dark.shepherd-has-title .shepherd-content header a.shepherd-cancel-link { 120 | padding: 0; 121 | margin-bottom: 0; } 122 | .shepherd-element.shepherd-theme-square-dark.shepherd-has-cancel-link .shepherd-content header h3 { 123 | float: left; } 124 | .shepherd-element.shepherd-theme-square-dark .shepherd-content { 125 | box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.17); 126 | border-radius: 0; 127 | padding: 0; } 128 | .shepherd-element.shepherd-theme-square-dark .shepherd-content * { 129 | font-size: inherit; } 130 | .shepherd-element.shepherd-theme-square-dark .shepherd-content header { 131 | *zoom: 1; 132 | border-radius: 0; } 133 | .shepherd-element.shepherd-theme-square-dark .shepherd-content header:after { 134 | content: ""; 135 | display: table; 136 | clear: both; } 137 | .shepherd-element.shepherd-theme-square-dark .shepherd-content header h3 { 138 | margin: 0; 139 | line-height: 1; 140 | font-weight: normal; } 141 | .shepherd-element.shepherd-theme-square-dark .shepherd-content header a.shepherd-cancel-link { 142 | float: right; 143 | text-decoration: none; 144 | font-size: 1.25em; 145 | line-height: .8em; 146 | font-weight: normal; 147 | color: rgba(0, 0, 0, 0.5); 148 | opacity: 0.25; 149 | position: relative; 150 | top: .1em; 151 | padding: .8em; 152 | margin-bottom: -.8em; } 153 | .shepherd-element.shepherd-theme-square-dark .shepherd-content header a.shepherd-cancel-link:hover { 154 | opacity: 1; } 155 | .shepherd-element.shepherd-theme-square-dark .shepherd-content .shepherd-text { 156 | padding: 1em; } 157 | .shepherd-element.shepherd-theme-square-dark .shepherd-content .shepherd-text p { 158 | margin: 0 0 0.5em 0; 159 | line-height: 1.3em; } 160 | .shepherd-element.shepherd-theme-square-dark .shepherd-content .shepherd-text p:last-child { 161 | margin-bottom: 0; } 162 | .shepherd-element.shepherd-theme-square-dark .shepherd-content footer { 163 | padding: 0 1em 1em; } 164 | .shepherd-element.shepherd-theme-square-dark .shepherd-content footer .shepherd-buttons { 165 | text-align: right; 166 | list-style: none; 167 | padding: 0; 168 | margin: 0; } 169 | .shepherd-element.shepherd-theme-square-dark .shepherd-content footer .shepherd-buttons li { 170 | display: inline; 171 | padding: 0; 172 | margin: 0; } 173 | .shepherd-element.shepherd-theme-square-dark .shepherd-content footer .shepherd-buttons li .shepherd-button { 174 | display: inline-block; 175 | vertical-align: middle; 176 | *vertical-align: auto; 177 | *zoom: 1; 178 | *display: inline; 179 | border-radius: 0; 180 | cursor: pointer; 181 | border: 0; 182 | margin: 0 0.5em 0 0; 183 | font-family: inherit; 184 | text-transform: uppercase; 185 | letter-spacing: .1em; 186 | font-size: .8em; 187 | line-height: 1em; 188 | padding: 0.75em 2em; 189 | background: #3288e6; 190 | color: #fff; } 191 | .shepherd-element.shepherd-theme-square-dark .shepherd-content footer .shepherd-buttons li .shepherd-button.shepherd-button-secondary { 192 | background: #eee; 193 | color: #888; } 194 | .shepherd-element.shepherd-theme-square-dark .shepherd-content footer .shepherd-buttons li:last-child .shepherd-button { 195 | margin-right: 0; } 196 | 197 | .shepherd-start-tour-button.shepherd-theme-square-dark { 198 | display: inline-block; 199 | vertical-align: middle; 200 | *vertical-align: auto; 201 | *zoom: 1; 202 | *display: inline; 203 | border-radius: 0; 204 | cursor: pointer; 205 | border: 0; 206 | margin: 0 0.5em 0 0; 207 | font-family: inherit; 208 | text-transform: uppercase; 209 | letter-spacing: .1em; 210 | font-size: .8em; 211 | line-height: 1em; 212 | padding: 0.75em 2em; 213 | background: #3288e6; 214 | color: #fff; } 215 | -------------------------------------------------------------------------------- /server/tether.min.js: -------------------------------------------------------------------------------- 1 | !function(t,e){"function"==typeof define&&define.amd?define(e):"object"==typeof exports?module.exports=e(require,exports,module):t.Tether=e()}(this,function(t,e,o){"use strict";function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function n(t){var e=getComputedStyle(t),o=e.position;if("fixed"===o)return t;for(var i=t;i=i.parentNode;){var n=void 0;try{n=getComputedStyle(i)}catch(r){}if("undefined"==typeof n||null===n)return i;var s=n.overflow,a=n.overflowX,f=n.overflowY;if(/(auto|scroll)/.test(s+f+a)&&("absolute"!==o||["relative","absolute","fixed"].indexOf(n.position)>=0))return i}return document.body}function r(t){var e=void 0;t===document?(e=document,t=document.documentElement):e=t.ownerDocument;var o=e.documentElement,i={},n=t.getBoundingClientRect();for(var r in n)i[r]=n[r];var s=x(e);return i.top-=s.top,i.left-=s.left,"undefined"==typeof i.width&&(i.width=document.body.scrollWidth-i.left-i.right),"undefined"==typeof i.height&&(i.height=document.body.scrollHeight-i.top-i.bottom),i.top=i.top-o.clientTop,i.left=i.left-o.clientLeft,i.right=e.body.clientWidth-i.width-i.left,i.bottom=e.body.clientHeight-i.height-i.top,i}function s(t){return t.offsetParent||document.documentElement}function a(){var t=document.createElement("div");t.style.width="100%",t.style.height="200px";var e=document.createElement("div");f(e.style,{position:"absolute",top:0,left:0,pointerEvents:"none",visibility:"hidden",width:"200px",height:"150px",overflow:"hidden"}),e.appendChild(t),document.body.appendChild(e);var o=t.offsetWidth;e.style.overflow="scroll";var i=t.offsetWidth;o===i&&(i=e.clientWidth),document.body.removeChild(e);var n=o-i;return{width:n,height:n}}function f(){var t=arguments.length<=0||void 0===arguments[0]?{}:arguments[0],e=[];return Array.prototype.push.apply(e,arguments),e.slice(1).forEach(function(e){if(e)for(var o in e)({}).hasOwnProperty.call(e,o)&&(t[o]=e[o])}),t}function h(t,e){if("undefined"!=typeof t.classList)e.split(" ").forEach(function(e){e.trim()&&t.classList.remove(e)});else{var o=new RegExp("(^| )"+e.split(" ").join("|")+"( |$)","gi"),i=u(t).replace(o," ");p(t,i)}}function l(t,e){if("undefined"!=typeof t.classList)e.split(" ").forEach(function(e){e.trim()&&t.classList.add(e)});else{h(t,e);var o=u(t)+(" "+e);p(t,o)}}function d(t,e){if("undefined"!=typeof t.classList)return t.classList.contains(e);var o=u(t);return new RegExp("(^| )"+e+"( |$)","gi").test(o)}function u(t){return t.className instanceof SVGAnimatedString?t.className.baseVal:t.className}function p(t,e){t.setAttribute("class",e)}function c(t,e,o){o.forEach(function(o){-1===e.indexOf(o)&&d(t,o)&&h(t,o)}),e.forEach(function(e){d(t,e)||l(t,e)})}function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function g(t,e){var o=arguments.length<=2||void 0===arguments[2]?1:arguments[2];return t+o>=e&&e>=t-o}function m(){return"undefined"!=typeof performance&&"undefined"!=typeof performance.now?performance.now():+new Date}function v(){for(var t={top:0,left:0},e=arguments.length,o=Array(e),i=0;e>i;i++)o[i]=arguments[i];return o.forEach(function(e){var o=e.top,i=e.left;"string"==typeof o&&(o=parseFloat(o,10)),"string"==typeof i&&(i=parseFloat(i,10)),t.top+=o,t.left+=i}),t}function y(t,e){return"string"==typeof t.left&&-1!==t.left.indexOf("%")&&(t.left=parseFloat(t.left,10)/100*e.width),"string"==typeof t.top&&-1!==t.top.indexOf("%")&&(t.top=parseFloat(t.top,10)/100*e.height),t}function b(t,e){return"scrollParent"===e?e=t.scrollParent:"window"===e&&(e=[pageXOffset,pageYOffset,innerWidth+pageXOffset,innerHeight+pageYOffset]),e===document&&(e=e.documentElement),"undefined"!=typeof e.nodeType&&!function(){var t=r(e),o=t,i=getComputedStyle(e);e=[o.left,o.top,t.width+o.left,t.height+o.top],U.forEach(function(t,o){t=t[0].toUpperCase()+t.substr(1),"Top"===t||"Left"===t?e[o]+=parseFloat(i["border"+t+"Width"]):e[o]-=parseFloat(i["border"+t+"Width"])})}(),e}var w=function(){function t(t,e){for(var o=0;o1?a-1:0),h=1;a>h;h++)f[h-1]=arguments[h];i.apply(s,f),r?this.bindings[t].splice(e,1):++e}}}]),t}();C.Utils={getScrollParent:n,getBounds:r,getOffsetParent:s,extend:f,addClass:l,removeClass:h,hasClass:d,updateClasses:c,defer:T,flush:S,uniqueId:O,Evented:W,getScrollBarSize:a};var M=function(){function t(t,e){var o=[],i=!0,n=!1,r=void 0;try{for(var s,a=t[Symbol.iterator]();!(i=(s=a.next()).done)&&(o.push(s.value),!e||o.length!==e);i=!0);}catch(f){n=!0,r=f}finally{try{!i&&a["return"]&&a["return"]()}finally{if(n)throw r}}return o}return function(e,o){if(Array.isArray(e))return e;if(Symbol.iterator in Object(e))return t(e,o);throw new TypeError("Invalid attempt to destructure non-iterable instance")}}(),w=function(){function t(t,e){for(var o=0;o16?(e=Math.min(e-16,250),void(o=setTimeout(n,250))):void("undefined"!=typeof t&&m()-t<10||("undefined"!=typeof o&&(clearTimeout(o),o=null),t=m(),_(),e=m()-t))};["resize","scroll","touchmove"].forEach(function(t){window.addEventListener(t,i)})}();var z={center:"center",left:"right",right:"left"},F={middle:"middle",top:"bottom",bottom:"top"},L={top:0,left:0,middle:"50%",center:"50%",bottom:"100%",right:"100%"},Y=function(t,e){var o=t.left,i=t.top;return"auto"===o&&(o=z[e.left]),"auto"===i&&(i=F[e.top]),{left:o,top:i}},H=function(t){var e=t.left,o=t.top;return"undefined"!=typeof L[t.left]&&(e=L[t.left]),"undefined"!=typeof L[t.top]&&(o=L[t.top]),{left:e,top:o}},X=function(t){var e=t.split(" "),o=M(e,2),i=o[0],n=o[1];return{top:i,left:n}},j=X,N=function(){function t(e){var o=this;i(this,t),this.position=this.position.bind(this),B.push(this),this.history=[],this.setOptions(e,!1),C.modules.forEach(function(t){"undefined"!=typeof t.initialize&&t.initialize.call(o)}),this.position()}return w(t,[{key:"getClass",value:function(){var t=arguments.length<=0||void 0===arguments[0]?"":arguments[0],e=this.options.classes;return"undefined"!=typeof e&&e[t]?this.options.classes[t]:this.options.classPrefix?this.options.classPrefix+"-"+t:t}},{key:"setOptions",value:function(t){var e=this,o=arguments.length<=1||void 0===arguments[1]?!0:arguments[1],i={offset:"0 0",targetOffset:"0 0",targetAttachment:"auto auto",classPrefix:"tether"};this.options=f(i,t);var r=this.options,s=r.element,a=r.target,h=r.targetModifier;if(this.element=s,this.target=a,this.targetModifier=h,"viewport"===this.target?(this.target=document.body,this.targetModifier="visible"):"scroll-handle"===this.target&&(this.target=document.body,this.targetModifier="scroll-handle"),["element","target"].forEach(function(t){if("undefined"==typeof e[t])throw new Error("Tether Error: Both element and target must be defined");"undefined"!=typeof e[t].jquery?e[t]=e[t][0]:"string"==typeof e[t]&&(e[t]=document.querySelector(e[t]))}),l(this.element,this.getClass("element")),this.options.addTargetClasses!==!1&&l(this.target,this.getClass("target")),!this.options.attachment)throw new Error("Tether Error: You must provide an attachment");this.targetAttachment=j(this.options.targetAttachment),this.attachment=j(this.options.attachment),this.offset=X(this.options.offset),this.targetOffset=X(this.options.targetOffset),"undefined"!=typeof this.scrollParent&&this.disable(),this.scrollParent="scroll-handle"===this.targetModifier?this.target:n(this.target),this.options.enabled!==!1&&this.enable(o)}},{key:"getTargetBounds",value:function(){if("undefined"==typeof this.targetModifier)return r(this.target);if("visible"===this.targetModifier){if(this.target===document.body)return{top:pageYOffset,left:pageXOffset,height:innerHeight,width:innerWidth};var t=r(this.target),e={height:t.height,width:t.width,top:t.top,left:t.left};return e.height=Math.min(e.height,t.height-(pageYOffset-t.top)),e.height=Math.min(e.height,t.height-(t.top+t.height-(pageYOffset+innerHeight))),e.height=Math.min(innerHeight,e.height),e.height-=2,e.width=Math.min(e.width,t.width-(pageXOffset-t.left)),e.width=Math.min(e.width,t.width-(t.left+t.width-(pageXOffset+innerWidth))),e.width=Math.min(innerWidth,e.width),e.width-=2,e.topo.clientWidth||[i.overflow,i.overflowX].indexOf("scroll")>=0||this.target!==document.body,s=0;n&&(s=15);var a=t.height-parseFloat(i.borderTopWidth)-parseFloat(i.borderBottomWidth)-s,e={width:15,height:.975*a*(a/o.scrollHeight),left:t.left+t.width-parseFloat(i.borderLeftWidth)-15},f=0;408>a&&this.target===document.body&&(f=-11e-5*Math.pow(a,2)-.00727*a+22.58),this.target!==document.body&&(e.height=Math.max(e.height,24));var h=this.target.scrollTop/(o.scrollHeight-a);return e.top=h*(a-e.height-f)+t.top+parseFloat(i.borderTopWidth),this.target===document.body&&(e.height=Math.max(e.height,24)),e}}},{key:"clearCache",value:function(){this._cache={}}},{key:"cache",value:function(t,e){return"undefined"==typeof this._cache&&(this._cache={}),"undefined"==typeof this._cache[t]&&(this._cache[t]=e.call(this)),this._cache[t]}},{key:"enable",value:function(){var t=arguments.length<=0||void 0===arguments[0]?!0:arguments[0];this.options.addTargetClasses!==!1&&l(this.target,this.getClass("enabled")),l(this.element,this.getClass("enabled")),this.enabled=!0,this.scrollParent!==document&&this.scrollParent.addEventListener("scroll",this.position),t&&this.position()}},{key:"disable",value:function(){h(this.target,this.getClass("enabled")),h(this.element,this.getClass("enabled")),this.enabled=!1,"undefined"!=typeof this.scrollParent&&this.scrollParent.removeEventListener("scroll",this.position)}},{key:"destroy",value:function(){var t=this;this.disable(),B.forEach(function(e,o){return e===t?void B.splice(o,1):void 0})}},{key:"updateAttachClasses",value:function(t,e){var o=this;t=t||this.attachment,e=e||this.targetAttachment;var i=["left","top","bottom","right","middle","center"];"undefined"!=typeof this._addAttachClasses&&this._addAttachClasses.length&&this._addAttachClasses.splice(0,this._addAttachClasses.length),"undefined"==typeof this._addAttachClasses&&(this._addAttachClasses=[]);var n=this._addAttachClasses;t.top&&n.push(this.getClass("element-attached")+"-"+t.top),t.left&&n.push(this.getClass("element-attached")+"-"+t.left),e.top&&n.push(this.getClass("target-attached")+"-"+e.top),e.left&&n.push(this.getClass("target-attached")+"-"+e.left);var r=[];i.forEach(function(t){r.push(o.getClass("element-attached")+"-"+t),r.push(o.getClass("target-attached")+"-"+t)}),T(function(){"undefined"!=typeof o._addAttachClasses&&(c(o.element,o._addAttachClasses,r),o.options.addTargetClasses!==!1&&c(o.target,o._addAttachClasses,r),delete o._addAttachClasses)})}},{key:"position",value:function(){var t=this,e=arguments.length<=0||void 0===arguments[0]?!0:arguments[0];if(this.enabled){this.clearCache();var o=Y(this.targetAttachment,this.attachment);this.updateAttachClasses(this.attachment,o);var i=this.cache("element-bounds",function(){return r(t.element)}),n=i.width,f=i.height;if(0===n&&0===f&&"undefined"!=typeof this.lastSize){var h=this.lastSize;n=h.width,f=h.height}else this.lastSize={width:n,height:f};var l=this.cache("target-bounds",function(){return t.getTargetBounds()}),d=l,u=y(H(this.attachment),{width:n,height:f}),p=y(H(o),d),c=y(this.offset,{width:n,height:f}),g=y(this.targetOffset,d);u=v(u,c),p=v(p,g);for(var m=l.left+p.left-u.left,b=l.top+p.top-u.top,w=0;wwindow.innerWidth&&(A=this.cache("scrollbar-size",a),x.viewport.bottom-=A.height),document.body.scrollHeight>window.innerHeight&&(A=this.cache("scrollbar-size",a),x.viewport.right-=A.width),(-1===["","static"].indexOf(document.body.style.position)||-1===["","static"].indexOf(document.body.parentElement.style.position))&&(x.page.bottom=document.body.scrollHeight-b-f,x.page.right=document.body.scrollWidth-m-n),"undefined"!=typeof this.options.optimizations&&this.options.optimizations.moveElement!==!1&&"undefined"==typeof this.targetModifier&&!function(){var e=t.cache("target-offsetparent",function(){return s(t.target)}),o=t.cache("target-offsetparent-bounds",function(){return r(e)}),i=getComputedStyle(e),n=o,a={};if(["Top","Left","Bottom","Right"].forEach(function(t){a[t.toLowerCase()]=parseFloat(i["border"+t+"Width"])}),o.right=document.body.scrollWidth-o.left-n.width+a.right,o.bottom=document.body.scrollHeight-o.top-n.height+a.bottom,x.page.top>=o.top+a.top&&x.page.bottom>=o.bottom&&x.page.left>=o.left+a.left&&x.page.right>=o.right){var f=e.scrollTop,h=e.scrollLeft;x.offset={top:x.page.top-o.top+f-a.top,left:x.page.left-o.left+h-a.left}}}(),this.move(x),this.history.unshift(x),this.history.length>3&&this.history.pop(),e&&S(),!0}}},{key:"move",value:function(t){var e=this;if("undefined"!=typeof this.element.parentNode){var o={};for(var i in t){o[i]={};for(var n in t[i]){for(var r=!1,a=0;a=0&&(b=parseFloat(b),y=parseFloat(y)),b!==y&&(v=!0,m[n]=y)}v&&T(function(){f(e.element.style,m)})}}}]),t}();N.modules=[],C.position=_;var R=f(N,C),M=function(){function t(t,e){var o=[],i=!0,n=!1,r=void 0;try{for(var s,a=t[Symbol.iterator]();!(i=(s=a.next()).done)&&(o.push(s.value),!e||o.length!==e);i=!0);}catch(f){n=!0,r=f}finally{try{!i&&a["return"]&&a["return"]()}finally{if(n)throw r}}return o}return function(e,o){if(Array.isArray(e))return e;if(Symbol.iterator in Object(e))return t(e,o);throw new TypeError("Invalid attempt to destructure non-iterable instance")}}(),P=C.Utils,r=P.getBounds,f=P.extend,c=P.updateClasses,T=P.defer,U=["left","top","right","bottom"];C.modules.push({position:function(t){var e=this,o=t.top,i=t.left,n=t.targetAttachment;if(!this.options.constraints)return!0;var s=this.cache("element-bounds",function(){return r(e.element)}),a=s.height,h=s.width;if(0===h&&0===a&&"undefined"!=typeof this.lastSize){var l=this.lastSize;h=l.width,a=l.height}var d=this.cache("target-bounds",function(){return e.getTargetBounds()}),u=d.height,p=d.width,g=[this.getClass("pinned"),this.getClass("out-of-bounds")];this.options.constraints.forEach(function(t){var e=t.outOfBoundsClass,o=t.pinnedClass;e&&g.push(e),o&&g.push(o)}),g.forEach(function(t){["left","top","right","bottom"].forEach(function(e){g.push(t+"-"+e)})});var m=[],v=f({},n),y=f({},this.attachment);return this.options.constraints.forEach(function(t){var r=t.to,s=t.attachment,f=t.pin;"undefined"==typeof s&&(s="");var l=void 0,d=void 0;if(s.indexOf(" ")>=0){var c=s.split(" "),g=M(c,2);d=g[0],l=g[1]}else l=d=s;var w=b(e,r);("target"===d||"both"===d)&&(ow[3]&&"bottom"===v.top&&(o-=u,v.top="top")),"together"===d&&(ow[3]&&"bottom"===v.top&&("top"===y.top?(o-=u,v.top="top",o-=a,y.top="bottom"):"bottom"===y.top&&(o-=u,v.top="top",o+=a,y.top="top")),"middle"===v.top&&(o+a>w[3]&&"top"===y.top?(o-=a,y.top="bottom"):ow[2]&&"right"===v.left&&(i-=p,v.left="left")),"together"===l&&(iw[2]&&"right"===v.left?"left"===y.left?(i-=p,v.left="left",i-=h,y.left="right"):"right"===y.left&&(i-=p,v.left="left",i+=h,y.left="left"):"center"===v.left&&(i+h>w[2]&&"left"===y.left?(i-=h,y.left="right"):iw[3]&&"top"===y.top&&(o-=a,y.top="bottom")),("element"===l||"both"===l)&&(iw[2]&&"left"===y.left&&(i-=h,y.left="right")),"string"==typeof f?f=f.split(",").map(function(t){return t.trim()}):f===!0&&(f=["top","left","right","bottom"]),f=f||[];var C=[],O=[];o=0?(o=w[1],C.push("top")):O.push("top")),o+a>w[3]&&(f.indexOf("bottom")>=0?(o=w[3]-a,C.push("bottom")):O.push("bottom")),i=0?(i=w[0],C.push("left")):O.push("left")),i+h>w[2]&&(f.indexOf("right")>=0?(i=w[2]-h,C.push("right")):O.push("right")),C.length&&!function(){var t=void 0;t="undefined"!=typeof e.options.pinnedClass?e.options.pinnedClass:e.getClass("pinned"),m.push(t),C.forEach(function(e){m.push(t+"-"+e)})}(),O.length&&!function(){var t=void 0;t="undefined"!=typeof e.options.outOfBoundsClass?e.options.outOfBoundsClass:e.getClass("out-of-bounds"),m.push(t),O.forEach(function(e){m.push(t+"-"+e)})}(),(C.indexOf("left")>=0||C.indexOf("right")>=0)&&(y.left=v.left=!1),(C.indexOf("top")>=0||C.indexOf("bottom")>=0)&&(y.top=v.top=!1),(v.top!==n.top||v.left!==n.left||y.top!==e.attachment.top||y.left!==e.attachment.left)&&e.updateAttachClasses(y,v)}),T(function(){e.options.addTargetClasses!==!1&&c(e.target,m,g),c(e.element,m,g)}),{top:o,left:i}}});var P=C.Utils,r=P.getBounds,c=P.updateClasses,T=P.defer;C.modules.push({position:function(t){var e=this,o=t.top,i=t.left,n=this.cache("element-bounds",function(){return r(e.element)}),s=n.height,a=n.width,f=this.getTargetBounds(),h=o+s,l=i+a,d=[];o<=f.bottom&&h>=f.top&&["left","right"].forEach(function(t){var e=f[t];(e===i||e===l)&&d.push(t)}),i<=f.right&&l>=f.left&&["top","bottom"].forEach(function(t){var e=f[t];(e===o||e===h)&&d.push(t)});var u=[],p=[],g=["left","top","right","bottom"];return u.push(this.getClass("abutted")),g.forEach(function(t){u.push(e.getClass("abutted")+"-"+t)}),d.length&&p.push(this.getClass("abutted")),d.forEach(function(t){p.push(e.getClass("abutted")+"-"+t)}),T(function(){e.options.addTargetClasses!==!1&&c(e.target,p,u),c(e.element,p,u)}),!0}});var M=function(){function t(t,e){var o=[],i=!0,n=!1,r=void 0;try{for(var s,a=t[Symbol.iterator]();!(i=(s=a.next()).done)&&(o.push(s.value),!e||o.length!==e);i=!0);}catch(f){n=!0,r=f}finally{try{!i&&a["return"]&&a["return"]()}finally{if(n)throw r}}return o}return function(e,o){if(Array.isArray(e))return e;if(Symbol.iterator in Object(e))return t(e,o);throw new TypeError("Invalid attempt to destructure non-iterable instance")}}();return C.modules.push({position:function(t){var e=t.top,o=t.left;if(this.options.shift){var i=this.options.shift;"function"==typeof this.options.shift&&(i=this.options.shift.call(this,{top:e,left:o}));var n=void 0,r=void 0;if("string"==typeof i){i=i.split(" "),i[1]=i[1]||i[0];var s=M(i,2);n=s[0],r=s[1],n=parseFloat(n,10),r=parseFloat(r,10)}else n=i.top,r=i.left;return e+=n,o+=r,{top:e,left:o}}}}),R}); --------------------------------------------------------------------------------