Commit Graph

62 Commits

Author SHA1 Message Date
Anders Kaseorg b474fa0e37 webpack: Generalize debug-require-webpack-plugin interface.
Now the caller simply imports the debug ‘require’ function as a
module, deciding for itself how to expose it and with what name (in
our case, we expose it as ‘require’ with expose-loader).  Also, remove
a stray console.log.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2020-02-25 14:01:06 -08:00
Steve Howell 9ab07d1038 util.js: Remove util from window.
We now treat util like a leaf module and
use "require" to import it everywhere it's used.

An earlier version of this commit moved
util into our "shared" library, but we
decided to wait on that.  Once we're ready
to do that, we should only need to do a
simple search/replace on various
require/zrequire statements plus a small
tweak to one of the custom linter checks.

It turns out we don't really need util.js
for our most immediate code-sharing goal,
which is to reuse our markdown code on
mobile.  There's a little bit of cleanup
still remaining to break the dependency,
but it's minor.

The util module still calls the global
blueslip module in one place, but that
code is about to be removed in the next
few commits.

I am pretty confident that once we start
sharing things like the typeahead code
more aggressively, we'll start having
dependencies on util.  The module is barely
more than 300 lines long, so we'll probably
just move the whole thing into shared
rather than break it apart.  Also, we
can continue to nibble away at the
cruftier parts of the module.
2020-02-15 12:20:20 -08:00
Vishnu KS 5bab2a3762 upload: Replace jQuery filedrop with Uppy. 2020-02-13 16:43:19 -08:00
Anders Kaseorg d7d8632525 pygments_data: Replace JS module with JSON module.
Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2020-02-12 10:09:12 -08:00
Anders Kaseorg e257253e64 emoji_codes: Replace JS module with JSON module.
webpack optimizes JSON modules using JSON.parse("{…}"), which is
faster than the normal JavaScript parser.

Update the backend to use emoji_codes.json too instead of the three
separate JSON files.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2020-02-12 10:09:12 -08:00
Anders Kaseorg ea9212a92d babel: Enable loose mode.
Due to try-catch deoptimization, Babel strict mode for…of loops run
about 5× slower in Firefox than Babel loose mode for…of, native
for…of, or forEach (which are all about the same speed).  Chrome
doesn’t seem to care.

For some reason we need to explicitly add the core-js Symbol polyfill
near the beginning of the common bundle.  Otherwise it gets loaded at
the wrong time and the Casper tests fail.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2020-02-05 11:52:52 -08:00
Steve Howell eeee6edf41 pm_list: Simplify redraws for Private Messages.
We now use vdom-ish techniques to track the
list items for the pm list.  When we go to update
the list, we only re-render nodes whose data
has changed, with two exceptions:

    - Obviously, the first time we do a full render.
    - If the keys for the items have changed (i.e.
      a new node has come in or the order has changed),
      we just re-render the whole list.

If the keys are the same since the last re-render, we
only re-render individual items if their data has
changed.

Most of the new code is in these two modules:

    - pm_list_dom.js
    - vdom.js

We remove all of the code in pm_list.js that is
related to updating DOM with unread counts.

For presence updates, we are now *never*
re-rendering the whole list, since presence
updates only change individual line items and
don't affect the keys.  Instead, we just update
any changed elements in place.

The main thing that makes this all work is the
`update` method in `vdom`, which is totally generic
and essentially does a few simple jobs:

    - detect if keys are different
    - just render the whole ul as needed
    - for items that change, do the appropriate
      jQuery to update the item in place

Note that this code seems to play nice with simplebar.

Also, this code continues to use templates to render
the individual list items.

FWIW this code isn't radically different than list_render,
but it's got some key differences:

    - There are fewer bells and whistles in this code.
      Some of the stuff that list_render does is overkill
      for the PM list.

    - This code detects data changes.

Note that the vdom scheme is agnostic about templates;
it simply requires the child nodes to provide a render
method.  (This is similar to list_render, which is also
technically agnostic about rendering, but which also
does use templates in most cases.)

