Commit Graph

245 Commits (639c3e9a4f74fafd1f23d1c06466c74e3a13a830)

Author SHA1 Message Date
Scott Nonnenberg 4124d5cb9b Show 'Message not sent' only if 'Some recipients failed' not showing
Also switch up the visual style for 'Some recipients failed' text to
match the more-visible 'Message not sent' text and the 'Resend' link.

FREEBIE
8 years ago
Scott Nonnenberg ff4fde651c Make it clear in conversation just some recipients failed
FREEBIE
8 years ago
Scott Nonnenberg 12914307f1 Improve experience when discovering identity key error on send
New experience in the Message Detail view when outgoing identity key
errors happen, matching the Android View.

'View' button is only shown on outgoing key errors right now.

When a contact with an outgoing identity key error is clicked, they are
taken to a view like the popup that comes up on Android: an explanation
of what happened and three options: 'Show Safety Number', 'Send Anyway',
and 'Cancel'

Contacts are now sorted alphabetically, with the set of contacts with
errors coming before the rest.

FREEBIE
8 years ago
Scott Nonnenberg b6cca41a0c Update verification-related strings to better match mobile app
FREEBIE
8 years ago
Scott Nonnenberg 293be5d9f6 Truncate long filenames in attachments
The :before technique for adding the icon was removed, because it
resulted in some rendering issues when the layout pressure in the
message bubble got too high - you would see a partial icon. This
solution shrinks the icon a bit when the filename wants to expand to
take its space.

The iOS bubble width also needed special care to ensure it didn't expand
to accommodate the very wide filenames. Beyond that, overflow: hidden
needed to be applied at several levels to make everything behave as
expected.

FREEBIE
8 years ago
Scott Nonnenberg 12d7fb3b74 Left-align confirmation dialog text, explain more on 'send anyway'
FREEBIE
8 years ago
Scott Nonnenberg 31bf05e14a Add verified state summary to top of safety number screen
FREEBIE
8 years ago
Scott Nonnenberg 11372b4e00 Add icons for keychange and expiration timer in-conversation items
The shield matches the Android app's key change notification, and the
clock icon was easy to do and makes it easier to visually distinguish
those items in the conversation history.

FREEBIE
8 years ago
Scott Nonnenberg c714fb6dbf Shadow/icon/blue for banner, better verify advisories in dark theme
FREEBIE
8 years ago
Scott Nonnenberg 1cf9289b1a Add items to conversation history when user verifies/unverifies
FREEBIE
8 years ago
Scott Nonnenberg a827334c3e Allow re-send of messages in msg detail view on OutgoingKeyError
We also show more errors than we used to in the MessageDetail screen
to help make it clear what is happening, and why the user would need to
re-send.

FREEBIE
8 years ago
Scott Nonnenberg 47c5142a83 Replace unicode check with new svg icon
A good bit of CSS was required to keep the text color changing along
with the text it is nestled within.

Also: took this opportunity to increase the contrast of the number and
verified section right under the contact name in the group members view.

FREEBIE
8 years ago
Scott Nonnenberg caa92c9312 Reintroduce outline around confirmation dialog buttons
It was very hard to tell which button was selected without the standard
outline.

FREEBIE
8 years ago
Scott Nonnenberg bedf10056b Support for group-member verifications via second-level panel
Also:
- All the necessary wire-up to update things in real time. If you have
a safety number page up via a group member view as well as via a 1:1
conversation with that contact, they'll both be updated as the
underlying model changes. Similarly, the overall group will update
in real-time as members change.
- A bit of special-casing for yourself in a group conversation - you're
shown as 'me' and are not clickable, where normally that would take you
to the Safety Number screen for that contact. You are also not included
in the trust calculations for a given group.

FREEBIE
8 years ago
Scott Nonnenberg ee0b0f5ffb Remove all concept of 'key conflict' from the app 8 years ago
Scott Nonnenberg 3b19d8f0e2 Light themes: Add gray background color to message detail screen
Outgoing messages were hard to see, white on white.

