This commit renames the `create_stream_permission` field in the
templates to `create_stream_policy`, matching the field used in the
database model. This matches what `invite_to_stream_policy` does and
will be clearer when the `waiting_period_threshold` is split into its
own field.
This commit replaces the `create_stream_by_admins_only` setting with a
new `create_stream_policy` setting, which mirroring the structure of
the existing `invite_to_stream_policy`.
This is important preparation for migrating the waiting period feature
to be its own independent setting.
Fixes#12236.
The error message, that is displayed when a user tries to upload a file
larger than the allowed size, currently displays a hardcoded max file
size of 25MB.
Changed this to show the correct max_file_upload_size value that has
been set by the server admin.
Fixes#12251.
Previously when disabling name changes in server settings, instead
of realm settings, the name edit button did not get disabled.
Changing name resulted in a message stating `no changes made`.
Fixes#12132.
Realm setting to disable avatar changes is already present.
The `AVATAR_CHANGES_DISABLED` setting now follows the same
2-setting model as `NAME_CHANGES_DISABLED`.
This is useful when syncing avatars from an integrated LDAP/active
directory.
The upload avatar and delete avatar buttons are hidden if avatar
changes are disabled and the user is a non-admin.
If the user has a gravatar set, then the user will not be able to
upload an image as their avatar if avatar changes are disabled.
Part of #12132.
Update stream-subscription-row in stream settings, when
subsctiption add/removal event is received. This is only
to show dynamic effects to user on sub events.
This adds the same "x" button as we have in "stream search" or "people
search" to the user status modal.
The button is shown if someone types something, or if the status
message was already set (meaning there was already a value in the
input field). If the input field is empty, the button is not visible.
This fixes the follow-up comments from #12179.
- Changed the <p>s to <button>s and modified the css accordingly.
- Changed the css to use scss nesting.
- Changed the line-height from 1.0em to 1.1em, because on Safari the "g" was not fully displayed.
This commit removes code to update-stream-privacy-btn
in stream settings from update-sub-settings function.
Because stream-privacy-btn is not part of regular
sub-settings, it is admins only settings.
When user unsubscribe from stream by clicking on
subscription-checkmark, the URL changes to unsubscribed
stream but stream settings UI is not updated.
We should change URL and stream settings modal
simultaneously. This PR moves update-hash function
inside open-stream-modal function, which make sure that
URL is getting updated everytime open-stream-modal
function is called and not otherwise.
This commit adds `stream_ui_updates.js` module. This module
will includes functions which will update different ui elements
(i.e. subscription button, subscriber count).
This commit creates a new organization setting that determines whether
a user can invite other users to streams. Previously this was linked
to the waiting period threshold, but this was both not documented and
overly limiting.
With significant tweaks by tabbott to change the database model to not
involve two threshhold fields, edit the tests, etc.
This requires follow-up work to make the create stream policy setting
work how this code implies it should.
Fixes#12042.
This bug turned out to pop up wherever a table existed in both
'settings' and 'organization settings', notably *excluding* both
'Custom Emoji' and 'Authentication Methods'.
The first thought to the solution was to simply add `thead` to the css
rule that applies the appropiate color for headers and the like. This
was successful, however it brought attention to a sub-problem:
`emoji-settings-admin` and `auth-mehtod-settings-admin` were both
creating table headers in the body of the table. This was causing the
rows in these two tables to be colored inversely from all the others.
This is also the reason why these tables are the only ones correctly
styled. These handlebars were updated with the headers moved out of the
body.
The even and odd rows of the tables were then colored appropriately.
Fixes: #12209
This commit adds a `insert_tip_box` function and thus adds a
`organization-settings-tip` handlebars file to add a genaralised tip for
all organization settings pages. This further removes the code for tipbox
which was added in `populate_auth_methods` functions, as it wasn't making
sense there, making it more clear and readable.
This commit adds a class prop-element for all the property elements, so
that later on we can directly use this to access elements.
In `get_subsection_property_elements`, we were finding these elements using
a makeshift method, where we were finding all these elements by mentioning
all input elements, textarea, select elements, which is not a desirable
method.
So now, here in `get_subsection_property_elements` function, we are finding
these properties using the newly added class `prop-element` which makes
code more clear and readable.
In handlebars and settings_org.js, the subsection in which
`realm_message_retention_days` property lies doesn't agree, and this wasn't
observed for a long time as it's disabled, still to make things right, in
this commit we have moved the logic which handles the collection of data
from `other_permission` to `other_settings` as it makes more sense there.
This is a small patch to fix the error message an admin would receive if
they tried to change bot info and owner from the "bots" setting of the
organization settings panel.
There are no other <h5>'s in static/templates. Basically just copied the
styling of `#settings_page h3` above it.
The vertical spacing here isn't great, but I think will require some deeper
fixes.
The order in the streams section is visual, audio, mobile, email, which also
seems to match other products (though didn't do a careful analysis). This
changes the PM section to match.
Previously the selector returned an undefined element when trying to select
the message edit save button (since `closest` selects the closest parent in
the DOM tree). This is fixed in this commit.
A few bugs were caused by 7d4cebbc1e.
In night mode:
- home icon was hidden by grey box on "All messages" narrow.
- inactive tabs (eg "mentions" and "stars") were hidden behind grey box.
- topic tab was hidden behind grey box in topic narrow.
In both night mode and normal mode:
- "private messages" tab in individual/group pm narrows was illegible.
These were all results of unexpected differences in precedence rules
caused by the refactor.
Removed the preview tag from the css rule, reduced the undo preview tag
to a font-size of 15px.
The preview tag being attached to the rule proved unnecessary. The icon
for reverting back to an editing state also dipped below the horizontal
level of the icon row.
This change adds rules for ordered lists that makes them visually similar
to bulleted lists.
Note that is has no effect because our markdown implementation doesn't
currently generate ol tags.
This change decreases the spacing at the top and bottom of bulleted lists
and blockquotes.
Specific rules for p and p:last-of-type have been added for both uls and
blockquotes to maintain visually consistent spacing in all cases.
The current behavior treats uppercase and lowercase characters
differently resulting in incorrect sorting of lists.
This change fixes that and makes the alphabetic sorting of columns
case insensitive.
Apparently, our use of JavaScript string `.replace()` here was buggy,
because replace() has several special escape sequences starting with
`$` if they appear in the replacement content string. We can work
around this through something of a hack, which is to pass a function
as the second argument to replace, which seems cleaner than replacing
all $s with $$s.
Thanks to Shreya for the report.
This reverts commit 6441ad0677 since it
causes two bugs: (1) when rendering new message there is glitch where
the profile picture flashes (2) when someone sends a new message their
profile picture flickers.
Historically, we had a large bottom-margin on p tags designed to
produce correct spacing between consecutive paragraphs (10px, similar
to the spacing between consecutive paragraphs in different messages by
the same sender). And then we tried to fix the end-of-message spacing
with a p:last-of-type rule, which fixed that problem, but created lots
of unnecessary extra space just before a bulleted list, block quote, etc.
We recently added some p+ul and p+blockquote negative margin rules in
62f2396ee2 to try to fix this, but those
created some secondary issues in interaction with the p:last-pf-type
rule. This rabbit hole is likely somewhat deep.
The right fix for this overall formatting is to implement the
inter-paragraph spacing as a p+p rule, rather than a bottom-margin on
the p rule; then, we get all the properties we're interested in for
how paragraphs interact.
We may need to do some follow-up work to add small p+ul and
p+blockquote rules to get the pixel-perfect spacing we want (or maybe
just adjust the ul/blockquote spacing CSS), but this is clearly a
better architecture for doing this work.
Fixes#12101 through solving the same problem it does.
This has no functional changes, just making the implementation more
standard.
We don't have any blockquotes outside markdown rendering, which is why
it's correct to collapse the blockquote rules.
This eliminates unnecessary use of the message_content CSS class in
favor of rendered_markdown, which makes more sense for places outside
messages where we display rendered Zulip markdown.
Now that we have a scroll container for the PM list,
it doesn't make much sense to limit the number to
five.
We may resurrect this feature if "more conversations"
actually fetches more conversations, but it doesn't
currently.
We also may soon make it easy to limit PMs to just
unread messages, which will make the max-5 feature
perhaps less necessary, and we don't want to make
the UI overly complicated.
We now just calculate two vars:
pm_list - which individual PM conversation to highlight
is_pm_filter - highlight "Private messages"
The logic is structured so that we err on the side of **not**
spuriously selecting list items:
* be defensive about `filter` not existing for some reason
* don't select anything if we have multiple pm-with
operands in the search (which is sort of undefined
behavior)
Tweaked by tabbott to add a comment explaining the multiple pm-with case.
We are basically just inlining remove_expanded_private_messages,
skipping the resize call that happens at the end of rebuild_recent.
This change makes sense even if we keep the
current UI for Private Messages.
Center aligned the icons from streams and decreased the font-size of
the icons from the global filters.
This dramatically improves the visual appearance of the left sidebar.
Fixes: #11917.
Blockquotes and unordered lists had a large amount of space above them
when preceded by a paragraph tag, which looks ugly. This is a common
issue with the CSS rendering of essentially all markdown
implementations (e.g. GitHub has this bug).
We resolve the issue by reducing that whitespace with negative
margins. Hopefully, this won't create other weird glitches in the
process.
Fixes#11631.
This is the part where the whole selection is analyzed to get the
`start_id` and `end_id` of the messages that are selected (the
loop part of the copy handler).
This is extracted and exported as well.
All the inline javascript code present in email_log.html(which is
rendered when the user visits "/emails" in development mode) is
transferred to a new file: email_log.js in portico/ directory.
Fixes#11608.
Private messages too have non-`undefined` stream name. It is usually
an empty string. The check has been changed to not check specifically
for stream name to be undefined.
Color and background is made according to "day mode"
exclusively here because when copying the content
into, say, Gmail compose box, the styles come along.
This is done to avoid copying the content with dark
background when using the app in night mode.
We can avoid other custom styles since they are wrapped
inside another parent such as `.message_content`.
This adds a parent selector, `rendered_content`, to night mode syntax
lighlight selector. This helps us in getting the "day mode" syntax
highlight styles in night mode.
This adds a class `rendered_markdown` for all the elements which have
rendered markdown content; This is done to add different styles for
rendered content in day mode and night mode.
Also replace the element selectors from CSS to use the class.
Using lazysizes we only load images if they are in view.
This decreases load time and save more bandwidth since images are loaded
after html is loaded and if they are on screen.
Fixes#3564.
The delete operator could throw a TypeError when attempting to
remove a non-configurable property, which is rare in practice since
they can only be created using `Object.defineProperty()` and
`Object.freeze()`. We also never uses the output of `del()` anyway.
Instead of using the `trapsarent` keyword, which is interpreted
as Safari as black with an opacity of 0%, re-use the gradient colors
themselves in order to lead to a single color gradient. This allows
for the homepage to look the same regardless of browser.
Fix#11985.
This commit removes inline javascript code present in
accounts_send_confirm.html and moves it to signup.js. This page is
rendered when the "/accounts/send_confirm" endpoint is visited. An
empty div element is added in accounts_send_confirm.html with
unique data-page-id attribute to make it more easy to find in which
page we are, while working with the javascript code.
This commit removes inline javascript code present in reset_confirm.html
and moves it to signup.js. The reset_confirm.html page is rendered when
the user visits "/accounts/password/reset" confirmation page. An empty
div element is added in reset_confirm.html with unique data-page-id
attribute to make it more easy to find in which page we are, while
working with the javascript code.
This commit removes inline javascript code present in reset.html and
moves it to signup.js. The reset.html page is rendered when the user
visits "/accounts/password/reset". An empty div element is added in
reset.html with unique data-page-id attribute to make it more easy
to find in which page we are, while working with the javascript code.
A new javascript file "dev-login.js" is created in static/js/portico/
and the inline javascipt code present in dev_login.html is transferred
to that file. An empty div element is added in dev_login.html with
unique data-page-id attribute to make it more easy to find in which
page we are, while working with the javascript code.
This commit removes inline javascript code present in create_realm.html
and moves it to signup.js. The create_realm.html page is rendered when
the user visits "/new". An empty div element is added in
create_realm.html with unique data-page-id attribute to make it more easy
to find in which page we are, while working with the javascript code.
This commit removes inline javascript code present in
accounts_home.html and moves it to signup.js. The accounts_home.html
page is rendered when the user visits "/register". An empty div
element is added in accounts_home.html with unique data-page-id
attribute to make it more easy to find in which page we are, while
working with the javascript code.
This commit removes inline javascript code present in login.html and
moves it to signup.js. An empty div element is added in login.html
with unique data-page-id attribute to make it more easy to find in
which page we are, while working with the javascript code.
slice always returns a new string, so this could have been motivated
by ensuring we always duplicate the string, but reading the code, it's
already sliced by the caller.
This is the follow-up of PR #10267.
Here, we add typeahead for slash commands `/me` and `/poll` in compose box.
The slash typeahead will open only when `/` is the first character and all
slash commands will be displayed when one types `/`, as this helps a lot in
discoverability. This also adds a description of what the slash command
does in the typeahead.
This also remove:
- meta.current_bot_element: As usage of meta has been wrongly exploited, we
should refrain us from using meta this way i.e. to share variable between
function using the global variable, as they reduce code readability.
- update_view_on_deactivate_reactivate_failure: Again to deduplicate the the
code we're compromising with readability which isn't worth it here, also
we need to this because we have removed above meta key.
We should pass row as an argument to update_view_on_deactivate because we
update deactivate view of a row when the user get activated/deactivated by
the event system.
This also removes a redundant data variable.
This fixes the confusing behavior that errors sending messages were
not immediately user-visible.
Based on work by Dominik Gryboś in #11479.
Fixes#10537.
This disables the Deactivate button for the current user in the Users tab,
so that it becomes hard to deactivae yourself accidently from Users tab.
Fixes#10427.
Apparently, this has been broken since
dee4e3fb89, due to the beforeSend code
here overriding the default beforeSend function that sets the CSRF
token. The correct fix was actually to just run the relevant code
directly before the channel.patch call.
Fixes#11938.
It is observed in Mozilla margin was considered from other side of thumbnail
due to some special padding issues observed in mozilla.
To fix this top and left value are assigned to 0 so that it automatically
takes its correct position in all browsers
Fixes#11867.
When new PMs came in, we would do a little
animation to show you the incoming message.
Unfortunately, it was broken and would animate
too many things. (The code looks at a single
var to see if PM counts changed, but there are
actually mulitple PM counts. We could fix that,
but we decided that this feature just isn't
worth the complexity.)
We still animate incoming mentions.
Fixes#11868.
This renames references to user avatars, bot avatars, or organization
icons to profile pictures. The string in the UI are updated,
in addition to the help files, comments, and documentation. Actual
variable/function names, changelog entries, routes, and s3 buckets are
left as-is in order to avoid introducing bugs.
Fixes#11824.
When we try to hover over Open or Download they were not highlighted
in night mode, because of incorrect specificity. This commit adds
highlighting in night mode (possibly fixing a regression when we made
night mode less aggressive about hover).
Fixes#11887.
This allows user to download the latest version of android apk from
the apps/android.
This will help the users who use Android without Google Play to
download the app and install it with ease.
To implement this I added a Download APK link on the apps.html page
which always points to the latest released version.
Fixes part of #11647.
Or on the scroll triggered by that resize.
Then we don’t need a kludge that skips the resize handler in
situations where it might hide popovers.
Signed-off-by: Anders Kaseorg <andersk@mit.edu>
This makes the "more topics" option which appears below the list of
known topics in the left sidebar appear only when it's possible there
are actually more topics to be displayed. Two specific cases it
resolves completely include:
* Newly created realms; this widget was a common source of confusion
for new organization administrators.
* Newly created streams.
There are still some corner cases this doesn't handle, e.g. if you
just joined a private stream with protected history, but there isn't
as easy a fix for those.
Essentially rewritten by tabbott to fix code duplication and comment
extensively.
Fixes#10265.
As a follow up of commit (bf1c9420df), this
commit removes the `build_realm_day_mode_logo_widget` and
`build_realm_night_mode_logo_widget` function , and changes
`build_realm_logo_widget` to take single argument `is_night` and depending
on this argument, corresponding `day mode` or `night_mode` widget is
handled.
It was impossible to add emoji to the message or to react on other's
message in mobile browsers because emoji popover used to get closed
due to the resize event being fired by the virtual keyboard. This
commit solves this issue by ignoring the resize event when the user
is trying to use emoji popover.
Fixes#11448.
We have this strange business requirement that the
blue-ish highlights for the current PM go into the
left gutter and all the way to the right edge.
We also have markup that treats the list of PMs
as a list inside the list item for the "Private
messages", which makes sense logically.
Before this change, the padding was done for the
outer top-left `ul`, but that caused the inner PM
rows not to have that padding when you hovered them.
Now we pad each individual list item and/or inner
list item or div.
Fixes#11879.
Firefox and Chrome handle selection of multiple messages differently. FF
creates multiple Ranges and Chrome creates one. Code written previously
terminated when we got an empty Range or Range with same starting and ending
message. This behaviour was incorrect since the selection was valid.
* Check for same message is done after looping through all the ranges now.
* `construct_copy_div` is called once since it is much easier to determine
start_id and end_id with confidence and this avoids any overlap between
same message ids.
Extended by tabbott to include a ton of comments on how this works.
Fixes#11805.
This changes the "new private message" button to be instead "new
conversation" when looking at PMs, to avoid confusion that the button
was the right thing to do to reply to the current private message
conversation.
Fixes#11679.
Even though there are only ever zero or one active
topic widgets in our current sidebar, it's almost the
same amount of code to just manage them with a Dict.
Also, we can more easily do possible future features
like setting streams to be always-open.
This moves the configuration of widget type from settings_org to instead
live in respective HTML templates, via `data-widget-setting-type` and we
also remove `get_subsection_property_types` and refactor function
`populate_data_for_request` accordingly.
Fixes: #11708.
This fixes the bug where the `Saved` state button faded out almost
instantly (that is actually 300 ms) and `Discard` button fades out
along with `Saved` state button; the key problem here was that the
setTimeout intended to fade was actually delaying the transition from
"saving" to "saved".
Now, first of all, we use `setTimeOut` function to fadeout elements giving
fadeout_delay time as `800 ms` and we hide discard button during `saving`
state. Also, when `Discard` button is selected, `Save changes` and `Dicard`
fade out simultaneously.
Fixes: #11737.
This was introduced in e0236646
For 1.5 years we did not find a case that needed it (besides the
`a` tag hover state, that is not obvious if it was needed or it was
used as an example)
It is not obvious if this solution was a good idea. The concern was
that `body.night-mode` is more specific than `body` and some styles
might override others less specific in cases we might not want that.
Of course, we want that in the majority of cases, and css-specificity
rules are not simple to comprehend.
Good further reading:
http://cssspecificity.com/https://specificity.keegan.st/
The added complexity of the resulting styles and the added code that
might not serve any practical purpose seem to not be worth it.
If you click on the avatar, we now show the menu
right next to the avatar. The current behavior
is particularly funny for long names. (I confirmed
this with Rishi.)
This fixes several bugs with /me messages:
* We no longer hover name if you're over
the message.
* We now launch the user popup if you
click on the name.
* Even if you click on the avatar, we
launch the user popup to the right
of the name. (I think this is odd,
but it's consistent with how we
do it for normal messages.)
The underlying problem here is that you have
two possible organizations.
From a logical standpoint, the image and
name go together (and both launch the user menu):
img Alice | says hi
From a physical perspective, the main message
is "Alice says hi" and it's aligned differently
from the image:
img | Alice says hi
Our HTML reflects the latter.
HTML doesn't allow overlapping diffs, of course,
so you have to pick your poison.
One goal of this commit is to just make the "happy
path" code a lot easier to read. It should be
pretty easy to verify that in this diff.
And then more stuff is now in me_message.
This is a pure code move, and it doesn't fix these
structural issues yet:
* the "say hi" part of "/me says hi" is
inside ".message_sender" (due to legacy
positioning issues)
* the avatar is outside of .sender-status
(again due to legacy positioning issue)
* we don't have sender_info_hover on
the sender name (which causes it not
to launch the user menu)
The code that was removed here wasn't doing what it
was intending to do, and we really just want to pop
up the user menu above the currently selected message.
This fixes some annoying copy-paste issues we've seen with users
accidentally getting a weird invisible unicode character in their URL
format string when trying to copy-paste an existing linkifier to
use for a new linkifier.
Fixes#10828.
Previously, because our check for whether to close compose for clicks
on the page body was looking at popover-content, not popover, parts of
larger popover-title areas (e.g. the big avatar at the top of the user
popover) did not have the proper click handler behavior.
Also, rearrange the comments to be a bit clearer.
The modal-backdrop and user-profile-modal had their on-click behavior
overridden to simply hide the modal, thus preserving the compose box.
Keeping the compose box open after viewing a user's profile feels
like a more natural UX.
Tweaked by tabbott to move the fix into the central click handler.
Fixes: #11585.
Adds possibility for users to use | as an OR-operator (besides ,)
when searching for other users.
This is a thing reasonable folks might try, and | in the thing to
search for isn't a realisitic possibility, so there's no real downside
to adding this.
Fixes#4109.
We now use 10px to the left of major elements in
left sidebar.
And we then explicitly use 19px for the following:
icons in top left
indent for (more conversations)
stream hashtag icons
stream lock icons
We also kill off 2px of gutter that was caused
by whitespace in the HTML (and was slightly messing
up alignment of names beneath "Private messages").
Finally, we make the topic indent a bit more explicit.
It was impossible to search people in mobile browsers because virtual
keyboard used to fire resize event and the function call that we used
to handle this event caused the input field to loose focus and this
made it impossible to type in the people search bar.
The code in this commit fixes this by simply ignoring the resize
events when the user wants to search.
Fixes#11795.
The previous gradient must have been from a previous design; it looked kind
of crazy against our current homepage. This widget also appears on /help,
/integrations, and other pages with a variety of different backgrounds, so a
neutral, muted style is probably safest.
The icon change is just because fa-off seems to be broken/missing. Maybe it
was in Font Awesome 3?
The extra padding line is to supercede padding (I assume) unintentionally
added by `.top-links a` to this widget on /help.
The border radius is a compromise between:
* Windows: no border radius on windows
* Mac: border radius top and bottom
* Ubuntu: border radius only on top
Ideally the image itself would just have border radius matching the OS, but
that's a bit tricky to do in the image editing software I'm using.
In this commit, I've added a feature to unstar all the starred
messages. This is useful, e.g., for folks who are using starred
messages to keep track of things they should come back when next at
their desktop.
The event flow is the standard one for a feature with a confirmation modal:
(1) User clicks on unstar all messages.
(2) We display a confirmation modal; if the user confirms, we send a
request to the backend to clear all starred messages.
(3) The events system sends that UI update back to us, removing the
stars from the UI.
Fixes#11401.
This commit deduplicates the code for `build_realm_logo_widget` and
`build_realm_night_logo_widget`. It deduplicates the common code for
`build_realm_day_mode_logo_widget` & `build_realm_night_mode_logo_widget`
into tthe function `build_realm_logo_widget`.
We no longer have an empty message_content div for
messages like this:
/me gets some coffee
This requires a minor change in how we compute the
position of the message for editing.
This is totally broken on master. If you "collapse" a /me
message, it adds the "More..." link without actually
hiding any content.
I have another branch related to collapse/condense that
will make this easier to resurrect.
Most elements, apart from chevrons, now have explicit
font sizes.
In some cases I chose integer values that were close
to the calculated values you would get with all the
ratio calculations.
And then I tweaked how the hashtag/lock icons get
aligned.
The alignment for those icons if off in this version; it'll be fixed
in an upcoming commit.
The fonts there used to be 14.2px due to an arcane
calculation. Now we explicity set a value.
If you expand Private Messages, the font inside now
is explicitly set to 13px. It used to be 12.8px due
to a complex calculation.
The previous commits made the "arrow" class no longer
necessary for these left sidebar elements.
The "arrow" class was always a bit dangerous, as bootstrap
has a class by the same name for a different concept.
We weren't really using consistent styling for "arrow"
across all our chevrons, so even without bootstrap in
play, it was just creating complexity.
This is a fairly big commit, but at the end
it simplifies a lot of things.
It's difficult to fix highly coupled code in
incremental steps because, well, it's highly
coupled code.
The main thing this does is give each type of
chevron in the left sidebar its own class
* all-messages-arrow (NEW)
* stream-sidebar-arrow
* topic-sidebar-arrow
Before this change, the "All messages" chevron
was using stream-sidebar-arrow, which was a
strange name for something that's not actually
in the stream sidebar. Obviously this was
cargo culted.
There was not much JS to change here--we just
fix the click handler for "All messsages".
And then there's a one-line change to the template,
and the rest is re-organizing the CSS.
Using a more specific class avoids confusion related
to the .arrow class, which is not only a popover concept,
but also a Zulip concept in the left sidebar.
The way we build chevrons is super messy and highly
coupled. This comment reflects an audit I did on the
code in its current state.
Subsequent commits will make things a bit easier to
understand.
The topic-sidebar-arrow chevron never shows
here--it was just cargo-culted code from
the topic lists.
It's also a landmine--we don't want to
accidentally build a topic-related sidebar
menu for PMs.
We could arguably just use zero-unreads everywhere,
but we definitely don't want zero-topic-unreads
inside our PM list.
I prefer to just have these two concepts:
zero-pm-unreads
zero-topic-unreads
And it's super easy to share CSS properties for both.
The antialiasing decisions we made for the webapp should be constant
over the entire page, not limited to particular subsections or themes.
If we wanted antialiasing, we should do it on the entire page, not
individual random widgets. But it's not clear we actually want to do
it on the entire page. The `-moz-osx-font-smoothing: grayscale`
setting now happens by default in OSX Mojave (40% world market share
right now and growing), so there's no reason to override it. And
without retina displays, generally, subpixel rendering provides better
results than antialiasing (which overrides subpixel rendering).
Thanks to Anders Kaseorg for advice on this issue.
When the user logs in as an admin, and clicks on the 'edit user'
button under the url path #organization/user-list-admin, the modal
that was displayed didn't contain the user's email address under the
list of information. This commit adds the email input as a readonly
element, which at the very least provides helpful confirmation that
you have the right user.
Fixes part of #11453.
The night logo synchronization on the settings page was perfect, but
the actual display logic had a few problems:
* We were including the realm_logo in context_processors, even though
it is only used in home.py.
* We used different variable names for the templating in navbar.html
than anywhere else the codebase.
* The behavior that the night logo would default to the day logo if
only one was uploaded was not correctly implemented for the navbar
position, either in the synchronization for updates code or the
logic in the navbar.html templates.
Add a background highlight to vote count button if currently
logged in user votes on that option.
Tweaked by tabbott to use better variable names and Rishi for better
styling.
This just puts the style more clearly that one shouldn't be using
`this` to refer to the outer MessageListview object, because that
breaks unexpectedly when inside a loop.
This is the real guts of how we render messages.
It only excludes the border effects, which we
leave in single_message.handlebars.
This is a pure code move, and should remove a lot of nesting that
would otherwise clutter one's view.
The bool `include_sender` will always be `true`
for status messages. Here is the relevant
excerpt from MLV:
message_container.status_message = // ...
message_container.include_sender = true;
We don't need the `include_sender` check in the template.
We could probably also fix the above code, but it's
semantically correct. I mostly care about simplifying
the template.
This is a pure code move. All three places where we use
this partial had the exact same markup, except one place
where I think `auto-select` was inadvertently left off.
This is a pretty coherent chunk of template code
related to these icons:
- edit pencil
- reactions
- chevron
- star
Moving it to a partial will simplify future diffs
where we re-work the message HTML.
This is a pure code move.
Some changes here:
* more whitespace
* avoid else, and just re-state the condition
* avoid long if blocks, just re-state the condition
* use standard `{{#if foo}}` construct
The refactoring of conditionals here will make more
sense in subsequent commits.
This is a pure data function, so it shouldn't be in popovers.js file
(Steve Howell added test coverage here, and tabbott removed an
accidental functional change.)
This fixes an issue where blank lines between blocks were causing
auto-numbering of list to stop before the blank line resulting
in two separate numbered list instead of one.
Edited significantly by tabbott to explain the tricky details in the
comments.
Fixes: #11651.
After discussion, we decided that the red color is too distinct
and does not convey the idea of "almost offline".
This changes the new "unavailable" status circle's color from dark
red to grey, the same color used by the "offline" status circle.
Fixes#11589.
Adds SCSS style for the "unavailable" user status and enables its
usage in `buddy_data.js`.
The style is a red circle with a horizontal line. The values might
look a bit 'magic' but they were considered carefully ` height` of
1px was too thin, 2px was too thick, thus 1.5px was chosen.
Fixing this involves fixing the backend to handle unchanged field
submissions of the Zoom credentials without trying to re-validate the
credentials (for performance) as well as to fetch the already-sent
secret.
Visually, #zoom_help_text acts like
.organization-settings-parent div:first-of-type when the Zoom option
is selected, but isn't treated as such.
No visual change with the #google_hangouts_domain change; just there to make
the code more readable/defensible.
If you topic-edited a single message within a narrow, we would update
all our unreads/sidebar/etc. data structures, and would rerender the
message if appropriate. However, for the corner case of being inside
a topic narrow when you did this, we didn't have logic to remove the
message from the narrow (which is the appropriate situation when you
just topic-edited a message in a narrow).
When topic-editing multiple messages including the currently selected
message (the more common case), we would end up changing the narrow,
resulting in this issue being masked.
Fixes#11601.
The correct behavior here is that we want to ensure there is
whitespace in between the syntax being added and the content on either
side. Our smart_insert logic handled this for the cases that were
common with inserting emoji (etc.), but didn't handle the more complex
cases with "quote and reply".
Fixes#11702.
Accomplished by adding a function to clear the status message with
an empty string. The html is then updated to reflect changes without a
refresh.
Currently, it's a small hassle to clear a status message. This option
makes things a bit easier.
Fixes#11630.
This new helper allows us to do the same operation
on every message in our message_store. We will
use this in a future commit to clear the `is_tall`
flags on all messages, after a resize.
We should be somewhat cautious about using this,
but simple operations should be really fast, even
if you have lots of messages in the store.
Previously, if you were in the process of editing the last message in
a narrow and a new message came in, we'd rerender that second-to-last
message, causing your editing widget to lose focus (and thus the next
few keys you typed to be interpreted as keyboard shortcuts, which
had a good chance of resulting in your navigating somewhere random).
This rerendering was essentially unnecessary; the only change to state
going into the rendering process was the next_is_same_sender CSS class
being toggled on the messagebox in the message. So, at most, we
should have been just toggling that CSS class (and this commit makes
us do precisely that).
It seems like we could further improve this code by just removing the
next_is_same_sender CSS class entirely and removing this block, but
I'm leaving that for follow-up work.
Fixes#11656.
This fixes an issue where closing stream search was not working if
user had not entered a search term and tried to close the search box
by clicking on the close icon; the problem was that we'd end up
re-opening the widget immediately after through event propagation.
Fixes: #11636.
The is_editable field includes topic edits, so we need a separate
field for whether to display these icons which are all for content
editing.
Fixes#11666.
Adblock Plus's "Block social media icons tracking" setting blocks
images with for social media platforms in their names from loading, so
we rename the Google logo to bypass this.
Adblock Plus's "Block social media icons tracking" setting blocked
integration logos for social media platforms from loading, so the logos
are renamed to bypass this.
Fixes#11590.
When copying a message by clicking on "copy and close" button in
message edit box an alert appears that says "Copied!"; Background
of the message is set corresponding with the day mode but not the
night mode. This changes the background of the alert message to
the dark color in night mode.
Also adds tests to ensure that we do not accidentally overwrite
the 'beginning' variable that contains the message content upto
that point. These should prevent similar errors in the future.
The bug was added in 8119258c4d.
The bug here was that when we rerendered messages following local echo
through the echo.process_from_server code path, the eventual call to
_rerender_header() made the implicit assumption that all messages in a
message group had the same date. As a result, it created a totally
new/fake message group and called the rendering logic on that group
without calling the functions for setting up recipient row dates,
which would always result in no recipient bar date being added. This
bug was latent/invisible before, because when introduced, the locally
echoed messages were always being added to a recipient group from
today, where the recipient bar's date area was by default empty anyway.
This latent bug was revealed when we modified the structure of the app
to do date dividers between individual messages within a message
group, rather than strictly between message groups.
When we're handling a single message that was locally echoed, there
will very likely be 0 messages not removed by
`echo.process_from_server`, and we can skip the unnecessary call to
`message_events.insert_new_messages`. This is a small performance
optimization and logical simplification when sending messages.
This commit achieves two things:
1. Changes the UI of the "Create stream" form to make the
textarea previously used to get the stream description
a simple input field of type text (to suggest a single
line description).
2. Adds an extra check on the frontend side to make sure that
when users create a new stream via. the "Create stream"
option in the settings panel, they can't enter any newline
characters (i.e. we disallow the enter key from being
registered when typing out the stream description).
We must also make sure that they cannot copy-and-paste over
descriptions containing newline characters.
resolves#11617
For consistency, we should keep all the code that works with
@mentions in markdown.js. In this case, message_list_view was
rewriting the contents of the mentions in cases where users'
names had been changed since we rendered their mention.
This change should help people discover to distinguish
silent mentions in text as a part of Zulip syntax while
differentiating them from regular mentions.
To test formatting we want a hard coded date, so we
can verify the date arithmetic with stable dates.
To make the test less brittle, we disable the
feature to remove old drafts.
This was an emergency fix. We should probably just
remove the last N drafts instead of having the 30-day
limit. Or we should have a better way to stub the cutoff
date.
The background color of the portico pages aren't true white,
so this commit adjusts it to match the actual portico page
background color to eliminate differences.
This is mostly adding markup, calling some convenient
functions in buddy_data.js, and adjusting CSS.
To make the circles update dynamically, I mostly
orchestrate this though activity.js for now. It's
possible we'll want to adjust that eventually to
happen through something like a `presence_events`
dispatcher, but that's essentially what
a good part of `activity.js` does now.
We're soon gonna have user circles in four different places,
and the fourth place, Private Messages, will have different
size/position CSS.
Now each component does positioning and sizing in its
main CSS file:
user info, group info -- popovers.scss
buddy list, group PMs -- right-sidebar.scss
(We also use the more explicit syntax for padding each
side.)
We now have a function get_user_circle_class
that returns one of these values:
"user_circle_green"
"user_circle_orange"
"user_circle_empty"
And we put that in the templates.
And then CSS renders the circle of the appropriate
color.
The unit tests now explicitly capture whether
we are rendering the correct kind of circle.
This is a pure code move.
We want to use user circles in the left sidebar,
so this code will no longer belong in
right-sidebar.scss.
This code is just related to drawing the circles.
We can still position in size in other CSS files
(with more context-specific selectors).
This fixes a longstanding UI issue when you have way too many recent
private message conversations, as you can now scroll down the list to
find what you're looking for.
Fixes#5384.
Date separator exists inside the message_row, which causes the
message controls to be visible even when hovering on date
separator. These two rules are redundant and cause this buggy
action. Other rules handle the behaviour of message controls
being visible on message box hover. Hence these can be removed.
Previously, if you scrolled down all the way in the left sidebar, and kept
your mouse hovered over a link, you had a feeling that there was still "more
stuff", since you could see the top of "Back to Zulip" peeking out over the
top of the URL Chrome (and maybe some other browsers) add in the bottom left
corner.
This just adds a bit of margin so that "Back to Zulip" is above that when
scrolled all the way down.
The function that was called here has no side
effects. If you don't use its value, it's just
wasted computation. The real action happens
in the subsequent calls to `rebuild_recent`.
Having it say "Clear" when you delete an existing status was a nice touch,
but it's confusing when you first open the modal and the text of the button
says "Clear".
I think the right medium-term solution here is for this modal to have "Save"
and "Cancel" buttons, and for there to be a small UI element in the user
popover itself that allows you to clear your current status.
We now use `fix_positions` to avoid cropping the emoji
picker. You can see cropping pretty easily on a short
screen if you click the smiley icon for reactions on a
message. It's a bit tricky to repro, since some
of the current top/bottom placements are correct, but
it's definitely reproducible.
I think there are opportunities to both simplify
and optimize `popovers.compute_placement`, so that it
plays nicer with `fix_positions`. For example, I would
bias it even more strongly toward favoring right/left
placement. But there are complicating factors--it is
also used by the hotspot code.
And I wanted to especially preserve the current
behavior when you launch the picker from the compose
box. That's one place where it looks pretty bad if
you select "right" instead of "bottom".
The fix_positions argument here fixes the horizontal
position of the stream popover.
It also fixes the vertical position, both in the default case, and
also doing an appropriate adjustment for the case that the color
picker is open.
This contains a few changes by tabbott to, rather than hiding the
arrow unconditionally, only do so when it would no longer point at the
right part of the screen.
Fixes#2374.
Fixes#6059.
Fixes#7290.
We use the `fix_positions` options every time
we launch a user popover, whether it is from
the message pane avatar or the buddy list
chevron.
For the message pane case, we can eliminate
some complexity related to trying to put
the menu above or below the avatar. We now
always suggest "right", and if there are
constraints due to being close to the edge
of the screen, the fix_positions code
will take care of it.
The patch to bootstrap will make the position smarter, but we still
want to preserve the 100px default vertical offset we chose for visual
reasons.
Tweaked by tabbott to preserve the visual design.
Changed <h5> to <p>, and removed the special formatting of
.empty_search_text to make this more in line with the formatting we
generally use with empty narrows.
This removes the left border extending the stream label from the
recipient bar in from the drafts in drafts modal. Those borders are
important in the message feed for containing several messages, but
here we're only ever going to show individual drafts, and this change
avoids potential color clashes with the blue box surrounding the
recipient blocks.