These fixes are somewhat related to #13605, but we
haven't gotten a solid repro on that issue, and
the scrolling issues there may be orthogonal to the
redraws.  But having fewer moving parts here should
help, and we won't get the rug pulled out from under
us on every presence update.

There are two possible extensions to this that are
somewhat overlapping in nature, but can be done
one a time.

    * We can do a deeper vdom approach here that
      gets us away from templates, and just have
      nodes write to an AST.  I have this on another
      branch, but it might be overkill.

    * We can avoid some redraws by detecting where
      keys are moving up and down.  I'm not completely
      sure we need it for the PM list.

If this gets merged, we may want to try similar
things for the stream list, which also does a fairly
complicated mixture of big-hammer re-renders and
surgical updates-in-place (with custom code).

BTW we have 100% line coverage for vdom.js.
2020-01-30 13:11:32 -08:00
Steve Howell fa82d12525 topic list: Extract topic_list_data.js.
This is mostly for tactical reasons.  It's hard to
get 100% test coverage on topic_list.js, but it
should be easy to get 100% test coverage on this
very important function.

I considered just moving this code into topic_data.js,
but it just didn't feel quite right.  I feel like
this is a pretty core piece of code that's nice
to be by itself and not be near other complicated
code that does stuff like build widgets or talk
to servers.  (And, again, it's not just the actual
code here, which is pretty small, it's the unit
tests, which are inherently verbose to exercise
all the edge cases.)
2020-01-22 14:31:33 -08:00
Anders Kaseorg ea6934c26d dependencies: Remove WebSockets system for sending messages.
Zulip has had a small use of WebSockets (specifically, for the code
path of sending messages, via the webapp only) since ~2013.  We
originally added this use of WebSockets in the hope that the latency
benefits of doing so would allow us to avoid implementing a markdown
local echo; they were not.  Further, HTTP/2 may have eliminated the
latency difference we hoped to exploit by using WebSockets in any
case.

While we’d originally imagined using WebSockets for other endpoints,
there was never a good justification for moving more components to the
WebSockets system.

This WebSockets code path had a lot of downsides/complexity,
including:

* The messy hack involving constructing an emulated request object to
  hook into doing Django requests.
* The `message_senders` queue processor system, which increases RAM
  needs and must be provisioned independently from the rest of the
  server).
* A duplicate check_send_receive_time Nagios test specific to
  WebSockets.
* The requirement for users to have their firewalls/NATs allow
  WebSocket connections, and a setting to disable them for networks
  where WebSockets don’t work.
* Dependencies on the SockJS family of libraries, which has at times
  been poorly maintained, and periodically throws random JavaScript
  exceptions in our production environments without a deep enough
  traceback to effectively investigate.
* A total of about 1600 lines of our code related to the feature.
* Increased load on the Tornado system, especially around a Zulip
  server restart, and especially for large installations like
  zulipchat.com, resulting in extra delay before messages can be sent
  again.

As detailed in
https://github.com/zulip/zulip/pull/12862#issuecomment-536152397, it
appears that removing WebSockets moderately increases the time it
takes for the `send_message` API query to return from the server, but
does not significantly change the time between when a message is sent
and when it is received by clients.  We don’t understand the reason
for that change (suggesting the possibility of a measurement error),
and even if it is a real change, we consider that potential small
latency regression to be acceptable.

If we later want WebSockets, we’ll likely want to just use Django
Channels.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2020-01-14 22:34:00 -08:00
Steve Howell 4e59937632 js: Add IntDict class.
We don't use this yet, but we will soon.

We report errors if users pass in strings instead of
ints, but we try to still use the key.
2020-01-05 12:27:26 -08:00
Steve Howell ee3e488e02 js: Extract FoldDict class.
We have ~5 years of proof that we'll probably never
extend Dict with more options.

Breaking the classes into makes both a little faster
(no options to check), and we remove some options
in FoldDict that are never used (from/from_array).

A possible next step is to fine-tune the Dict to use
Map internally.

Note that the TypeScript types for FoldDict are now
more specific (requiring string keys).  Of course,
this isn't really enforced until we convert other
modules to TS.
2020-01-03 17:19:50 -08:00
Steve Howell a3512553a8 streams: Add LazySet for subscribers.
This defers O(N*S) operations, where

    N = number of streams
    S = number of subscribers per stream

