Styleguide-Revamp.html

Django Template
===============

{# our styleguide would provide an API to load templates #}
{% load styleguide %}

{# we loop over our regular object, and assign the appropriate variables #}
{% for card in cards %}
	styleguide.load('components/cards', {
		'type': 'simple',
		'title': instance.title,
		'content': instance.content
	});
{% endfor %}

Styleguide Template
===================

{# this would be the template, all api's would use #}
<div class="card{% if type != 'simple' %} card-advanced{% endif %}">
	<h1>{{ title }}</h1>
	{{ content|truncatewords:"25" }}
</div>


Styleguide Rendering
====================

{# in order to test and maintain, we need a styleguide where we can develop those plugins/addons and test them first.
	we have there 3 options:
	
	- the automatic generated content (from components, icons...)
	- the manual generated content (adding custom infos and code)
	- specific templates
	
	The first two can be combined by adding the option to autocreate but interfere with certain elements (instructions and comments for example)
	The last could be auto generated (folder with templates) and than just added to the styleguide (generate the template list manually according to the folder structure)

    // api
	styleguide.component('name', options); // fully reusable components
	styleguide.snippet('name', options); // more intended for example showcase
	styleguide.load('your/own/path', options) // if you want to access another file from the styleguide
	
	folder structure would be something like
	
	aldryn_styleguide
	  |- templates // for rendering styleguide templates
	  |- components // for rendering styleguide.component
	  |- snippets // for rendering styleguide.snippet
	  |- app // for rendering the app itself (http://localhost/styleguide)
	  
	The styleguide app needs to provide some menu and pages much as the cms provides but by editing templates directly.
	Ideally we provide already some predefined settings for typography and so on.
	
	We also need to find a way to automatically render all used icons (maybe scan the font, scan the icon file or so...)
	
	Additionally we need an api to call for all templates defined. For example: http://localhost/styleguide/api/templates which returns:
	[
		{ 'template': 'Home', 'path': '/styleguide/templates/home' },
		{ 'template': 'Content', 'path': '/styleguide/templates/content' }
	]
	and so on, so we can pass these tempaltes automatically to our testrunners. 
	The templates can be defined within the backend (not in the template as currently) so we can read this list easily,
	or if there is another way read them from a template.
	
	All this data needs to be database independent (except for the apphook) so the styleguide runs on every local machine.

	Also, we need to provide a static way of calling ajax request so we canload dummy content like styleguide.ajax?
#}


{# Now we just need someone to develop it. #}











{% with title="This is an example" %}
{% for item in items %}
    {% styleguide %}
        styleguide.component('cards', {
            'type': {{ instance.type }},
            'title': {{ title }},
            'content': {{ instance.html }}
        });
    {% endstyleguide %}
{% endfor %}
{% endwith %}






{% with type=instance.type content=instance.conten %}
    {% include "component/..." %}
{% endwith %}

{# template #}

<div class="card{% if object.type != 'simple' %} card-advanced{% endif %}">
	<h1>{{ object.title }}</h1>
	{{ object.content|truncatewords:"25" }}
</div>