Metadata-Version: 1.1
Name: btc-floating-windows
Version: 1.0
Summary: Floating windows for use as pop-ups, modal or separate sources of information in a user graphical interface.
Home-page: https://github.com/MEADez/btc-floating-windows
Author: MEADez
Author-email: m3adez@gmail.com
License: BSD License
Description: ===================================================
        BTC Floating Windows
        ===================================================
        
        Floating windows for use as pop-ups, modal or separate sources of information
        in a user graphical interface.
        
        Detailed documentation is in the "docs" directory.
        
        Quick start
        -----------
        
        1. Add "floating_windows" to your INSTALLED_APPS setting like this::
        
              INSTALLED_APPS = (
                  ...
                  'floating_windows',
              )
        
        2. Add static files css/js::
        
            <link type="text/css" rel="stylesheet" href="{% static 'floating_windows/css/windows.css' %}">
            <script src="{% static 'floating_windows/js/windows.js' %}"></script>
        
        3. Create and add window(s) template(s) to the base template::
        
            <!-- Separate template "sign_in_modal.html" -->
            {% extends 'floating_windows/windows/default.html' %}
        
            {% block body_content %}
                <!-- window body -->
            {% endblock %}
        
            <!-- In base template -->
            {% include 'blocks/floating_windows/sign_in_modal.html' with fw_id='auth' %}
        
        4. You can load windows content dynamically through ajax, in this case, you need to add basic window
           template that will be used by the script to copy and create new windows::
        
            <!-- In base template -->
            {% include 'floating_windows/windows/default.html' %}
        
        5. Initialize windows script. For several windows with background on same page, which can display in same time,
           you must specify `floatingWindowZIndex` attribute for background and window correct display::
        
            const fw = new FloatingWindows();
            fw.config = {
                'fw-1': {
                    'floatingWindowTitle': 'Title-1',
                    'floatingWindowPosition': '125px,unset,unset,230px',
                    'floatingWindowHideOnOutsideClick': true,             popup
                    'floatingWindowShowFooter': false,
                    'floatingWindowSetBackground': 'body',                background parent container (bcg of popups is ignoring)
                    'floatingWindowZIndex': '200',                        set this attr to set windows hierarchy
                    'floatingWindowSetToUrl': true,                       automatic window opening on page reload by
                                                                          get-parameter in address-bar
                    'floatingWindowPushToHistory': true                   add window open/close events to browser history
                },
                ...
            }
            // etc. see code for thin setup
            fw.initWindows();
        
            $(document).on('floating-window:opened', function (event, window, trigger) {
                // tracking of signals about the opening of windows for loading content in them.
                // configure content load here
            });
        
        6. Setup trigger in template::
        
            <button type="button" data-floating-window-open="fw-1">
                Trigger
            </button>
        
        Example:
        
        .. image:: https://user-images.githubusercontent.com/33987296/74094685-3af89000-4af6-11ea-995b-35b3b1820f4a.png
        
Platform: UNKNOWN
Classifier: Environment :: Web Environment
Classifier: Framework :: Django
Classifier: Intended Audience :: Developers
Classifier: License :: OSI Approved :: BSD License
Classifier: Operating System :: OS Independent
Classifier: Programming Language :: Python :: 3.6
Classifier: Topic :: Internet :: WWW/HTTP
Classifier: Topic :: Internet :: WWW/HTTP :: Dynamic Content
