Skip to content

Commit

Permalink
Merge pull request #622 from wireapp/dev
Browse files Browse the repository at this point in the history 
staging bump 2017-01-12
  • Loading branch information
@herrmannplatz
herrmannplatz authored Jan 12, 2017
2 parents 72fd4b5 + 5b7c068 commit b19e09a
Show file tree
Hide file tree
Showing 49 changed files with 522 additions and 597 deletions.
Binary file modified app/font/Wire.ttf
100644 → 100755
View file
Binary file not shown.
1 change: 0 additions & 1 deletion app/page/template/_dist/app.htm
View file
Original file line number Diff line number Diff line change
Expand Up @@ -240,7 +240,6 @@
<script src="/script/components/asset/audioAsset.js"></script>
<script src="/script/components/asset/fileAsset.js"></script>
<script src="/script/components/asset/linkPreviewAsset.js"></script>
<script src="/script/components/asset/linkPreviewCompactAsset.js"></script>
<script src="/script/components/asset/locationAsset.js"></script>
<script src="/script/components/asset/controls/audioSeekBar.js"></script>
<script src="/script/components/asset/controls/seekBar.js"></script>
Expand Down
51 changes: 15 additions & 36 deletions app/page/template/content/collection-details.htm
View file
Original file line number Diff line number Diff line change
@@ -1,57 +1,36 @@
<div id="collection-details"
class="collection content-wrapper"
class="collection-details content"
data-bind="with: $root.collection_details, removed_from_view: $root.collection_details.removed_from_view">

<!-- ko if: conversation_et() -->

<div class="content-titlebar">

<div class="content-titlebar-items-left">
<span class="content-titlebar-icon icon-back" data-bind="click: click_on_back_button"></span>
</div>

<span class="content-titlebar-items-center">
<span><span class="label-bold-xs">Pictures</span> <span class="text-graphite">in</span> <span class="text-graphite" data-bind="text: conversation_et().display_name()"></span></span>
</span>

<span class="content-titlebar-items-center" data-bind="text: conversation_et().display_name()"></span>
</div>

<div class="content-list">

<div class="collection-images">
<div class="content-list-wrapper">
<div class="content-list" data-bind="antiscroll: true">

<!-- ko if: template() === 'images' -->
<!-- ko foreach: {data: items(), as: 'message_et'} -->
<image-component class="collection-image" params="asset: message_et.get_first_asset().resource"></image-component>
<!-- /ko -->
<!-- /ko -->
<div class="collection-images">

<!-- ko if: template() === 'links' -->
<!-- ko foreach: {data: items(), as: 'message_et'} -->
<link-preview-compact-asset params="message: message_et, header: true"></link-preview-compact-asset>
<!-- ko if: message_et.category & z.message.MessageCategory.IMAGE -->
<image-component class="collection-image" data-bind="click: $parent.click_on_image" params="asset: message_et.get_first_asset().resource"></image-component>
<!-- /ko -->
<!-- ko if: message_et.category & z.message.MessageCategory.LINK -->
<link-preview-asset params="message: message_et, header: true"></link-preview-asset>
<!-- /ko -->
<!-- ko if: message_et.category & z.message.MessageCategory.FILE -->
<file-asset class="collection-file" params="message: message_et, header: true"></file-asset>
<!-- /ko -->
<!-- /ko -->
<!-- /ko -->

<!-- ko if: template() === 'files' -->
<!-- ko foreach: {data: items(), as: 'message_et'} -->
<file-asset class="collection-file" params="message: message_et, header: true"></file-asset>
<!-- /ko -->
<!-- /ko -->

<!-- ko if: template() === 'audio' -->
<!-- ko foreach: {data: items(), as: 'message_et'} -->
<audio-asset class="collection-file" params="message: message_et, header: true"></audio-asset>
<!-- /ko -->
<!-- /ko -->

<!-- ko if: template() === 'video' -->
<!-- ko foreach: {data: items(), as: 'message_et'} -->
<video-asset class="collection-file" params="message: message_et"></video-asset>
<!-- /ko -->
<!-- /ko -->
</div>

</div>

</div>

<!-- /ko -->
Expand Down
165 changes: 63 additions & 102 deletions app/page/template/content/collection.htm
View file
Original file line number Diff line number Diff line change
@@ -1,119 +1,80 @@
<div id="collection"
class="collection content-wrapper"
class="collection content"
data-bind="with: $root.collection, removed_from_view: $root.collection.removed_from_view">

