Merge pull request #633 from wireapp/dev

.travis.yml

@@ -8,7 +8,7 @@ env:
     # RAYGUN_USERNAME
     - secure: "F+G6JgvLfvXjSmbDrV7VWefMbAD1qaA3aSIRF2OIwJMa9h6h4F3jYaX7w3+5BVBZnoMwl7XJC7tL732aIN4rr7l+VgAB8YjAzwbnTk19LS2/g4DrIBz6GVfBOFQtG9gMtpdJJmW8Xo3bDBuOXrGE2dZipz0E46NrHIp7JtEmqnv2DSLD0RwuCS+KMwtKzO8j9ZePrdNB66IxF/hPAeHOcyQg9t/7+szxXzX58rvqjVdgbLWyt16ZoVgNInuOrECricBJ8k7A5NzCjunvOsSE3YnNe86FRycpQd+XLvozqq3ZGvwuWKHzx6PfnqEEPKVNRun9deiv08BvTVxaqr4bK8pDMZEtqlL83WQcucB1uR+ldOYnG/DVfjgoGJ5kVmEyuUJu4CwTP1GkG0+vl/Bezkvzwt00k2d22x2jdKcdICAfzSXi2cz2SqeSSxF+L4n7Eml+G8a0NyIi/ZzVLQvaW4uZc+AK+Skz2q1HCp3POU0rX9I3cQKvq703oBRmkZjZLO16gySW9DMnlwIqDrIDOAYKG8ETwYIRPqm0juwAC7WkRgGJK+DWDwv2EEJbSD1urUMRUiuJkcXa8fWTPHV5/tA89JRsAqrgYPh+u6GjV9P00u/3boZqnMDPMtPUZVxfKUjcWA0HimfvP/Z+98i40Pg2GF6yUlpy1pMypfrp5jI="
     # RAYGUN_PASSWORD
