Commit Graph

45 Commits

Author SHA1 Message Date
Sahil Batra 998d710275 frontend: Add new user_settings module for user's settings.
We add a new user_settings module similar to page_params
module in frontend and use it to access user's personal
settings instead of page_params.
2021-08-01 15:30:17 -07:00
Steve Howell 842b14b916 layout: Introduce a #compose-content div.
This should make it more intuitive to add
new elements to the compose box (such as
banners), and it also makes it a bit more
clear for styling purposes that the same
geometry happens whether the compose box
is open or the buttons are visible.

I lifted the #compose_container div into
the server template.  It's not totally
clear to me why we need both #compose
and #compose_container, but there are
some scary comments about 1400px that
made me too timid to address that quirk.

In passing I removed a clearly redundant
click handler.
2021-06-10 11:22:05 -07:00
Tim Abbott 3e8ec76aa0 css: Slightly increase size of left sidebar. 2021-04-30 16:02:31 -07:00
Tim Abbott ed6d5dcf36 css: Extract variables for the widths of the sidebars. 2021-04-30 16:02:31 -07:00
Anders Kaseorg 38ffd47b90 js: Convert static/js/page_params.js to ES6 module.
Signed-off-by: Anders Kaseorg <anders@zulip.com>
2021-03-26 10:17:56 -07:00
Gaurav Pandey dea5245590 right-sidebar: Fix design bugs with keyboard-shortcuts.
The keyboard-shortcuts icon currently has a fix position
causing design related bugs such as overlapping with userlist
in the sidebar.

