Slide Sheet

Last Updated: March 2022

Python API

class tethys_sdk.gizmos.SlideSheet(id='slide-sheet', content_template='', title='', attributes=<class 'dict'>, classes='', **kwargs)

Adds a slide sheet that slides up from the bottom of the page. Add content to the slidesheet by creating an HTML template with the desired content and then providing the path to the template to the template using the template argument.

Parameters:

• id (str) -- ID of the slide sheet.

• content_template (str) -- Path to template containing content for the slide sheet.

• title (str) -- Title of the slide sheet.

Controller Example

from tethys_sdk.gizmos import SlideSheet

slide_sheet = SlideSheet(
    id='slide-sheet',
    title='Slide Sheet',
    content_template='my_first_app/slide_sheet_content.html'
)

context = {
    'slide_sheet': slide_sheet,
}

Template Example

{% load tethys_gizmos %}

{% block app_content %}
    <button class="btn btn-success" onclick="SLIDE_SHEET.open('{{ slide_sheet.id }}');">Show Slide Sheet</button>
    {% gizmo slide_sheet %}
{% endblock %}

JavaScript API

The slide sheet can be opened and closed dynamically using the JavaScript API.

SLIDE_SHEET.open(id)

Open the slide sheet gizmo with the given ID.

$(function() { //wait for page to load
    SLIDE_SHEET.open('slide-sheet');
});

SLIDE_SHEET.close(id)

Close the slide sheet gizmo with the given ID.

$(function() { //wait for page to load
    SLIDE_SHEET.close('slide-sheet');
});