FREEBIE
8 years ago
Scott Nonnenberg b238242ead Add padding at the top of the conversation
Keeps no-scroll-bar conversations from sticking directly to the top of
the window.

FREEBIE
8 years ago
Scott Nonnenberg 9ead5c76ce Remove helvetica font in favor of Roboto
FREEBIE
8 years ago
Scott Nonnenberg 13fb40fdcc Make spacing at top/bottom of last seen indicator consistent
Sadly, that spacing now needs to be bigger because scrollIntoView
doesn't honor margins which overlap each other to eliminate this kind of
'too much spacing' kind of problem.

FREEBIE
8 years ago
Scott Nonnenberg bb1aa14a60 Refine Last Indicator Visuals
FREEBIE
8 years ago
Ikarulus ec3278ca3a add message length warning for android clients 8 years ago
Unknown d79ed69c21 Forgot & 8 years ago
Unknown 235ac03775 Hover-effect for new messages 8 years ago
Unknown 416359d4ad Add scroll-down-button hover-effect
Normal Android & iOS Theme
8 years ago
Scott Nonnenberg 0d722a3186 Last seen indicator visual refresh
- Last seen indicator now spans the full conversation, with subtle
shadow highlights above and below
- Scrollbars now overlap the content of the conversation, allowing last
seen indicator to touch the right edge of the window.
- The iOS and Android conversation background is now #eee instead of
white, which meant that the outgoing messages (Android) and incoming
messages (iOS) had to be updated for contrast. They now have white
backgrounds.
- Similarly, the scroll down button needed more contrast, and its
background is now white in light themes.

FREEBIE
8 years ago
Scott Nonnenberg d294cc96a5 A few tweaks to safety number-related UI
* Show a pointer cursor on safety number change notification
* Add 'click to verify' to the text shown there
* Add ':' to the text shown on the safety number screen
* Limit the width of the safety number box, to force 3x4 layout
* Center the safety number box

FREEBIE
8 years ago
Scott Nonnenberg 1839efd535 Move margin-top back to inner last seen indicator element
FREEBIE
8 years ago
lilia 681418cf6b Restyle last seen indicator
Add horizontal line behind text.

// FREEBIE
8 years ago
lilia 4921ef1b9d Tweak scroll to bottom bottom color
And add drop shadow

// FREEBIE
8 years ago
Scott Nonnenberg 4c7bfbe9ff Scroll down button: when scrolled up, or new non-visible message
FREEBIE
8 years ago
Scott Nonnenberg fed26c36ca Add new Last Seen Indicator with unread count, scroll to it
This is to ensure that when there are a lot of unread messages, the user
is given the chance to see all of them by being scrolled to the oldest
new message.

When a new message comes in, the indicator will be incremented.

When the user sends a message or switches away from the conversation,
the last seen indicator will be removed.

FREEBIE
8 years ago
lilia 3ea5c0435b Update attachment style
Add names and sizes for all attachments except images, and (as with
arbitrary attachments), clicking on the text will open a save dialog.
In the absence of a filename, choose something that makes sense.

Display different icons for different media types, including distinct icons
for voice notes and audio files.

In iOS theme, audio, video, voice, and files are all encapsulated in bubbles.

Closes #804
Closes #842
Closes #836

// FREEBIE
8 years ago
Scott Nonnenberg 42195acfb1 Reduce empty space to the left of the larger file icon
FREEBIE
8 years ago
Scott Nonnenberg ae6e6da44b Change iOS file attachment bubbles to be on-theme
FREEBIE
8 years ago
Scott Nonnenberg ee00ad0e15 File attachments: show file size, bold filename, make icon bigger
FREEBIE
8 years ago
lilia a27ea20f3e Improve unsupported file type handling
Make arbitrary files look nicer and display the filename.

