Merge PR #1467 into 12.0

Signed-off-by pedrobaeza
pull/1478/head
OCA-git-bot 2020-01-03 12:07:53 +00:00
commit c08a76c129
9 changed files with 170 additions and 3 deletions

View File

@ -103,6 +103,12 @@ Features for computers:
.. image:: https://raw.githubusercontent.com/OCA/web/12.0/web_responsive/static/img/chatter.gif
* When the chatter is configured on the side part, the document viewer fills that
part for side-by-side reading instead of full screen. You can still put it on full
width preview clicking on the new maximize button.
.. image:: https://raw.githubusercontent.com/OCA/web/12.0/web_responsive/static/img/document_viewer.gif
**Table of contents**
.. contents::

View File

@ -25,5 +25,6 @@
'static/src/xml/apps.xml',
'static/src/xml/form_view.xml',
'static/src/xml/navbar.xml',
'static/src/xml/document_viewer.xml',
],
}

View File

@ -75,3 +75,9 @@ Features for computers:
* Followers and send button is displayed on mobile. Avatar is hidden.
.. image:: ../static/img/chatter.gif
* When the chatter is configured on the side part, the document viewer fills that
part for side-by-side reading instead of full screen. You can still put it on full
width preview clicking on the new maximize button.
.. image:: ../static/img/document_viewer.gif

View File

@ -430,6 +430,11 @@ See <a class="reference external" href="https://github.com/odoo/odoo/issues/3006
<li><p class="first">Followers and send button is displayed on mobile. Avatar is hidden.</p>
<img alt="https://raw.githubusercontent.com/OCA/web/12.0/web_responsive/static/img/chatter.gif" src="https://raw.githubusercontent.com/OCA/web/12.0/web_responsive/static/img/chatter.gif" />
</li>
<li><p class="first">When the chatter is configured on the side part, the document viewer fills that
part for side-by-side reading instead of full screen. You can still put it on full
width preview clicking on the new maximize button.</p>
<img alt="https://raw.githubusercontent.com/OCA/web/12.0/web_responsive/static/img/document_viewer.gif" src="https://raw.githubusercontent.com/OCA/web/12.0/web_responsive/static/img/document_viewer.gif" />
</li>
</ul>
<p><strong>Table of contents</strong></p>
<div class="contents local topic" id="contents">

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.7 MiB

View File