<!-- ko if: conversation_et() -->

<div class="content-titlebar">

<span class="content-titlebar-items-center" data-bind="text: conversation_et().display_name()"></span>

<div class="content-titlebar-items-right">
<div class="content-titlebar-items-left">
<span class="content-titlebar-icon icon-close" data-bind="click: click_on_back_button"></span>
</div>

<span class="content-titlebar-items-center" data-bind="text: conversation_et().display_name()"></span>
</div>

<div class="content-list collection-list">

<!-- ko ifnot: no_items_found() -->

<!-- ko if: images().length -->
<section class="collection-section" data-uie-name="collection-section-image">
<header>
<span class="collection-header-icon icon-library"></span>
<span class="label-bold-xs">Pictures</span>
<!-- ko if: images().length > 10 -->
<span class="collection-header-all text-theme" data-bind="click: function() { click_on_section('images', images()) }"><span data-bind="l10n_html: {'id': z.string.collection_show_all, 'replace': {'placeholder': '%no', 'content': images().length}}" data-uie-name="collection-size"></span> <span class="icon-forward font-size-xxs"></span></span>
<!-- /ko -->
</header>
<div class="collection-images">
<!-- ko foreach: {data: images.slice(0,10), as: 'message_et'} -->
<image-component class="collection-image" data-bind="click: $parent.click_on_image" params="asset: message_et.get_first_asset().resource"></image-component>
<!-- /ko -->
</div>
</section>
<!-- /ko -->

<!-- ko if: links().length -->
<section class="collection-section" data-uie-name="collection-section-link">
<header>
<span class="collection-header-icon icon-link"></span>
<span class="label-bold-xs">Links</span>
<!-- ko if: links().length > 4 -->
<span class="collection-header-all text-theme" data-bind="click: function() { click_on_section('links', links()) }"><span data-bind="l10n_html: {'id': z.string.collection_show_all, 'replace': {'placeholder': '%no', 'content': links().length}}" data-uie-name="collection-size"></span> <span class="icon-forward font-size-xxs"></span></span>
<!-- /ko -->
</header>
<div class="collection-images">
<!-- ko foreach: {data: links.slice(0,4), as: 'message_et'} -->
<link-preview-compact-asset params="message: message_et, header: true"></link-preview-compact-asset>
<!-- /ko -->
</div>
</section>
<div class="content-list-wrapper">
<div class="content-list" data-bind="antiscroll: true">

<!-- ko ifnot: no_items_found() -->
<!-- ko if: images().length -->
<section class="collection-section" data-uie-name="collection-section-image">
<header>
<span class="collection-header-icon icon-library"></span>
<span class="label-bold-xs" data-bind="l10n_text: z.string.collection_section_images"></span>
<!-- ko if: images().length > 12 -->
<span class="collection-header-all text-theme" data-bind="click: function() { click_on_section('images', images()) }"><span data-bind="l10n_html: {'id': z.string.collection_show_all, 'replace': {'placeholder': '%no', 'content': images().length}}" data-uie-name="collection-size"></span> <span class="icon-forward font-size-xxs"></span></span>
<!-- /ko -->
</header>
<div class="collection-images">
<!-- ko foreach: {data: images.slice(0, 12), as: 'message_et'} -->
<image-component class="collection-image" data-bind="click: $parent.click_on_image" params="asset: message_et.get_first_asset().resource"></image-component>
<!-- /ko -->
</div>
</section>
<!-- /ko -->

<!-- ko if: links().length -->
<section class="collection-section" data-uie-name="collection-section-link">
<header>
<span class="collection-header-icon icon-link"></span>
<span class="label-bold-xs" data-bind="l10n_text: z.string.collection_section_links"></span>
<!-- ko if: links().length > 4 -->
<span class="collection-header-all text-theme" data-bind="click: function() { click_on_section('links', links()) }"><span data-bind="l10n_html: {'id': z.string.collection_show_all, 'replace': {'placeholder': '%no', 'content': links().length}}" data-uie-name="collection-size"></span> <span class="icon-forward font-size-xxs"></span></span>
<!-- /ko -->
</header>
<div class="collection-images">
<!-- ko foreach: {data: links.slice(0, 4), as: 'message_et'} -->
<link-preview-asset params="message: message_et, header: true"></link-preview-asset>
<!-- /ko -->
</div>
</section>
<!-- /ko -->

