Commit Graph

657 Commits (75d089410456671142521c6152847cbfb6317237)

Author SHA1 Message Date
lilia 0373252901 Update stylesheet 10 years ago
lilia 13ce354ab8 Registration UX improvements
Add some nice modal dialogs instead of confirmation alerts.
10 years ago
lilia c3d875305d Restore delivery receipt checkmarks 10 years ago
lilia a7079206f4 Nicer looking end-session and group control messages 10 years ago
lilia f160d1b7ad Css source maps 10 years ago
lilia 20baa795ad Fixes #198 Squished avatars
Refactor all avatar views to use a shared partial, then change it to a
background image. Requires allowing unsafe-inline styles in the CSP.
10 years ago
lilia 5ffa265559 Revert "Popout inbox"
This reverts commit 31e7d285e3.

This seemed like a nice feature, but the popup bubble isn't very
conducive to nontrivial user inputs, e.g. file inputs.

Fixes #211
10 years ago
lilia c526dbda5f Set up production build task
`grunt copy`

Closes #191
10 years ago
lilia 897d391817 Improve identity key conflict ux
Clicking on a key conflict message opens the message detail view,
which displays the contact(s) in this conversation. If the message
contains a key conflict with any of these contacts, a button is
displayed which attempts to resolve that conflict and any other
conflicts in the conversation that are related to that contact.
10 years ago
lilia 31e7d285e3 Popout inbox
Rather than opening the inbox in its own window, let it appear as a
browser action popup by default, but allow promotion to its own window
if requested.
10 years ago
lilia 45a053b3a8 Break long links in message bubbles / Fixes #204 10 years ago
lilia 69d5a6a33c Improve group update ui/ux
Promote group update to its own screen. Add typeahead contact selector
from new conversation view. Restyle to match android (more or less).

Closes #186
10 years ago
lilia 7e3961891b Tweak menu styles 10 years ago
lilia d20e23402d Refactor RecipientsInputView from NewConversationView
For reuse on group update screen.
10 years ago
lilia 8e54aa1401 Plumb contact avatars into conversations 10 years ago
lilia 019a9d1fbc Unread counts
Update unreadCounts per-conversation on incoming messages. Render unread
conversations with font-weigh: bold in the inbox view.

To ensure that the inbox and conversation views remain in sync, the
background page now ensures that the same models objects are used for
both views.
10 years ago
lilia 254131488e Render emoji in conversation and inbox views. 10 years ago
lilia c73f4d71a7 DRY up scrollable pattern
Switch to using gutter class instead of id since there is potentially
more than one usage on the page.
10 years ago
lilia fd6e2954f7 Curtail over-zealous websocket reconnects
Closes #173

Previously, in the event of a failed websocket auth, we would attempt to
reconnect once a second ad infinitum. This changeset ensures that we
only reconnect automatically if the socket closed 'normally' as
indicated by the code on the socket's CloseEvent. Otherwise, show a
'Websocket closed' error on the inbox view.

Ideally we would show a more contextual error (ie, 'Unauthorized'), but
unfortunately the actual server response code is not available to our
code. It can be observed in the console output from the background page,
but programmatically, we only receive the WebSocket CloseEvent codes
listed here:
https://developer.mozilla.org/en-US/docs/Web/API/CloseEvent#Status_codes

The websocket error message is displayed by a normally-hidden but ever
present socket status element. Clicking this element will immediately
refresh the background page, which will try again to open the websocket
connection.
10 years ago
lilia 8ee282b1aa Restyle registration page
When first intalling, users will no longer be presented with the option
to register as a standalone client.

For developer convenience, the standalone form can still be found at
chrome-extension://.../register.html