If an audio or video element fails to load for any reason, timeout after
a few seconds and render it as an arbitrary file. Also short circuit to
this treatment for common audio and video file types that we know are
going to fail, e.g., proprietary formats from apple.

// FREEBIE
8 years ago
lilia 030c5a403f Fix key change advisory style in dark theme
Override the light font color which is the default in dark mode.
For regular android theme this should cause no change.
8 years ago
lilia 9c00a27081 Bump video min-width to include all controls
Fixes #960
9 years ago
lilia d5431a942f Simplify and correct message metadata alignment
Match left/right adjustment on Android.
Incoming to the left, outgoing to the right.
9 years ago
lilia 657fa2725f Adjust hourglass vertical alignment 9 years ago
lilia 83d285e4ab Fix style for qr code 9 years ago
lilia 790407d42e Add qr codes 9 years ago
lilia 7fe708d195 Insert keychange advisories
On click, these open a verification panel for the relevant contact,
within this conversation.

// FREEBIE
9 years ago
lilia 4cd2c03687 Add clock svg style 9 years ago
lilia e809a0cf8b Breakout timer rendering into its own view
Make width and height constant.
9 years ago
lilia 5f92ccd524 Render animated hourglass when messages are expiring 9 years ago
lilia 96fd017890 Support for incoming expiring messages
When initialized, or when expiration-related attributes change, expiring
messages will set timers to self-destruct. On self-destruct they trigger
'expired' events so that frontend listeners can clean up any collections
and views referencing them.

At startup, load all messages pending expiration so they can start their
timers even if they haven't been loaded in the frontend yet.

Todo: Remove expired conversation snippets from the left pane.
9 years ago
lilia 6a4b720b89 Make timestamp text selectable
Previously we only declared the message body as selectable, but Chrome's
implementation of user-select is a little quirky in that it allows
unselectable text to be copied if you select elements around it. Oddly
enough, styling the entire bubble contents as selectable, including the
timestamp, actually prevents chrome from copying the timestamp text when
it's not supposed to, i.e., when triple-clicking the message body.

Fixes #887

// FREEBIE
9 years ago
lilia d7b6e7c26b Make group updates and other control messages selectable
// FREEBIE
9 years ago
lilia f918142742 Fix bubble selection style and toast z-index
// FREEBIE
9 years ago
lilia 65cb7c0e9c Cleanup colors and focus/active input states
// FREEBIE
9 years ago
lilia 6c05a71424 Tune up ios bubble style
// FREEBIE
9 years ago
lilia 7b9894d688 Refactor css to support theming
Move away from inline style attributes for setting contact colors.
Apply colors by name via css classes instead. Also lays groundwork
for syncing contact colors.

// FREEBIE
9 years ago
lilia 41e4154d60 Make font sizes relative
So it's easier to adjust them globally.

// FREEBIE
9 years ago
lilia 9fa7e7f462 Remove unused view
// FREEBIE
9 years ago
lilia 4f46a164ba Add voice notes
// FREEBIE
9 years ago
bitim 1a0d2595da Committing corresponding changes to the scss files 9 years ago
lilia f34f6eedef Add min-width on video elements
Such that all the player controls are visible.

Fixes #782

// FREEBIE
9 years ago
lilia dea8983235 Error icons only use pointer-cursor when clickable
// FREEBIE
9 years ago
lilia 58c3fe047e Make error messages clickable
// FREEBIE
9 years ago
lilia 0d47a04815 Remove unused style
// FREEBIE
9 years ago
lilia 3217f2c0b6 Hide unregistered user errors in groups
// FREEBIE
9 years ago
lilia b6f785737c Restyle error icons, move them outside the bubble 9 years ago
lilia b5ddd41a5e Fix error icon
// FREEBIE
9 years ago
lilia 8200780fc2 Don't let timestamps wrap
// FREEBIE
9 years ago
lilia ba22151a31 Unpad message-container on message detail screen
// FREEBIE
9 years ago
lilia 28c602ab85 Use button for file input / paperclip
// FREEBIE
9 years ago
lilia e5748b974f Harmonize x/close buttons
// FREEBIE
9 years ago
lilia 6faed3d9d7 Remove unused style
// FREEBIE
9 years ago
lilia 6be7b765b2 Harmonize border radii
// FREEBIE
9 years ago
lilia d4174b94f1 Tweak button sizes and menu style
Restore previous icon size to header buttons, add padding to accomodate
positioning.

