browser: add last modification and document status at the bottom #4531

gmasei11 · 2022-04-04T11:58:33Z

Signed-off-by: Alexandru Vlăduţu alexandru.vladutu@1and1.ro
Change-Id: I04891ce23e0f250243d9453bfecb0570683cae7a

adds a last modification setting as well in coolwsd.xml so that it
displays the last modified after a certain delay
moves the last modification text to the bottom as well as adds a new
text related to the document status (if saved)

Change-Id: I3b21274ed7557b37789f63751e0b9db583469355

Resolves: #
Target version: master

Summary

TODO

...

Checklist

Code is properly formatted
All commits have Change-Id
I have run tests with make check
I have issued make run and manually verified that everything looks okay
Documentation (manuals or wiki) has been updated or is not required

pedropintosilva · 2022-04-05T11:32:59Z

Hi in general I'm not against adding this to the status bar specially as an optional thing : ) but somehow it seems an additional empty div is being created (?) :

pedropintosilva · 2022-04-05T11:33:33Z

with that div removed:

pedropintosilva · 2022-04-05T11:34:17Z

and there are other details that maybe I can help with

gmasei11 · 2022-04-05T12:05:04Z

Hi Pedro,

Thanks for your review!

Hi in general I'm not against adding this to the status bar specially as an optional thing : ) but somehow it seems an additional empty div is being created (?)

Indeed there is an issue with that empty div. It should be fixed.

and there are other details that maybe I can help with

I know that this is a design change but we think that it looks better and this is what we have in our version :). If you have suggestions or any other improvements then go ahead! I'm open to any suggestions/fixes!

Thanks!

pedropintosilva · 2022-04-07T08:59:36Z

browser/css/cool.css

+
+#tb_actionbar_item_right {
+	text-align: right;
+}
+#saved-status-label {
+	background-image: url("data:image/svg+xml,%3Csvg id='Icons' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%235cb82a;%7D.cls-2%7Bfill:%23fff;%7D%3C/style%3E%3C/defs%3E%3Ctitle%3E_%3C/title%3E%3Cg id='Funktions-Icons_24' data-name='Funktions-Icons 24'%3E%3Ccircle class='cls-1' cx='10' cy='10' r='10'/%3E%3Crect class='cls-2' x='3.36' y='10.52' width='6.75' height='2.5' rx='0.5' ry='0.5' transform='translate(10.29 -1.31) rotate(45)'/%3E%3Crect class='cls-2' x='5.63' y='8.75' width='11.75' height='2.5' rx='0.5' ry='0.5' transform='translate(-3.7 11.06) rotate(-45)'/%3E%3C/g%3E%3C/svg%3E");
+	background-position: left center;
+	background-repeat: no-repeat;
+	padding-left: 18px;
+	margin-left: 15px;
+}


better to place this near to the other #toolbar-down rules at: browser/css/toolbar.css

pedropintosilva · 2022-04-07T09:21:42Z

browser/src/control/Control.Menubar.js

-			},
-			{name: _('Last modification'), id: 'last-mod', type: 'action', tablet: false}


Some integrators and users are avoiding the use of statusbar (by hiding it be that to save vertical space, because they might not use those features or simply for personal taste) and thus I think it would be cool to instead of removing this altogether for everyone to, make it an option within the xml.

pedropintosilva · 2022-04-07T09:22:28Z

coolwsd.xml.in

@@ -53,6 +53,7 @@
        <group_download_as desc="If set to true, groups download as icons into a dropdown for the notebookbar view." type="bool" default="false">false</group_download_as>
        <out_of_focus_timeout_secs desc="The maximum number of seconds before dimming and stopping updates when the browser tab is no longer in focus. Defaults to 120 seconds." type="uint" default="120">120</out_of_focus_timeout_secs>
        <idle_timeout_secs desc="The maximum number of seconds before dimming and stopping updates when the user is no longer active (even if the browser is in focus). Defaults to 15 minutes." type="uint" default="900">900</idle_timeout_secs>
+        <min_saved_message_timeout_secs type="uint" desc="The minimum number of seconds before the last modified message is being displayed." default="6">6</min_saved_message_timeout_secs>