<!-- ko if: files().length -->
<section class="collection-section" data-uie-name="collection-section-file">
<header>
<span class="collection-header-icon icon-file"></span>
<span class="label-bold-xs" data-bind="l10n_text: z.string.collection_section_files"></span>
<!-- ko if: files().length > 4 -->
<span class="collection-header-all text-theme" data-bind="click: function() { click_on_section('files', files()) }"><span data-bind="l10n_html: {'id': z.string.collection_show_all, 'replace': {'placeholder': '%no', 'content': files().length}}" data-uie-name="collection-size"></span> <span class="icon-forward font-size-xxs"></span></span>
<!-- /ko -->
</header>
<div class="collection-images">
<!-- ko foreach: {data: files.slice(0, 4), as: 'message_et'} -->
<file-asset class="collection-file" params="message: message_et, header: true"></file-asset>
<!-- /ko -->
</div>
</section>
<!-- /ko -->
<!-- /ko -->

<!-- ko if: video().length -->
<section class="collection-section" data-uie-name="collection-section-video">
<header>
<span class="collection-header-icon icon-video"></span>
<span class="label-bold-xs">Videos</span>
<!-- ko if: video().length > 4 -->
<span class="collection-header-all text-theme" data-bind="click: function() { click_on_section('video', video()) }"><span data-bind="l10n_html: {'id': z.string.collection_show_all, 'replace': {'placeholder': '%no', 'content': video().length}}" data-uie-name="collection-size"></span> <span class="icon-forward font-size-xxs"></span></span>
<!-- /ko -->
</header>
<div class="collection-images">
<!-- ko foreach: {data: video.slice(0,4), as: 'message_et'} -->
<video-asset class="collection-video" params="message: message_et"></video-asset>
<!-- /ko -->
</div>
</section>
<!-- ko if: no_items_found() -->
<div class="absolute-center" data-uie-name="collection-no-items">
<div class="collection-no-items-icon icon-collection"></div>
<div class="label-bold-xs text-graphite text-center">No items</div>
</div>
<!-- /ko -->

<!-- ko if: audio().length -->
<section class="collection-section" data-uie-name="collection-section-audio">
<header>
<span class="collection-header-icon icon-microphone"></span>
<span class="label-bold-xs">Audio messages</span>
<!-- ko if: audio().length > 4 -->
<span class="collection-header-all text-theme" data-bind="click: function() { click_on_section('audio', audio()) }"><span data-bind="l10n_html: {'id': z.string.collection_show_all, 'replace': {'placeholder': '%no', 'content': audio().length}}" data-uie-name="collection-size"></span> <span class="icon-forward font-size-xxs"></span></span>
<!-- /ko -->
</header>
<div class="collection-images">
<!-- ko foreach: {data: audio.slice(0,4), as: 'message_et'} -->
<audio-asset class="collection-file" params="message: message_et, header: true"></audio-asset>
<!-- /ko -->
</div>
</section>
<!-- /ko -->

<!-- ko if: files().length -->
<section class="collection-section" data-uie-name="collection-section-file">
<header>
<span class="collection-header-icon icon-file"></span>
<span class="label-bold-xs">files</span>
<!-- ko if: files().length > 4 -->
<span class="collection-header-all text-theme" data-bind="click: function() { click_on_section('files', files()) }"><span data-bind="l10n_html: {'id': z.string.collection_show_all, 'replace': {'placeholder': '%no', 'content': files().length}}" data-uie-name="collection-size"></span> <span class="icon-forward font-size-xxs"></span></span>
<!-- /ko -->
</header>
<div class="collection-images">
<!-- ko foreach: {data: files.slice(0,4), as: 'message_et'} -->
<file-asset class="collection-file" params="message: message_et, header: true"></file-asset>
<!-- /ko -->
</div>
</section>
<!-- /ko -->

<!-- /ko -->

<!-- ko if: no_items_found() -->

<div class="absolute-center" data-uie-name="collection-no-items">
<div class="collection-no-items-icon icon-collection"></div>
<div class="label-bold-xs text-graphite text-center">No items</div>
</div>

<!-- /ko -->

</div>
</div>

