Commit Graph

48 Commits (a9a063c0e983c5643178428327ca9907558c1f68)

Author SHA1 Message Date
Mélanie Chauvel (ariasuni) 1fb92037e4
Improve toot clicking areas (#13327)
* Make the area to the left “Show Thread” also expand the toot in Web UI

* Clicking the left part of a conversation with the avatars now opens it in Web UI
2020-03-31 19:40:23 +02:00
Matt Panaro 31f7c3fc5d Summary: fix slowness due to layout thrashing when reloading a large … (#12661)
* Summary: fix slowness due to layout thrashing when reloading a large set of status updates

in order to limit the maximum size of a status in a list view (e.g. the home timeline), so as to avoid having to scroll all the way through an abnormally large status update (see https://github.com/tootsuite/mastodon/pull/8205), the following steps are taken:
•the element containing the status is rendered in the browser
•its height is calculated, to determine if it exceeds the maximum height threshold.
Unfortunately for performance, these steps are carried out in the componentDidMount(/Update) method, which also performs style modifications on the element.  The combination of  height request and style modification during javascript evaluation in the browser leads to layout-thrashing, where the elements are repeatedly re-laid-out (see https://developers.google.com/web/fundamentals/performance/rendering/avoid-large-complex-layouts-and-layout-thrashing & https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Performance_best_practices_for_Firefox_fe_engineers).
The solution implemented here is to memoize the collapsed state in Redux the first time the status is seen (e.g. when fetched as part of a small batch, to populate the home timeline) , so that on subsequent re-renders, the value can be queried, rather than recalculated.  This strategy is derived from https://github.com/tootsuite/mastodon/pull/4439 & https://github.com/tootsuite/mastodon/pull/4909, and should resolve https://github.com/tootsuite/mastodon/issues/12455.

Andrew Lin (https://github.com/onethreeseven) is thanked for his assistance in root cause analysis and solution brainstorming

* remove getSnapshotBeforeUpdate from status

* remove componentWillUnmount from status

* persist last-intersected status update and restore when ScrollableList is restored

e.g. when navigating from home-timeline to a status conversational  thread and <Back again

* cache currently-viewing status id to avoid calling redux with identical value

* refactor collapse toggle to pass explicit boolean
2019-12-29 05:39:48 +01:00
BSKY fccf83e1f2 Add noopener and/or noreferrer (#12202) 2019-10-24 22:44:42 +02:00
Eugen Rochko 538db85d3c
Remove `lang` attribute from individual statuses (#12124)
Fix #10930
2019-10-09 03:45:05 +02:00
ThibG 37f612074e Fix items in StatusContent render list not all having a key (#11645) 2019-08-23 21:02:59 +02:00
ThibG fd01043691 Fix “read more” button behing hidden (regression from #11404) (#11522)
* Fix “read more” button behing hidden (regression from #11404)

This has the side-effect of putting the “Read more” button below possibly
trunctated polls instead of putting the poll below the “Read more”

* Remove dead code
2019-08-08 17:05:50 +02:00
Eugen Rochko 5e35aa8280
Fix non-lowercase hashtags not being picked up by the streaming API (#11508)
Regression from f371b32

Fix hashtag links always being lowercase
2019-08-07 10:01:19 +02:00
Eugen Rochko 1d8d553d8b
Revert "Change links in webUI to rewrite misleading links (#11426)" (#11500)
This reverts commit b31b232edf.
2019-08-06 12:09:28 +02:00
ThibG b31b232edf Change links in webUI to rewrite misleading links (#11426)
* [WiP] Show host for “misleading” links

* Disallow misleading targets which domain names are prefixes of link text

* Move decodeIDNA to app/javascript/mastodon/utils

* Add support for international domain names

* Change link origin tag color to darker text color

* Handle links to domains starting with www. as shortened by Mastodon

* [WiP] Ignore links that cannot be misread as URLs, rewrite other links
2019-07-30 12:13:29 +02:00
ThibG 9349f1067a Fix animate on hover in poll options without CW (#11404) 2019-07-28 13:48:04 +02:00
ThibG 10e78ecf57 Change contrast of status links that are not mentions nor hashtags (#11406) 2019-07-28 06:00:51 +02:00
ThibG 7de8c51873 Play animated custom emoji on hover (#11348)
* Play animated custom emoji on hover in status

* Play animated custom emoji on hover in display names

* Play animated custom emoji on hover in bios/bio fields

* Add support for animation on hover on public pages emojis too

* Fix tests

* Code style cleanup
2019-07-21 18:10:40 +02:00
ThibG a4a502e85c Do not expand toot when clicking on a poll option (#11067)
Fixes regression introduced by e9ddd5a159
2019-06-13 00:16:46 +02:00
ThibG e9ddd5a159 Put poll options behind content warnings (#10983)
* Put poll options behind CWs in WebUI

* Put polls behind CWs on public pages

* Add poll icon to public pages CWs

* Revert to not showing an icon in the CW button
2019-06-08 17:40:59 +02:00
Eugen Rochko e6cfa7ab89
Change language detector threshold from 140 characters to 4 words (#10376)
Add `lang` attribute to statuses in web UI
2019-03-26 01:23:59 +01:00
Eugen Rochko 1f95190202
Refactor icons in web UI to use Icon component (#9951)
* Refactor uses of icons to an Icon component in web UI

* Refactor options passed to the Icon component

* Make tests work with absolute component paths
2019-02-01 00:14:05 +01:00
Eugen Rochko 9c38c5daa3
Fix dimensions of preview cards, fix crash in web UI, fix warning (#9133) 2018-10-29 04:42:07 +01:00
Eugen Rochko 5d5d1b528e
Double the threshold for "read more" functionality (#8835) 2018-10-01 03:38:10 +02:00
Haelwenn Monnier 15fc2b76f9 Show "read more" link on overly long in-stream statuses (#8205)
Show "read more" link on overly long in-stream statuses
2018-09-27 17:04:33 +02:00
M Somerville 298ee84488 Fix #8264 - Do not override ctrl/cmd+click. (#8265)
This includes clicks on hashtags, mentions, display names and media in the
timeline; and usernames in reply-indicator, detailed status, and the boost
modal.
2018-08-18 12:50:32 +02:00
Stephen Burgess 18965cb0e6 feat(ShowMore): Add classname to show more/show less button (#6904) 2018-03-26 13:59:44 +02:00
Eugen Rochko 8bf3e750ab
Fix #6757: Adjust RTL styles for landing page (#6768) 2018-03-13 08:14:08 +01:00
Eugen Rochko cfa9b6e13a
Remove text requirement when media attached from statuses (#6672) 2018-03-07 08:28:52 +01:00
Eugen Rochko 05686cc99d Fix unwanted content warning gap in CSS (#5436)
Fix #5356
2017-10-17 20:07:44 +02:00
unarist 2d395324e1 Fix React warning about tabIndex on status with CW (#5432) 2017-10-17 13:03:12 +02:00
Akihiko Odaki f303a954e6 Remove aria-label of status content (#5195)
aria-label contained body of status with content warning, which should be
hidden by default. Remove the label for the case and other cases due to
consistency.
2017-10-03 13:10:06 +02:00
Sorin Davidoi 8eb6d171e6 feat: Cache status height to avoid expensive renders (#4439)
* feat: Cache status height to avoid expensive renders

* feat: Escape content and emojify in reducers

* fix(css): Remove backface-visibility: hidden from .scrollable

* fix(statuses): Avoid creating DOMParses inside a loop
2017-08-07 20:32:03 +02:00
Sorin Davidoi e44f03bc71 Improve accessibility (part 7) (#4457)
* fix(media_modal): Keyboard navigation

* fix(column_back_button): Use native button

* fix(media_gallery): Keyboard navigation

* fix(status_content): Make CW content focusable
2017-07-31 00:18:15 +02:00
Sorin Davidoi c71874b84c Improve accessibility (part 6) (#4435)
* fix(status_action_bar): Use aria-pressed for reblog and favourite button

* fix(column_back_button): Keyboard accessible

* fix(status_content): Make focusable and accessible

* fix(dropdown_menu): Use aria-expanded instead of aria-pressed

* fix(emoji_picker_dropdown): Use aria-expanded instead of aria-hidden

* feat(icon_button): Add aria-expanded

* fix(privacy_dropdown): Use aria-expanded instead of aria-hidden
2017-07-29 01:58:53 +02:00
Eugen Rochko e19eefe219 Redesign the landing page, mount public timeline on it (#4122)
* Redesign the landing page, mount public timeline on it

* Adjust the standalone mounted component to the lacking of router

* Adjust auth layout pages to new design

* Fix tests

* Standalone public timeline polling every 5 seconds

* Remove now obsolete translations

* Add responsive design for new landing page

* Address reviews

* Add floating clouds behind frontpage form

* Use access token from public page when available

* Fix mentions and hashtags links, cursor on status content in standalone mode

* Add footer link to source code

* Fix errors on pages that don't embed the component, use classnames

* Fix tests

* Change anonymous autoPlayGif default to false

* When gif autoplay is disabled, hover to play

* Add option to hide the timeline preview

* Slightly improve alt layout

* Add elephant friend to new frontpage

* Display "back to mastodon" in place of "login" when logged in on frontpage

* Change polling time to 3s
2017-07-11 15:27:59 +02:00
Nolan Lawson 63b77f2320 Avoid using getBoundingClientRect to calculate height (#4001) 2017-07-08 01:57:22 +02:00
STJrInuyasha 6bf6d35637 Parse links in status content on update as well as mount (#4042)
* Update links in status content on update as well as mount
Fixes occasional bugs with mentions and hashtags not being set to open in a new column like they should, and instead opening in a new page

* use classList instead of raw className
2017-07-06 21:30:37 +02:00
Daniel Hunsaker c0979381a4 Fix a typo and give CW'd statuses the right cursor (#3918) 2017-06-23 23:13:27 +02:00
Yamagishi Kazutoshi c1a8e3d1eb Use Class and Property Decorators (#3730)
ref https://tc39.github.io/proposal-decorators/
2017-06-23 19:36:54 +02:00
Yamagishi Kazutoshi eff9416469 Remove unused variables (#3906) 2017-06-23 16:05:04 +02:00
Sorin Davidoi 8f03fdce7f Upgrade React Router (#3677)
* chore(yarn): Remove react-router

* chore(yarn): Remove react-router-scroll

* chore(yarn): Remove history

* chore(yarn): Add react-router-dom

* chore: Remove usages of react-router-scroll

* refactor: Upgrade to react-router-web

* refactor: Use fork of react-router-scroll

This reverts commit 2ddea9a6c8d39fc64b7d0b587f3fbda7a45a7fa2.

* fix: Issues mentions in the PR feedback
2017-06-20 20:40:03 +02:00
unarist bf8c2c4348 Clicking on the CW text should expand the status (#3855) 2017-06-20 01:34:10 +02:00
unarist aa58cca040 Set cursor:pointer only when necessary (#3857) 2017-06-19 18:27:07 +02:00
Sorin Davidoi 0f52e42c2d fix(status): Content jump due to height changes (#3734) 2017-06-13 20:46:21 +02:00
Eugen Rochko 8015fd7600 Improve RTL detection (#3682)
- Use plaintext
- Strip out URLs
- Strip out mentions
- Strip out hashtags
- Strip out whitespace from "overall" count
- Consistent between JS and Ruby
2017-06-10 15:06:50 +02:00
unarist 3e3ec9b2c8 Fix an error on dragging into status_content component (#3308) 2017-05-25 16:27:44 +02:00
Yamagishi Kazutoshi 2e112e2406 Improve eslint rules (#3147)
* Add semi to ESLint rules

* Add padded-blocks to ESLint rules

* Add comma-dangle to ESLint rules

* add config/webpack and storyboard

* add streaming/

* yarn test:lint -- --fix
2017-05-20 17:31:47 +02:00
Yamagishi Kazutoshi b8b7b506a2 Replace inline styles with stylesheet (#3115) 2017-05-19 11:42:54 +02:00
beatrix fd03a3d957 tiny js fix for 'show more' button in chrome (#3045) 2017-05-13 22:07:58 +02:00
beatrix 3dcb5fa28f Revert HTML CW changes (#3020)
* selectively Revert "Fix regressions from #2683 (#2970)"

This reverts commit 72698bc3b4.

* Revert "Handle hashtags in spoiler_texts (partial fix for #699) (#2683)"

This reverts commit e2491680e6.
2017-05-13 04:03:43 +02:00
Yamagishi Kazutoshi 2991a7cfe6 Use ES Class Fields & Static Properties (#3008)
Use ES Class Fields & Static Properties (currently stage 2) for improve class outlook.

Added babel-plugin-transform-class-properties as a Babel plugin.
2017-05-12 14:44:10 +02:00
Eugen Rochko 72698bc3b4 Fix regressions from #2683 (#2970)
* Fix regressions from #2683

Properly format spoiler text HTML, while keeping old logic for blankness intact
Process hashtags and mentions in spoiler text
Format spoiler text for Atom
Change "show more" toggle into a button instead of anchor
Fix style regression on dropdowns for detailed statuses

* Fix lint issue

* Convert spoiler text to plaintext in desktop notifications
2017-05-11 00:28:10 +02:00
Eugen Rochko f5bf5ebb82 Replace sprockets/browserify with Webpack (#2617)
* Replace browserify with webpack

* Add react-intl-translations-manager

* Do not minify in development, add offline-plugin for ServiceWorker background cache updates

* Adjust tests and dependencies

* Fix production deployments

* Fix tests

* More optimizations

* Improve travis cache for npm stuff

* Re-run travis

* Add back support for custom.scss as before

* Remove offline-plugin and babili

* Fix issue with Immutable.List().unshift(...values) not working as expected

* Make travis load schema instead of running all migrations in sequence

* Fix missing React import in WarningContainer. Optimize rendering performance by using ImmutablePureComponent instead of
React.PureComponent. ImmutablePureComponent uses Immutable.is() to compare props. Replace dynamic callback bindings in
<UI />

* Add react definitions to places that use JSX

* Add Procfile.dev for running rails, webpack and streaming API at the same time
2017-05-03 02:04:16 +02:00