Closes #159
10 years ago
lilia 7a03c26849 Adjust message bubble tail position
It should align with the center of the avatar.
10 years ago
lilia e2bd55c171 Tweak delivery receipt and timestamp display
Checkmark is no longer underlined when hovering over the timestamp.
10 years ago
lilia 441167ab35 Tighten up send btn icon size 10 years ago
lilia 567a48e82b Adjust widths of bubbles and chat window
With these changes, message bubbles in the default-sized chat popup are
just wide enough to display the full complement of html5 media player
controls.
10 years ago
lilia 1311f7c9ae Fix attachment previews for audio/video files 10 years ago
lilia c8274d7bc7 Give video elements black backgrounds 10 years ago
lilia db7dee9a8a Fixup file size warning
Add contentType-specific limits, switch to lazy-init iff we encounter an
oversized file, and restyle as a toast, factoring out a generic
ToastView along the way.
10 years ago
lilia ddc0ed1b9a Add audio and video players
Basic implementation using html5 audio/video tags and data URIs.
10 years ago
lilia dcc1588219 Add key verification screen
Accessible from the menu on private conversations.
10 years ago
lilia 33b9a11e65 Always overflow: auto 10 years ago
lilia fd30dc6f1a Add message detail view 10 years ago
lilia 368cd2f79a Refactor back button style
Make it easier to reuse these styles.
10 years ago
lilia d0392a3e04 Refactor title bar text style 10 years ago
lilia 4945180c12 Constrain .end-session style to the .message-list
It was incorrectly being applied to the End Session menu item.
10 years ago
lilia 3292177a96 Remove resize logic in favor of pure css 10 years ago
lilia 7231bcd5ce Flesh out font faces 10 years ago
lilia 4716754209 Refactor content message class names 10 years ago
lilia 367421d40a Style end session messages
Also add a missing call to render()
10 years ago
lilia eddf4164fa Hide sender names in private conversations 10 years ago
lilia 96af6b56ef Handle incoming sync messages
Assign them to the correct conversation and mark them outgoing with the
correct timestamp.

Closes #150
10 years ago
lilia 746e6530b9 WIP pill view for selected recipients 10 years ago
lilia eaf3d46c1f Make 'New Message' view match new title bar style
Make text blue and light weight. Update back button colors to match.
10 years ago
lilia bebe47eacd Hide our own avatar for consistency with Android 10 years ago
lilia 29bf70b76f Shrink more styles
Shrink font and image size
Shrink converation avatars
Shrink fab
10 years ago
lilia bffdaf9ceb Restyle menu icon 10 years ago
lilia db5e7fd6b6 Fix list view scrolling
Resize handlers are ugly. But not as ugly as scroll handlers. :p
Normalized some whitespace along the way.
10 years ago
lilia ec01d33b50 Reorganize stylesheets and global styles
Simplifies the grunt watch task for sass. Renames sass partials with
leading underscores. Flattens stylesheet directory. The only remaining
raw css file is options.css.

Move globally-relevant styles to _global. Shrink overall font size.
10 years ago
lilia 33c0f5b274 Change title bar color 10 years ago
lilia 374fa044af Shrink some styles
Group update font and sender names should be smaller.
10 years ago
lilia 1334032a89 Add hidden group update form to new conversation view 10 years ago
lilia d7436aaebe Adjust conversation menu styles 10 years ago
lilia b1ad04298f Add title bar label to new conversation view 10 years ago
lilia b13e36a11c Style conversation menu 10 years ago
lilia eacca80a7d Don't let contact details wrap in skinny windows 10 years ago
lilia 6d81011f6a Add back button to compose view 10 years ago
lilia fedfdcdd7e Style elements for compose flow 10 years ago
lilia e52c7a3e2c Remove stubborn width calculation
It's making my typeahead contact details wrap onto the next line and
doesn't seem to be adding much value.
10 years ago
lilia 19ee28209d Restore delivery receipt checkmark 10 years ago
lilia 00e9e3b757 Setup loading gif on conversation list
TODO: get actual gif asset in there.
10 years ago
lilia ee34e446e6 Label new-contact block 10 years ago
lilia f504087603 Move index styles to their own file 10 years ago
lilia 613dc3bedd Start on support for messaging a brand new contact 10 years ago
lilia c6a19afd29 Tweak contact style in typeahead
Remove message snippets and dates.
Add checkboxes.
10 years ago
lilia 79b4c89ce4 Fixup attachment preview 10 years ago
lilia a2f5f734b3 Set up index.scss
This file is for index page styles. Start by offsetting the gutter so
the title bar doesn't obscure the first entry.
10 years ago
lilia 58e7f3c7e1 Fix file input click zone
Previously, the ugly file input was hidden with opacity, and styled as a
square paperclip icon, but its drop and click zones were not constrained
to the visible square. They remained active across the whole 'Choose
File' button, which overlapped with the textarea. Instead, hide the file
input complete (display: none) and transmit click events from the
paperclip to the input programmatically.

Eventually, we'll need to address drag and drop events, but I want to do
that at the window level. Otherwise dropping a file outside the file
input drop zone causes the browser to navigate to the file://... url.
10 years ago
lilia 8498d7ad1f Fixup conversation page styles and functionality
Render the entire conversation from a template, because some parts of it
must be rendered conditionally if it is a group vs private conversation.