wow that's nice!

Andreas-Kainz · 2022-04-20T09:24:45Z

As in the Notebookbar layout there is no last-mod string, it will be an improvement to have it in the statusbar. And as I'm for no specific cases, if not explicit needed. We can talk about if the statusbar is hidden, the last-mod was shown, BUT there is also the save button which indicate you, that your document is saved or not. So from my point, no duplicated strings and keep it simple.

mmeeks · 2024-03-07T10:20:34Z

Hi Gabriel - do you think you can rescue this ? it's very old and we're trying to dung out our old, unresponsive pull requests. Looks like a pretty feature, can we get it in ? =)

gmasei11 · 2024-03-12T09:25:50Z

Hi Gabriel - do you think you can rescue this ? it's very old and we're trying to dung out our old, unresponsive pull requests. Looks like a pretty feature, can we get it in ? =)

Hi Michael,
I think it's a good idea to finalize it. We'll take a look over it in the next period.

pedropintosilva · 2024-04-22T15:17:01Z

@gmasei11 awesome, good to hear, let me know if there is anything I can help with

Darshan-upadhyay1110 · 2024-07-09T15:59:20Z

hello 🙋 @gmasei11 I wanted to check in and see how things are going with the task. Have you made any progress or encountered any complications?

If you need any assistance, please feel free to reach out.

gmasei11 · 2024-07-15T12:56:40Z

hello 🙋 @gmasei11 I wanted to check in and see how things are going with the task. Have you made any progress or encountered any complications?

If you need any assistance, please feel free to reach out.

Hi @Darshan-upadhyay1110
I haven't started working on it yet as I'm busy with the upgrade. I am currently familiarizing myself with the FE side of the application while working on the upgrade. I'll reach you if I'll need assistance. Thanks!

gmasei11 · 2024-08-21T08:16:17Z

Hi there,

I finally started to look into this PR :). A question: should I make it optional within coolwsd.xml ?

mmeeks · 2024-08-21T15:03:00Z

I finally started to look into this PR :). A question: should I make it optional within coolwsd.xml ?

We could have a UI setting for it in the post-message as an option I guess =) some people don't like the status bar for whatever reason - annoyingly then the integration can decide :-)

meven · 2024-08-29T10:41:25Z

I finally started to look into this PR :). A question: should I make it optional within coolwsd.xml ?

We could have a UI setting for it in the post-message as an option I guess =) some people don't like the status bar for whatever reason - annoyingly then the integration can decide :-)

https://sdk.collaboraonline.com/docs/postmessage_api.html

Users settings are stored in localstorage, you can mimic what we do with Show_StatusBar.

eszkadev · 2024-08-29T12:58:15Z

also worth to mention: https://sdk.collaboraonline.com/docs/theming.html#user-interface-modifications
Which is recommended way to adjust the UI by integrator, then it can be done per user.
On top of that user's preferences are saved in local storage in the browser as @meven mentioned above.

I would prefer to not add additional coolwsd.xml option - as it is a global setting (not per-user) and will only complicate decision-making if we should show the statusbar :)

gmasei11 · 2024-09-03T14:55:27Z

Uploaded an initial rework of the Alexandru's patch without making the feature optional for now. It's been a while since then... @eszkadev Could you confirm (or not) if the approach is the right one ?

eszkadev

looks good.
but in longer run it would be good to move things to separate files (other than Map.js which we plan to reduce), at least the widget code,
thank you for the update! :)

eszkadev · 2024-09-04T05:34:40Z

browser/src/map/Map.js