-    - secure: "EfmwyVuqyg1KkB4Zdnm7GGBV9f7aBK2ZmKvDJH8avBhDCynyxCGh3aQ8gW1fpUdtEwA7J6d7ZY71SNugiPzCuhM/P9mUMrHXYvQ+ENun1RFRhVqYXx1f4LYNcN9nuOTWnpupdAmy13+qa/4tPorkCey3GwlqmB+n0Gx22gMGf2H/RqDQd0yApkffEdCjQiTFkTmqpNhW1Y9mqr6RoWsOYibOVT9Zh07l+yX17KzBkEzMYTCZrzRE45TP6dHPgN4faBAZS3L50K+VAJzqwPUecfsNHKufHvHj6CdniE9FdDZ1YtwQXY9HEzvJtyqLPogq+FWNJoiQgQqZZtkJctRX07jcL0GZIOsrirIlfAln8Kh+lcAa0cqpOERvxxBE2m+y97JzAak2gFEYMt9x6nfQKemr8ILJX83VgOG22/OgXls1gSR2VnBag6rjR0foXNwKmjX7HDnRLGO+bwzvthtcHjgOE1b7jLl/3YrBNFxuy+XY/jOSJSVBRGwBCBBSNZZRfY8XwMOgaIvuR3P7dJ+QHUzBjkO1JI05yQhTcp9aXfud2MevhZNDwfCNjoemy2b5JUPyKP1/dnBttm0fOmXu+2bk7nmz0XKm0bsQQ94aL3bq6fg5J8nSafX8L4K5LacovUHt/i1H90fvuMuSZ7uhg+cEmSj6VrclA4qFwL6cvtk="
+    - secure: "voLf9KMrK+9bO3z19nhKkTXMxaGtIazachYW1LT2kTTPQ3atu2bUZAemJBPN2VxOcaCUUi59Bpsxa0DO2QsjpuRsqjD8+meDuKv43WpMxxPDKFyDVAnX6DqdDz1fO9wDa4kTGhwTQONFENlH23BiVQhRhJFV2QL6F9Sv/nVMqFciReYnkkuhfmp2D5aYeZlRQ968JRV0awpY6D2jJ/A77JF79uKMh41bMFCmjW3qkdTZevxfYPRU4MN7QPQS3TD/WGNz/HSdUmBqLSi6VGuqRZqMoiAbLeM+NbYEoQ3XzTAT+5Tw+ipc/0rI20aeeot1m/b432guvdWuuEM4MNfrOMeyCdDdZnjG2VQJO3VT+Gl53qmObsF8EyT4AJbieYpjVhrxcoVRHTBjO5qZJX+CO+Xmoa+BpA5NGsvOn02MJU9RkbAsC3QpB6ClEABcVnFr1fdeHfWV/FBkeQrdHZlAbIsANMKJzn+7FNZlDe9IW9rrxY+j1iAwUuappvZctA3Ceu9c7SC8T8uTgKLHEkIMsl63pTDf9r/HzdrLszIFVG8hsSThzXt6TdQLTbnr8D0zjjGRZ4Cogw/2RuqY+icQQXWeYv1zpsYqPMV4F4yDEz8WFpOFNcIYiyFQX2uOfp/bsEGSoC9SP7suzYI93Kf9szJurfIdmLYmCnEMts8NMiw="
     # WIRE_WEBAPP_BOT_EMAIL
     - secure: "cRgk2yvpezpf2/Z/49wgJ1rm8i3e7h7nAOkbF8ykOcka9VanaGy5pn2JJs9/EMEBbKK8+tUkD9MKm1k4xd2qotxXZsOeonvzMV5yBcF/XZ887vW7FByvfFQ9iqSq+VA7sgUr6qr6+N51Wp4DZh++ojFBh6D8LB1hHqKCCRnM2PFECrMG03CXVc0rbSNLdGh7xm11pCteLxANciQv9xCUAVCyQNy3QorEczTyY50k/0nT29Axqn2FFjaLnLtG+nM7ufLaySPfOVAnWX7sb2yf08yC38bBktwnpbWKjJlveK6aFA4LVuj7eXLTfA1DF/0AUmlk0MNmUPCHz7Xo+YLLIua8+Rms6bzLCeUswJyDp69/2WdidrTUDNtRjNQ2BkNowfhOOuSrsf/3WLP/Sli9fX7G70RBHICBNZ3qJ40V8PkQJTKTQYUtVL7cmnH94OjBxy/rwmBfHQSa4zx8JNFn+IDHCATVb7RIPARTHBiAK+C0kne/Ito0k59MLbWiic+y+1Y2CtDHJqlgxYMMSnrPd3+4z0/LFbkMwnyL3QQlt1U4kFn4XOlOSp6aHg5ke2HGueQBiUJcfj52rbLRceBay9A+HrNLfVhzDTiUUbkfx544sdUv8PyITpZxYXKrGSqvIvDUFOA5rwj90NwwokTi+tHzPTbbDFYRn0IvNdHCJbo="
     # WIRE_WEBAPP_BOT_PASSWORD
@@ -25,7 +25,7 @@ addons:
 # http://docs.travis-ci.com/user/languages/javascript-with-nodejs/
 language: node_js
 node_js:
-  - 6
+  - "6"
 
 # https://blog.travis-ci.com/2013-12-05-speed-up-your-builds-cache-your-dependencies
 cache:

README.md