Remove blue border from menus.

// FREEBIE
9 years ago
lilia d8d34e7afc Icon upgrade
Also remove unused images.

// FREEBIE
9 years ago
lilia 6a9ec073c6 Decrease bubble radius
// FREEBIE
9 years ago
lilia 76652c2622 Update style and copy on key changes
// FREEBIE
9 years ago
lilia 1b6eda6a8d Tighten spacing between bubbles
// FREEBIE
9 years ago
lilia 6c35f2a010 Clean up timestamp/status alignment
// FREEBIE
9 years ago
lilia 512c5bf739 Incoming bubbles have sender's color background
// FREEBIE
9 years ago
lilia 4060221b9c Make panel scrollbar track persistent
The bar is effectively invisible, but having it present means that we
don't see a jarring change in width when the content expands into the
overflow zone and triggers the scrollbar to suddenly appear.

// FREEBIE
9 years ago
lilia 1e3e730d88 Consolidate panel container styling
Special case the main panel because it is super speshul.

// FREEBIE
9 years ago
lilia 6fe9c3f964 Nest key verification inside conflict dialogs
// FREEBIE
9 years ago
lilia 9f0bcf6ae7 Add top padding to panel containers
// FREEBIE
9 years ago
lilia 3901bcb8df Style resend button as an inline link
For messages that failed to send due to network errors, this change
allows retrying them directly from the main conversation view rather
than only from the message detail view.

// FREEBIE
9 years ago
lilia c48484e04f Add padding to right of conversation input
// FREEBIE
9 years ago
lilia d24eaa655a Tweak styles on key verification view
// FREEBIE
9 years ago
lilia d3b035121d Clean up bottom bar styles
// FREEBIE
9 years ago
lilia 234f937bc7 Conversation subscreens share a header
// FREEBIE
9 years ago
lilia 3e103ffde2 Add x padding on message detail container
// FREEBIE
9 years ago
lilia dd943163fe Increase message list padding
// FREEBIE
9 years ago
lilia b094607e0d Highlight bottom bar when focused
// FREEBIE
9 years ago
lilia 7310afd1b4 Replace message list loading spinner with bar
// FREEBIE
9 years ago
lilia c16356084d Align header buttons and touch up styles
// FREEBIE
9 years ago
lilia 18a5ce8e54 Restyle conversation panel
// FREEBIE
9 years ago
lilia 043a3f9609 New layout
Move the global header inside the left pane only, expand conversation
panels to full bleed, restyle conversation list items and selected state.

// FREEBIE
9 years ago
lilia 78603259c1 Center conversation tile in the main pane
Also fixes a visual bug with debug log and other overlays which wouldn't
cover the right edge of a very wide window.

// FREEBIE
9 years ago
lilia 33fde3d4e7 Dedupe modal styles
// FREEBIE
9 years ago
lilia 4ab2e25df6 Refactor Contact and Conflict views
Untangle these two views into their component parts, consolidating all
the key conflict logic in the key conflict view. Contact view now simply
renders basic contact info and miscellaneous errors but not conflicts or
message errors.

// FREEBIE
9 years ago
lilia f221921127 Tweak conflict style
// FREEBIE
9 years ago
lilia 28c763992a Move error indicators on message bubbles
// FREEBIE
9 years ago
lilia 5340791868 Display key conflict dialog inline
One less modal.

// FREEBIE
9 years ago
lilia ad66da9fb5 Move identity conflicts to top of message detail
Also restyle them as with network errors

// FREEBIE
9 years ago