@@ -424,6 +453,37 @@ L.Map = L.Evented.extend({
 	},

 	initializeModificationIndicator: function() {
+		this._docStatusUI = document.getElementById('documentstatus');
+		if (this._docStatusUI !== null && this._docStatusUI !== undefined) {


would be good to extract that widget into separate file (not Map.js)

it's inserted to Statusbar as customitem we can create "widget factory method" like other widgets
also there is mechanism to update the widget there

for update: please see example of onPageChange(e) in StatusBar.js
for creation of html for a widget: this._generateHtmlItem('statepagenumber'),
which produces widget of type htmlcontent and it's content is generated in https://github.com/CollaboraOnline/online/blob/master/browser/src/control/jsdialog/Widget.HTMLContent.ts#L121

so would be good to follow the same approach as other widgets and encapsulate a bit

:) This is funny. My first implementation was exactly as you are suggesting. However, I didn't like that updateWidget recreates the whole content of the widget every time there is a change in its content. But if this is the approach that you prefer then I'm OK with it. Just a question: should I also use updateWidget every time the "Last saved" information changes or I can save the element in a data member and just change the text (as it is now) ? Of course, I will use updateWidget for all the other cases (like switching from "Saving..." to "Document Saved").

would be good to extract that widget into separate file (not Map.js)

it's inserted to Statusbar as customitem we can create "widget factory method" like other widgets also there is mechanism to update the widget there

A completely new file ?

would be good to extract that widget into separate file (not Map.js)
A completely new file ?
no, it's fine just to move to the other files

:) This is funny. My first implementation was exactly as you are suggesting. However, I didn't like that updateWidget recreates the whole content of the widget every time there is a change in its content. But if this is the approach that you prefer then I'm OK with it. Just a question: should I also use updateWidget every time the "Last saved" information changes or I can save the element in a data member and just change the text (as it is now) ? Of course, I will use updateWidget for all the other cases (like switching from "Saving..." to "Document Saved").

I also don't like that, but for now it will be the best, as later we can rework all of them at once.
The reason is: we have rules of how our "JSDialog" framework works, any hacks to optimize something may lead to worse state.
We have "actions" which can do just a text modification, but let's not overcomplicate now. We need to rework all of the HTMLContent widgets anyway (as it is just an adapter for legacy widgets to JSDialogs)

eszkadev · 2024-09-04T05:46:38Z

browser/src/map/Map.js

@@ -479,7 +543,12 @@ L.Map = L.Evented.extend({
 				timeout = 60000;
 			}

-			this.lastModIndicator.innerHTML = dateValue;


we also could do this.fire('lastmodificationupdate', some data) - then we can handle it in many places by:
map.on('lastmodificationupdate', this.someHandlerFunction, this); so someHandlerFunction will do the job - without tight coupling the code

eszkadev · 2024-09-04T05:48:12Z

browser/src/map/Map.js

@@ -347,6 +351,31 @@ L.Map = L.Evented.extend({

 	// end of A11y

+	// can be '', 'SAVING', 'MODIFIED' or 'SAVED'
+	setDocumentStatus: function(status) {


this could be moved to StatusBar.js as a handler for a fire signal on last mod status update

eszkadev · 2024-09-04T05:48:52Z

browser/src/control/Control.StatusBar.js

@@ -242,6 +242,7 @@ class StatusBar extends JSDialog.Toolbar {
 			this._generateHtmlItem('permissionmode'),					// spreadsheet, text, presentation
 			{type: 'toolitem', id: 'signstatus', command: '.uno:Signature', w2icon: '', text: _UNO('.uno:Signature'), visible: false},
 			{type: 'spacer',  id: 'permissionspacer'},
+			{type: 'customtoolitem',  id: 'documentstatus'},


could be generateHtmlItem as other widgets here

Sure, no problem. But why not all of the items are generated with _generateHtmlItem ? What is the difference ?

Because it's just an adapter for old widgets moved from w2ui toolbar to our JSDialog one.
Other widgets are "native" JSDialog's widgets

Signed-off-by: Gabriel Masei <gabriel.masei@1and1.ro> Change-Id: I89f782cf65f2f104e12cf31ddc059c3481c4eb55

Signed-off-by: Gabriel Masei <gabriel.masei@1and1.ro> Change-Id: I022433099333483b9274524a1e38e0e9bd975960

pedropintosilva · 2024-10-17T10:17:43Z

@eszkadev could you please give feedback on this. @gmasei11 has refactored the code

pedropintosilva requested changes Apr 7, 2022

View reviewed changes

pedropintosilva mentioned this pull request Apr 20, 2022

cool header area content arrangement #4340

Open

Andreas-Kainz mentioned this pull request Apr 20, 2022

Replace w2ui #4401

Closed

gmasei11 force-pushed the private/gmasei11/document-status branch from b233469 to 3196881 Compare May 18, 2022 12:13

pedropintosilva mentioned this pull request Mar 8, 2023

browser: add last modification timeout setting #4195

Closed

6 tasks

mmeeks assigned gmasei11 Mar 7, 2024

timar force-pushed the master branch from ebbad3c to 61cf2b4 Compare August 29, 2024 20:13

gmasei11 force-pushed the private/gmasei11/document-status branch from 3196881 to 503b40f Compare September 3, 2024 14:49

eszkadev reviewed Sep 4, 2024

View reviewed changes

gmasei11 added 2 commits September 16, 2024 15:42

browser: add last modification and document status at the bottom

73ab47f

Signed-off-by: Gabriel Masei <gabriel.masei@1and1.ro> Change-Id: I89f782cf65f2f104e12cf31ddc059c3481c4eb55

some improvements in implementation

ae28212

Signed-off-by: Gabriel Masei <gabriel.masei@1and1.ro> Change-Id: I022433099333483b9274524a1e38e0e9bd975960

gmasei11 force-pushed the private/gmasei11/document-status branch from f87edcc to ae28212 Compare September 16, 2024 12:53

eszkadev added the CODE "red" label Sep 23, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

browser: add last modification and document status at the bottom #4531

browser: add last modification and document status at the bottom #4531

gmasei11 commented Apr 4, 2022

pedropintosilva commented Apr 5, 2022

pedropintosilva commented Apr 5, 2022

pedropintosilva commented Apr 5, 2022

gmasei11 commented Apr 5, 2022

pedropintosilva Apr 7, 2022

pedropintosilva Apr 7, 2022

pedropintosilva Apr 7, 2022

Andreas-Kainz commented Apr 20, 2022

mmeeks commented Mar 7, 2024

gmasei11 commented Mar 12, 2024

pedropintosilva commented Apr 22, 2024

Darshan-upadhyay1110 commented Jul 9, 2024 •

edited

Loading

gmasei11 commented Jul 15, 2024

gmasei11 commented Aug 21, 2024

mmeeks commented Aug 21, 2024

meven commented Aug 29, 2024

eszkadev commented Aug 29, 2024

gmasei11 commented Sep 3, 2024

eszkadev left a comment

eszkadev Sep 4, 2024

eszkadev Sep 4, 2024

gmasei11 Sep 4, 2024

gmasei11 Sep 4, 2024

eszkadev Sep 4, 2024

eszkadev Sep 4, 2024

eszkadev Sep 4, 2024

eszkadev Sep 4, 2024

eszkadev Sep 4, 2024

gmasei11 Sep 4, 2024

eszkadev Sep 4, 2024

pedropintosilva commented Oct 17, 2024

		},
		{name: _('Last modification'), id: 'last-mod', type: 'action', tablet: false}

browser: add last modification and document status at the bottom #4531

Are you sure you want to change the base?

browser: add last modification and document status at the bottom #4531

Conversation

gmasei11 commented Apr 4, 2022

Summary

TODO

Checklist

pedropintosilva commented Apr 5, 2022

pedropintosilva commented Apr 5, 2022

pedropintosilva commented Apr 5, 2022

gmasei11 commented Apr 5, 2022

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Andreas-Kainz commented Apr 20, 2022

mmeeks commented Mar 7, 2024

gmasei11 commented Mar 12, 2024

pedropintosilva commented Apr 22, 2024

Darshan-upadhyay1110 commented Jul 9, 2024 • edited Loading

gmasei11 commented Jul 15, 2024

gmasei11 commented Aug 21, 2024

mmeeks commented Aug 21, 2024

meven commented Aug 29, 2024

eszkadev commented Aug 29, 2024

gmasei11 commented Sep 3, 2024

eszkadev left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

pedropintosilva commented Oct 17, 2024

Darshan-upadhyay1110 commented Jul 9, 2024 •

edited

Loading