[Experimental idea] Create a <jinja-template> component

SimonBiggs commented 6 years ago

Alright, so, to help begin addressing the following issues:

I will be attempting to create a <jinja> component. The idea/hope is that it will be able to work as so:

<section-start>

```python
tables = {
    'first_table': pd.DataFrame(data=[1, 2, 3]),
    'second_table': pd.DataFrame(data=[4, 5, 6])
}

a_python_dictionary = {
    a_title: 'foo',
    image_srcs: ['a', 'few', 'sources'],
    another_title: 'boo',
    tables: tables,
    some_text: None
}
```

</section-start>

<variable-string>a_python_dictionary['some_text']</variable_string>

<jinja-template context="a_python_dictionary">

## {{ a_title }}

{% if some_text is not None %}
This text only displays if the variable string has been written in
<variable-tick>cant_see_me_until_string_is_written_in</variable-tick>
{% endif %}

{% for item in image_srcs %}
<img src="{{ item }}">
{% endfor %}

## {{ another_title  }}

{% for a_table_key in list(tables.keys()) %}
<variable-table>tables['{{ a_table_key }}']</variable-table>
{% endfor %}

</jinja-template>

SimonBiggs commented 6 years ago

A key issue with the implementation of this will be the fact that the html being rendered will be flexible. Previously if the html/markdown ever changed it was only because the file itself changed. This was coped with by refreshing the whole form.

A form refresh everytime the jinja template updates won't work. Therefore I need to decouple form component initialisation from the page loading sequence. This will be quite a refactor. This refactor will however help for a range of outstanding issues.

SimonBiggs commented 6 years ago

@OxygenLithium @robmarkcole any thoughts on this idea?

robmarkcole commented 6 years ago

What is the use case?

SimonBiggs commented 6 years ago

It is for advanced use cases. Not expected to be used in basic scenarios.

Use case

It makes what is displayed on the screen be significantly more flexible. For example, certain parts of the form can be conditionally displayed. Other parts of the form can be repeated as needed.

Forms could start quite sparse and then have the content of the form that is displayed on the screen grow conditionally depending on user input.

With more work along a similar vein

If this is a good idea, and if after implementing it it seems to work well, then I shall expand to refactoring the form structure to also be a jinja template. The default one will be used as standard and the majority of users need not know it is there, however the template used by scriptedforms will be able to be swapped out. I can then use these templating options to customise scriptedforms into a documentation layout. Therefore making the documentation itself simply be a customised scriptedform.

So instead of locking the layout away and making it rigid, I will be exposing the form layout and styling as a overridable jinja template.

robmarkcole commented 6 years ago

Understood, I can certainly see the benefits of this approach, so long as the basic usage maintains the currently simplicity

SimonBiggs commented 6 years ago

Yup. Keep the basics simple. A major draw of ScriptedForms is its initial simplicity.

I just want to push it further however and take the lid off the top for those who want to make it do more. ...and if I can make the documentation itself be a ScriptedForm, that would be ideal.

olivercrask commented 6 years ago

I really like this idea. How would someone use jinja to change the colour of a button for instance? Would it be that the user can define the colour in Python and then that variable is input into the HTML?

SimonBiggs commented 6 years ago

I've actually been thinking further about this. And I think what you've been keen on is actually something a bit different.

I think what you really want is top level access to the css. And I think I've worked out how to do it.

I should be able to also make that cover button color etc. I'll keep you posted.

SimonBiggs commented 6 years ago

Won't implement Jinja2 something like this feature will still be implemented however. Just not like this.

SimonBiggs / scriptedforms

[Experimental idea] Create a <jinja-template> component #246

Use case

With more work along a similar vein