<!-- /ko -->
Expand Down
2 changes: 1 addition & 1 deletion app/page/template/content/conversation/message-list.htm
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
<div class="message"
data-bind="css: $parent.get_css_class(message),
in_viewport: function() {$parent.message_in_viewport(message)},
attr: {'data-uie-uid': message.id, 'data-uie-value': message.super_type}, 'data-uie-sending-status': message.status"
attr: {'data-uie-uid': message.id, 'data-uie-value': message.super_type, 'data-uie-expired-status': message.ephemeral_expires}"
data-uie-name="item-message">
<div data-bind="template: {name: 'timestamp'}"></div>
<div data-bind="template: {name: message.super_type}"></div>
Expand Down
44 changes: 40 additions & 4 deletions app/page/template/detail-view.htm
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,42 @@
<div id="detail-view" class="modal detail-view">
<img class="detail-view-image modal-content-anim-close" data-bind="attr: {src: image_src()}, css: {'modal-content-anim-open': image_visible()}" data-uie-name="status-picture"/>
<div class="detail-view-close-button">
<span class="icon-close icon-button" data-bind="click: hide_detail_view" data-uie-name="do-close-detail-view"></span>
</div>
<!-- ko if: message_et() && conversation_et() -->
<div class="detail-view-content modal-content-anim-close" data-bind="css: {'modal-content-anim-open': image_visible()}">
<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>
<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">
<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() -->
<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>
</span>
<!-- /ko -->
<!-- ko if: message_et().is_reactable() && !conversation_et().removed_from_conversation() -->
<span class="detail-view-action-button" data-bind="click: click_on_like">
<span data-bind="css: message_et().is_liked() ? 'icon-liked text-red' : 'icon-like'"></span>
<span data-bind="l10n_text: z.string.conversation_context_menu_like"></span>
</span>
<!-- /ko -->
<!-- ko if: message_et().is_deletable() -->
<span class="detail-view-action-button" data-bind="click: click_on_delete">
<span class="icon-delete-for-me"></span>
<span data-bind="l10n_text: z.string.conversation_context_menu_delete"></span>
</span>
<!-- /ko -->
<!-- ko if: message_et().user().is_me && message_et().status() !== z.message.StatusType.SENDING && !conversation_et().removed_from_conversation() -->
<span class="detail-view-action-button" data-bind="click: click_on_delete_for_everyone">
<span class="icon-delete-for-everyone"></span>
<span data-bind="l10n_text: z.string.conversation_context_menu_delete_everyone"></span>
</span>
<!-- /ko -->
</footer>
</div>
<!-- /ko -->
</div>
6 changes: 3 additions & 3 deletions app/page/template/partials/template-message.htm
View file
Original file line number Diff line number Diff line change
Expand Up @@ -62,11 +62,11 @@

<!-- ko foreach: {data: message.assets, as: 'asset'} -->
<!-- ko if: asset.is_image() -->
<div class="message-asset-image" data-bind="fit_to_viewport: asset">
<div class="message-asset-image">
<div class="image image-loading" data-bind="
attr: {'data-uie-visible': $parent.visible},
background_image: asset.resource,
click: $parents[1].show_detail,
click: function() {$parents[1].show_detail(message, event)},
css: {'bg-color-ephemeral': message.is_expired()},
viewport_changed: $parents[1].viewport_changed
" data-uie-name="go-image-detail">
Expand All @@ -92,7 +92,7 @@
<div class="text" data-bind="html: asset.render(), css: {'text-graphite': $parent.is_editing, 'text-large': z.util.emoji.includes_only_emojies(asset.text), 'text-graphite': message.status() === z.message.StatusType.SENDING, 'ephemeral-message-obfuscated': message.is_expired()}" dir="auto"></div>
<!-- /ko -->
<!-- ko foreach: asset.previews() -->
<link-preview-compact-asset data-bind="css: {'ephemeral-asset-expired': message.is_expired()}" params="message: message"></link-preview-compact-asset>
<link-preview-asset class="message-asset" data-bind="css: {'ephemeral-asset-expired': message.is_expired()}" params="message: message"></link-preview-asset>
<!-- /ko -->
<!-- /ko -->
<!-- ko if: asset.is_video() -->
Expand Down
2 changes: 1 addition & 1 deletion app/script/components/asset/assetHeader.coffee
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,6 +28,6 @@ class z.components.AssetHeader
ko.components.register 'asset-header',
viewModel: z.components.AssetHeader
template: """
<span data-bind="text: message_et.sender_name(), css: message_et.accent_color" class="asset-header-name"></span>
<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>
"""
Loading

0 comments on commit b19e09a

Please sign in to comment.