The fix wraps the invite-more-users link and keyboard icon inside
a div with display property as flex instead of just using the anchor
tags inside the side-bar items.
2021-03-22 19:29:46 -07:00
Anders Kaseorg ea9ca6b7d0 js: Use jQuery as a module.
Signed-off-by: Anders Kaseorg <anders@zulip.com>
2021-03-12 10:08:25 -08:00
Anders Kaseorg fb93be0d94 js: Convert static/js/scroll_bar.js to ES6 module.
Signed-off-by: Anders Kaseorg <anders@zulip.com>
2021-02-28 14:23:00 -08:00
Anders Kaseorg d679aa015d scroll_bar: Flip max-width queries for min-width.
Signed-off-by: Anders Kaseorg <anders@zulip.com>
2021-02-05 09:23:59 -08:00
Anders Kaseorg 1a148f5d9a scroll_bar: Fix incorrectly converted breakpoint.
Commit e941ee4a15 (#16680) incorrectly
converted this from 775px to xl-max = 1199px instead of md-max =
767px, causing misplacement of the FRB for browser widths between
these values.

Signed-off-by: Anders Kaseorg <anders@zulip.com>
2021-01-27 10:32:45 -08:00
Aman Agrawal f8aea9aecb postcss_vars: Use underscore to follow better naming convention. 2021-01-25 14:49:32 -08:00
Aman Agrawal e941ee4a15 media_query: Use 767px instead of 775px as md breakpoint.
We use 767px for hiding left column.

The components changed here were tested to be working fine.

This change is not likely to introduce any regression as the
calculations in the components here were not dependent upon the
breakpoint being at 775px.
2021-01-25 14:49:32 -08:00
Aman Agrawal 5a8150e34b media_query: Use 1199px instead of 1165px as xl breakpoint.
We use 1199px for hiding right column.

The components changed here were tested to be working fine.

This change is not likely to introduce any regression as the
calculations in the components here were not dependent upon the
breakpoint being at 1165px.
2021-01-25 14:49:32 -08:00
Anders Kaseorg 72d6ff3c3b docs: Fix more capitalization issues.
Signed-off-by: Anders Kaseorg <anders@zulip.com>
2020-10-23 11:46:55 -07:00
Anders Kaseorg 62dfee4930 eslint: Fix unicorn/prefer-node-append and unicorn/prefer-node-remove.
https://github.com/sindresorhus/eslint-plugin-unicorn/blob/master/docs/rules/prefer-node-append.md
https://github.com/sindresorhus/eslint-plugin-unicorn/blob/master/docs/rules/prefer-node-remove.md

Signed-off-by: Anders Kaseorg <anders@zulip.com>
2020-10-07 16:00:33 -07:00
Anders Kaseorg 6ec808b8df js: Add "use strict" directive to CommonJS files.
ES and TypeScript modules are strict by default and don’t need this
directive.  ESLint will remind us to add it to new CommonJS files and
remove it from ES and TypeScript modules.

Signed-off-by: Anders Kaseorg <anders@zulip.com>
2020-07-31 22:09:46 -07:00
Anders Kaseorg b65d2e063d js: Reformat with Prettier.
Signed-off-by: Anders Kaseorg <anders@zulip.com>
2020-07-17 14:31:25 -07:00
Anders Kaseorg f3726db89a js: Normalize strings to double quotes.
Prettier would do this anyway, but it’s separated out for a more
reviewable diff.  Generated by ESLint.

Signed-off-by: Anders Kaseorg <anders@zulip.com>
2020-07-17 14:31:24 -07:00
Anders Kaseorg 28f3dfa284 js: Automatically convert var to let and const in most files.
This commit was originally automatically generated using `tools/lint
--only=eslint --fix`.  It was then modified by tabbott to contain only
changes to a set of files that are unlikely to result in significant
merge conflicts with any open pull request, excluding about 20 files.
His plan is to merge the remaining changes with more precise care,
potentially involving merging parts of conflicting pull requests
before running the `eslint --fix` operation.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-11-03 12:42:39 -08:00
Anders Kaseorg d17b577d0c js: Purge useless IIFEs.
With webpack, variables declared in each file are already file-local
(Global variables need to be explicitly exported), so these IIFEs are
no longer needed.

Signed-off-by: Anders Kaseorg <andersk@mit.edu>
2019-10-25 13:51:21 -07:00
Anders Kaseorg becef760bf cleanup: Delete leading newlines.
Previous cleanups (mostly the removals of Python __future__ imports)
were done in a way that introduced leading newlines.  Delete leading
newlines from all files, except static/assets/zulip-emoji/NOTICE,
which is a verbatim copy of the Apache 2.0 license.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-08-06 23:29:11 -07:00
Tyler B. Thrailkill 85c7eba3f9 css: Call set_layout_width even if the sbwidth is 0.
Historically, the logic that was extracted into set_layout_width only
did something on non-macOS platforms, where sbwidth != 0
(i.e. scrollbars have nonzero width).

However, with the addition of the fluid layout width option, that
function does something if either sbwidth != 0 OR fluid_layout_width
is enabled.  At that point, we should just call that function
unconditionally.
2019-07-02 15:47:03 -07:00
YashRE42 8fe86e5e24 tooltips: Fix alignment with keyboard-icon. 2019-06-24 12:57:52 -07:00
Anders Kaseorg 01613e71fb ui: Replace set_up_scrollbar with data-simplebar attribute.
With perfectScrollbar, we needed to call a function from JavaScript to
enable a scrollbar on a new element, but simplebar has a much simpler
default API one can do by using data-simplebar attributes in the HTML.

So we can delete all the scrollbar creation/deletion code.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-05-19 18:06:38 -07:00
Tim Abbott 243db9a22f css: Fix width calculations for fluid width.
Apparently, while b38ae6e0ed was correct
for the default Zulip UI, it was not correct for the fluid width case,
where we did actually want to override the 1400px width rule for the
non-fixed `.app-main` element.

The right fix here is to add an additional CSS rule tweak to our
scrollbar logic.  This has been carefully tested with both initial
setting states as well as toggling the state.
2019-05-13 11:27:00 -07:00
Tim Abbott b38ae6e0ed scrollbar: Fix incorrect CSS selector.
In a838de63d8, we incorrectly changed
the selector for accessing .fixed-app .app-main to just be .app-main,
which resulted in it affecting parts of the site it should not have.

The end result was a significant layout regression of the floating
recipient bar at some widths.
2019-05-10 11:45:46 -07:00
Tim Abbott 349c6f972b scroll_bar: Calculate the scrollbar width only once.
We wouldn't do it often in any case, but this is a cleaner workflow in
case a future design has us call these size adjustment functions more
often.
2019-05-10 11:44:27 -07:00
Tim Abbott abae98a901 css: Add detailed comment explaining our 1400px max-width.
The reference to this being overriding in scroll_bar.js and how it
causes flashes is valuable.
2019-05-09 14:07:27 -07:00
Pragati Agrawal a838de63d8 settings: Add option for fixed/fluid width.
This adds a new option for "fluid width" under `Display settings` section
of SETTINGS/DISPLAY SETTINGS tab.

Fixes: #11844.
2019-05-09 13:57:57 -07:00
Rishi Gupta 5774300364 right sidebar: Change media cut-off for where we hide the buddy list.
This was last changed in 88951d6 from 975 to 1025, but I think that wasn't
quite aggressive enough.
2018-09-27 07:29:32 -04:00
Cynthia Lin 1ab4d08258 right-sidebar: Improve keyboard shortcuts icon styling.
* 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.
2018-08-31 13:36:17 -07:00
Armaan Ahluwalia 6d255efe4c app: Prepare JS files for consumption by webpack.
This commit prepares the frontend code to be consumed by webpack.

It is a hack: In theory, modules should be declaring and importing the
modules they depend on and the globals they expose directly.

However, that requires significant per-module work, which we don't
really want to block moving our toolchain to webpack on.

So we expose the modules by setting window.varName = varName; as
needed in the js files.
2018-07-05 10:53:36 +02:00
Shubham Dhama 9387efc399 scroll_bar: Initialize scroll_bar in ui_init.js.
This will help in making the order of ui modules initialization
more explicit and clear.
2018-06-20 07:38:22 -04:00
Shubham Dhama 80a2d5bc59 eslint: Enable `conditionalAssign` config of no-trailing-spaces rule. 2018-06-11 07:51:24 -04:00
Shubham Dhama dcb6254a4e eslint: Enable `no-extra-parens` rule.
Following sub-configuration is disabled:
                "nestedBinaryExpressions": false,
2018-06-11 07:51:24 -04:00
Shubham Padia 9ad292cf2a right-sidebar: Add keyboard instructions shortcut in bottom-right corner.
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`.
2018-05-16 13:32:42 -07:00
Tim Abbott 7ab8a8e820 js: Fix a bunch of indentation issues found by eslint.
This is preparation for enabling an eslint indentation configuration.
90% of these changes are just fixes for indentation errors that have
snuck into the codebase over the years; the others are more
significant reformatting to make eslint happy (that are not otherwise
actually improvements).

The one area that we do not attempt to work on here is the
"switch/case" indentation.
2018-05-06 16:25:02 -07:00
Tim Abbott 88951d627a viewport: Hide right-sidebar buddy list below 1024px.
This is a slight change in the responsive design, moving the 975px
cutoff to 1025px; the main effect is that for windows that just barely
had a right sidebar, we now hide the ride sidebar.  This is pretty
beneficial for the user experience specifically in the common size of
1024px, where that sidebar was making things feel a bit too
constrained.
2018-04-26 14:33:28 -07:00
gooca a50054bdc1 Refactor perfect-scrollbar: Call ui methods in scroll_bar.js. 2018-03-16 12:47:46 -07:00
Brock Whittaker 09be694ea3 Rewrite scrollbar width check to not use jQuery.
This check was going to do the wrong thing when we upgraded to jQuery 3.
2017-08-22 12:50:54 -07:00
Brock Whittaker d01549e8e3 Fix outerHeight to OR with 0 to not produce NaN.
This is an issue where in jQuery v3 the result of outerHeight on a node
that doesn’t exist is now “undefined” rather than “null”, which means
it will no longer cast to a Number but rather NaN. For this, we create
the safeOuterHeight and safeOuterWidth functions to safely return a
result (or 0).

This is a better solution than manually going to each instance and
ORing it with 0 for type safety.

https://stackoverflow.com/questions/41454285/jquery-outerheight-returns-
undefined-instead-of-null
2017-07-27 14:16:57 -07:00
Rafid Aslam 4f482834b4 deps: Upgrade and move `perfect-scrollbar` from `static/third` to `npm`.
- Remove `perfect-scrollbar` from `static/third` and fetch it from npm.
- Upgrade `perfect-scrollbar` to 0.7.1.
- Bump up the `PROVISION_VERSION` to 5.6.

Changed `wheelSpeed` in "static/js/scroll_bar.js" to 0.5, because when it
20, the scrollbar scrolls very fast.

Changed 'wheelSpeed' in "static/js/emoji_picker.js" from 25 to 0.68
(based on tabbott's testing of scrolling through the emoji list).

Part of #1709.
2017-06-11 10:15:48 -07:00
Tim Abbott 998dff9e50 lint: Add dangling commas in JavaScript objects. 2017-01-11 15:23:42 -08:00
AZtheAsian 5e9918135b eslint: change quote-props from off to error and fix violations. 2016-12-02 18:35:53 -08:00
Steve Howell 84b59d4335 Created scroll_bar.js (with code taken from ui.js).
(imported from commit 0c4e8538031ceb1a0f50eea9a34e315e23e7d9ff)
2014-03-14 20:48:56 -04:00