The following elements in the top left corner
are major components of our app:
All messages
Private messages
Starred messages
Mentions
We can now find them directly:
$('.top_left_all_messages')
$('.top_left_private_messages')
$('.top_left_starred_messages')
$('.top_left_mentions')
Before this, we had to build up complicated selectors
like below:
exports.get_global_filter_li = function (filter_name) {
var selector = "#global_filters li[data-name='"
+ filter_name + "']";
return $(selector);
};
I don't think any newbie would know to grep for "global_filter",
and I've seen a PR where somebody added specific markup here
to "Private messages" because they couldn't grok the old scheme.
Another thing to note is that we still have a "home-link"
class for "All messages", which overlapped with portico
code that had the same name. (There were some inaccurate
comments in the code relating to the tab bar, but we don't
actually have a way to click to the home view in the tab
bar any more.) I'll eliminate that cruft in another commit.
For this commit the four elements still have the
"global-filter" class, since there's some benefit to being
able to style them all as a group, although we should give
it a nicer name in a subsequent commit.
Most of this PR is basic search/replace, but I did add a
two-line helper: `top_left_corner.update_starred_count`
User was able to click delete button multiple time which could cause
multiple delete requests. This commit disables and hides the delete
message button after the first click and shows a spinner until http
the delete request responds.
Also adds a casperjs test to ensure that spinner becomes visible and
delete button becomes invisible after clicking on delete button for
first time and hides spinner and show delete buttton when message is
deleted.
Fixes: #11219.
This reverts the temporary fix done in commit
46f4e58782 and replaced it with the fix that
non-admins should be able to see a dropdown to select a non-admin type of
invited user i.e. normal member or guest user.
Since we have already added the `invite_as` field to models, we can now
replace usage of `invite_as_admin` properly with its equivalent `invite_as
== PreregistrationUser.INVITE_AS['REALM_ADMIN']`.
Hence, also removed now redundant `invite_as`.
This adds a new realm_logo field, which is a horizontal-format logo to
be displayed in the top-left corner of the webapp, and any other
places where we might want a wide-format branding of the organization.
Tweaked significantly by tabbott to rebase, fix styling, etc.
Fixing the styling of this feature's loading indicator caused me to
notice the loading indicator for the realm_icon feature was also ugly,
so I fixed that too.
Fixes#7995.
The stream/topic edit areas now have these ids:
#stream_message_recipient_stream
#stream_message_recipient_topic
They are pretty verbose, but being able to grep
for these without noise does have some value.
If you go to "Manage streams" in the gear menu,
it's now a direct link to '#streams/subscribed'
instead of just '#streams'. This makes our
back button behavior more predictable.
This correctly shows guest users that they cannot interact with
anything in the "Organization" tab, though we preserve the read-only
access to it so that they can (e.g.) browse the organization's custom
emoji.
Also adds relevant tests and documentation. We currently
do not narrow to a new topic, and instead just narrow to
the stream. Similarly, we do not narrow to a PM if any of
the recipients are invalid.
Add a lock icon to the right of tabs on which nothing is editable
for normal users. Add lock next to Custom emoji option if only admin
can edit them.
Tweaked by tabbott to use title for the lock icons, rather than
aria-hidden, since they do convey useful information.
Fixes: #10893.
Previously, messages were a string of disconnected regions. Modeling them as a list brings several benefits:
* Quickly jump to the message list by using a screen reader's list navigation hotkey.
* Quickly jump between messages by using a screen reader's list item navigation hotkey.
* Quickly jump to the beginning or end of message lists in screen readers that support it.
Use CSS to display a `+` button on mobile but keep the more verbose
buttons on desktop. In the future, this button will be used to display
a popop for a new message.
* Eliminate unnecessary div element wrapping around the icon and
change jQuery selectors accordingly
* Set initial position through CSS instead of JS
* Set color to inherit to prevent night mode issues.
Fixes#9803.
The compose box closes on any click in the document outside the compose
box except for an element with an anchor tag or in its parents.
This commit adds an anchor tag as parent of the keyboard shortcuts
icon.
We add a padded div to our container for the buddy
list to give scrolling the illusion that we've
rendered every list item, while still letting
the browser do the heavy lifting instead of trying
to fake it out too much.
This new div allows us to split out two concerns:
semantic list of items - remains in #user_presences
widget real estate - controlled by new #buddy_list_wrapper
We will use this for progressive rendering. We want to add
padding to the buddy list without messing with the integrity
of the actual HTML '<ul>' list. (One ugly alternative would
have been to add a dummy list item, which be a pitfall for
any code traversing the list.)
Basically, all the code relating to click handlers and similar
things was left alone. We only change js/css related to
scrolling, resizing, and overflow.
Following points have been implemented in this commit:
1.) Add search pill on selecting typeahead.
2.) Re-narrow after removing a search pill.
3.) Add quiet optional parameter to removeLastPill.
4.) Pre populate search pills in narrow.activate.
5.) Clear existing search pills on narrow.deactivate.
Description of above points:
1.) I tried out using the description from suggestions.lookup_table
to append a pill using appendValidatedData so that the description
had not to be calculated again. But the description in the suggestions
lookup contains html due to highlighting. This html is escaped when
inputed in a pill. An attempt was also made to remove the higlighting
by replacing the tags. But other espaced characters like < also
popped up, so it was better to use append_search_string.
3.) If one wants to refresh the pill using pill.clear and wants to
repopulate them, evaluating the event_handler associated with the
action of removing the pill may not be desired.
4.) Pill population code is added to narrow.activate. Pills are not
populated if the narrow was triggered by search as search handles the
addition and removal of pill by itself. The reason for not handling
search too in narrow.activate is to avoid clearing the pills and
repopulating them. Example of some of the triggers for narrow.activate
include `restore draft`, `topic change`,`sidebar`.
Also modifies tests for search.js
Input pills require a contenteditable div with a class named input
to fall inside the pill container. On converting the input tag into
a div, the size of the input decreases which is compensated by a
line-height of 40px. Comment above letter-spacing:normal was removed
as chrome and firefox do not change the letter-spacing to normal
for a div via the default browser stylesheet.
NOTE: Currently writing something into the div will call the action
corresponding to that key in the keyboard shortcuts. The input will
work fine once the pills have been initiated.
For the casper tests, for now, we just use the legacy search code.
When we change that, $.val() cannot be used on contenteditable div, so
$.html() will need to be used instead in select_item_via_typeahead.
<script charset=…>, <script type=…>, and <style type=…> are “obsolete
but conforming” in HTML5. They make the validator.nu output noisier
and real problems a little harder to find.
(type was required in HTML 4, which is not relevant to us.)
Signed-off-by: Anders Kaseorg <andersk@mit.edu>
Otherwise validator.nu warns about the empty header tags. The
placeholder text is replaced by JavaScript.
Signed-off-by: Anders Kaseorg <andersk@mit.edu>
These must refer to the id of an existing form control; id_username
doesn’t exist and streams_to_add isn’t a form control.
Signed-off-by: Anders Kaseorg <andersk@mit.edu>
xmlns:svg is an XML namespace declaration that would be valid in XHTML
but not in HTML. Even in XHTML, it wouldn’t be necessary because we
don’t write SVG tags prefixed like <svg:circle>, only unprefixed like
<circle>.
Signed-off-by: Anders Kaseorg <andersk@mit.edu>
This commit moves all files previously under the 'app' bundle in
the Django pipeline to being compiled by webpack under the 'app'
entry point. In the process, it moves assets under the app entry
to a file called app.js that consumes all relevant css and js files.
This commit also edits the webpack config to be able to expose certain
variables for third party libraries that are currently required by
some modules. This is bad coding form and should be refactored to
requiring whatever dependencies a module may have; we're just
deferring that to the future to simplify the series of transitions we
need to do here. The variable exposure is done using expose-loader in
webpack.
The app/index.html template is edited to override the newly introduced
'commonjs' block in the base template. This is done as a temporary
measure so as not to disrupt other pages on the app during the transition.
It also fixes the value of the 'this' context that was being inferred
as window by third party libraries. This is done using imports-loader
in the webpack config. This is also messy and probably isn't how we
want things to work long term.
The list with the options for normal settings now has
the class normal-settings-list.
The list with the options for org settings now has
the class org-settings-list.
The new markup helps us avoid code like this:
$(".settings-list li:not(.admin)")
We also have funny hacks in our key handlers related
to the old combined-list approach, which we can
eventually eliminate.
I guess we used to have a way to logout from within
settings, but the list item was always hidden when you
went into settings, so it's apparently just dead code,
and it's kind of a strange thing to have in settings.
Makes the i18n strings in this file much easier to translate by splitting
them into smaller chunks (which avoids having a lot of code in the tagged
strings), and adds a string that was missing as well.
Fixes#9433.
Extra bottom margin was observed when using `compose_error` which
was caused by paragraphs in bootstrap having a bottom margin of 10px.
The paragraph tag has been replaced by a span tag.
Fixes#9182. Adds a link to the keyboard shortcuts popup at the
bottom-right corner of the right sidebar. A tooltip saying
`Keyboard Shortcuts(?)` has been added to the icon. The icon is
positioned using `position: fixed`.
This commit transitions all styles in app.css in the Django pipeline
to being compiled by webpack in an app-styles bundle, and renames the
various files to now be processed as SCSS.
To implement this transition, we move the old CSS file refernces in
settings.py and replace them with a bundle declared in
`webpack.assets.json` and includedn in the index.html template
Tweaked by tabbott to keep the list of files in `app.css` in
`webpack.assets.json`, and to preserve the ordering from the old
`settings.py`.
We haven't seen significant traffic from the legacy desktop app in
over a year, and users using it get a warning to upgrade since last
summer, so it's probably OK to stop providing special fonts for it.
We use the attrs property provided by render_bundle function of
django-webpack-loader to add `nonce="<csp_nonce_val_here>" to
js scripts being rendered by webpack.
This should make it easier to find the templates that are actually
part of the core webapp, instead of having them all mixed together
with the portico pages.
Steve Howell
Rishi Gupta
Mohit Gupta
Shubham Jadon
Shubham Dhama
Joshua Pan
Vishnu Ks
Tim Abbott
Rohitt Vashishtha
varunvaruns9
Nolan Darilek
Yashashvi Dave
Marco Burstein
Cynthia Lin
Pragati Agrawal
Harshit Bansal
Shubham Padia
Anders Kaseorg
Aditya Bansal
Armaan Ahluwalia
Eeshan Garg
Anupam Dagar
Yago González
Aastha Gupta