Verified Commit e34954cf authored by Štěpán Henek's avatar Štěpán Henek 🌩

sample_plugin: more comments

parent bbba97ba
......@@ -11,4 +11,8 @@ Requirements
Installation
============
``python setup.py install``
``python setup.py install``
or
``pip install .``
......@@ -11,7 +11,11 @@ from foris.plugins import ForisPlugin
from foris.utils.translators import gettext_dummy as gettext, ugettext as _
# This represents a main form handler
class SamplePluginConfigHandler(BaseConfigHandler):
# gettext() triggers lazy_translated text
# it is also used for detecting translations during foris_make_messages cmd
userfriendly_title = gettext("Sample")
###
slices = 10
......@@ -24,7 +28,7 @@ class SamplePluginConfigHandler(BaseConfigHandler):
###
if self.data:
# Update from post
# Update from post (used when the form is updated via ajax)
data.update(self.data)
form = fapi.ForisForm("sample", data)
......@@ -32,6 +36,8 @@ class SamplePluginConfigHandler(BaseConfigHandler):
name="main_section",
title=self.userfriendly_title,
)
# _() translates the string immediatelly
# it is also used for detecting translations during foris_make_messages cmd
section.add_field(
Number, name="slices", label=_("Number of slices"), required=True,
validators=validators.InRange(2, 15)
......@@ -53,9 +59,10 @@ class SamplePluginConfigHandler(BaseConfigHandler):
return form
# This represents a plugin page
class SamplePluginPage(ConfigPageMixin, SamplePluginConfigHandler):
menu_order = 90 # Where it should be placed in the main menu
template = "sample/sample"
menu_order = 90 # Where it should be placed in the main menu (higher the number the lower)
template = "sample/sample" # template which will be used (.html.js will be auto added)
template_type = "jinja2"
def get_backend_data(self):
......@@ -70,6 +77,7 @@ class SamplePluginPage(ConfigPageMixin, SamplePluginConfigHandler):
return res["records"]
def save(self, *args, **kwargs):
# Handle form result here
return super(SamplePluginPage, self).save(*args, **kwargs)
def _prepare_render_args(self, args):
......@@ -84,6 +92,7 @@ class SamplePluginPage(ConfigPageMixin, SamplePluginConfigHandler):
return super(SamplePluginPage, self).render(**kwargs)
def _action_get_records(self):
# obtain and render the data and render a partial template (for ajax)
records = self.get_backend_data()
return bottle.template(
......@@ -99,19 +108,20 @@ class SamplePluginPage(ConfigPageMixin, SamplePluginConfigHandler):
raise ValueError("Unknown AJAX action.")
# plugin definition
class SamplePlugin(ForisPlugin):
PLUGIN_NAME = "sample"
PLUGIN_NAME = "sample" # also shown in the url
DIRNAME = os.path.dirname(os.path.abspath(__file__))
PLUGIN_STYLES = [
"css/sample.css",
"css/sample.css", # path to css script generated using sass/sample.sass
]
PLUGIN_STATIC_SCRIPTS = [
"js/contrib/Chart.bundle.min.js",
"js/sample.js",
"js/contrib/Chart.bundle.min.js", # 3rd party static js
"js/sample.js", # static js file
]
PLUGIN_DYNAMIC_SCRIPTS = [
"sample.js",
"sample.js", # dynamic js file (a template which will be rendered to javascript)
]
def __init__(self, app):
......
// Render a chart based on table data
var make_chart = function() {
var graph_config = {
data: {
datasets: [
{
lineTension: 0,
label: Foris.sampleMessages.chartLabel,
label: Foris.sampleMessages.chartLabel, // transaltions are defined within dynamic js
data: graph_data,
},
],
......@@ -14,7 +15,7 @@ var make_chart = function() {
responsive: true,
title: {
display: true,
text: Foris.sampleMessages.chartTitle
text: Foris.sampleMessages.chartTitle // transaltions are defined within dynamic js
},
tooltips: {
mode: 'index',
......@@ -29,7 +30,7 @@ var make_chart = function() {
display: false,
scaleLabel: {
display: true,
labelString: Foris.sampleMessages.chartTimeAxis
labelString: Foris.sampleMessages.chartTimeAxis // transaltions are defined within dynamic js
}
}],
yAxes: [{
......@@ -40,7 +41,7 @@ var make_chart = function() {
},
scaleLabel: {
display: true,
labelString: Foris.sampleMessages.chartValueAxis
labelString: Foris.sampleMessages.chartValueAxis // transaltions are defined within dynamic js
}
}],
},
......@@ -56,7 +57,10 @@ var make_chart = function() {
Foris.lineChartOptions = graph_config.options;
}
// Global chart data
var graph_data;
// Functions which updates the chart
Foris.update_sample_chart = function() {
// Clear current chart
$("#canvas-container").empty();
......@@ -79,6 +83,7 @@ Foris.update_sample_chart = function() {
make_chart();
}
// Update chart after page is rendred
$(document).ready(function() {
Foris.update_sample_chart();
});
/* a simple sass example */
#records
td, th
padding: 0.3em 0.8em
......
// Translation has to be handeled dynamically in jinja2 template here
Foris.sampleMessages = {
chartLabel: "{% trans %}Chart Data{% endtrans %}",
chartTitle: "{% trans %}Example chart{% endtrans %}",
......@@ -5,9 +6,7 @@ Foris.sampleMessages = {
chartValueAxis: "{% trans %}Value axis{% endtrans %}"
}
// Register on websockets events
// now after you insert `foris-notify-wrapper -n -m sample -a reload_chart '{}'` to
// routers console your chart will be reloaded
// Register on websockets events (just reload chart is used
Foris.WS["sample"] = function(msg) {
switch(msg.action) {
case "reload_chart":
......
{% extends 'config/base.html.j2' %}
{# this block will be inserted into the main layout #}
{% block config_base %}
{# The the main form can be rendered using ajax. And it might be necessary to skip some parts for that #}
{% if is_xhr is not defined %}
<div id="page-sample-plugin" class="config-page">
{% endif %}
{# Just for fun render some images #}
{% for _ in range(20) %}
<img src="{{ static('plugins/sample/img/logo-dark.svg') }}"/>
{% endfor %}
{# Render messages that config store operation passed/failed #}
{% include '_messages.html.j2' %}
<p>{% trans %}Some generic description what this plugin does.{% endtrans %}</p>
<form action="{{ request.fullpath }}" method="post" class="config-form">
<input type="hidden" name="csrf_token" value="{{ get_csrf_token() }}">
{# For the most cases this is how the forms are rendered #}
{% for field in form.active_fields %}
{% include '_field.html.j2' %}
{% endfor %}
......@@ -17,10 +25,17 @@
</form>
<h3>{% trans %}Records{% endtrans %}</h3>
<div id="records">
{# Example to render some data #}
{% include 'sample/_records.html.j2' %}
</div>
<h3>{% trans %}Chart{% endtrans %}</h3>
<p>{% trans %}To redraw the chart using websockets just run the following command:{% endtrans %}</p>
<pre>foris-notify-wrapper -n -m sample -a reload_chart '{}'</pre>
<br />
{# Example chart in Chart.js #}
<div id="canvas-container"><canvas id="canvas"></canvas></div>
{% if is_xhr is not defined %}
</div>
{% endif %}
{% endblock %}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment