Mirrors/invoiceninja
1
0
Fork 0
mirror of https://github.com/invoiceninja/invoiceninja.git synced 2024-09-20 08:21:34 +02:00
Code Issues Releases Activity

PDF preview improvements (#3632)

Browse Source 
- Added total page and current page preview
- Added new "Page" translation
- Replaced CDN based assets with local
- Production builds of assets

Co-authored-by: David Bomba <turbo124@gmail.com>
This commit is contained in:
Benjamin Beganović 2020-04-16 23:18:07 +02:00 committed by GitHub
parent e5a230e0c7
commit 01e8afc1f6
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
10 changed files with 1751 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
public/css/app.css vendored
View File

File diff suppressed because one or more lines are too long

2
public/js/clients/shared/pdf.js vendored
View File

File diff suppressed because one or more lines are too long

1686
public/js/vendor/alpinejs/alpine.js vendored Normal file
View File

File diff suppressed because it is too large Load Diff

4
public/mix-manifest.json
View File

@ -1,12 +1,12 @@
{
"/js/app.js": "/js/app.js?id=8b49701583f407403ddf",
"/css/app.css": "/css/app.css?id=54b56cad767e049a84d7",
"/css/app.css": "/css/app.css?id=adcfc72ac9afb077fdb4",
"/js/clients/invoices/action-selectors.js": "/js/clients/invoices/action-selectors.js?id=caec43815d9a13168a38",
"/js/clients/invoices/payment.js": "/js/clients/invoices/payment.js?id=af49e24958be5fc00c92",
"/js/clients/payment_methods/authorize-stripe-card.js": "/js/clients/payment_methods/authorize-stripe-card.js?id=f4c45f0da9868d840799",
"/js/clients/payments/process.js": "/js/clients/payments/process.js?id=bb91cb611d1bdab40973",
"/js/clients/quotes/action-selectors.js": "/js/clients/quotes/action-selectors.js?id=f7c6bfdbf9cfc3efdf0b",
"/js/clients/quotes/approve.js": "/js/clients/quotes/approve.js?id=fcb23f15eebc3bff639d",
"/js/clients/shared/pdf.js": "/js/clients/shared/pdf.js?id=5e05bbd189e1f70e0c27",
"/js/clients/shared/pdf.js": "/js/clients/shared/pdf.js?id=fc675e996ad606c6eca6",
"/js/setup/setup.js": "/js/setup/setup.js?id=d30808ba9e2c9f908ce5"
}

23
resources/js/clients/shared/pdf.js vendored
View File

@ -53,6 +53,27 @@ class PDF {
return this;
}
setPagesInViewport() {
let currentPageContainer = document.getElementById(
"current-page-container"
);
let totalPageContainer = document.getElementById(
"total-page-container"
);
let paginationButtonContainer = document.getElementById(
"pagination-button-container"
);
currentPageContainer.innerText = this.currentPage;
totalPageContainer.innerText = this.maxPages;
if (this.maxPages > 1) {
paginationButtonContainer.style.display = "flex";
}
}
async handle() {
let pdf = await pdfjsLib.getDocument(this.url).promise;
@ -69,6 +90,8 @@ class PDF {
canvasContext: this.context,
viewport
});
this.setPagesInViewport();
}
}

3
resources/lang/en/texts.php
View File

@ -3197,5 +3197,8 @@ return [
'open_in_new_tab' => 'Open in new tab',
'complete_your_payment' => 'Complete payment',
'authorize_for_future_use' => 'Authorize payment method for future use',
'page' => 'Page',
'of' => 'Of',
'view_credit' => 'View Credit',
];

28
resources/views/portal/ninja2020/invoices/show.blade.php
View File

@ -62,16 +62,23 @@
<div class="flex items-center justify-between">
<section class="flex items-center">
<button class="input-label" id="previous-page-button">
<svg class="w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7"/>
</svg>
</button>
<button class="input-label" id="next-page-button">
<svg class="w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"/>
</svg>
</button>
<div class="items-center" style="display: none" id="pagination-button-container">
<button class="input-label focus:outline-none hover:text-blue-600 transition ease-in-out duration-300" id="previous-page-button" title="Previous page">
<svg class="w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7"/>
</svg>
</button>
<button class="input-label focus:outline-none hover:text-blue-600 transition ease-in-out duration-300" id="next-page-button" title="Next page">
<svg class="w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"/>
</svg>
</button>
</div>
<span class="text-sm text-gray-700 ml-2">{{ ctrans('texts.page') }}:
<span id="current-page-container"></span>
<span>{{ strtolower(ctrans('texts.of')) }}</span>
<span id="total-page-container"></span>
</span>
</section>
<div x-data="{ open: false }" @keydown.escape="open = false" @click.away="open = false" class="relative inline-block text-left">
<div>
@ -94,7 +101,6 @@
<div class="flex justify-center">
<canvas id="pdf-placeholder" class="shadow rounded-lg bg-white mt-4 p-4"></canvas>
</div>
@endsection
@section('footer')

3
resources/views/portal/ninja2020/layout/app.blade.php
View File

@ -44,8 +44,7 @@
<!-- Scripts -->
<script src="{{ mix('js/app.js') }}" defer></script>
<script src="https://cdn.jsdelivr.net/gh/alpinejs/alpine@v2.x.x/dist/alpine.js" defer></script>
<script src="https://kit.fontawesome.com/8a87eb8352.js" crossorigin="anonymous"></script>
<script src="{{ asset('js/vendor/alpinejs/alpine.js') }}" defer></script>
<!-- Fonts -->
<link rel="dns-prefetch" href="https://fonts.gstatic.com">

1
resources/views/portal/ninja2020/layout/clean.blade.php
View File

@ -44,7 +44,6 @@
<!-- Scripts -->
<script src="{{ mix('js/app.js') }}" defer></script>
<script src="https://kit.fontawesome.com/8a87eb8352.js" crossorigin="anonymous"></script>
<!-- Fonts -->
<link rel="dns-prefetch" href="https://fonts.gstatic.com">

28
resources/views/portal/ninja2020/quotes/show.blade.php
View File

@ -53,16 +53,23 @@
<div class="flex items-center justify-between">
<section class="flex items-center">
<button class="input-label" id="previous-page-button">
<svg class="w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7"/>
</svg>
</button>
<button class="input-label" id="next-page-button">
<svg class="w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"/>
</svg>
</button>
<div class="items-center" style="display: none" id="pagination-button-container">
<button class="input-label focus:outline-none hover:text-blue-600 transition ease-in-out duration-300" id="previous-page-button" title="Previous page">
<svg class="w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7"/>
</svg>
</button>
<button class="input-label focus:outline-none hover:text-blue-600 transition ease-in-out duration-300" id="next-page-button" title="Next page">
<svg class="w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"/>
</svg>
</button>
</div>
<span class="text-sm text-gray-700 ml-2">{{ ctrans('texts.page') }}:
<span id="current-page-container"></span>
<span>{{ strtolower(ctrans('texts.of')) }}</span>
<span id="total-page-container"></span>
</span>
</section>
<div x-data="{ open: false }" @keydown.escape="open = false" @click.away="open = false" class="relative inline-block text-left">
<div>
@ -85,7 +92,6 @@
<div class="flex justify-center">
<canvas id="pdf-placeholder" class="shadow rounded-lg bg-white mt-4 p-4"></canvas>
</div>
@endsection
@section('footer')