Both "Add client" and "Client details" views use client_details.html
template. With this commit, "Add client" extends scopes.html and "Client
details" extend commands.hmlt.
Otherwise, scopes with dots in their names breaks the javascript code.
From
https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/id:
---
Note: Technically, in HTML5, the value for an id attribute may contain
any character, except whitespace characters. However, to avoid
inadvertent errors, only ASCII letters, digits, '_', and '-' should be
used and the value for an id attribute should start with a letter. For
example, . has a special meaning in CSS (it acts as a class selector).
Unless you are careful to escape it in the CSS, it won't be recognized
as part of the value of an id attribute. It is easy to forget to do
this, resulting in bugs in your code that could be hard to detect.
---
Extend commands.html template to keep scope tree, and action buttons
state.
When in the software inventory view, there exists two options: 'update'
or 'view'. Do not print raw json response from ogserver about the software
inventory/profile.
When vieweing the software list, print a html table using the new
template: software_list.html.
Do not print blank pages with plain text html error codes when something
goes wrong. Instead, print an error message after redirecting to the
commands view.
On scopes and commands views, draw clients as users selects them in the
scopes tree.
Trigger client drawing on two events:
1."change" event, occurs when the user clicks a client checkbox. This
event is standard [1].
2. "show-client" event, fires when ogcp get selected clients from
localStorage and when an user checks a parent checkbox. This event is
custom.
Dot characters (".") in clients names are replaced by underscore("_")
when used as id to avoid errors.
1. https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event
If something goes wrong, the application shows an error message after
redirecting to the commands view.
Do not show blank pages with plain text error codes.
Extending from command.html is required for action views to mantain
the scope context on the left side column.
Enables setting dropdown button and action button as active when loading
the hardware inventory view.
Group related actions in the "commands" section inside a
dropdown button.
Declutters the panel in which the buttons are displayed.
Dropdown button jinja block name is used as prefix for the block names
of inside buttons. For example, for the image dropwdown button:
<button class="...{% block nav_image %}{% endblock %}...">
{{ _('Image') }}
</button>
Actions such as restore and create will show a jinja block inside class
attr like:
<input class="... dropdown-item{% block nav_image_restore %}{% endblock %}" ...
<input class="... dropdown-item{% block nav_image_create %}{% endblock %}" ...
Adds empty jinja blocks for the class attribute of all action buttons.
Child templates from command (actions) can set their nav button as
active overriding the corresponding {% block %}.
Currently, not all action templates extends the commands.html template.
This is not a problem, as the blocks are just empty.
This is a preparation for changes on each action template to extend
commands.html template.
{% block %} defined in nav template cannot be overriden by child
templates from base. This is a limitation in jinja.
Merge nav into base template so jinja blocks so no {% include %} is used
and these blocks can be overriden by child templates (commands, images,
dashboard...)
Avoid using request.endpoint to determine active nav item, decoupling
endpoint names from navigation. Instead use child templates to override
jinja blocks.
[1] https://stackoverflow.com/q/40537752https://stackoverflow.com/a/40562662https://github.com/pallets/jinja/issues/243
Otherwise, users have to click clients checkboxes every time they
switch view.
This commit adds one hook to capture when clients checkboxes changes.
When they are checked, ogcp (front-end) stores them in browser's local
storage. When they are unchecked, ogcp removes them from local storage.
Every time users load a page with the scopes tree, ogcp checks local
storage to restore selected clients.
Otherwise, users have to expand the scopes tree every time they switch
view.
This commit adds two hooks to capture when an element of the tree is
shown or is hidden[1]. When they are shown, ogcp (front-end) stores them
in browser's local storage[2]. When they are hidden, ogcp removes them
from local storage.
Every time users load a page with the scopes tree, ogcp checks local
storage to restore the scopes tree state.
Store and remove functions use stopPropagation() to prevent ancestors of
clicked elements to also be stored or removed from local storage.[3]
1. https://getbootstrap.com/docs/4.1/components/collapse/#events
2. https://developer.mozilla.org/en-US/docs/Web/API/Web_Storage_API
3. https://javascript.info/bubbling-and-capturing
User can confirm when deleting an image by double checking the
information displayed on this page.
Adds a new optional field in GenericForm: 'ids'. Used when dealing with
ids instead of ips.
This commit adds an extra view to ensure users do not reboot clients
accidentally.
ogcp GET /reboot returns the confirmation page and POST /reboot
builds and sends the request to ogServer.
It also includes Spanish translation of the new strings.
This commit adds an extra view to ensure users do not power off clients
accidentally.
ogcp GET /poweroff returns the confirmation page and POST /poweroff
builds and sends the request to ogServer.
It also includes Spanish translation of the new strings.
This commit rename partition table type MSDOS to MBR in the front-end.
At the back-end ogCP still uses MSDOS string because ogClient scripts
(aka cloning engine) expects it.
This commit converts disk and partition size from kibibytes to mebibytes
to improve usability. Disk and partition size are used in "Client
details" and "Partition & format" forms.
It also returns size to kibibytes when creating /setup API
payload as required by ogServer.
This commits configures and sets up flask-babel and adds Spanish po
file. Flask-babel is already a dependency so this commits no needs to
add it.
Users can edit ogcp.json to choose between English or Spanish. After
changing the language in the configuration file, users must restart ogcp
service.
Instructions to generate translation files, inspired by
https://flask-babel.tkte.ch/:
1. Download ogcp source code.
git clone git://git.soleta.eu/ogCP /path/to/ogcp
2. Create a python virtual environment.
python3 -m venv /path/to/new/venv
3. Activate the virtual environment.
source /path/to/new/venv/bin/activate
4. Install dependencies to the virtual environment.
cd /path/to/ogcp
pip3 install -r requirements.txt
5. Extract ogcp strings.
cd /path/to/ogcp/ogcp
pybabel extract -F babel.cfg -k _l -o messages.pot .
NOTE: "-k _l" is needed to extract strings which use lazy
translations.
6. Create or update translation files.
a. Create translation file. This example creates a french translation
file.
pybabel init -i messages.pot -d translations -l fr
b. Update translation files. You need to do this when ogcp strings
change and want to update current supported languages.
pybabel update -i messages.pot -d translations
7. Edit the translations .po file as needed. Example route:
/path/to/ogcp/ogcp/translations/fr/LC_MESSAGES/messages.po.
8. Compile translations.
pybabel compile -d translations
9. Launch ogcp and check the translations.
cd /path/to/ogcp
pip3 install -r requirements.txt
10. Commit and push .po files with translation changes.
From flask babel documentation:
---
Additionally if you want to use constant strings somewhere in your
application and define them outside of a request, you can use a lazy
strings. Lazy strings will not be evaluated until they are actually
used. To use such a lazy string, use the lazy_gettext() function.
---
_() and _l() functions are aliases of gettext() and lazy_gettext()
respectively. Both functions belong to flask babel library.
ogCP limits which scopes can use each user.
Configuration file stores allowed scopes by their names. Leave scope
list empty to give a user permissions on all scopes.
Otherwise, undesired collapse/expand events may occur when users click
an element of the scope.
Old id format example: level3-2
New id format example: id_1-1_2-4_3-2
Explanation:
* "id" -> Prefix needed because html ids must start with an
alphabetic character.
* "_" -> Separator.
* "1-1" -> Values pair separated by "-". The first value is the
level of the node. The second value is its position with
respect to its siblings. This is always 1-1 because is the
root node.
* "_" -> Separator.
* "2-4" -> Child node of the previous node. In this example,
this node its in level 2 and has the fourth position.
* "_" -> Separator.
* "3-2" -> Child of node "2-4" in level 3 and in the second
position. This is the final node in this example.
In other cases ogcp may draws deeper nodes, so it creates longer ids.
For example: id_1-1_2-1_3-2_4-1_5-1_6-1
Clients in ogLive offer a web page with lighttpd that shows a real-time
log. This commit links this log in ogcp.
Future patches will deprecate this log functionality in favour of more
robust solutions.
Add a new select input and button to choose which disk you want to
partition.
TODO: Current argument parsing function returns a list with all the
arguments, except csrf_token. Future patches should add granular parsing
of different types of arguments.
Adds a new button in the images view.
This action handles image deletion, one at a time for security. Users
must select an image using the images tree.
Partition & Format JSON cache fields always have the default values (no
cache) although users order to create a cache partition.
Set JSON cache fields with the values filled by the user.
These functions can work with any kind of strings and not only with IPs.
This is required by the "image details form" that a follow up patch
implements. "Image details form" validates and parses IDs instead of IPs
with these functions.
Rename validate and parse IPs functions to a generic name, so it makes
sense to use them with any kind of string.
This patch fixes the javascript that adds/removes rows from the setup
form.
The AddPartition function now replaces the id `partitions-N-FIELDNAME`
using a regular expression. The hidden csrf input is also ignored to get
incremental numbers.
On deletion, all the ids are reassign from zero, in order, to get always
an ordered list with all numbers between the first and the last.
Creates "delete center" form with a select to choose a center to delete.
Adds a new button in the scopes view. Because scopes checkboxes values
maps to ips the only way to specify the center to delete is in the delete
center form itself, using a select input.
Current submit command behaviour redirects the user to scopes views.
This commit changes the behaviour when submitting a command forms to
redirect users to the general command view.
The initial "Partition & Format" (aka setup) form only allows to modify
one partition at a time. This commit updates it to allow to modify the
whole disk partition schema in one go, without pop-ups and transitions.
This is a remake of the previous form using FieldList de WTForms and
javascript to duplicate / remove FieldList adapted to the attributes
available in WTForms.
This patch adds new states: OPG for clients in ogLive, BSY for busy
clients, VDI for clients in OpenGnsys VDI and WOL_SENT for booting
clients.
It also removes state ON because do not exists.
ogCP currently uses the following colors:
* OPG -> Solid yellow
* BSY -> Solid red
* VDI -> Solid green
* WOL_SENT -> Solid brown
* OFF -> Hollow grey
This patch adds a javascript function to update the scope tree (on/off)
state.
This javacript function is called every second, does a call to the
new backend endpoint `/scopes/status` and updates the tree classes
depending on the current data.
The new `/scopes/status` endpoint just returns the scopes tree as json.
This patch also adds an icon in the tree leafs, a filled green circle
when the state is `on`, and a empty red circle when the state is `off`.
There's also a new javascript function to unfold all collapses in the
scope tree.
Creates "add center" form with "name" as required input and "comment" as
optional input.
In the future, the CenterForm can be used to display center information
once such functionality lands in the ogserver.
This patch adds a way to add a new partition to the setup.html template.
This button opens a modal dialog with a new form and calls a new
endpoint to create the new partition (this endpoint does nothing, it's
needed to be implemented in the future).
I've followed the initial design for this template, with one form per
each partition, so every button will call a function and reload the
page.
It's possible to do all actions at once, but that will require a rework
of this, to do that we can just define an unique form in the whole html,
remove all the "Modify" buttons and add just one "Apply" button at the
end. But maybe that option is a lot complex in the backend because will
require to validate all the changes at once.
This patch also improves the setup.html form without using
flask-bootstrap and rendering the form in the template directly with the
bootstrap4 classes.
Being able to collapse the scopes tree allows to fit a bigger scopes
tree.
A new macro is introduced to generate the HTML code for the scope tree
in such a way that each non-leaf level (center, room) are collapsible.
macros.scopes_tree_collapse(scopes)
As of now, the state of the scope tree is not saved when changing nav
sections.
Commands view has a scope sidebar with the content block filled with
command buttons (poweroff, wol, etc.)
This commit leaves scope create/delete/update buttons in the /scopes
view, which serves that purpose.
To avoid duplicating scope tree creation macro, an external macros.html
is created, this template can be imported. Future macros needed can be
written in there.
Modify the base template to add the sidebar and command bar, implemented
just in the scopes view.
This patch also modifies the "actions/mode.html" template to be shown in
the scopes page. Any other action that should be inside the scopes
should do the same, add the scopes and clients to the template context
and use the "scopes.html" as base in those actions.
The notification has been also changed to use a toast notification
instead of the usual alert to avoid changing the layout on error.
Update the login template based on the AdminLTE extra page:
https://adminlte.io/themes/v3/pages/examples/login.html
This patch also adds a font-awesome icon to the login page, we've
font-awesome from the AdminLTE plugins so we can use this icons in the
interface.
This patch adds the css and js sources from the AdminLTE template to the
base template so it can be used in all templates.
There's also some flexbox bootstrap classes [1] to place the footer at
the bootom always, even when there's no content to fill the page.
[1] https://getbootstrap.com/docs/4.6/utilities/flex/
Add the open source AdminLTE bootstrap dashboard template to the static
folder, and some plugins that we'll use in the following changes to the
templates.
Plugins:
* jquery
* bootstrap
* font-awesome
https://adminlte.io/
Creates "delete room" form with a select to choose a room to delete.
Adds a new button inside the button group in the scopes view. Because
scopes checkboxes values maps to ips the only way to specify the room to
delete is in the delete room form itself, using a select input.
Creates "add room" form with required inputs only: center, name and
netmask.
Adds a new button inside the button group in the scopes view. Because
scopes checkboxes values maps to ips the only way to specify the center
in which to add the room is in the add room form itself, using a select
input.
In the future, the RoomForm can be used to display room information once
such functionality lands in the ogserver.
Add the following disk stats to the dashboard:
* Disk size: shows the amount of total disk size in Gibibytes.
* used: shows the amount of used disk size in Gibibytes.
* available: shows the amount of free disk size in Gibibytes.
* use(%): shows the amount of used disk size in percentage.
Users want to know latest created/modified images to manage new images
or changes made on existing images.
This commit adds a list with the 10 latest created or modified images.
When the user logs into ogcp, the web page redirects him to "Scopes".
In the future ogcp will have a dashboard showing multiple stats and
details. This dashboard will be in "Home" path and we want the user to
see it when he logs in.
Change login redirection from "Scopes" to "Home".
* Adds label for each action page.
* Adds a colored state for opengnsys connected clients
* Fix nav active item
* Rename some actions
* Adds DISK to partition and format form
Ogcp requires a simple login page in order to avoid exposure of the
ogServer API to anyone trying to access the web page.
Because the main authorization mechanism in ogServer is the api token
the login implemented for the ogcp does not include registration process
but a single user and password specified in the ogcp.json.
"USER": "user",
"PASS": "pass"
Adds two new views: /login and /logout. They are used to login the user so
that the rest of views regarding ogServer functionality can be accessed
in a "login required" fashion. Index view (/) is an exception, it can be
accessed logged in or not so different data can be displayed.
Templates can now access a variable "current_user" to get information
about login status. This is a Flask-Login feature.
- Templates regarding login can be found in templates/auth/
- Login form is defined in forms/auth.py to separate it from
action_forms.py
- Adds Flask-Login module to requirements.txt
- Adds default user and pass in ogcp.json
quick_form macro from Flask-Bootstrap creates vertical forms by
default, this rendered each partition spanning too much vertical space.
Use form_type='inline' from quick_form macro to compact the whole setup
form.
This patch enables a set of ips to be specified as a target of an image
restore action.
The set of selected computers must have the same partition setup in
order for the form to be rendered sucessfully, if different partition
setups are detected a redirection is made and an error flash message
is shown.
This action is related to /mode in ogServer API. Allows changing
the netboot template for a set of given clients, previously selected
in the /scopes view.
Adds in a declarative way the validation of the image name form control
when creating a partition image.
This commit serves as an example of adding a predefined validator of the
WTForms module. Custom validator may be added by creating a given
function and appending it to the list of validators.
See https://wtforms.readthedocs.io/en/2.3.x/validators/#custom-validators
Add a function to validate that the ips received from the /scopes form
is valid (no more, no less).
Also redirects to the /scopes when any final request to the ogServer is
responded by a "200 OK"
An error was produced when rendering the setup form of a computer
with any FAT32 partition. It was missing from the mapping of codes
received in a response to a given filesystem.
This commit may serve for future reference as to how some cosmetic
changes have been applied to the web.
Primarily using bootstrap classes in order to adjust margin or padding,
there are mechanisms that allow modifying the class of an
underlying html element in WTForms. Bootstrap classes are written
directly in html templates for Flask.
Also add a Soleta branded footer.
These are used to store a message string that can be later accessed. We
can use Flask flash messages to alert about any error or providing info
when processing a request.
Image creation action was lacking a template to render the form. This
patch adds said template.
Also redirects to /scopes when the request was processed by the ogserver
successfully.
Previously the only method (in the form select) was "UNICAST". This
patch enables specifying a correct parameter for the underlying script
to fetch the image to be restored.
UNICAST-DIRECT makes the administrator transfer the image through the
network. UNICAST-CACHE indicates the taget pc to search for the image in
its cache partition.
Also redirects to the /scopes when ogserver responds with 200 OK.
A new parameter for the setup/ was added: type. Regarding the disk
partition scheme. It must be either "MSDOS" or "GPT".
ogServer expects a 4 partition setup in order to succesfully execute a
setup/ command. Ogcp is currently getting the partition to modify
one partition at a time. This patch enables ogcp to "autofill" with
empty partitions the partition_setup payload parameter.
TODO: In the future, the setup/ logic should not need to query the
database once again in order to create the 'partition_setup' payload
parameter with the form modifications.
This patch introduces the usage of Flask.Config class so the config can
be read at startup (__init__) only once. Config keys must be uppercase
so that from_json method does take it into account.
dormousehole.readthedocs.io/en/stable/api.html#flask.Config.from_json
Prior to this patch each request required opening and closing the
ogserver.json file via load_config in views.py.
In the future the decorated load_config function inside views.py
may be removed to avoid creating multiple instances of the OGServer
class.
This action lists every piece of software installed in an OS from a
client.
This action can handle listing the software from the DB as well as
updating that DB with the latest client information.
Partition filesystem are encoded with integers in the DB. We need to
send the type string instead of the encoded integer, so this patch
parses the encoded integer to string.
This action can be applied on one or multiple scopes. This
implementation use Flask-WTF as a way to build and valdiate forms. As a
side effect, this adds CSRF protection to all forms.
Javier Sánchez Parra
Jose M. Guisado
Daniel García Moreno
OpenGnSys Support Team
Roberto Hueso Gómez