@@ -34,3 +34,7 @@ Run `yarn start` and Wire's web app will be available at:
 ### Status
 
 [![Build Status](https://travis-ci.org/wireapp/wire-webapp.svg?branch=dev)](https://travis-ci.org/wireapp/wire-webapp)
+
+### Translations
+
+All Wire translations are crowdsourced via [Crowdin](https://crowdin.com/projects/wire).

app/page/auth.html

@@ -133,17 +133,17 @@
 
           <form id="form-account-register" class="form" data-bind="submit: register">
             <div id="wire-register-name-container" class="form-control">
-              <input class="input name" id="wire-register-name" type="text" autocomplete="off" maxlength="64" spellcheck="false"
+              <input class="input name" id="wire-register-name" type="text" maxlength="64" spellcheck="false"
                      data-bind="css: {'input-error': failed_validation_name}, event: {input: clear_error}, l10n_tooltip: z.string.auth_placeholder_name, l10n_placeholder: z.string.auth_placeholder_name, textInput: name"
                      data-uie-name="enter-name" tabindex="1" dir="auto">
             </div>
             <div id="wire-register-email-container" class="form-control">
-              <input class="input email" id="wire-register-email" type="text" autocomplete="off" maxlength="128" spellcheck="false"
+              <input class="input email" id="wire-register-email" type="text" maxlength="128" spellcheck="false"
                      data-bind="css: {'input-error': failed_validation_email}, event: {input: clear_error}, l10n_tooltip: z.string.auth_placeholder_email, l10n_placeholder: z.string.auth_placeholder_email, textInput: username"
                      data-uie-name="enter-email" tabindex="2">
             </div>
             <div id="wire-register-password-container" class="form-control">
-              <input class="input password" id="wire-register-password" type="password" autocomplete="off" maxlength="1024"
+              <input class="input password" id="wire-register-password" type="password" maxlength="1024"
                      data-bind="css: {'input-error': failed_validation_password}, event: {input: clear_error_password}, l10n_tooltip: z.string.auth_placeholder_password_set, l10n_placeholder: z.string.auth_placeholder_password_set, textInput: password"
                      data-uie-name="enter-password" tabindex="3">
             </div>
@@ -180,12 +180,12 @@
             <div class="auth-headline" data-bind="l10n_text: z.string.auth_verify_account_headline"></div>
             <div class="auth-headline-sub" data-bind="l10n_text: z.string.auth_verify_account_detail"></div>
             <div id="wire-verify-account-email-container" class="form-control">
-              <input class="input email" id="wire-verify-account-email" type="text" autocomplete="off" maxlength="128" spellcheck="false"
+              <input class="input email" id="wire-verify-account-email" type="text" maxlength="128" spellcheck="false"
                      data-bind="css: {'input-error': failed_validation_email}, event: {input: clear_error}, l10n_tooltip: z.string.auth_placeholder_email, l10n_placeholder: z.string.auth_placeholder_email, textInput: username"
                      data-uie-name="enter-email">
             </div>
             <div id="wire-verify-account-password-container" class="form-control">
-              <input class="input password" id="wire-verify-account-password" type="password" maxlength="1024" autocomplete="off"
+              <input class="input password" id="wire-verify-account-password" type="password" maxlength="1024"
                      data-bind="css: {'input-error': failed_validation_password}, event: {input: clear_error_password}, l10n_tooltip: z.string.auth_placeholder_password_set, l10n_placeholder: z.string.auth_placeholder_password_set, textInput: password"
                      data-uie-name="enter-password">
             </div>
@@ -262,7 +262,7 @@
           <form id="form-verify-phone-password" class="form" data-bind="submit: verify_password">
             <div class="auth-headline verify-password-text" data-bind="l10n_text: z.string.auth_verify_password_headline"></div>
             <div id="wire-verify-phone-password-container" class="form-control">
-              <input class="input password" id="wire-verify-password-input" type="password" maxlength="1024" autocomplete="off"
+              <input class="input password" id="wire-verify-password-input" type="password" maxlength="1024"
                      data-bind="css: {'input-error': failed_validation_password}, event: {input: clear_error_password}, l10n_tooltip: z.string.auth_placeholder_password_put, l10n_placeholder: z.string.auth_placeholder_password_put, textInput: password"
                      data-uie-name="enter-password">
             </div>

app/page/template/content/collection-details.htm

@@ -12,7 +12,7 @@
     </div>
 
     <div class="content-list-wrapper">
-      <div class="content-list" data-bind="antiscroll: true">
+      <div class="content-list collection-list" data-bind="antiscroll: true">
 
         <div class="collection-images">
 

app/page/template/content/collection.htm

@@ -1,6 +1,6 @@
 <div id="collection"
      class="collection content"
-     data-bind="with: $root.collection, removed_from_view: $root.collection.removed_from_view">
+     data-bind="with: $root.collection, added_to_view: $root.collection.added_to_view, removed_from_view: $root.collection.removed_from_view">
 
   <!-- ko if: conversation_et() -->
 
@@ -12,7 +12,7 @@
     </div>
 
     <div class="content-list-wrapper">
-      <div class="content-list" data-bind="antiscroll: true">
+      <div class="content-list collection-list" data-bind="antiscroll: true">
 
         <!-- ko ifnot: no_items_found() -->
           <!-- ko if: images().length -->

app/page/template/detail-view.htm

@@ -4,15 +4,15 @@
       <header class="detail-view-header">
           <div class="text-center">
             <div class="label-bold-xs" data-bind="text: message_et().sender_name()"></div>
-            <div class="label-xs" data-bind="text: moment(message_et().timestamp).format('DD/MM/YYYY h:mm')"></div>
+            <div class="label-xs" data-bind="text: moment(message_et().timestamp).format('DD/MM/YYYY H:mm')"></div>
           </div>
         <span class="detail-view-header-close-button icon-close icon-button" data-bind="click: click_on_close" data-uie-name="do-close-detail-view"></span>
       </header>
-      <div class="detail-view-main">
+      <div class="detail-view-main" data-bind="click: click_on_close">
         <img class="detail-view-image" data-bind="attr: {src: image_src()}" data-uie-name="status-picture"/>
       </div>
       <footer class="detail-view-footer">
-        <!-- ko if: message_et().get_first_asset().download && !message_et().is_ephemeral() -->
+        <!-- ko if: message_et().is_downloadable() && !message_et().is_ephemeral() -->
           <span class="detail-view-action-button" data-bind="click: click_on_download">
             <span class="icon-download"></span>
             <span data-bind="l10n_text: z.string.conversation_context_menu_download"></span>

app/page/template/list/conversations.htm

@@ -37,7 +37,7 @@
              data-bind="click: $parent.click_on_conversation">
           <div class="name"
                data-bind="attr: {'data-uie-uid': id, 'data-uie-value': display_name()},
-                          css: {'text-theme': $parent.content_state() === z.ViewModel.content.CONTENT_STATE.CONVERSATION && id === $parent.active_conversation_id()},
+                          css: {'text-theme': $parent.is_selected_conversation($data)},
                           text: display_name()"
                data-uie-name="item-call"></div>
           <!-- ko ifnot: call().is_declined() -->
@@ -174,7 +174,7 @@
 
       <!-- ko foreach: conversations_unarchived -->
         <li class="left-list-item"
-          data-bind="css: {'text-theme': $parent.content_state() === z.ViewModel.content.CONTENT_STATE.CONVERSATION && id === $parent.active_conversation_id()}">
+          data-bind="css: {'text-theme': $parent.is_selected_conversation($data)}">
           <div class="overlay"></div>
           <div class="left-column">
             <!-- ko if: unread_type() === z.conversation.ConversationUnreadType.UNREAD -->

app/page/template/partials/template-message.htm

@@ -270,7 +270,7 @@
       <hr class="message-header-line" />
     </div>
   </div>
-  <div class="message-body label-semibold" data-bind="text: message.name"></div>
+  <div class="message-body label-bold" data-bind="text: message.name"></div>
 </script>
 
 <script type="text/html" id="unable-to-decrypt">

app/script/components/asset/assetHeader.coffee

@@ -28,6 +28,6 @@ class z.components.AssetHeader
 ko.components.register 'asset-header',
   viewModel: z.components.AssetHeader
   template: """
-            <span class="text-capitalize" data-bind="text: message_et.user().first_name(), css: message_et.accent_color" class="asset-header-name"></span>
-            <span data-bind="text: moment(message_et.timestamp).format('D.M H:mm')" class="asset-header-time"></span>
+            <span class="asset-header-name" data-bind="text: message_et.user().first_name(), css: message_et.accent_color"></span>
+            <span class="asset-header-time" data-bind="text: moment(message_et.timestamp).format('D.M H:mm')"></span>
             """

app/script/components/asset/fileAsset.coffee

@@ -96,7 +96,7 @@ ko.components.register 'file-asset',
                   <div class="file-desc">
                     <div data-uie-name="file-name"
                          data-bind="text: z.util.trim_file_extension(asset.file_name)"
-                         class="label-xs label-semibold ellipsis"></div>
+                         class="label-bold-xs ellipsis"></div>
                     <ul class="file-desc-meta label-xs text-graphite">
                       <li data-uie-name="file-size" data-bind="text: z.util.format_bytes(asset.file_size)"></li>
                       <!-- ko if: z.util.get_file_extension(asset.file_name) -->

app/script/components/asset/linkPreviewAsset.coffee

@@ -62,7 +62,7 @@ ko.components.register 'link-preview-asset',
                 <!-- ko if: header -->
                   <asset-header class="link-preview-info-header" params="message: message_et"></asset-header>
                 <!-- /ko -->
-                <div class="link-preview-info-title ellipsis" data-uie-name="link-preview-title" data-bind="text: preview.title"></div>
+                <div class="link-preview-info-title" data-uie-name="link-preview-title" data-bind="text: preview.title, css: header ? 'link-preview-info-title-sigleline' : 'link-preview-info-title-multiline'"></div>
                 <a class="link-preview-info-link text-graphite ellipsis" data-uie-name="link-preview-url" target="_blank" rel="nofollow noopener noreferrer"
                    data-bind="text: z.util.naked_url(url), attr: {href: z.util.add_http(url), title: url}"></a>
               </div>
@@ -72,7 +72,7 @@ ko.components.register 'link-preview-asset',
                 <div class="link-preview-image-placeholder icon-link bg-color-ephemeral text-white"></div>
               </div>
               <div class="link-preview-info">
-                <div class="link-preview-info-title ephemeral-message-obfuscated ellipsis" data-bind="text: z.util.StringUtil.obfuscate(preview.title)"></div>
+                <div class="link-preview-info-title ephemeral-message-obfuscated" data-bind="text: z.util.StringUtil.obfuscate(preview.title), css: header ? 'link-preview-info-title-sigleline' : 'link-preview-info-title-multiline'"></div>
                 <a class="link-preview-info-link ephemeral-message-obfuscated ellipsis" target="_blank" rel="nofollow noopener noreferrer"
                    data-bind="text: z.util.StringUtil.obfuscate(url)"></a>
               </div>

app/script/entity/message/ContentMessage.coffee

@@ -104,3 +104,30 @@ class z.entity.ContentMessage extends z.entity.Message
   ###
   was_edited: ->
     return @replacing_message_id?
+
+  ###
+  Download message content.
+  ###
+  download: ->
+    asset_et = @get_first_asset()
+    file_name = @get_content_name()
+    asset_et.download file_name
+
+  ###
+  Get content name.
+
+  @return [Boolean]
+  ###
+  get_content_name: ->
+    asset_et = @get_first_asset()
+    file_name = asset_et.file_name
+
+    if not file_name
+      date = moment @timestamp
+      file_name = "Wire #{date.format('YYYY-MM-DD')} at #{date.format('H.mm.ss')}"
+
+    if asset_et.file_type
+      file_extension = asset_et.file_type.split('/').pop()
+      file_name = "#{file_name}.#{file_extension}"
+
+    return file_name

app/script/entity/message/MediumImage.coffee

@@ -43,15 +43,8 @@ class z.entity.MediumImage extends z.entity.Asset
     @resource = ko.observable()
 
   ###
-  # TODO combine with file
   Loads and decrypts otr asset as initiates download
   @return [Promise] Returns a promise that resolves with the asset as blob
   ###
   download: (file_name) =>
-    @resource()?.load().then (blob) =>
-      if file_name? or not @file_name
-        file_extension = @file_type.split('/').pop()
-        file_name = "#{file_name}.#{file_extension}"
-      else
-        file_name = @file_name
-      return z.util.download_blob blob, file_name
+    @resource()?.load().then (blob) -> z.util.download_blob blob, file_name

app/script/entity/message/Message.coffee

@@ -141,6 +141,13 @@ class z.entity.Message
   is_content: ->
     return @super_type is z.message.SuperType.CONTENT
 
+  ###
+  Check if the message content can be downloaded
+  @return [Boolean] Is message of type content
+  ###
+  is_downloadable: ->
+    return @get_first_asset?().download?
+
   ###
   Check if message is a member message.
   @return [Boolean] Is message of type member

app/script/view_model/AuthViewModel.coffee

@@ -220,8 +220,6 @@ class z.ViewModel.AuthViewModel
       .on 'hashchange', @_on_hash_change
       .on 'keydown', @keydown_auth
 
-    $("[id^='wire-login'], [id^='wire-register'], [id^='wire-verify']").prevent_prefill()
-
     # Select country based on location of user IP
     @country_code (z.util.CountryCodes.get_country_code($('[name=geoip]').attr 'country') or 1).toString()
     @changed_country_code()
@@ -1342,12 +1340,3 @@ $.fn.extend
       window.setTimeout =>
         $(@).focus()
       , 0
-
-  # FIX to prevent unwanted auto form fill on Chrome
-  prevent_prefill: ->
-    if z.util.Environment.browser.chrome or z.util.Environment.browser.opera
-      @each ->
-        $(@)
-          .attr 'readonly', true
-          .on 'focus', ->
-            $(@).removeAttr 'readonly'

app/script/view_model/ImageDetailViewViewModel.coffee

@@ -60,9 +60,7 @@ class z.ViewModel.ImageDetailViewViewModel
     @image_modal.hide()
 
   click_on_download: ->
-    date = moment @message_et().timestamp
-    name = "Wire #{date.format('YYYY-MM-DD')} at #{date.format('h.mm.ss')}"
-    @message_et().get_first_asset().download name
+    @message_et().download()
 
   click_on_like: =>
     @conversation_repository.toggle_like @conversation_et(), @message_et()

app/script/view_model/MessageListViewModel.coffee

@@ -378,7 +378,7 @@ class z.ViewModel.MessageListViewModel
 
     @_track_context_menu message_et
 
-    if message_et.get_first_asset()?.download? and not message_et.is_ephemeral()
+    if message_et.is_downloadable() and not message_et.is_ephemeral()
       entries.push {label: z.string.conversation_context_menu_download, action: 'download'}
 
     if message_et.is_reactable() and not @conversation().removed_from_conversation()
@@ -427,9 +427,7 @@ class z.ViewModel.MessageListViewModel
         amplify.publish z.event.WebApp.WARNING.MODAL, z.ViewModel.ModalType.DELETE_EVERYONE_MESSAGE,
           action: => @conversation_repository.delete_message_everyone @conversation(), message_et
       when 'download'
-        date = moment message_et.timestamp
-        name = "Wire #{date.format('YYYY-MM-DD')} at #{date.format('h.mm.ss')}"
-        message_et?.get_first_asset()?.download name
+        message_et.download()
       when 'edit'
         amplify.publish z.event.WebApp.CONVERSATION.MESSAGE.EDIT, message_et
       when 'react'

app/script/view_model/bindings/CommonBindings.coffee

@@ -329,9 +329,11 @@ ko.bindingHandlers.in_viewport = do ->
 
   listeners = []
 
-  window.addEventListener 'scroll', (e) ->
+  notify_listeners = _.throttle (e) ->
     listener(e) for listener in listeners by -1 # listeners can be deleted during iteration
-  , true
+  , 300
+
+  window.addEventListener 'scroll', notify_listeners, true
 
   init: (element, valueAccessor) ->
 

app/script/view_model/content/CollectionViewModel.coffee

@@ -33,7 +33,12 @@ class z.ViewModel.content.CollectionViewModel
 
     @no_items_found = ko.observable false
 
+  added_to_view: =>
+    $(document).on 'keydown.collection', (event) =>
+      amplify.publish z.event.WebApp.CONVERSATION.SHOW, @conversation_et() if event.keyCode is z.util.KEYCODE.ESC
+
   removed_from_view: =>
+    $(document).off 'keydown.collection'
     @no_items_found false
     @conversation_et null
     [@images, @files, @links].forEach (array) -> array.removeAll()
@@ -42,10 +47,9 @@ class z.ViewModel.content.CollectionViewModel
     @conversation_et conversation_et
     @conversation_repository.get_events_for_category conversation_et, z.message.MessageCategory.LINK_PREVIEW
     .then (message_ets) =>
-      if message_ets.length is 0
+      @populate_items message_ets
+      if @images().length + @files().length + @links().length is 0
         @no_items_found true
-      else
-        @populate_items message_ets
 
   populate_items: (message_ets) =>
     for message_et in message_ets