summaryrefslogtreecommitdiffstats
path: root/ogcp/templates/macros.html
Commit message (Collapse)AuthorAgeFilesLines
* templates: reduce size of client list titleAlejandro Sirgo Rica2024-09-171-1/+1
| | | | | Reduce the size of the tittle message containing "Selected clients" in the bock showing the client pills.
* js: add ogStorage to prevent localStorage key collissionAlejandro Sirgo Rica2024-09-161-1/+1
| | | | | | | | | | | Define ogStorage class to manage the localStorage operations. The new keys are constructed with the following structure: "group-context-id" Where group is either "show" for the collapsed items in the sidebar, or "check" for the selected checkboxes of the sidebar. Add sotrage versioning to delete obsolete localStorage when a new design for the storage is included in ogCP.
* js: consolidate sidebar collapse persistence logicAlejandro Sirgo Rica2024-09-161-1/+1
| | | | | Consolidate all the sidebar collapse persistence logic. Implement a single function to handle all the views.
* templates: add name and status to client listAlejandro Sirgo Rica2024-09-111-15/+3
| | | | | | | | | | | | | | | | Add a client name column to the client list view accessed through the Dashboard. Add status column to the client list. Move client status leyend into a separate file. Show the client status leyend in client list. Fix the 0 link speed conditional. Reuse the data returned by get_scopes() to reduce the number of requests.
* ogcp: improve sidebar logic in CommandsAlejandro Sirgo Rica2024-07-221-3/+1
| | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | Disable all checkboxes of scopes of level higher than room in the $(window).on('pageshow', function) callback. Set checkboxes as "indeterminate" when not every children is selected but have some of its children selected. [x] center [x] room1 [x] client1 [x] client1 [-] center [ ] room1 [-] room2 [ ] client1 [x] client1 Send all selected sidebar fields as form fields. This requires setting disabled to false and replacing indeterminate = true to checked = true in the .on('submit', function) callback. When a checkbox is clicked: 1. Find the room branch of the checked input. [ ] center [ ] room1 [ ] room2 <- root of the room branch [ ] client1 <-- clicked item 2. Uncheck all the checkboxes outside of the room branch. 3. Set all the children of the clicked item to the same value as the clicked item. 4. Set the parent checked or indeterminate values. 5. Save checkbox status.
* ogcp: show an indicator in each sidebar branch with live childrenAlejandro Sirgo Rica2024-07-091-3/+6
| | | | | | | | | | | | | | Add visual indicator to the disclosure widget when its branch has any clients in live mode. Ease the search of systems in ogLive in need of being booted or turned off. Add id= to the HTML component containing the disclosure widget. Set the id to the value scope_type-scope_name for type='server' and scope_type-scope_id for the rest. Add the CSS class 'live-report' to the HTML components with live children. Assign the class field in the js function updateScopes.
* ogcp: improve page heading styleAlejandro Sirgo Rica2024-06-271-1/+1
| | | | Make headings take less space and have a dashed line under them.
* ogcp: add disclosure widget to sidebarAlejandro Sirgo Rica2024-06-141-2/+1
| | | | | | | | | | | | Add cache buster to soleta.css in base.html to have control over cache expirity. Bump soleta.css version to ensure browser does not used older (cached) version. Add CSS rules to show a disclosure widget in the sidebar. Show center checkboxes as disabled in the commands view sidebar for visual consistency. Add class "collapsed" to the proper HTML components to keep a proper state on page reload.
* src: revisit sidebar context storage approachAlejandro Sirgo Rica2024-06-141-4/+5
| | | | | | | | | | | Maintain selections made in scope sidebar after clicking an action (ie. client add, room delete, etc.) Use ids instead of names as the name html property is the same for every room and center. Call keepSelectedClients() in macros.html for both Scope Management and Commands instead of only in Commands. Add a "context" value to the checkbox id to separate scope and commands values in local storage.
* templates: show folder iconJavier Hernandez2024-01-301-0/+3
| | | | | | Add icons to differentiate folders. Use &#x1F4C1; which represents folder using emojis.
* views: Add computers to folderJavier Hernandez2024-01-111-6/+8
| | | | | | | | | | Add support for adding computers to a folder. It uses a js script that when selecting a folder in the html form, it will also select the parent of the folder. For instance, if the user were to select a folder that is contained inside a room, the room would also get selected. This allows the view to know which parent contains the folder.
* views: Add delete folderJavier Hernandez2024-01-101-0/+6
| | | | | | | Add functionality to allow the user to delete a folder. Show a confirmation page to the user listing the content of the folder that is about to delete
* Remove id from client's bubblesJavier Hernandez2023-12-211-1/+1
| | | | | | | | Remove id from client's bubbles in the following commands: Power (Poweroff, Poweron, Reboot); Setup (Set boot mode, Set ogLive); Client (Start session) To make the string replacement, a custom jinja filter has been created
* templates: translate shutdown state keysJavier Hernandez2023-11-271-1/+1
| | | | Change key element 'Apagado' to its English form 'Shutdown'
* Add clients in Linux and Windows modeJavier Sánchez Parra2022-11-171-0/+8
| | | | | Scopes tree shows clients booted in Linux and Windows with ogClient installed. It also shows if the user logs in.
* Fix client room retrievingJavier Sánchez Parra2022-09-271-5/+6
| | | | Otherwise, retrieving do not work on clients inside folders.
* Add multiple servers to the dashboard viewDaniel García Moreno2022-09-271-2/+2
|
* Implement single room selection for commands viewDaniel García Moreno2022-09-271-3/+5
|
* Add different selection mode for the tree viewDaniel García Moreno2022-09-271-4/+8
|
* Add a room to a center using the scopes treeJavier Sánchez Parra2022-09-271-0/+6
| | | | | With this commit users can select a center from the scopes tree, and then add a room to that center.
* Add current ogServer to scopesFormJavier Sánchez Parra2022-09-271-1/+6
| | | | | | | | | With this commit when users select a scope, the ogServer to which it belongs is also sent. Then when processing the form we obtain this ogServer and we can send it the pertinent requests. This commit also makes action "Add client" to use the ogServer sent in the form.
* Add a client to a room using the scopes treeJavier Sánchez Parra2022-09-271-1/+7
| | | | | With this commit users can select a room from the scopes tree, and then add a client to that room.
* Add color legend of the client statesJavier Sánchez Parra2022-05-171-0/+11
| | | | | Add an explanatory list of the colors used to represent the different client states.
* Add indeterminate checkboxes to scopes treeJavier Sánchez Parra2022-04-081-0/+1
| | | | | | | Each checkbox may have child checkboxes. If all those children are checked, it be checked. If none are checked, it is unchecked. If some of them are checked, then it’s in an indeterminate state (in this case symbolically meaning “partially” checked).
* Simplify scope identifiersJavier Sánchez Parra2022-04-081-5/+5
| | | | | | | | | | | Old id format example: id_1-1_2-4_3-2 New id format example: scope-1-4-2 It represents the node and its ancestors' position with respect to theirs siblings. The rightmost value is the current node position. Commit f70d90ba32a6 introduces the old format.
* Submit IPs when scopes tree is read onlyJavier Sánchez Parra2022-04-011-1/+2
| | | | | | | | | | Otherwise, users can not switch between actions without going back to the parent view. This makes "scopesForm" work again in all views and not only in scopes.html and commands.html. Commit feed135554543 introduces this regression.
* Replace " " with "_" in HTML scopes IDsJavier Sánchez Parra2022-03-251-2/+2
| | | | | | | | | | | | | | | | | | | Otherwise, scopes with whitespaces 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. ---
* Disable scopes tree's checkboxes in action viewsJavier Sánchez Parra2022-03-101-5/+5
| | | | | Now users can select clients only in scopes and command views, in any other view we set the scopes tree read only.
* Set pills widthJavier Sánchez Parra2022-03-091-1/+1
| | | | Set the same width to all pills.
* Add separator and heading to selected clientsJavier Sánchez Parra2022-03-071-0/+1
|
* Use pill style in confirmation pagesJavier Sánchez Parra2022-03-031-8/+10
| | | | | Draw selected clients from confirmation pages like selected clients from scopes and commands pages.
* Replace "." with "_" in HTML scopes IDsJavier Sánchez Parra2022-02-251-1/+1
| | | | | | | | | | | | | | | | | | 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. ---
* Limit max number of clients drawn in commandsJavier Sánchez Parra2022-02-241-1/+5
| | | | | Print large number of clients (hundreds) does not make sense, it is unreadable.
* Wrap selected clients listJavier Sánchez Parra2022-02-241-1/+1
| | | | Otherwise, the list overflows the screen when users select many clients.
* Refactor selected clients drawing in commandsJavier Sánchez Parra2022-02-241-0/+8
| | | | Refactor duplicated code as a jinja macro.
* Show selected clients in container blockJavier Sánchez Parra2022-02-231-0/+5
| | | | | | | | | | | | | | | | | | | 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
* Check scopes checkboxes recursivelyJavier Sánchez Parra2022-01-311-0/+1
| | | | | | Otherwise, nested scopes are not checked and mislead users. When a scope is checked, we search all its children and check them too.
* Keep selected clients in the scopes treeJavier Sánchez Parra2022-01-281-0/+1
| | | | | | | | | | | | 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.
* Keep scopes tree stateJavier Sánchez Parra2022-01-281-0/+1
| | | | | | | | | | | | | | | | | | | | 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
* Remove dead code in macro.htmlJavier Sánchez Parra2022-01-281-20/+0
| | | | scopes_tree_collapse() replaces this dead code.
* Ensure unique HTML ids for scope elementsJavier Sánchez Parra2021-11-261-5/+5
| | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | 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
* Keep scopes collapsed by defaultJose M. Guisado2021-10-151-1/+0
| | | | | For large scopes, unfolding by default slows page loading. It also takes lots of vertical space and the scroll bar gets smaller.
* Fix scopes tree draw on empty centers/roomsJavier Sánchez Parra2021-07-301-1/+1
| | | | | Otherwise, ogcp draws empty centers and rooms as computers, with the state circle.
* Add and restyle clients statesJavier Sánchez Parra2021-07-201-5/+7
| | | | | | | | | | | | | | | | 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
* Update scopes tree dynamicallyDaniel García Moreno2021-07-071-2/+18
| | | | | | | | | | | | | | | | | 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.
* Add scopes_tree_collapse macroJose M. Guisado Gomez2021-06-301-0/+29
| | | | | | | | | | | | | 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.
* Keep the selection in the sidebar for mode & setupDaniel García Moreno2021-06-171-0/+1
|
* Add commands view and macros.htmlJose M. Guisado2021-06-171-0/+19
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.