@ -1,6 +1,8 @@
/* Copyright 2018 Tecnativa - Jairo Llopis
* License LGPL-3.0 or later (http://www.gnu.org/licenses/lgpl). */
$chatter_zone_width: 35%;
@mixin full-screen-dropdown {
border: none;
box-shadow: none;
@ -499,7 +501,7 @@ html .o_web_client .o_main .o_main_content {
.o_chatter {
border-left: 1px solid gray('400');
flex: 0 0 35%;
flex: 0 0 $chatter_zone_width;
max-width: initial;
min-width: initial;
overflow: auto;
@ -576,3 +578,106 @@ html .o_web_client .o_main .o_main_content {
.oe_wait {
cursor: progress;
}
// Document Viewer
.o_web_client.o_chatter_position_sided {
.o_modal_fullscreen.o_document_viewer {
// On-top of navbar
z-index: 10;
&.o_responsive_document_viewer {
/* Show sided viewer on large screens */
@include media-breakpoint-up(lg) {
width: $chatter_zone_width;
margin-left: auto;
/* Show/Hide control buttons (next, prev, etc..) */
&:hover .arrow, &:hover .o_viewer_toolbar {
display: unset;
}
.arrow, .o_viewer_toolbar {
display: none;
}
.o_viewer_img_wrapper {
position: relative;
.o_viewer_pdf {
width: 95%;
}
}
}
.o_minimize_btn {
display: none;
}
}
&:not(.o_responsive_document_viewer) {
.o_maximize_btn {
display: none;
}
}
@include media-breakpoint-down(lg) {
.o_minimize_btn, .o_maximize_btn {
display: none;
}
}
}
}
/* Max/Min buttons only are usefull in sided mode */
.o_web_client:not(.o_chatter_position_sided) {
.o_minimize_btn, .o_maximize_btn {
display: none;
}
}
// Apply improvements for Document Viewer on all modes
.o_modal_fullscreen .o_viewer_content {
.o_viewer-header {
.o_image_caption {
display: contents;
.o_split_pdf_area {
padding: 16px;
margin-bottom: 0;
position: relative;
top: -5px;
label {
margin-bottom: unset;
}
.o_page_number_input {
border: 1px solid white;
border-radius: 3px;
}
}
/* Hide 'split pdf' feature on small screens */
@include media-breakpoint-down(xs) {
.o_split_pdf_area {
display: none;
}
}
}
// Now uses a container to have more buttons
.o_buttons {
min-width: 35px;
text-align: right;
// Now close button ('X') it's a fa-icon
> .o_close_btn {
top: unset;
left: unset;
bottom: unset;
right: unset;
font-size: unset;
font-weight: unset;
}
}
}
.o_viewer_toolbar {
width: max-content;
}
}

View File

@ -14,6 +14,7 @@ odoo.define('web_responsive', function (require) {
var Menu = require("web.Menu");
var RelationalFields = require('web.relational_fields');
var Chatter = require('mail.Chatter');
var DocumentViewer = require('mail.DocumentViewer');
/*
* Helper function to know if are waiting
@ -525,4 +526,25 @@ odoo.define('web_responsive', function (require) {
// Include the SHIFT+ALT mixin wherever
// `KeyboardNavigationMixin` is used upstream
AbstractWebClient.include(KeyboardNavigationShiftAltMixin);
// DocumentViewer: Add support to maximize/minimize
DocumentViewer.include({
events: _.extend(DocumentViewer.prototype.events, {
'click .o_maximize_btn': '_onClickMaximize',
'click .o_minimize_btn': '_onClickMinimize',
}),
start: function () {
this.$btnMaximize = this.$('.o_maximize_btn');
this.$btnMinimize = this.$('.o_minimize_btn');
return this._super.apply(this, arguments);
},
_onClickMaximize: function () {
this.$el.removeClass('o_responsive_document_viewer');
},
_onClickMinimize: function () {
this.$el.addClass('o_responsive_document_viewer');
},
});
});

View File

@ -0,0 +1,22 @@
<?xml version="1.0" encoding="UTF-8"?>
<!-- Copyright 2019 Tecnativa - Alexandre Díaz
License LGPL-3.0 or later (http://www.gnu.org/licenses/lgpl). -->
<template>
<t t-extend="DocumentViewer">
<t t-jquery=".o_modal_fullscreen" t-operation="attributes">
<attribute name="class">modal o_modal_fullscreen o_document_viewer o_responsive_document_viewer</attribute>
<attribute name="data-backdrop">false</attribute>
</t>
</t>
<t t-extend="DocumentViewer.Content">
<t t-jquery=".o_close_btn" t-operation="replace">
<div class="o_buttons float-right mr8">
<a role="button" class="mr8 o_maximize_btn" tabindex="0" aria-label="Maximize" title="Maximize"><i class="fa fa-window-maximize"></i></a>
<a role="button" class="mr8 o_minimize_btn" tabindex="0" aria-label="Minimize" title="Minimize"><i class="fa fa-window-minimize"></i></a>
<a role="button" class="o_close_btn" tabindex="0" aria-label="Close" title="Close"><i class="fa fa-close"></i></a>
</div>
</t>
</t>
</template>

View File

@ -11,8 +11,8 @@
inherit_id="web.webclient_bootstrap"
name="App Drawer - Web Client"
>
<xpath expr="//*[hasclass('o_main')]" position="attributes">
<attribute name="t-attf-class">o_main o_chatter_position_{{ request.env.user.chatter_position or 'normal' }}</attribute>
<xpath expr="//t[@t-set='body_classname']" position="attributes">
<attribute name="t-value">'o_web_client o_chatter_position_' + (request.env.user.chatter_position or 'normal')</attribute>
</xpath>
</template>