In many cases we never do an O(N) operation on
a stream.  Exceptions include:

    - checking stream links from the compose box
    - editing a stream
    - adding members to a newly added stream

An operation that used to be O(N)--computing
the number of subscribers--is now O(1), and we
don't even pay O(N) on a one-time basis to
compute it (not counting the cost to build the
array from JSON, but we have to do that).
2019-12-30 09:47:55 -08:00
Anders Kaseorg fffef412bc dependencies: Upgrade to-markdown 3.1.1 to turndown 5.0.3.
Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-11-11 16:26:31 -08:00
Thomas Ip c93522d847 blueslip: Make stack trace more readable.
The stack trace popup is now sourcemapped and each stackframe have a
expandable code context window.

[anders@zulipchat.com: Rebased and simplified.]
2019-10-31 13:47:54 -07:00
Anders Kaseorg 2bbcd6ab34 bundles: Factor out portico bundle.
This adds translations.js to the digest entrypoint.  Presumably that’s
fine.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-10-28 15:53:15 -07:00
Anders Kaseorg 27fac76da8 styles: Move media queries into the files they override.
Webpack code splitting will make the inclusion order of CSS files less
obvious, and we need to guarantee that these rules follow the rules
they override.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-10-28 15:39:17 -07:00
Anders Kaseorg a3475b422d typing_status: Convert to ES6 module.
Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-10-17 16:48:23 -07:00
Anders Kaseorg dea6889956 templates: Make the Loading… message more robust.
Don’t hide it until both CSS and JS have loaded.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-09-20 10:34:44 -07:00
Anders Kaseorg 7494f1600c templates: Move page_params from an inline script to the <body> dataset.
This sidesteps tricky escaping issues, and will make it easier to
build a strict Content-Security-Policy.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-09-17 16:06:33 -07:00
Wyatt Hoodes f623540409 data export: Add UI to trigger data export.
This commit serves as the frontend piece for the "public export"
webapp feature.

Fixes: #11930
2019-08-12 18:21:38 -07:00
Tim Abbott 97b256d1f0 css: Extract rendered_markdown.scss.
This moves our main CSS for rendered Zulip message content into an
external file, which may be reusable but in any case should make it
easier to find this content.
2019-07-31 12:08:17 -07:00
Anders Kaseorg f54a63e2f9 webpack: Transpile JS code with Babel.
Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-07-22 17:55:32 -07:00
Vinit Singh 86073588be dependencies: Upgrade jquery-autosize 1.17.7 to autosize 4.0.2.
The API for the autosize library changed upstream, so several changes
had to be made to relevant js files for a successful upgrade.

Resolves #12695.
2019-07-18 14:33:16 -07:00
Anders Kaseorg ab89f40a66 generate-custom-icon-webfont: Replace with webpack webfonts-loader.
Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-07-18 12:00:00 -07:00
Anders Kaseorg 218c60ae86 third: Upgrade spectrum-colorpicker to 1.8.0 from NPM.
We had several patches to spectrum, but the only essential one 
(0ea770fc18) had already been fixed upstream,
and another was just handling jQuery deprecation warnings for not yet removed features.

See #12749 for details.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-07-10 10:07:34 -07:00
Anders Kaseorg 9f08513acb bundles: Rename commons.js to common.js.
Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-07-03 15:03:22 -07:00
Anders Kaseorg b0be0d5285 settings_account: Use webpack asynchronous require to load zxcvbn.
Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-07-02 16:50:03 -07:00
Anders Kaseorg f346d0e511 dependencies: Use core-js for String.prototype polyfills.
It seems like the de facto standard ES polyfill library these days,
and we already depend on it through simplebar.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-07-02 16:50:03 -07:00
Anders Kaseorg 05663aa3fa webpack: Rectify "common" bundle with bundles/commons.js.
Moving bootstrap-typeahead from bundles/commons.js to bundles/app.js
and csrf.js from bundles/app.js to bundles/commons.js makes
bundles/commons.js equivalent to the "common" bundle, so we can
replace the latter with the former.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-07-02 16:38:26 -07:00
Anders Kaseorg 1b94733953 webpack: Remove resolve.modules override.
The minimal syntactic sugar it might provide isn’t worth the
unexpected side effects (including side effects on third party
modules).