Also apply some style fixes and restore lost functionality:
  * Make conversation title bar fixed.
  * Widens message bubbles.
  * Unhide message list.
  * Restore attachment rendering.
  * Restore message sending and attachment file selection.
  * Style attachments file input as a paperclip.
  * Style send button like on Android and make it a submit input.
10 years ago
lilia 7827c4c591 Restore default avatars on the index 10 years ago
lilia 5821e0ddee Add fonts so we don't have to hit googlefonts 10 years ago
Riley Shaw 94ce4d4b91 Simplify panel state management and message passing 10 years ago
Riley Shaw 9071d98395 Update styles to material design to match Android client (first pass) 10 years ago
Riley Shaw 2cbcb28ee3 Start on panels 10 years ago
lilia ed06161ee7 Quick fix for phone input style 10 years ago
Emily Chao bb2b53035e Restyled message attachments
Added a size limit, added functionality to delete the attachments before sending in a more user-friendly way
10 years ago
Emily Chao e74cba8a92 Restyled country dropdown
Added jquery plugin that allows for flags and country codes to be
displayed in a user-friendly way, on top of the existing phone view
10 years ago
Emily Chao 5d3020b9ed Refactor phone number input view
Moves validation logic to its own view to be shared on index and options
pages.
10 years ago
Matt Corallo e7f3e52b6c Remove NaCL! 10 years ago
lilia 3d6c251fd1 Group avatars 10 years ago
Matt Corallo b070c6ccb0 s/\t/ /g in stylesheets/options.css 10 years ago
Dave Sescleifer 2462aba24b Fixed timestamps and added last message to the gutter 10 years ago
Dave Sescleifer 1c47fb7ed8 Contact name now overflows into ellipsis 10 years ago
Dave Sescleifer 893fffdad8 Added ✓ to delivered messages
Closes #100
Closes #101
10 years ago
lilia 8c93101989 Don't store conversationType on messages
This was used to conditionally render messages in the group style, but
it's actually unnecessary. We can render the same markup in both cases
and change the appearance with css.
10 years ago
lilia 99a2685f93 Store attachments as binary blobs
Move base64 encoding of attachments to an AttachmentView. This makes
image rendering an asynchronous task so we fire an update event to
indicate to the parent MessageListView that its content has changed
height and it is time to scroll down.
11 years ago
lilia 28290477f4 Nicer timestamps with momentjs
This dependency may be a little heavy for our current use case, but we can
roll with it for now and find something slimmer if it turns out yagni.

Closes #77
Closes #40
11 years ago
lilia 4119c13ba2 Registration ux tweaks 11 years ago
lilia 054f027786 Remove unused stylesheets
Move the remaining to /stylesheets
11 years ago
lilia cd888f66ef Build unminified manifest.css from sources 11 years ago
lilia 349e7e18f6 Add sass stylesheets 11 years ago
lilia 0cc0b8cc72 Switch tagsinput to bower 11 years ago
lilia c8ad65efe0 Switch to bower dependencies
Checks in only the files we actually need from bower_components.
11 years ago
lilia 987744cd79 Default avatars
Someday you'll be able to edit your avatar. Until then, put a bird on
it.
11 years ago
lilia 3334504eff render attachments 11 years ago
lilia 229007040c Basic frontend support for image attachments 11 years ago
lilia c6aae62151 Small message form tweaks 11 years ago
lilia d67b723f4f Highlight the selected thread 11 years ago
lilia 19dac1f3df Decorate incoming group messages
with numbers and image placeholders, so you know who's saying what.
11 years ago
lilia e8399f98df Quickfix for wonky tagsinput 11 years ago
lilia 2bd77693e1 Refactor options page and style using bootstrap 11 years ago
lilia 40c3bc8640 Fix nacl not loading
HEADDESK HEADDESK HEADDESK
11 years ago
lilia 806693ac1c use new index page for popup 11 years ago
lilia 2f0b0f7a1b Get overflow scrolls working
Had to resort to a resize event handler.
A bit slow at times, but it works.
11 years ago
lilia 546cdf82cb Fix some markup issues
* Remove spurious search div
* Fix nested uls
* Use class name selected, not closed (the inverse)
* Restor nacl div
11 years ago
lilia c2beda8e40 Get single recipient message composition working again 11 years ago
lilia c034ac8267 Refactor components for the main content section
Each conversation views now manages its own separate elements
rather than all binding to a shared #conversation element, and
similarly for message composition ui.

Also includes the beginnings of group creation UI (not working yet),
featuring bootstrap-tagsinput field for entering group recipients
11 years ago
lilia 28e16aaae8 bootstrap tags input 11 years ago
lilia 518bdb2056 with love from tyler 11 years ago