API tools faq
paste
Advertisement
KoctrX

Untitled

KoctrX
Sep 26th, 2023
748
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
JavaScript 17.03 KB | None | 0 0
raw download clone embed print report
  1. import Basic from "./basic.js";
  2.  
  3. class Resize extends Basic {
  4.     constructor() {
  5.         super();
  6.  
  7.         this.app = app;
  8.         this.deletedPages = [];
  9.         this.sizesConfig = [];
  10.         this.marginConfig = [];
  11.         this.changeViewLocked = false;
  12.         this.viewAs = 'document';
  13.         this.selected = {};
  14.         this.toolName = 'resize-pdf';
  15.         this.init();
  16.     }
  17.  
  18.     async init() {
  19.         console.log(`METHOD init`); //! LOG
  20.         let that = this;
  21.         fetch("/pdfcpu/pdfcpu.wasm").then((x) => {
  22.             console.log("🟢️ wasm loaded");
  23.         });
  24.  
  25.         $(document).on('click', '#view-as-documents', function (e) {
  26.             $('.doc-item--selected').removeClass('doc-item--selected');
  27.  
  28.             that.viewAsDocumens();
  29.         })
  30.  
  31.         $(document).on('click', '#view-as-pages', function (e) {
  32.             $('.doc-item--selected').removeClass('doc-item--selected');
  33.  
  34.             that.viewAsPages();
  35.         })
  36.  
  37.         $(document).on('click', '[data-fid]', function (e) {
  38.             e.preventDefault();
  39.             that.selectPage($(this));
  40.         })
  41.  
  42.         // type of resizing buttons (margns&padding or page size)
  43.         $('.resize-type-selector').click(e => {
  44.             setTimeout(() => {
  45.                 this.renderChangeSizes();
  46.                 $('.doc-item--selected').removeClass('doc-item--selected');
  47.             }, 200);
  48.         });
  49.  
  50.         // page seize inputs
  51.         ['left', 'top', 'right', 'bottom'].forEach(key => {
  52.             $(`[name="margins-${key}"]`).on('change', e => this.setupUniqueSizes());
  53.         });
  54.  
  55.         // margns&padding selectors
  56.         $("[data-optional] input").on("change", e => {
  57.             console.log(`CHANGE: [data-optional] input`); //! LOG
  58.             // if (e.target.closest('#selectPageSize')) {
  59.                 this.setupUniqueSizes();
  60.             // }
  61.         });
  62.  
  63.         // custom page size (margns&padding -> custom size)
  64.         ['custom_paper_height', 'custom_paper_width'].forEach(key => {
  65.             $(`.${key}`).on('change', e => this.setupUniqueSizes());
  66.         });
  67.     }
  68.  
  69.     getPageSizesValues() {
  70.         let resize_type = $('.resize-type-selector.active-tab').data('type');
  71.         let new_paper_size = false;
  72.  
  73.         if (resize_type == 2) {
  74.             new_paper_size = $('[name="page-size"]:checked').val();
  75.  
  76.             if (new_paper_size == 'custom_size') {
  77.                 let w = parseFloat($(".custom_paper_width").val());
  78.                 let h = parseFloat($(".custom_paper_height").val());
  79.                 if (w < 0) { $(".custom_paper_width").val(0); w = 0; }
  80.                 if (h < 0) { $(".custom_paper_height").val(0); h = 0; }
  81.  
  82.                 new_paper_size = `${w}in,${h}in`;
  83.             }
  84.  
  85.             new_paper_size = new_paper_size.replace(/in/g, '').split(',').map(size => parseFloat(size));
  86.         } else if (resize_type == 1) {
  87.             new_paper_size = {
  88.                 top: parseFloat($('[name="margins-top"]').val()),
  89.                 left: parseFloat($('[name="margins-left"]').val()),
  90.                 right: parseFloat($('[name="margins-right"]').val()),
  91.                 bottom: parseFloat($('[name="margins-bottom"]').val())
  92.             };
  93.  
  94.             ['left', 'top', 'right', 'bottom'].forEach(key => {
  95.                 if (new_paper_size[key] < 0 || isNaN(new_paper_size[key])) {
  96.                     $(`[name="margins-${key}"]`).val(0);
  97.                     new_paper_size[key] = 0;
  98.                 }
  99.             });
  100.         }
  101.  
  102.         return new_paper_size;
  103.     }
  104.  
  105.     getUpdateSizeKey() {
  106.         const selectedType = document.querySelector('.resize-type-selector.active-tab').dataset.type;
  107.  
  108.         return selectedType == 1 ? 'marginConfig' : 'sizesConfig';
  109.     }
  110.  
  111.     setupUniqueSizes() {
  112.         const sizes = this.getPageSizesValues();
  113.         const key = this.getUpdateSizeKey();
  114.         console.log(`METHOD setupUniqueSizes`, sizes, key); //! LOG
  115.  
  116.         if (this.viewAs == 'pages') {
  117.             console.log(` pages`); //! LOG
  118.             const documentList = document.querySelector('.documents_list');
  119.             const pagesSelected = Array.from(documentList.querySelectorAll('.doc-item--selected')).map(el => {
  120.                 return { fid: el.dataset.fid, page: el.dataset.fpage };
  121.             }).filter(data => data.fid && data.page);
  122.  
  123.             if (pagesSelected && pagesSelected.length) {
  124.                 this[key] = this[key].filter(sc => !pagesSelected.find(ps => ps.fid == sc.fid && ps.page == sc.page));
  125.                 this[key].push(...pagesSelected.map(page => ({ ...page, sizes })));
  126.             } else {
  127.                 this.setupCurrentSizeToAllPages();
  128.             }
  129.         } else {
  130.             console.log(` docs`); //! LOG
  131.             // fileid надо, тогда проставиться сайз для всех страниц
  132.             const files = Array.from($('.documents_list').find('.doc-item--selected')).map(element => ({ id: element.dataset.fid }));
  133.             this.setupCurrentSizeToAllPages(files && files.length ? files : this.files);
  134.         }
  135.  
  136.         this.renderChangeSizes();
  137.     }
  138.  
  139.     renderChangeSizes() {
  140.         for (const file of this.files) {
  141.             const fileData = this.loaded_files[file.id];
  142.             if (!fileData || !fileData._pdfInfo) continue;
  143.  
  144.             new Array(fileData._pdfInfo.numPages).fill(false).forEach((t, i) => {
  145.                 this.renderPageSizePreview(i + 1, file.id, false);
  146.             });
  147.         }
  148.     }
  149.  
  150.     setupCurrentSizeToAllPages(files = false) {
  151.         if (!files) files = this.files;
  152.         const sizes = this.getPageSizesValues();
  153.  
  154.         const replacedConfig = files.reduce((result, file) => {
  155.             const pagesConfig = this.loaded_files[file.id];
  156.             if (!pagesConfig || !pagesConfig._pdfInfo) return result;
  157.             const data = new Array(pagesConfig._pdfInfo.numPages)
  158.                 .fill(false).map((q, i) => i + 1)
  159.                 .filter(pn => !this.deletedPages.find(dp => dp.page == pn && dp.id == file.id));
  160.  
  161.             if (data && data.length) {
  162.                 result.push(...data.map(pn => ({ fid: file.id, page: pn, sizes })));
  163.             }
  164.  
  165.             return result;
  166.         }, []);
  167.  
  168.         this[this.getUpdateSizeKey()] = replacedConfig;
  169.         console.log('REPLACED CONFIG', replacedConfig);
  170.     }
  171.  
  172.     selectPage(el) {
  173.         let page = el.data('fpage');
  174.         let id = el.data('fid');
  175.         let selectedClass = 'doc-item--selected';
  176.         let selected = this.selected[id].includes(page);
  177.        
  178.         if (selected) {
  179.             el.removeClass(selectedClass);
  180.             this.selected[id].splice(this.selected[id].indexOf(page), 1);
  181.         } else {
  182.             el.addClass(selectedClass);
  183.             this.selected[id].push(page);
  184.         }
  185.     }
  186.  
  187.     unselectAll() {
  188.         let that = this;
  189.         Object.keys(this.selected).forEach(function (fid, index) {
  190.             that.selected[fid] = [];
  191.         });
  192.     }
  193.  
  194.     viewAsDocumens() {
  195.         if (this.changeViewLocked || this.viewAs == 'document') {
  196.             return;
  197.         }
  198.         this.lockChangeView();
  199.         this.unselectAll();
  200.  
  201.         $(".documents_list:not(:last-of-type)").remove();
  202.         $(".documents_list").empty();
  203.         $('.list-docs--header').addClass('hidden');
  204.  
  205.         for (let i = 0; i < this.files.length; i++) {
  206.             this.documentPreview(this.files[i]);
  207.         }
  208.  
  209.         this.viewAs = 'document';
  210.         this.lockChangeView(false);
  211.     }
  212.  
  213.     viewAsPages() {
  214.         if (this.changeViewLocked || this.viewAs == 'pages') { return; }
  215.  
  216.         this.lockChangeView();
  217.         this.unselectAll();
  218.  
  219.         $(".list-doc:not(:last-child)").remove();
  220.         $(".documents_list").empty();
  221.  
  222.         for (let i = 0; i < this.files.length; i++) {
  223.             let file = this.files[i];
  224.             this.documentPagesPreview(file, this.loaded_files[file.id]._pdfInfo.numPages);
  225.  
  226.             if (i < this.files.length - 1) {
  227.                 this.createWraperForDocPages();
  228.             }
  229.         }
  230.  
  231.         this.viewAs = 'pages';
  232.         this.lockChangeView(false);
  233.     }
  234.  
  235.     createWraperForDocPages() {
  236.         let prevWrapper = $(".list-doc:last-child");
  237.         let clone = prevWrapper.clone();
  238.         clone.appendTo(prevWrapper.parent());
  239.         clone.find('.documents_list').empty();
  240.     }
  241.  
  242.     lockChangeView(lock = true) {
  243.         let el = $('.change-view-type');
  244.         this.changeViewLocked = lock;
  245.         lock ? el.addClass('c-wait') : el.removeClass('c-wait');
  246.     }
  247.  
  248.     getResizeType() {
  249.         let resize_type = $('.resize-type-selector.active-tab').data('type');
  250.         switch (resize_type) {
  251.             case 1:
  252.                 resize_type = 'margins';
  253.                 break;
  254.             case 2:
  255.                 resize_type = 'paper';
  256.                 break;
  257.         }
  258.  
  259.         return resize_type;
  260.     }
  261.  
  262.     collectParams(fid) {
  263.         let new_paper_size = $('[name="page-size"]:checked').val();
  264.         let dims = {};
  265.         let defDims = {};
  266.         let resize_type = this.getResizeType();
  267.  
  268.         if (new_paper_size == 'custom_size') {
  269.             new_paper_size = $(".custom_paper_width").val() + "in," + $(".custom_paper_height").val() + "in";
  270.         }
  271.  
  272.         if (resize_type == 'margins') {
  273.             dims.top = $('[name="margins-top"]').val();
  274.             dims.left = $('[name="margins-left"]').val();
  275.             dims.right = $('[name="margins-right"]').val();
  276.             dims.bottom = $('[name="margins-bottom"]').val();
  277.             defDims.top = defDims.left = defDims.right = defDims.bottom = 0;
  278.         } else if (resize_type == 'paper') {
  279.             let ps = new_paper_size.replace(/\s/g, '');
  280.             ps = ps.split('in,');
  281.             dims.width = ps[0];
  282.             dims.heigth = ps[1].replace(/in/g, '');
  283.             defDims.width = defDims.heigth = 0;
  284.         }
  285.  
  286.         let pages = false;
  287.         if (resize_type == 'paper') {
  288.             let sizes = this.sizesConfig.filter(sc => sc.fid == fid);
  289.             pages = sizes.reduce((result, item) => {
  290.                 const [width, height] = item.sizes;
  291.  
  292.                 result[item.page] = {
  293.                     page_num: item.page,
  294.                     rotation: 0,
  295.                     new: { width, height }
  296.                 };
  297.  
  298.                 return result;
  299.             }, {});
  300.         } else if (resize_type == 'margins') {
  301.             let margins = this.marginConfig.filter(mc => mc.fid == fid);
  302.             pages = margins.reduce((result, item) => {
  303.                 result[item.page] = {
  304.                     page_num: item.page,
  305.                     rotation: 0,
  306.                     new: item.sizes
  307.                 };
  308.  
  309.                 return result;
  310.             }, {});
  311.         }
  312.  
  313.         let result = { resize_type, pages, new_paper_size };
  314.         const deletePages = this.deletedPages.filter(dp => dp.id == fid).reduce((res, item) => {
  315.             res.push(item.page);
  316.  
  317.             return res;
  318.         }, []);
  319.  
  320.         return { ...result, deletePages };
  321.     }
  322.  
  323.     async processPdf() {
  324.         this.showLoading(".after_upload");
  325.         const resize_type = this.getResizeType();
  326.         const isEmptySizes = !this.sizesConfig && !this.sizesConfig.length && resize_type == 'paper';
  327.         const isEmptyMargins = !this.marginConfig && !this.marginConfig.length && resize_type == 'margins';
  328.         if (isEmptySizes || isEmptyMargins) this.setupCurrentSizeToAllPages();
  329.  
  330.         // try{
  331.         await store.fs.uploadFiles(this.files);
  332.  
  333.         for (let i = 0; i < this.files.length; i++) {
  334.             let file = this.files[i];
  335.             this.updateLoadingValue(file, i + 1, this.files.length, 0);
  336.             const params = this.collectParams(file.id);
  337.  
  338.             let resp = await app.components.resize.apply(file.name, params);
  339.             this.results[resp.name] = resp;
  340.         };
  341.  
  342.         this.afterProcessPdf();
  343.         // }catch(e){
  344.         //     console.error("⛔️", e);
  345.         //     alert("error (1)");
  346.         // }
  347.  
  348.         this.hideLoading(".after_upload");
  349.     }
  350.  
  351.     async afterFilesSelected(files) {
  352.         try {
  353.             $(".footer").addClass("hidden");
  354.  
  355.             for (let i = 0; i < files.length; i++) {
  356.                 let file = files[i];
  357.                 this.selected[file.id] = [];
  358.                 this.loadPdf(file).then((res) => {
  359.                     if (this.viewAs == 'pages') {
  360.                         this.createWraperForDocPages();
  361.                         this.documentPagesPreview(res.file, res.pdf_doc._pdfInfo.numPages);
  362.                     } else {
  363.                         this.documentPreview(res.file);
  364.                     }
  365.                 });
  366.             }
  367.  
  368.         } catch (e) {
  369.             console.error(e);
  370.         }
  371.  
  372.         this.showAfterUpload();
  373.     }
  374.  
  375.     deletePageCallback(el) {
  376.         const parent = el.closest('.doc-item');
  377.         const data = parent.dataset;
  378.  
  379.         if (data.fpage) {
  380.             this.deletedPages.push({ id: data.fid, page: data.fpage });
  381.             this.sizesConfig = this.sizesConfig.filter(sc => !(sc.page == data.fpage && sc.fid == data.fid));
  382.             this.marginConfig = this.marginConfig.filter(mc => !(mc.page == data.fpage && mc.fid == data.fid));
  383.    
  384.             parent.remove();
  385.             return;
  386.         }
  387.  
  388.         this.deletedPages = this.deletedPages.filter(dp => dp.id != data.fid);
  389.         return this.deleteFile(parent.data('fid'), false, $(parent));
  390.     }
  391.  
  392.     async documentPreview(file, page = null) {
  393.         let previewSelector = `preview-${file.id}`;
  394.         let name = file.name;
  395.         let pagedata = '';
  396.  
  397.         if (page) {
  398.             previewSelector += `-${page}`;
  399.             name = 'Page ' + page;
  400.             pagedata = `data-fpage="${page}"`;
  401.  
  402.             if (this.deletedPages.find(dp => dp.page == page && dp.id == file.id)) {
  403.                 console.log('DELETED PAGE NOT RENDER!', file.id, page);
  404.                 return false;
  405.             }
  406.         }
  407.  
  408.         let template = `<div class="doc-item doc_outer" data-fid="${file.id}" ${pagedata}>
  409.             <div class="doc-page">
  410.                 <div class="doc-page--img">
  411.                     <canvas id="${previewSelector}"></canvas>
  412.                 </div>
  413.  
  414.                 <div class="doc-page--text">
  415.                     ${name}
  416.                 </div>
  417.                
  418.                 <div class="doc-page--text" data-type="size">8.5″ x 11″</div>
  419.  
  420.                 <div class="doc-page--controls">
  421.                     <div class="flex flex-col items-end mb--8">
  422.                         ${this.getPreviewBtn(!page)}
  423.                         ${this.getDeleteBtn()}
  424.                     </div>
  425.                 </div>
  426.             </div>
  427.         </div>`;
  428.  
  429.         $(".list-doc:last-child  .documents_list").append(template);
  430.         const { viewport } = await this.renderPreviewImage(file, page ?? 1, 181, 243, '#' + previewSelector);
  431.         await this.renderPageSizePreview(page, file.id, viewport);
  432.  
  433.         return template;
  434.     }
  435.  
  436.     async renderPageSizePreview(pn, fid, dataViewport = false) {
  437.         if(!pn || pn == undefined) pn = 1;
  438.         let viewport = this.cloneDeep(dataViewport);
  439.         const sizeConfig = this.sizesConfig.find(sc => sc.fid == fid && sc.page == pn);
  440.         const type = this.getResizeType();
  441.  
  442.         if (sizeConfig && type != 'margins') {
  443.             viewport = {
  444.                 width: sizeConfig.sizes[0],
  445.                 height: sizeConfig.sizes[1],
  446.                 type: 'inch'
  447.             };
  448.  
  449.         } else if (!viewport) {
  450.             viewport = await this.getViewportByFIDAndPageNumber(fid, pn);
  451.         }
  452.  
  453.         if (viewport.type != 'inch') {
  454.             viewport.width = this.app.utils.pointsToInch(viewport.width / viewport.scale);
  455.             viewport.height = this.app.utils.pointsToInch(viewport.height / viewport.scale);
  456.         }
  457.  
  458.         if (type == 'margins') {
  459.             const margin = this.marginConfig.find(mc => mc.fid == fid && mc.page == pn);
  460.             if (margin) {
  461.                 viewport.width += margin.sizes.left + margin.sizes.right;
  462.                 viewport.height += margin.sizes.top + margin.sizes.bottom;
  463.             }
  464.         }
  465.  
  466.         if (this.sizesConfig)
  467.             if (this.viewAs == 'pages') {
  468.                 const sizeElement = $(`[data-fid="${fid}"][data-fpage="${pn}"]`).find('[data-type="size"]')[0];
  469.                 sizeElement.innerHTML = `${viewport.width.toFixed(2)}″ x ${viewport.height.toFixed(2)}″`;
  470.             } else {
  471.                 const sizeElement = $(`[data-fid="${fid}"]`).find('[data-type="size"]')[0];
  472.                 if (sizeElement) {
  473.                     sizeElement.innerHTML = `${viewport.width.toFixed(2)}″ x ${viewport.height.toFixed(2)}″`;
  474.                 }
  475.             }
  476.     }
  477.  
  478.     documentPagesPreview(file, pages) {
  479.         for (let j = 0; j < pages; j++) {
  480.             this.documentPreview(file, j + 1);
  481.         }
  482.  
  483.         let wrapper = $(".list-doc:last-child");
  484.         wrapper.find('.list-docs--header').removeClass('hidden');
  485.         wrapper.find('.line-name-text').html(file.name);
  486.     }
  487. }
  488.  
  489. let resize_tool = new Resize();
  490. window.new_pdf_tool = window.resize_tool = resize_tool;
  491.  
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!