For now, we allow zrequire to emulate the previous syntax in the Node
test suite, even though stealing part of the NPM namespace is
confusing.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-07-02 16:38:26 -07:00
Thomas Ip 8c199fd44c webpack: Use handlebars-loader to handle frontend templates.
And remove the compile-handlebars-templates system.
2019-07-02 16:23:29 -07:00
Anders Kaseorg d8ed1d4553 third: Remove FormData polyfill.
It has no effect in our supported browsers including IE11.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-07-02 15:04:58 -07:00
Anders Kaseorg 438c7c46ed third: Get jquery-caret-plugin from NPM.
Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-07-02 15:04:58 -07:00
Anders Kaseorg 1647582acf third: Get jquery-autosize from NPM.
Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-07-02 15:04:58 -07:00
Anders Kaseorg 23cd064c86 webpack: Elide node_modules when importing JS modules.
Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-06-26 16:49:32 -07:00
Anders Kaseorg 141088586b Completely replace perfect-scrollbar with SimpleBar.
perfect-scrollbar replaces both the appearance and the behavior of the
scrollbar, and its emulated behavior will never feel native on most
platforms.  SimpleBar customizes the appearance while preserving the
native behavior.

Signed-off-by: Anders Kaseorg <andersk@mit.edu>
2019-05-17 12:06:51 -07:00
Yashashvi Dave 3649a9f15c subs: Add `stream_ui_updates.js` module for managing ui elements.
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).
2019-04-30 14:36:52 -07:00
Priyank Patel 8a15b9ee87 Revert "user-profiles: Lazy load profile pictures when in view."
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.
2019-04-12 16:50:37 -07:00
Priyank Patel 6441ad0677 user-profiles: Lazy load profile pictures when in view.
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.
2019-04-05 15:51:02 -07:00
Thomas Ip a2872c107e typescript: Move TS files into JS directory.
This is just a code reorganization to avoid making it difficult to
find things as we migrate more file to TypeScript.
2019-03-25 12:11:37 -07:00
Thomas Ip 7d050ab0cf typescript: Migrate dict.js to typescript. 2019-03-21 10:48:44 -07:00
Steve Howell 3c8c2abd99 css: Split out user_circles.scss.
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).
2019-02-18 14:22:37 -08:00
Steve Howell a964977960 user status: Add ability to edit status text. 2019-01-29 10:27:49 -08:00
Steve Howell 1cbcb06157 ui: Extract feedback_widget module. 2019-01-04 10:54:07 -08:00
Steve Howell d8d703af45 frontend: Add basic user_status module.
So far this processes page_params, but it's otherwise
an unused internal API.
2019-01-02 09:16:31 -08:00
Joshua Pan ad1df0ebeb settings: Add support for customizing the top-left logo.
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.
2018-12-18 12:44:52 -08:00
Tim Abbott 12b3e79661 settings: Rename "settings_filters" to "settings_linkifiers".
This makes the JS codebase match the UI for how to describe this
feature.  No user-facing effect.
2018-12-17 12:28:55 -08:00
Steve Howell 7a44d99b96 settings: Eliminate admin_sections module.
We move all of its logic into settings_sections.

Note that this is slightly more than a refactor.
We are slightly more aggressive about resetting
sections.  For example, if you go into Settings,
then exit the overlay, then go into Manage
Organization, we will now reset sections for both
groups.
2018-12-17 10:13:20 -08:00
Tim Abbott cb9b526f0c third: Extract bootstrap typeahead to its own module.
Bootstrap's typeahead is the main part of the project that we've
forked, and moving it to its own module should help unlock our ability
to upgrade bootstrap itself.
2018-12-17 09:06:52 -08:00
Tim Abbott 7485cb2a50 widgets: Rename voting_widget to poll_widget.
This ensures greater consistency with our other widgets' naming
convention.
2018-12-16 19:46:48 -08:00