@everymatrix/blog-articles-grid 1.13.10 → 1.13.12
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/blog-articles-grid/blog-articles-grid.esm.js +1 -1
- package/dist/blog-articles-grid/p-369fb926.entry.js +1 -0
- package/dist/blog-articles-grid/p-ed2f13d0.js +1 -0
- package/dist/cjs/blog-articles-grid.cjs.js +2 -2
- package/dist/cjs/blog-articles-grid_2.cjs.entry.js +50 -8
- package/dist/cjs/{index-a19b0ad2.js → index-c17538b7.js} +25 -0
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/collection/components/blog-articles-grid/blog-articles-grid.js +24 -9
- package/dist/collection/utils/locale.utils.js +5 -1
- package/dist/collection/utils/utils.js +17 -0
- package/dist/components/blog-articles-grid.js +45 -8
- package/dist/components/helper-pagination2.js +7 -1
- package/dist/esm/blog-articles-grid.js +2 -2
- package/dist/esm/blog-articles-grid_2.entry.js +50 -8
- package/dist/esm/{index-04850975.js → index-c02b7464.js} +25 -0
- package/dist/esm/loader.js +2 -2
- package/dist/types/Users/sebastian.strulea/Documents/work/widgets-stencil/packages/blog-articles-grid/.stencil/packages/blog-articles-grid/stencil.config.d.ts +2 -0
- package/dist/types/components/blog-articles-grid/blog-articles-grid.d.ts +4 -0
- package/dist/types/utils/utils.d.ts +1 -0
- package/package.json +2 -2
- package/dist/blog-articles-grid/p-d93771be.entry.js +0 -1
- package/dist/blog-articles-grid/p-f0d2badc.js +0 -1
- package/dist/types/Users/adrian.pripon/Documents/Work/stencil/widgets-stencil/packages/blog-articles-grid/.stencil/packages/blog-articles-grid/stencil.config.d.ts +0 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
import{p as e,b as t}from"./p-
|
|
1
|
+
import{p as e,b as t}from"./p-ed2f13d0.js";(()=>{const t=import.meta.url,n={};return""!==t&&(n.resourcesUrl=new URL(".",t).href),e(n)})().then((e=>t([["p-369fb926",[[1,"blog-articles-grid",{cmsEndpoint:[1,"cms-endpoint"],language:[1],handleClick:[1,"handle-click"],clientStyling:[1,"client-styling"],clientStylingUrl:[1,"client-styling-url"],showPublishingDate:[4,"show-publishing-date"],showImage:[4,"show-image"],showTitle:[4,"show-title"],showContent:[4,"show-content"],showButton:[4,"show-button"],usePostmessage:[4,"use-postmessage"],postMessageEvent:[1,"post-message-event"],blogsLimit:[514,"blogs-limit"],paginationActive:[516,"pagination-active"],arrowsActive:[516,"arrows-active"],secondaryArrowsActive:[516,"secondary-arrows-active"],numberedNavActive:[516,"numbered-nav-active"],paginationBlogList:[32],currentPage:[32],hasErrors:[32],limitStylingAppends:[32],isLoading:[32],bannerMatrixReady:[32],nextPage:[32],previousPage:[32],device:[32]},[[8,"BannerMatrixReady","handleBannerReady"],[0,"hpPageChange","hpPageChange"]]],[1,"helper-pagination",{nextPage:[1537,"next-page"],prevPage:[1537,"prev-page"],offset:[1538],limit:[1538],total:[1538],language:[1537],clientStyling:[1537,"client-styling"],clientStylingUrlContent:[1537,"client-styling-url-content"],arrowsActive:[1540,"arrows-active"],secondaryArrowsActive:[1540,"secondary-arrows-active"],numberedNavActive:[1540,"numbered-nav-active"],offsetInt:[32],lastPage:[32],previousPage:[32],limitInt:[32],totalInt:[32],pagesArray:[32],endInt:[32],limitStylingAppends:[32]}]]]],e)));
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{r as t,c as i,h as n}from"./p-ed2f13d0.js";const e=["ro","en","fr","ar","hu"],s={en:{error:"Error",readmore:"Read more"},ro:{error:"Eroare",readmore:"Read more"},fr:{error:"Error",readmore:"Read more"},ar:{error:"خطأ",readmore:"Read more"},hu:{error:"Error",readmore:"Read more"}},o=(t,i)=>{const n=i;return s[void 0!==n&&e.includes(n)?n:"en"][t]},r=class{constructor(e){t(this,e),this.articleActionButton=i(this,"articleActionButton",7),this.language="en",this.clientStyling="",this.clientStylingUrl="",this.showPublishingDate=!0,this.showImage=!0,this.showTitle=!0,this.showContent=!0,this.showButton=!0,this.postMessageEvent="articleActionButton",this.paginationBlogList={offset:0},this.currentPage=0,this.hasErrors=!1,this.limitStylingAppends=!1,this.isLoading=!0,this.bannerMatrixReady=!1,this.nextPage="",this.previousPage="",this.device="",this.defaultStyling="\n div#PaginationContainer {\n justify-content: right;\n }\n .LeftItems button .NavigationButton {\n display: none;\n }\n .LeftItems button:after, .RightItems button:after {\n padding: 7px 12px;\n font-size: 18px;\n font-weight: 700;\n line-height: 46px;\n }\n .LeftItems button:after {\n content: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1.2em' viewBox='0 0 320 512'%3E%3C!--! Font Awesome Free 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --%3E%3Cpath d='M9.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l192 192c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L77.3 256 246.6 86.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-192 192z'/%3E%3C/svg%3E\");\n }\n .RightItems button:after {\n content: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1.2em' viewBox='0 0 320 512'%3E%3C!--! Font Awesome Free 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --%3E%3Cpath d='M310.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-192 192c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L242.7 256 73.4 86.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l192 192z'/%3E%3C/svg%3E\");\n display: block;\n height: 38px;\n }\n div.LeftItems button, div.RightItems button {\n width: unset;\n height: 40px;\n background-color: #fff;\n color: #000;\n border: 1px solid #000;\n overflow: hidden;\n &:disabled {\n background-color: #989898;\n }\n }\n div.LeftItems button {\n min-width: 60px;\n border-radius: 20px 0 0 20px;\n border-right: 0;\n }\n div.RightItems button {\n display: flex;\n min-width: 100px;\n justify-content: space-evenly;\n align-items: center;\n border-radius: 0 20px 20px 0;\n text-transform: none;\n }\n .RightItems button .NavigationButton {\n padding: 12px 0 12px 12px;\n font-weight: 700;\n }",this.setClientStyling=()=>{let t=document.createElement("style");t.innerHTML=this.clientStyling,this.stylingContainer.prepend(t)},this.setClientStylingURL=()=>{let t=new URL(this.clientStylingUrl),i=document.createElement("style");fetch(t.href).then((t=>t.text())).then((t=>{i.innerHTML=t,setTimeout((()=>{this.stylingContainer.prepend(i)}),1)})).catch((t=>{console.log("error ",t)}))},this.renderContentConditionally=t=>{if(t)return-1!==t.indexOf("<bannermatrix-banner")?this.bannerMatrixReady?n("div",{class:"BlogContent",innerHTML:t}):null:n("div",{class:"BlogContent",innerHTML:t})}}getArticleId(t){this.articleActionButton.emit({postId:t}),this.usePostmessage&&window.postMessage({type:this.postMessageEvent,postId:t})}handleBannerReady(){this.bannerMatrixReady=!0}watchEndpoint(t,i){t&&t!=i&&this.cmsEndpoint&&this.getBlogArticleGrid()}hpPageChange(t){var i,n;this.paginationBlogList=t.detail,this.currentPage=Math.floor((null===(i=this.paginationBlogList)||void 0===i?void 0:i.offset)/(null===(n=this.paginationBlogList)||void 0===n?void 0:n.limit)),this.currentPage+1>this.lastPage||this.getBlogArticleGrid()}handleAction(t){this.getArticleId(t)}connectedCallback(){this.cmsEndpoint&&this.language&&this.getBlogArticleGrid()}componentDidLoad(){window.postMessage({type:"BlogArticlesGridLoaded"},window.location.href),this.detectAndAlertDeviceType()}detectAndAlertDeviceType(){this.device=function(){const t=navigator.userAgent.toLowerCase(),i=screen.availWidth,n=screen.availHeight;if(t.includes("iphone"))return"mobile";if(t.includes("android")){if(n>i&&i<800)return"mobile";if(i>n&&n<800)return"tablet"}return"desktop"}()}sortArticlesByDate(t){return t.sort(((t,i)=>t.publishingDate>i.publishingDate?-1:t.publishingDate<i.publishingDate?1:0)),t}findLatestFeatured(t){let i=t.filter((t=>t.isFeaturedPost));return 0===i.length?null:(i=this.sortArticlesByDate(i),i[0])}moveLatestFeatureToStart(t,i){const n=t.indexOf(i);return-1!==n&&(t.splice(n,1),t.unshift(i)),t}getBlogArticleGrid(){this.isLoading=!0;let t=new URL(`${this.cmsEndpoint}/${this.language}/blog-posts`);t.searchParams.append("per_page",JSON.stringify(this.blogsLimit)),t.searchParams.append("page",JSON.stringify(this.currentPage+1)),fetch(t.href).then((t=>{if(t.status>=300)throw this.hasErrors=!0,new Error("There was an error while fetching the data");return t.json()})).then((t=>{this.lastPage=+t.pages.last.slice(t.pages.last.lastIndexOf("=")+1);let i=t.items;this.nextPage=t.pages.next,this.previousPage=t.pages.previous;const n=this.findLatestFeatured(i);this.blogData=this.sortArticlesByDate(i),this.blogData=this.moveLatestFeatureToStart(i,n),this.blogData.items=i.map((t=>Object.assign(Object.assign({},t),{publishingDate:new Date(t.publishingDate).toLocaleDateString()}))),this.isLoading=!1})).catch((t=>{this.hasErrors=!0,console.log("Error",t)})).finally((()=>this.isLoading=!1))}componentDidRender(){!this.limitStylingAppends&&this.stylingContainer&&(this.clientStyling&&this.setClientStyling(),this.clientStylingUrl&&this.setClientStylingURL(),this.limitStylingAppends=!0)}formatDateToYearMonthDay(t){let i=new Date(t),n=i.getFullYear(),e=String(i.getMonth()+1).padStart(2,"0");return`${String(i.getDate()).padStart(2,"0")}-${e}-${n}`}render(){var t,i;return this.hasErrors?n("div",{class:"BlogArticleDetails"},n("div",{class:"Title"},o("error",this.language))):n("div",{ref:t=>this.stylingContainer=t},n("div",{class:"BlogGridPaginationWrapper"},1==this.paginationActive&&n("helper-pagination",{"next-page":this.nextPage,"prev-page":this.previousPage,offset:this.paginationBlogList.offset,limit:this.blogsLimit,total:null===(i=null===(t=this.blogData)||void 0===t?void 0:t.items)||void 0===i?void 0:i.length,language:this.language,"client-styling":this.clientStyling||this.defaultStyling,"arrows-active":this.arrowsActive||!1,"secondary-arrows-active":this.secondaryArrowsActive||!1,"numbered-nav-active":this.numberedNavActive||!1})),!this.isLoading&&n("div",{class:"GridContainerWrapper"},this.blogData.map((t=>{var i,e;return n("div",{class:"GridContainer"},this.showPublishingDate&&n("div",{class:"BlogDate"},this.formatDateToYearMonthDay(null==t?void 0:t.publishingDate)),this.showImage&&n("div",{class:"BlogBanner"},(null===(i=t.image)||void 0===i?void 0:i.src)?n("img",{src:t.image.src,alt:t.image.src}):(null===(e=t.video)||void 0===e?void 0:e.sources[this.device])?n("video",{src:t.video.sources[this.device],controls:!0}):n("h1",{style:{color:"white"}},"No Image")),this.showTitle&&n("div",{class:"BlogTitle"},null==t?void 0:t.title),this.showContent&&this.renderContentConditionally(null==t?void 0:t.content),this.showButton&&n("div",{class:"BlogLink"},n("button",{onClick:()=>this.handleAction(null==t?void 0:t.postID)},o("readmore",this.language))))}))))}static get watchers(){return{cmsEndpoint:["watchEndpoint"],language:["watchEndpoint"]}}};r.style=":host {\n display: block;\n}\n\n.GridContainerWrapper {\n display: grid;\n}\n\n.GridContainer {\n margin: auto;\n width: 100%;\n height: 280px;\n border-radius: 15px;\n background-color: #07072A;\n margin-bottom: 20px;\n display: grid;\n gap: 30px;\n grid-template-rows: 1fr 4fr 1fr 1fr;\n grid-template-columns: 30px 1fr 1fr 30px;\n}\n.GridContainer .BlogBanner {\n grid-column: 1/3;\n grid-row: 1/5;\n}\n.GridContainer .BlogBanner img {\n border-radius: 5px 0 0 5px;\n width: 100%;\n height: 280px;\n}\n.GridContainer .BlogDate {\n font-size: 12px;\n border-radius: 5px 5px 0 0;\n padding: 10px;\n width: fit-content;\n text-align: center;\n color: #FFFFFF;\n background-color: #0D0D4D;\n grid-column: 2/2;\n grid-row: 4/4;\n z-index: 1;\n}\n.GridContainer .BlogTitle {\n font-size: 24px;\n color: #FFF;\n margin-top: 20px;\n grid-column: 3/5;\n}\n.GridContainer .BlogContent {\n font-size: 14px;\n color: #FFF;\n width: 90%;\n max-height: 80px;\n overflow: hidden;\n text-overflow: ellipsis;\n grid-column: 3/5;\n}\n.GridContainer .BlogLink {\n grid-column: 3/5;\n color: #FFF;\n}\n.GridContainer .BlogLink button {\n font-size: 14px;\n border: none;\n padding: 0;\n background: none;\n color: #D0046C;\n cursor: pointer;\n}\n\n@container (max-width: 475px) {\n .GridContainerWrapper {\n display: grid;\n }\n\n .GridContainer {\n margin: auto;\n width: 100%;\n min-height: 400px;\n gap: 10%;\n padding-bottom: 30px;\n border-radius: 5px;\n background-color: #07072A;\n margin-bottom: 20px;\n display: grid;\n grid-template-rows: repeat(auto-fit, minmax(50px, 1fr));\n grid-template-rows: auto auto auto 50px;\n grid-template-columns: 15px auto auto 15px;\n gap: 10px;\n }\n .GridContainer .BlogBanner {\n grid-column: 1/5;\n grid-row: 1/3;\n margin: 0;\n }\n .GridContainer .BlogBanner img {\n width: 100%;\n height: 232px;\n border-radius: 5px 5px 0 0;\n }\n .GridContainer .BlogDate {\n grid-column: 2/3;\n grid-row: 2/3;\n font-size: 12px;\n border-radius: 5px 5px 0 0;\n padding: 10px;\n width: fit-content;\n text-align: center;\n color: #FFFFFF;\n background-color: #0D0D4D;\n z-index: 1;\n }\n .GridContainer .BlogTitle {\n grid-column: 2/4;\n font-size: 24px;\n color: #FFF;\n }\n .GridContainer .BlogContent {\n grid-column: 2/4;\n font-size: 14px;\n color: #FFF;\n }\n .GridContainer .BlogLink {\n grid-column: 2/4;\n color: #FFF;\n cursor: pointer;\n }\n .GridContainer .BlogLink button {\n font-size: 14px;\n border: none;\n background: none;\n color: #D0046C;\n cursor: pointer;\n }\n}";const a=t=>!!(t.toLowerCase().match(/android/i)||t.toLowerCase().match(/blackberry|bb/i)||t.toLowerCase().match(/iphone|ipad|ipod/i)||t.toLowerCase().match(/windows phone|windows mobile|iemobile|wpdesktop/i)),h=["ro","en","hu"],l={en:{firstPage:"First",previousPage:"Previous",nextPage:"Next",lastPage:"Last"},ro:{firstPage:"Prima",previousPage:"Anterior",nextPage:"Urmatoarea",lastPage:"Ultima"},fr:{firstPage:"First",previousPage:"Previous",nextPage:"Next",lastPage:"Last"},ar:{firstPage:"First",previousPage:"Previous",nextPage:"Next",lastPage:"Last"},hu:{firstPage:"First",previousPage:"Previous",nextPage:"Következő",lastPage:"Last"}},d=(t,i)=>{const n=i;return l[void 0!==n&&h.includes(n)?n:"en"][t]},c=class{constructor(n){t(this,n),this.hpPageChange=i(this,"hpPageChange",7),this.nextPage="",this.prevPage="",this.offset=0,this.limit=1,this.total=1,this.language="en",this.clientStyling="",this.clientStylingUrlContent="",this.lastPage=!1,this.previousPage=!1,this.pagesArray=[],this.endInt=0,this.userAgent=window.navigator.userAgent,this.currentPage=1,this.limitStylingAppends=!1,this.navigateTo=t=>{switch(t){case"firstPage":this.offsetInt=0;break;case"lastPage":this.offsetInt=this.endInt*this.limitInt;break;case"previousPage":this.offsetInt-=this.limitInt;break;case"nextPage":this.offsetInt+=this.limitInt;break;case"fivePagesBack":this.offsetInt-=5*this.limitInt,this.offsetInt=this.offsetInt<=0?0:this.offsetInt;break;case"fivePagesForward":this.offsetInt+=5*this.limitInt,this.offsetInt=this.offsetInt/this.limitInt>=this.endInt?this.endInt*this.limitInt:this.offsetInt}this.previousPage=!!this.offsetInt,this.hpPageChange.emit({offset:this.offsetInt,limit:this.limitInt,total:this.totalInt})},this.paginationNavigation=(t,i)=>{this.previousPage=!0,isNaN(t)?0===i&&this.currentPage<=4?this.navigateTo("firstPage"):0===i&&this.currentPage>4?this.navigateTo("fivePagesBack"):4===i&&this.endInt-this.currentPage>=2&&this.navigateTo("fivePagesForward"):1===t?(this.offsetInt=t-1,this.previousPage=!1):this.offsetInt=(t-1)*this.limitInt,this.hpPageChange.emit({offset:this.offsetInt,limit:this.limitInt,total:this.totalInt})},this.setClientStyling=()=>{let t=document.createElement("style");t.innerHTML=this.clientStyling,this.stylingContainer.prepend(t)},this.setClientStylingURL=()=>{let t=document.createElement("style");setTimeout((()=>{t.innerHTML=this.clientStylingUrlContent,this.stylingContainer.prepend(t)}),1)}}componentWillRender(){this.offsetInt=this.offset,this.limitInt=this.limit,this.currentPage=this.offsetInt/this.limitInt+1,this.limitInt=this.limit,this.totalInt=this.total,this.endInt=Math.ceil(this.totalInt/this.limitInt)-1,this.lastPage=!(this.offsetInt>=this.endInt*this.limitInt),1==this.currentPage||2==this.currentPage?(this.pagesArray=Array.from({length:4},((t,i)=>i+1)),this.pagesArray.push("...")):this.currentPage>=3&&this.endInt-this.currentPage>=2?(this.pagesArray=Array.from({length:3},((t,i)=>this.currentPage+i-1)),this.pagesArray.push("..."),this.pagesArray.unshift("...")):this.endInt-this.currentPage<3&&(this.pagesArray=Array.from({length:4},((t,i)=>this.endInt-2+i)),this.pagesArray.unshift("..."))}componentDidRender(){!this.limitStylingAppends&&this.stylingContainer&&(this.clientStyling&&this.setClientStyling(),this.clientStylingUrlContent&&this.setClientStylingURL(),this.limitStylingAppends=!0)}render(){let t=n("ul",{class:"PaginationArea"},this.pagesArray.map(((t,i)=>n("li",{class:"PaginationItem"+(t===this.currentPage?" ActiveItem":" ")+" "+(a(this.userAgent)?"MobileButtons":"")},n("button",{disabled:t===this.currentPage,onClick:this.paginationNavigation.bind(this,t,i)},n("span",null,t)))))),i=n("button",{disabled:!this.prevPage,onClick:this.navigateTo.bind(this,"firstPage")},n("span",{class:"NavigationButton"},d("firstPage",this.language)),n("span",{class:"NavigationIcon"})),e=n("div",{class:"LeftItems"},this.secondaryArrowsActive&&i,n("button",{disabled:!this.prevPage,onClick:this.navigateTo.bind(this,"previousPage")},n("span",{class:"NavigationButton"},d("previousPage",this.language)),n("span",{class:"NavigationIcon"})));a(this.userAgent)&&(e=n("div",{class:"LeftItems"},n("button",{disabled:!this.prevPage,onClick:this.navigateTo.bind(this,"previousPage")},n("span",{class:"NavigationButton"},d("previousPage",this.language)),n("span",{class:"NavigationIcon"}))));let s=n("button",{disabled:!this.nextPage,onClick:this.navigateTo.bind(this,"lastPage")},n("span",{class:"NavigationButton"},d("lastPage",this.language)),n("span",{class:"NavigationIcon"})),o=n("div",{class:"RightItems"},n("button",{disabled:!this.nextPage,onClick:this.navigateTo.bind(this,"nextPage")},n("span",{class:"NavigationButton"},d("nextPage",this.language)),n("span",{class:"NavigationIcon"})),this.secondaryArrowsActive&&s);return a(this.userAgent)&&(o=n("div",{class:"RightItems"},n("button",{disabled:!this.nextPage,onClick:this.navigateTo.bind(this,"nextPage")},n("span",{class:"NavigationButton"},d("nextPage",this.language)),n("span",{class:"NavigationIcon"})))),n("div",{id:"PaginationContainer",ref:t=>this.stylingContainer=t},this.arrowsActive&&e,this.numberedNavActive&&t,this.arrowsActive&&o)}};c.style='@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap");:host{display:block;font-family:"Roboto", sans-serif}#PaginationContainer{width:100%;margin:20px 0;display:inline-flex;justify-content:space-between;align-items:center}.LeftItems button:not(:first-child),.RightItems button:not(:last-child){margin:0 10px}.LeftItems button,.RightItems button{padding:0;background-color:#009993;border-color:#009993}.PaginationArea{display:inline-flex;gap:10px;list-style:none}.PaginationArea li{margin:0;padding:0}.PaginationArea li button{width:24px;height:24px;display:flex;border:0;padding:0;justify-content:center;align-items:center;background-color:transparent;color:#000;cursor:pointer;pointer-events:all}.PaginationItem.ActiveItem button{background:#009993;border-color:#009993;color:#fff}.PaginationItem.ActiveItem button:disabled{pointer-events:none;cursor:not-allowed}.PaginationItem button:hover,.PaginationItem button:active{background:#009993;border-color:#009993;color:#fff;opacity:0.8}button{width:100px;height:32px;border:1px solid #524e52;border-radius:5px;background:#524e52;color:#fff;font-size:14px;font:inherit;cursor:pointer;transition:all 0.1s linear;text-transform:uppercase;text-align:center;letter-spacing:0}button:hover,button:active{background:#004D4A;border-color:#004D4A}button:disabled{background-color:#ccc;border-color:#ccc;color:#fff;cursor:not-allowed}@media screen and (max-width: 720px){button{width:90px;font-size:14px}}@media screen and (max-width: 480px){button{width:70px;font-size:14px}.paginationArea{padding:5px}}@media screen and (max-width: 320px){button{width:58px;font-size:12px}.paginationArea{padding:5px;gap:5px}}@media (hover: none){.paginationItem button:hover{background:inherit;border-color:inherit;color:inherit;opacity:1}.paginationItem.activeItem button:hover{background:#009993;border-color:#009993;color:#fff}}';export{r as blog_articles_grid,c as helper_pagination}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
let e,t,n=!1;const l="undefined"!=typeof window?window:{},s=l.document||{head:{}},o={t:0,l:"",jmp:e=>e(),raf:e=>requestAnimationFrame(e),ael:(e,t,n,l)=>e.addEventListener(t,n,l),rel:(e,t,n,l)=>e.removeEventListener(t,n,l),ce:(e,t)=>new CustomEvent(e,t)},c=e=>Promise.resolve(e),r=(()=>{try{return new CSSStyleSheet,"function"==typeof(new CSSStyleSheet).replace}catch(e){}return!1})(),i=(e,t,n)=>{n&&n.map((([n,l,s])=>{const c=a(e,n),r=u(t,s),i=f(n);o.ael(c,l,r,i),(t.o=t.o||[]).push((()=>o.rel(c,l,r,i)))}))},u=(e,t)=>n=>{try{256&e.t?e.i[t](n):(e.u=e.u||[]).push([t,n])}catch(e){K(e)}},a=(e,t)=>8&t?l:e,f=e=>0!=(2&e),d=new WeakMap,h=e=>"sc-"+e.h,y={},$=e=>"object"==(e=typeof e)||"function"===e,m=(e,t,...n)=>{let l=null,s=!1,o=!1,c=[];const r=t=>{for(let n=0;n<t.length;n++)l=t[n],Array.isArray(l)?r(l):null!=l&&"boolean"!=typeof l&&((s="function"!=typeof e&&!$(l))&&(l+=""),s&&o?c[c.length-1].$+=l:c.push(s?p(null,l):l),o=s)};if(r(n),t){const e=t.className||t.class;e&&(t.class="object"!=typeof e?e:Object.keys(e).filter((t=>e[t])).join(" "))}const i=p(e,null);return i.m=t,c.length>0&&(i.p=c),i},p=(e,t)=>({t:0,S:e,$:t,g:null,p:null,m:null}),b={},w=(e,t,n,s,c,r)=>{if(n!==s){let i=J(e,t),u=t.toLowerCase();if("class"===t){const t=e.classList,l=g(n),o=g(s);t.remove(...l.filter((e=>e&&!o.includes(e)))),t.add(...o.filter((e=>e&&!l.includes(e))))}else if("style"===t){for(const t in n)s&&null!=s[t]||(t.includes("-")?e.style.removeProperty(t):e.style[t]="");for(const t in s)n&&s[t]===n[t]||(t.includes("-")?e.style.setProperty(t,s[t]):e.style[t]=s[t])}else if("ref"===t)s&&s(e);else if(i||"o"!==t[0]||"n"!==t[1]){const l=$(s);if((i||l&&null!==s)&&!c)try{if(e.tagName.includes("-"))e[t]=s;else{let l=null==s?"":s;"list"===t?i=!1:null!=n&&e[t]==l||(e[t]=l)}}catch(e){}null==s||!1===s?!1===s&&""!==e.getAttribute(t)||e.removeAttribute(t):(!i||4&r||c)&&!l&&e.setAttribute(t,s=!0===s?"":s)}else t="-"===t[2]?t.slice(3):J(l,u)?u.slice(2):u[2]+t.slice(3),n&&o.rel(e,t,n,!1),s&&o.ael(e,t,s,!1)}},S=/\s/,g=e=>e?e.split(S):[],j=(e,t,n,l)=>{const s=11===t.g.nodeType&&t.g.host?t.g.host:t.g,o=e&&e.m||y,c=t.m||y;for(l in o)l in c||w(s,l,o[l],void 0,n,t.t);for(l in c)w(s,l,o[l],c[l],n,t.t)},v=(t,n,l)=>{let o,c,r=n.p[l],i=0;if(null!==r.$)o=r.g=s.createTextNode(r.$);else if(o=r.g=s.createElement(r.S),j(null,r,!1),null!=e&&o["s-si"]!==e&&o.classList.add(o["s-si"]=e),r.p)for(i=0;i<r.p.length;++i)c=v(t,r,i),c&&o.appendChild(c);return o},M=(e,n,l,s,o,c)=>{let r,i=e;for(i.shadowRoot&&i.tagName===t&&(i=i.shadowRoot);o<=c;++o)s[o]&&(r=v(null,l,o),r&&(s[o].g=r,i.insertBefore(r,n)))},k=(e,t,n,l,s)=>{for(;t<=n;++t)(l=e[t])&&(s=l.g,P(l),s.remove())},C=(e,t)=>e.S===t.S,O=(e,t)=>{const n=t.g=e.g,l=e.p,s=t.p,o=t.$;null===o?(j(e,t,!1),null!==l&&null!==s?((e,t,n,l)=>{let s,o=0,c=0,r=t.length-1,i=t[0],u=t[r],a=l.length-1,f=l[0],d=l[a];for(;o<=r&&c<=a;)null==i?i=t[++o]:null==u?u=t[--r]:null==f?f=l[++c]:null==d?d=l[--a]:C(i,f)?(O(i,f),i=t[++o],f=l[++c]):C(u,d)?(O(u,d),u=t[--r],d=l[--a]):C(i,d)?(O(i,d),e.insertBefore(i.g,u.g.nextSibling),i=t[++o],d=l[--a]):C(u,f)?(O(u,f),e.insertBefore(u.g,i.g),u=t[--r],f=l[++c]):(s=v(t&&t[c],n,c),f=l[++c],s&&i.g.parentNode.insertBefore(s,i.g));o>r?M(e,null==l[a+1]?null:l[a+1].g,n,l,c,a):c>a&&k(t,o,r)})(n,l,t,s):null!==s?(null!==e.$&&(n.textContent=""),M(n,null,t,s,0,s.length-1)):null!==l&&k(l,0,l.length-1)):e.$!==o&&(n.data=o)},P=e=>{e.m&&e.m.ref&&e.m.ref(null),e.p&&e.p.map(P)},R=(e,t,n)=>{const l=(e=>B(e).j)(e);return{emit:e=>x(l,t,{bubbles:!!(4&n),composed:!!(2&n),cancelable:!!(1&n),detail:e})}},x=(e,t,n)=>{const l=o.ce(t,n);return e.dispatchEvent(l),l},E=(e,t)=>{t&&!e.v&&t["s-p"]&&t["s-p"].push(new Promise((t=>e.v=t)))},L=(e,t)=>{if(e.t|=16,!(4&e.t))return E(e,e.M),oe((()=>N(e,t)));e.t|=512},N=(e,t)=>{const n=e.i;let l;return t&&(e.t|=256,e.u&&(e.u.map((([e,t])=>F(n,e,t))),e.u=null)),l=U(l,(()=>F(n,"componentWillRender"))),U(l,(()=>T(e,n,t)))},T=async(e,t,n)=>{const l=e.j,o=l["s-rc"];n&&(e=>{const t=e.k,n=e.j,l=t.t,o=((e,t)=>{let n=h(t),l=Y.get(n);if(e=11===e.nodeType?e:s,l)if("string"==typeof l){let t,o=d.get(e=e.head||e);o||d.set(e,o=new Set),o.has(n)||(t=s.createElement("style"),t.innerHTML=l,e.insertBefore(t,e.querySelector("link")),o&&o.add(n))}else e.adoptedStyleSheets.includes(l)||(e.adoptedStyleSheets=[...e.adoptedStyleSheets,l]);return n})(n.shadowRoot?n.shadowRoot:n.getRootNode(),t);10&l&&(n["s-sc"]=o,n.classList.add(o+"-h"))})(e);W(e,t),o&&(o.map((e=>e())),l["s-rc"]=void 0);{const t=l["s-p"],n=()=>A(e);0===t.length?n():(Promise.all(t).then(n),e.t|=4,t.length=0)}},W=(n,l)=>{try{l=l.render(),n.t&=-17,n.t|=2,((n,l)=>{const s=n.j,o=n.k,c=n.C||p(null,null),r=(e=>e&&e.S===b)(l)?l:m(null,null,l);t=s.tagName,o.O&&(r.m=r.m||{},o.O.map((([e,t])=>r.m[t]=s[e]))),r.S=null,r.t|=4,n.C=r,r.g=c.g=s.shadowRoot||s,e=s["s-sc"],O(c,r)})(n,l)}catch(e){K(e,n.j)}return null},A=e=>{const t=e.j,n=e.i,l=e.M;F(n,"componentDidRender"),64&e.t||(e.t|=64,q(t),F(n,"componentDidLoad"),e.P(t),l||D()),e.v&&(e.v(),e.v=void 0),512&e.t&&se((()=>L(e,!1))),e.t&=-517},D=()=>{q(s.documentElement),se((()=>x(l,"appload",{detail:{namespace:"blog-articles-grid"}})))},F=(e,t,n)=>{if(e&&e[t])try{return e[t](n)}catch(e){K(e)}},U=(e,t)=>e&&e.then?e.then(t):t(),q=e=>e.classList.add("hydrated"),H=(e,t,n)=>{if(t.R){e.watchers&&(t.L=e.watchers);const l=Object.entries(t.R),s=e.prototype;if(l.map((([e,[l]])=>{(31&l||2&n&&32&l)&&Object.defineProperty(s,e,{get(){return((e,t)=>B(this).N.get(t))(0,e)},set(n){((e,t,n,l)=>{const s=B(e),o=s.j,c=s.N.get(t),r=s.t,i=s.i;if(n=((e,t)=>null==e||$(e)?e:4&t?"false"!==e&&(""===e||!!e):2&t?parseFloat(e):1&t?e+"":e)(n,l.R[t][0]),(!(8&r)||void 0===c)&&n!==c&&(!Number.isNaN(c)||!Number.isNaN(n))&&(s.N.set(t,n),i)){if(l.L&&128&r){const e=l.L[t];e&&e.map((e=>{try{i[e](n,c,t)}catch(e){K(e,o)}}))}2==(18&r)&&L(s,!1)}})(this,e,n,t)},configurable:!0,enumerable:!0})})),1&n){const n=new Map;s.attributeChangedCallback=function(e,t,l){o.jmp((()=>{const t=n.get(e);if(this.hasOwnProperty(t))l=this[t],delete this[t];else if(s.hasOwnProperty(t)&&"number"==typeof this[t]&&this[t]==l)return;this[t]=(null!==l||"boolean"!=typeof this[t])&&l}))},e.observedAttributes=l.filter((([e,t])=>15&t[0])).map((([e,l])=>{const s=l[1]||e;return n.set(s,e),512&l[0]&&t.O.push([e,s]),s}))}}return e},V=e=>{F(e,"connectedCallback")},_=(e,t={})=>{const n=[],c=t.exclude||[],u=l.customElements,a=s.head,f=a.querySelector("meta[charset]"),d=s.createElement("style"),y=[];let $,m=!0;Object.assign(o,t),o.l=new URL(t.resourcesUrl||"./",s.baseURI).href,e.map((e=>{e[1].map((t=>{const l={t:t[0],h:t[1],R:t[2],T:t[3]};l.R=t[2],l.T=t[3],l.O=[],l.L={};const s=l.h,a=class extends HTMLElement{constructor(e){super(e),I(e=this,l),1&l.t&&e.attachShadow({mode:"open"})}connectedCallback(){$&&(clearTimeout($),$=null),m?y.push(this):o.jmp((()=>(e=>{if(0==(1&o.t)){const t=B(e),n=t.k,l=()=>{};if(1&t.t)i(e,t,n.T),V(t.i);else{t.t|=1;{let n=e;for(;n=n.parentNode||n.host;)if(n["s-p"]){E(t,t.M=n);break}}n.R&&Object.entries(n.R).map((([t,[n]])=>{if(31&n&&e.hasOwnProperty(t)){const n=e[t];delete e[t],e[t]=n}})),(async(e,t,n,l,s)=>{if(0==(32&t.t)){{if(t.t|=32,(s=X(n)).then){const e=()=>{};s=await s,e()}s.isProxied||(n.L=s.watchers,H(s,n,2),s.isProxied=!0);const e=()=>{};t.t|=8;try{new s(t)}catch(e){K(e)}t.t&=-9,t.t|=128,e(),V(t.i)}if(s.style){let e=s.style;const t=h(n);if(!Y.has(t)){const l=()=>{};((e,t,n)=>{let l=Y.get(e);r&&n?(l=l||new CSSStyleSheet,l.replace(t)):l=t,Y.set(e,l)})(t,e,!!(1&n.t)),l()}}}const o=t.M,c=()=>L(t,!0);o&&o["s-rc"]?o["s-rc"].push(c):c()})(0,t,n)}l()}})(this)))}disconnectedCallback(){o.jmp((()=>(()=>{if(0==(1&o.t)){const e=B(this);e.o&&(e.o.map((e=>e())),e.o=void 0)}})()))}componentOnReady(){return B(this).W}};l.A=e[0],c.includes(s)||u.get(s)||(n.push(s),u.define(s,H(a,l,1)))}))})),d.innerHTML=n+"{visibility:hidden}.hydrated{visibility:inherit}",d.setAttribute("data-styles",""),a.insertBefore(d,f?f.nextSibling:a.firstChild),m=!1,y.length?y.map((e=>e.connectedCallback())):o.jmp((()=>$=setTimeout(D,30)))},z=new WeakMap,B=e=>z.get(e),G=(e,t)=>z.set(t.i=e,t),I=(e,t)=>{const n={t:0,j:e,k:t,N:new Map};return n.W=new Promise((e=>n.P=e)),e["s-p"]=[],e["s-rc"]=[],i(e,n,t.T),z.set(e,n)},J=(e,t)=>t in e,K=(e,t)=>(0,console.error)(e,t),Q=new Map,X=e=>{const t=e.h.replace(/-/g,"_"),n=e.A,l=Q.get(n);return l?l[t]:import(`./${n}.entry.js`).then((e=>(Q.set(n,e),e[t])),K)},Y=new Map,Z=[],ee=[],te=(e,t)=>l=>{e.push(l),n||(n=!0,t&&4&o.t?se(le):o.raf(le))},ne=e=>{for(let t=0;t<e.length;t++)try{e[t](performance.now())}catch(e){K(e)}e.length=0},le=()=>{ne(Z),ne(ee),(n=Z.length>0)&&o.raf(le)},se=e=>c().then(e),oe=te(ee,!0);export{_ as b,R as c,m as h,c as p,G as r}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
const index = require('./index-
|
|
3
|
+
const index = require('./index-c17538b7.js');
|
|
4
4
|
|
|
5
5
|
/*
|
|
6
6
|
Stencil Client Patch Browser v2.15.2 | MIT Licensed | https://stenciljs.com
|
|
@@ -15,5 +15,5 @@ const patchBrowser = () => {
|
|
|
15
15
|
};
|
|
16
16
|
|
|
17
17
|
patchBrowser().then(options => {
|
|
18
|
-
return index.bootstrapLazy([["blog-articles-grid_2.cjs",[[1,"blog-articles-grid",{"cmsEndpoint":[1,"cms-endpoint"],"language":[1],"handleClick":[1,"handle-click"],"clientStyling":[1,"client-styling"],"clientStylingUrl":[1,"client-styling-url"],"showPublishingDate":[4,"show-publishing-date"],"showImage":[4,"show-image"],"showTitle":[4,"show-title"],"showContent":[4,"show-content"],"showButton":[4,"show-button"],"usePostmessage":[4,"use-postmessage"],"postMessageEvent":[1,"post-message-event"],"blogsLimit":[514,"blogs-limit"],"paginationActive":[516,"pagination-active"],"arrowsActive":[516,"arrows-active"],"secondaryArrowsActive":[516,"secondary-arrows-active"],"numberedNavActive":[516,"numbered-nav-active"],"paginationBlogList":[32],"currentPage":[32],"hasErrors":[32],"limitStylingAppends":[32],"isLoading":[32],"bannerMatrixReady":[32],"nextPage":[32],"previousPage":[32]},[[8,"
|
|
18
|
+
return index.bootstrapLazy([["blog-articles-grid_2.cjs",[[1,"blog-articles-grid",{"cmsEndpoint":[1,"cms-endpoint"],"language":[1],"handleClick":[1,"handle-click"],"clientStyling":[1,"client-styling"],"clientStylingUrl":[1,"client-styling-url"],"showPublishingDate":[4,"show-publishing-date"],"showImage":[4,"show-image"],"showTitle":[4,"show-title"],"showContent":[4,"show-content"],"showButton":[4,"show-button"],"usePostmessage":[4,"use-postmessage"],"postMessageEvent":[1,"post-message-event"],"blogsLimit":[514,"blogs-limit"],"paginationActive":[516,"pagination-active"],"arrowsActive":[516,"arrows-active"],"secondaryArrowsActive":[516,"secondary-arrows-active"],"numberedNavActive":[516,"numbered-nav-active"],"paginationBlogList":[32],"currentPage":[32],"hasErrors":[32],"limitStylingAppends":[32],"isLoading":[32],"bannerMatrixReady":[32],"nextPage":[32],"previousPage":[32],"device":[32]},[[8,"BannerMatrixReady","handleBannerReady"],[0,"hpPageChange","hpPageChange"]]],[1,"helper-pagination",{"nextPage":[1537,"next-page"],"prevPage":[1537,"prev-page"],"offset":[1538],"limit":[1538],"total":[1538],"language":[1537],"clientStyling":[1537,"client-styling"],"clientStylingUrlContent":[1537,"client-styling-url-content"],"arrowsActive":[1540,"arrows-active"],"secondaryArrowsActive":[1540,"secondary-arrows-active"],"numberedNavActive":[1540,"numbered-nav-active"],"offsetInt":[32],"lastPage":[32],"previousPage":[32],"limitInt":[32],"totalInt":[32],"pagesArray":[32],"endInt":[32],"limitStylingAppends":[32]}]]]], options);
|
|
19
19
|
});
|
|
@@ -2,10 +2,10 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
const index = require('./index-
|
|
5
|
+
const index = require('./index-c17538b7.js');
|
|
6
6
|
|
|
7
7
|
const DEFAULT_LANGUAGE$1 = 'en';
|
|
8
|
-
const SUPPORTED_LANGUAGES$1 = ['ro', 'en', 'fr', 'ar'];
|
|
8
|
+
const SUPPORTED_LANGUAGES$1 = ['ro', 'en', 'fr', 'ar', 'hu'];
|
|
9
9
|
const TRANSLATIONS$1 = {
|
|
10
10
|
en: {
|
|
11
11
|
error: 'Error',
|
|
@@ -22,6 +22,10 @@ const TRANSLATIONS$1 = {
|
|
|
22
22
|
ar: {
|
|
23
23
|
error: 'خطأ',
|
|
24
24
|
readmore: 'Read more',
|
|
25
|
+
},
|
|
26
|
+
hu: {
|
|
27
|
+
error: 'Error',
|
|
28
|
+
readmore: 'Read more',
|
|
25
29
|
}
|
|
26
30
|
};
|
|
27
31
|
const translate$1 = (key, customLang) => {
|
|
@@ -29,6 +33,24 @@ const translate$1 = (key, customLang) => {
|
|
|
29
33
|
return TRANSLATIONS$1[lang !== undefined && SUPPORTED_LANGUAGES$1.includes(lang) ? lang : DEFAULT_LANGUAGE$1][key];
|
|
30
34
|
};
|
|
31
35
|
|
|
36
|
+
function checkDeviceType() {
|
|
37
|
+
const userAgent = navigator.userAgent.toLowerCase();
|
|
38
|
+
const width = screen.availWidth;
|
|
39
|
+
const height = screen.availHeight;
|
|
40
|
+
if (userAgent.includes('iphone')) {
|
|
41
|
+
return 'mobile';
|
|
42
|
+
}
|
|
43
|
+
if (userAgent.includes('android')) {
|
|
44
|
+
if (height > width && width < 800) {
|
|
45
|
+
return 'mobile';
|
|
46
|
+
}
|
|
47
|
+
if (width > height && height < 800) {
|
|
48
|
+
return 'tablet';
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
return 'desktop';
|
|
52
|
+
}
|
|
53
|
+
|
|
32
54
|
const blogArticlesGridCss = ":host {\n display: block;\n}\n\n.GridContainerWrapper {\n display: grid;\n}\n\n.GridContainer {\n margin: auto;\n width: 100%;\n height: 280px;\n border-radius: 15px;\n background-color: #07072A;\n margin-bottom: 20px;\n display: grid;\n gap: 30px;\n grid-template-rows: 1fr 4fr 1fr 1fr;\n grid-template-columns: 30px 1fr 1fr 30px;\n}\n.GridContainer .BlogBanner {\n grid-column: 1/3;\n grid-row: 1/5;\n}\n.GridContainer .BlogBanner img {\n border-radius: 5px 0 0 5px;\n width: 100%;\n height: 280px;\n}\n.GridContainer .BlogDate {\n font-size: 12px;\n border-radius: 5px 5px 0 0;\n padding: 10px;\n width: fit-content;\n text-align: center;\n color: #FFFFFF;\n background-color: #0D0D4D;\n grid-column: 2/2;\n grid-row: 4/4;\n z-index: 1;\n}\n.GridContainer .BlogTitle {\n font-size: 24px;\n color: #FFF;\n margin-top: 20px;\n grid-column: 3/5;\n}\n.GridContainer .BlogContent {\n font-size: 14px;\n color: #FFF;\n width: 90%;\n max-height: 80px;\n overflow: hidden;\n text-overflow: ellipsis;\n grid-column: 3/5;\n}\n.GridContainer .BlogLink {\n grid-column: 3/5;\n color: #FFF;\n}\n.GridContainer .BlogLink button {\n font-size: 14px;\n border: none;\n padding: 0;\n background: none;\n color: #D0046C;\n cursor: pointer;\n}\n\n@container (max-width: 475px) {\n .GridContainerWrapper {\n display: grid;\n }\n\n .GridContainer {\n margin: auto;\n width: 100%;\n min-height: 400px;\n gap: 10%;\n padding-bottom: 30px;\n border-radius: 5px;\n background-color: #07072A;\n margin-bottom: 20px;\n display: grid;\n grid-template-rows: repeat(auto-fit, minmax(50px, 1fr));\n grid-template-rows: auto auto auto 50px;\n grid-template-columns: 15px auto auto 15px;\n gap: 10px;\n }\n .GridContainer .BlogBanner {\n grid-column: 1/5;\n grid-row: 1/3;\n margin: 0;\n }\n .GridContainer .BlogBanner img {\n width: 100%;\n height: 232px;\n border-radius: 5px 5px 0 0;\n }\n .GridContainer .BlogDate {\n grid-column: 2/3;\n grid-row: 2/3;\n font-size: 12px;\n border-radius: 5px 5px 0 0;\n padding: 10px;\n width: fit-content;\n text-align: center;\n color: #FFFFFF;\n background-color: #0D0D4D;\n z-index: 1;\n }\n .GridContainer .BlogTitle {\n grid-column: 2/4;\n font-size: 24px;\n color: #FFF;\n }\n .GridContainer .BlogContent {\n grid-column: 2/4;\n font-size: 14px;\n color: #FFF;\n }\n .GridContainer .BlogLink {\n grid-column: 2/4;\n color: #FFF;\n cursor: pointer;\n }\n .GridContainer .BlogLink button {\n font-size: 14px;\n border: none;\n background: none;\n color: #D0046C;\n cursor: pointer;\n }\n}";
|
|
33
55
|
|
|
34
56
|
const BlogArticlesGrid = class {
|
|
@@ -81,6 +103,7 @@ const BlogArticlesGrid = class {
|
|
|
81
103
|
this.bannerMatrixReady = false;
|
|
82
104
|
this.nextPage = '';
|
|
83
105
|
this.previousPage = '';
|
|
106
|
+
this.device = '';
|
|
84
107
|
this.defaultStyling = `
|
|
85
108
|
div#PaginationContainer {
|
|
86
109
|
justify-content: right;
|
|
@@ -153,10 +176,10 @@ const BlogArticlesGrid = class {
|
|
|
153
176
|
return;
|
|
154
177
|
const hasBanner = content.indexOf('<bannermatrix-banner') !== -1;
|
|
155
178
|
if (!hasBanner) {
|
|
156
|
-
return index.h("div", { class: "BlogContent", innerHTML:
|
|
179
|
+
return index.h("div", { class: "BlogContent", innerHTML: content });
|
|
157
180
|
}
|
|
158
181
|
if (this.bannerMatrixReady) {
|
|
159
|
-
return index.h("div", { class: "BlogContent", innerHTML:
|
|
182
|
+
return index.h("div", { class: "BlogContent", innerHTML: content });
|
|
160
183
|
}
|
|
161
184
|
return null;
|
|
162
185
|
};
|
|
@@ -180,6 +203,8 @@ const BlogArticlesGrid = class {
|
|
|
180
203
|
var _a, _b;
|
|
181
204
|
this.paginationBlogList = event.detail;
|
|
182
205
|
this.currentPage = Math.floor(((_a = this.paginationBlogList) === null || _a === void 0 ? void 0 : _a.offset) / ((_b = this.paginationBlogList) === null || _b === void 0 ? void 0 : _b.limit));
|
|
206
|
+
if (this.currentPage + 1 > this.lastPage)
|
|
207
|
+
return;
|
|
183
208
|
this.getBlogArticleGrid();
|
|
184
209
|
}
|
|
185
210
|
handleAction(postId) {
|
|
@@ -192,6 +217,10 @@ const BlogArticlesGrid = class {
|
|
|
192
217
|
}
|
|
193
218
|
componentDidLoad() {
|
|
194
219
|
window.postMessage({ type: 'BlogArticlesGridLoaded' }, window.location.href);
|
|
220
|
+
this.detectAndAlertDeviceType();
|
|
221
|
+
}
|
|
222
|
+
detectAndAlertDeviceType() {
|
|
223
|
+
this.device = checkDeviceType();
|
|
195
224
|
}
|
|
196
225
|
sortArticlesByDate(arr) {
|
|
197
226
|
arr.sort((a, b) => {
|
|
@@ -233,6 +262,7 @@ const BlogArticlesGrid = class {
|
|
|
233
262
|
return res.json();
|
|
234
263
|
})
|
|
235
264
|
.then((blogContent) => {
|
|
265
|
+
this.lastPage = +blogContent.pages.last.slice(blogContent.pages.last.lastIndexOf('=') + 1);
|
|
236
266
|
let blogItems = blogContent.items;
|
|
237
267
|
this.nextPage = blogContent.pages.next;
|
|
238
268
|
this.previousPage = blogContent.pages.previous;
|
|
@@ -261,6 +291,13 @@ const BlogArticlesGrid = class {
|
|
|
261
291
|
}
|
|
262
292
|
// end custom styling area
|
|
263
293
|
}
|
|
294
|
+
formatDateToYearMonthDay(dateString) {
|
|
295
|
+
let date = new Date(dateString);
|
|
296
|
+
let year = date.getFullYear();
|
|
297
|
+
let month = String(date.getMonth() + 1).padStart(2, '0');
|
|
298
|
+
let day = String(date.getDate()).padStart(2, '0');
|
|
299
|
+
return `${day}-${month}-${year}`;
|
|
300
|
+
}
|
|
264
301
|
render() {
|
|
265
302
|
var _a, _b;
|
|
266
303
|
if (this.hasErrors) {
|
|
@@ -268,10 +305,9 @@ const BlogArticlesGrid = class {
|
|
|
268
305
|
}
|
|
269
306
|
return (index.h("div", { ref: el => this.stylingContainer = el }, index.h("div", { class: "BlogGridPaginationWrapper" }, this.paginationActive == true && index.h("helper-pagination", { "next-page": this.nextPage, "prev-page": this.previousPage, offset: this.paginationBlogList.offset, limit: this.blogsLimit, total: (_b = (_a = this.blogData) === null || _a === void 0 ? void 0 : _a.items) === null || _b === void 0 ? void 0 : _b.length, language: this.language, "client-styling": this.clientStyling || this.defaultStyling, "arrows-active": this.arrowsActive || false, "secondary-arrows-active": this.secondaryArrowsActive || false, "numbered-nav-active": this.numberedNavActive || false })), (!this.isLoading) &&
|
|
270
307
|
index.h("div", { class: "GridContainerWrapper" }, this.blogData.map((data) => {
|
|
271
|
-
var _a;
|
|
308
|
+
var _a, _b;
|
|
272
309
|
return index.h("div", { class: "GridContainer" }, this.showPublishingDate &&
|
|
273
|
-
index.h("div", { class: "BlogDate" }, data === null || data === void 0 ? void 0 : data.publishingDate), this.showImage &&
|
|
274
|
-
index.h("div", { class: "BlogBanner" }, index.h("img", { src: (_a = data === null || data === void 0 ? void 0 : data.image) === null || _a === void 0 ? void 0 : _a.src, alt: data === null || data === void 0 ? void 0 : data.title })), this.showTitle &&
|
|
310
|
+
index.h("div", { class: "BlogDate" }, this.formatDateToYearMonthDay(data === null || data === void 0 ? void 0 : data.publishingDate)), this.showImage && (index.h("div", { class: "BlogBanner" }, ((_a = data.image) === null || _a === void 0 ? void 0 : _a.src) ? (index.h("img", { src: data.image.src, alt: data.image.src })) : (((_b = data.video) === null || _b === void 0 ? void 0 : _b.sources[this.device]) ? (index.h("video", { src: data.video.sources[this.device], controls: true })) : (index.h("h1", { style: { color: "white" } }, "No Image"))))), this.showTitle &&
|
|
275
311
|
index.h("div", { class: "BlogTitle" }, data === null || data === void 0 ? void 0 : data.title), this.showContent &&
|
|
276
312
|
this.renderContentConditionally(data === null || data === void 0 ? void 0 : data.content), this.showButton &&
|
|
277
313
|
index.h("div", { class: "BlogLink" }, index.h("button", { onClick: () => this.handleAction(data === null || data === void 0 ? void 0 : data.postID) }, translate$1('readmore', this.language))));
|
|
@@ -298,7 +334,7 @@ const isMobile = (userAgent) => {
|
|
|
298
334
|
};
|
|
299
335
|
|
|
300
336
|
const DEFAULT_LANGUAGE = 'en';
|
|
301
|
-
const SUPPORTED_LANGUAGES = ['ro', 'en'];
|
|
337
|
+
const SUPPORTED_LANGUAGES = ['ro', 'en', 'hu'];
|
|
302
338
|
const TRANSLATIONS = {
|
|
303
339
|
en: {
|
|
304
340
|
firstPage: 'First',
|
|
@@ -323,6 +359,12 @@ const TRANSLATIONS = {
|
|
|
323
359
|
previousPage: 'Previous',
|
|
324
360
|
nextPage: 'Next',
|
|
325
361
|
lastPage: 'Last'
|
|
362
|
+
},
|
|
363
|
+
hu: {
|
|
364
|
+
firstPage: 'First',
|
|
365
|
+
previousPage: 'Previous',
|
|
366
|
+
nextPage: 'Következő',
|
|
367
|
+
lastPage: 'Last'
|
|
326
368
|
}
|
|
327
369
|
};
|
|
328
370
|
const translate = (key, customLang) => {
|
|
@@ -268,6 +268,31 @@ const setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags) => {
|
|
|
268
268
|
classList.remove(...oldClasses.filter((c) => c && !newClasses.includes(c)));
|
|
269
269
|
classList.add(...newClasses.filter((c) => c && !oldClasses.includes(c)));
|
|
270
270
|
}
|
|
271
|
+
else if (memberName === 'style') {
|
|
272
|
+
// update style attribute, css properties and values
|
|
273
|
+
{
|
|
274
|
+
for (const prop in oldValue) {
|
|
275
|
+
if (!newValue || newValue[prop] == null) {
|
|
276
|
+
if (prop.includes('-')) {
|
|
277
|
+
elm.style.removeProperty(prop);
|
|
278
|
+
}
|
|
279
|
+
else {
|
|
280
|
+
elm.style[prop] = '';
|
|
281
|
+
}
|
|
282
|
+
}
|
|
283
|
+
}
|
|
284
|
+
}
|
|
285
|
+
for (const prop in newValue) {
|
|
286
|
+
if (!oldValue || newValue[prop] !== oldValue[prop]) {
|
|
287
|
+
if (prop.includes('-')) {
|
|
288
|
+
elm.style.setProperty(prop, newValue[prop]);
|
|
289
|
+
}
|
|
290
|
+
else {
|
|
291
|
+
elm.style[prop] = newValue[prop];
|
|
292
|
+
}
|
|
293
|
+
}
|
|
294
|
+
}
|
|
295
|
+
}
|
|
271
296
|
else if (memberName === 'ref') {
|
|
272
297
|
// minifier will clean this up
|
|
273
298
|
if (newValue) {
|
package/dist/cjs/loader.cjs.js
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
const index = require('./index-
|
|
5
|
+
const index = require('./index-c17538b7.js');
|
|
6
6
|
|
|
7
7
|
/*
|
|
8
8
|
Stencil Client Patch Esm v2.15.2 | MIT Licensed | https://stenciljs.com
|
|
@@ -14,7 +14,7 @@ const patchEsm = () => {
|
|
|
14
14
|
const defineCustomElements = (win, options) => {
|
|
15
15
|
if (typeof window === 'undefined') return Promise.resolve();
|
|
16
16
|
return patchEsm().then(() => {
|
|
17
|
-
return index.bootstrapLazy([["blog-articles-grid_2.cjs",[[1,"blog-articles-grid",{"cmsEndpoint":[1,"cms-endpoint"],"language":[1],"handleClick":[1,"handle-click"],"clientStyling":[1,"client-styling"],"clientStylingUrl":[1,"client-styling-url"],"showPublishingDate":[4,"show-publishing-date"],"showImage":[4,"show-image"],"showTitle":[4,"show-title"],"showContent":[4,"show-content"],"showButton":[4,"show-button"],"usePostmessage":[4,"use-postmessage"],"postMessageEvent":[1,"post-message-event"],"blogsLimit":[514,"blogs-limit"],"paginationActive":[516,"pagination-active"],"arrowsActive":[516,"arrows-active"],"secondaryArrowsActive":[516,"secondary-arrows-active"],"numberedNavActive":[516,"numbered-nav-active"],"paginationBlogList":[32],"currentPage":[32],"hasErrors":[32],"limitStylingAppends":[32],"isLoading":[32],"bannerMatrixReady":[32],"nextPage":[32],"previousPage":[32]},[[8,"
|
|
17
|
+
return index.bootstrapLazy([["blog-articles-grid_2.cjs",[[1,"blog-articles-grid",{"cmsEndpoint":[1,"cms-endpoint"],"language":[1],"handleClick":[1,"handle-click"],"clientStyling":[1,"client-styling"],"clientStylingUrl":[1,"client-styling-url"],"showPublishingDate":[4,"show-publishing-date"],"showImage":[4,"show-image"],"showTitle":[4,"show-title"],"showContent":[4,"show-content"],"showButton":[4,"show-button"],"usePostmessage":[4,"use-postmessage"],"postMessageEvent":[1,"post-message-event"],"blogsLimit":[514,"blogs-limit"],"paginationActive":[516,"pagination-active"],"arrowsActive":[516,"arrows-active"],"secondaryArrowsActive":[516,"secondary-arrows-active"],"numberedNavActive":[516,"numbered-nav-active"],"paginationBlogList":[32],"currentPage":[32],"hasErrors":[32],"limitStylingAppends":[32],"isLoading":[32],"bannerMatrixReady":[32],"nextPage":[32],"previousPage":[32],"device":[32]},[[8,"BannerMatrixReady","handleBannerReady"],[0,"hpPageChange","hpPageChange"]]],[1,"helper-pagination",{"nextPage":[1537,"next-page"],"prevPage":[1537,"prev-page"],"offset":[1538],"limit":[1538],"total":[1538],"language":[1537],"clientStyling":[1537,"client-styling"],"clientStylingUrlContent":[1537,"client-styling-url-content"],"arrowsActive":[1540,"arrows-active"],"secondaryArrowsActive":[1540,"secondary-arrows-active"],"numberedNavActive":[1540,"numbered-nav-active"],"offsetInt":[32],"lastPage":[32],"previousPage":[32],"limitInt":[32],"totalInt":[32],"pagesArray":[32],"endInt":[32],"limitStylingAppends":[32]}]]]], options);
|
|
18
18
|
});
|
|
19
19
|
};
|
|
20
20
|
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { Component, Prop, State, Event, Watch, h, Listen } from '@stencil/core';
|
|
2
2
|
import { translate } from '../../utils/locale.utils';
|
|
3
|
+
import { checkDeviceType } from '../../utils/utils';
|
|
3
4
|
import '@everymatrix/helper-pagination';
|
|
4
5
|
export class BlogArticlesGrid {
|
|
5
6
|
constructor() {
|
|
@@ -49,6 +50,7 @@ export class BlogArticlesGrid {
|
|
|
49
50
|
this.bannerMatrixReady = false;
|
|
50
51
|
this.nextPage = '';
|
|
51
52
|
this.previousPage = '';
|
|
53
|
+
this.device = '';
|
|
52
54
|
this.defaultStyling = `
|
|
53
55
|
div#PaginationContainer {
|
|
54
56
|
justify-content: right;
|
|
@@ -121,10 +123,10 @@ export class BlogArticlesGrid {
|
|
|
121
123
|
return;
|
|
122
124
|
const hasBanner = content.indexOf('<bannermatrix-banner') !== -1;
|
|
123
125
|
if (!hasBanner) {
|
|
124
|
-
return h("div", { class: "BlogContent", innerHTML:
|
|
126
|
+
return h("div", { class: "BlogContent", innerHTML: content });
|
|
125
127
|
}
|
|
126
128
|
if (this.bannerMatrixReady) {
|
|
127
|
-
return h("div", { class: "BlogContent", innerHTML:
|
|
129
|
+
return h("div", { class: "BlogContent", innerHTML: content });
|
|
128
130
|
}
|
|
129
131
|
return null;
|
|
130
132
|
};
|
|
@@ -148,6 +150,8 @@ export class BlogArticlesGrid {
|
|
|
148
150
|
var _a, _b;
|
|
149
151
|
this.paginationBlogList = event.detail;
|
|
150
152
|
this.currentPage = Math.floor(((_a = this.paginationBlogList) === null || _a === void 0 ? void 0 : _a.offset) / ((_b = this.paginationBlogList) === null || _b === void 0 ? void 0 : _b.limit));
|
|
153
|
+
if (this.currentPage + 1 > this.lastPage)
|
|
154
|
+
return;
|
|
151
155
|
this.getBlogArticleGrid();
|
|
152
156
|
}
|
|
153
157
|
handleAction(postId) {
|
|
@@ -160,6 +164,10 @@ export class BlogArticlesGrid {
|
|
|
160
164
|
}
|
|
161
165
|
componentDidLoad() {
|
|
162
166
|
window.postMessage({ type: 'BlogArticlesGridLoaded' }, window.location.href);
|
|
167
|
+
this.detectAndAlertDeviceType();
|
|
168
|
+
}
|
|
169
|
+
detectAndAlertDeviceType() {
|
|
170
|
+
this.device = checkDeviceType();
|
|
163
171
|
}
|
|
164
172
|
sortArticlesByDate(arr) {
|
|
165
173
|
arr.sort((a, b) => {
|
|
@@ -201,6 +209,7 @@ export class BlogArticlesGrid {
|
|
|
201
209
|
return res.json();
|
|
202
210
|
})
|
|
203
211
|
.then((blogContent) => {
|
|
212
|
+
this.lastPage = +blogContent.pages.last.slice(blogContent.pages.last.lastIndexOf('=') + 1);
|
|
204
213
|
let blogItems = blogContent.items;
|
|
205
214
|
this.nextPage = blogContent.pages.next;
|
|
206
215
|
this.previousPage = blogContent.pages.previous;
|
|
@@ -229,6 +238,13 @@ export class BlogArticlesGrid {
|
|
|
229
238
|
}
|
|
230
239
|
// end custom styling area
|
|
231
240
|
}
|
|
241
|
+
formatDateToYearMonthDay(dateString) {
|
|
242
|
+
let date = new Date(dateString);
|
|
243
|
+
let year = date.getFullYear();
|
|
244
|
+
let month = String(date.getMonth() + 1).padStart(2, '0');
|
|
245
|
+
let day = String(date.getDate()).padStart(2, '0');
|
|
246
|
+
return `${day}-${month}-${year}`;
|
|
247
|
+
}
|
|
232
248
|
render() {
|
|
233
249
|
var _a, _b;
|
|
234
250
|
if (this.hasErrors) {
|
|
@@ -239,13 +255,11 @@ export class BlogArticlesGrid {
|
|
|
239
255
|
h("div", { class: "BlogGridPaginationWrapper" }, this.paginationActive == true && h("helper-pagination", { "next-page": this.nextPage, "prev-page": this.previousPage, offset: this.paginationBlogList.offset, limit: this.blogsLimit, total: (_b = (_a = this.blogData) === null || _a === void 0 ? void 0 : _a.items) === null || _b === void 0 ? void 0 : _b.length, language: this.language, "client-styling": this.clientStyling || this.defaultStyling, "arrows-active": this.arrowsActive || false, "secondary-arrows-active": this.secondaryArrowsActive || false, "numbered-nav-active": this.numberedNavActive || false })),
|
|
240
256
|
(!this.isLoading) &&
|
|
241
257
|
h("div", { class: "GridContainerWrapper" }, this.blogData.map((data) => {
|
|
242
|
-
var _a;
|
|
258
|
+
var _a, _b;
|
|
243
259
|
return h("div", { class: "GridContainer" },
|
|
244
260
|
this.showPublishingDate &&
|
|
245
|
-
h("div", { class: "BlogDate" }, data === null || data === void 0 ? void 0 : data.publishingDate),
|
|
246
|
-
this.showImage &&
|
|
247
|
-
h("div", { class: "BlogBanner" },
|
|
248
|
-
h("img", { src: (_a = data === null || data === void 0 ? void 0 : data.image) === null || _a === void 0 ? void 0 : _a.src, alt: data === null || data === void 0 ? void 0 : data.title })),
|
|
261
|
+
h("div", { class: "BlogDate" }, this.formatDateToYearMonthDay(data === null || data === void 0 ? void 0 : data.publishingDate)),
|
|
262
|
+
this.showImage && (h("div", { class: "BlogBanner" }, ((_a = data.image) === null || _a === void 0 ? void 0 : _a.src) ? (h("img", { src: data.image.src, alt: data.image.src })) : (((_b = data.video) === null || _b === void 0 ? void 0 : _b.sources[this.device]) ? (h("video", { src: data.video.sources[this.device], controls: true })) : (h("h1", { style: { color: "white" } }, "No Image"))))),
|
|
249
263
|
this.showTitle &&
|
|
250
264
|
h("div", { class: "BlogTitle" }, data === null || data === void 0 ? void 0 : data.title),
|
|
251
265
|
this.showContent &&
|
|
@@ -571,7 +585,8 @@ export class BlogArticlesGrid {
|
|
|
571
585
|
"isLoading": {},
|
|
572
586
|
"bannerMatrixReady": {},
|
|
573
587
|
"nextPage": {},
|
|
574
|
-
"previousPage": {}
|
|
588
|
+
"previousPage": {},
|
|
589
|
+
"device": {}
|
|
575
590
|
}; }
|
|
576
591
|
static get events() { return [{
|
|
577
592
|
"method": "articleActionButton",
|
|
@@ -601,7 +616,7 @@ export class BlogArticlesGrid {
|
|
|
601
616
|
"methodName": "watchEndpoint"
|
|
602
617
|
}]; }
|
|
603
618
|
static get listeners() { return [{
|
|
604
|
-
"name": "
|
|
619
|
+
"name": "BannerMatrixReady",
|
|
605
620
|
"method": "handleBannerReady",
|
|
606
621
|
"target": "window",
|
|
607
622
|
"capture": false,
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
const DEFAULT_LANGUAGE = 'en';
|
|
2
|
-
const SUPPORTED_LANGUAGES = ['ro', 'en', 'fr', 'ar'];
|
|
2
|
+
const SUPPORTED_LANGUAGES = ['ro', 'en', 'fr', 'ar', 'hu'];
|
|
3
3
|
const TRANSLATIONS = {
|
|
4
4
|
en: {
|
|
5
5
|
error: 'Error',
|
|
@@ -16,6 +16,10 @@ const TRANSLATIONS = {
|
|
|
16
16
|
ar: {
|
|
17
17
|
error: 'خطأ',
|
|
18
18
|
readmore: 'Read more',
|
|
19
|
+
},
|
|
20
|
+
hu: {
|
|
21
|
+
error: 'Error',
|
|
22
|
+
readmore: 'Read more',
|
|
19
23
|
}
|
|
20
24
|
};
|
|
21
25
|
export const translate = (key, customLang) => {
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
export function checkDeviceType() {
|
|
2
|
+
const userAgent = navigator.userAgent.toLowerCase();
|
|
3
|
+
const width = screen.availWidth;
|
|
4
|
+
const height = screen.availHeight;
|
|
5
|
+
if (userAgent.includes('iphone')) {
|
|
6
|
+
return 'mobile';
|
|
7
|
+
}
|
|
8
|
+
if (userAgent.includes('android')) {
|
|
9
|
+
if (height > width && width < 800) {
|
|
10
|
+
return 'mobile';
|
|
11
|
+
}
|
|
12
|
+
if (width > height && height < 800) {
|
|
13
|
+
return 'tablet';
|
|
14
|
+
}
|
|
15
|
+
}
|
|
16
|
+
return 'desktop';
|
|
17
|
+
}
|
|
@@ -2,7 +2,7 @@ import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/i
|
|
|
2
2
|
import { d as defineCustomElement$2 } from './helper-pagination2.js';
|
|
3
3
|
|
|
4
4
|
const DEFAULT_LANGUAGE = 'en';
|
|
5
|
-
const SUPPORTED_LANGUAGES = ['ro', 'en', 'fr', 'ar'];
|
|
5
|
+
const SUPPORTED_LANGUAGES = ['ro', 'en', 'fr', 'ar', 'hu'];
|
|
6
6
|
const TRANSLATIONS = {
|
|
7
7
|
en: {
|
|
8
8
|
error: 'Error',
|
|
@@ -19,6 +19,10 @@ const TRANSLATIONS = {
|
|
|
19
19
|
ar: {
|
|
20
20
|
error: 'خطأ',
|
|
21
21
|
readmore: 'Read more',
|
|
22
|
+
},
|
|
23
|
+
hu: {
|
|
24
|
+
error: 'Error',
|
|
25
|
+
readmore: 'Read more',
|
|
22
26
|
}
|
|
23
27
|
};
|
|
24
28
|
const translate = (key, customLang) => {
|
|
@@ -26,6 +30,24 @@ const translate = (key, customLang) => {
|
|
|
26
30
|
return TRANSLATIONS[lang !== undefined && SUPPORTED_LANGUAGES.includes(lang) ? lang : DEFAULT_LANGUAGE][key];
|
|
27
31
|
};
|
|
28
32
|
|
|
33
|
+
function checkDeviceType() {
|
|
34
|
+
const userAgent = navigator.userAgent.toLowerCase();
|
|
35
|
+
const width = screen.availWidth;
|
|
36
|
+
const height = screen.availHeight;
|
|
37
|
+
if (userAgent.includes('iphone')) {
|
|
38
|
+
return 'mobile';
|
|
39
|
+
}
|
|
40
|
+
if (userAgent.includes('android')) {
|
|
41
|
+
if (height > width && width < 800) {
|
|
42
|
+
return 'mobile';
|
|
43
|
+
}
|
|
44
|
+
if (width > height && height < 800) {
|
|
45
|
+
return 'tablet';
|
|
46
|
+
}
|
|
47
|
+
}
|
|
48
|
+
return 'desktop';
|
|
49
|
+
}
|
|
50
|
+
|
|
29
51
|
const blogArticlesGridCss = ":host {\n display: block;\n}\n\n.GridContainerWrapper {\n display: grid;\n}\n\n.GridContainer {\n margin: auto;\n width: 100%;\n height: 280px;\n border-radius: 15px;\n background-color: #07072A;\n margin-bottom: 20px;\n display: grid;\n gap: 30px;\n grid-template-rows: 1fr 4fr 1fr 1fr;\n grid-template-columns: 30px 1fr 1fr 30px;\n}\n.GridContainer .BlogBanner {\n grid-column: 1/3;\n grid-row: 1/5;\n}\n.GridContainer .BlogBanner img {\n border-radius: 5px 0 0 5px;\n width: 100%;\n height: 280px;\n}\n.GridContainer .BlogDate {\n font-size: 12px;\n border-radius: 5px 5px 0 0;\n padding: 10px;\n width: fit-content;\n text-align: center;\n color: #FFFFFF;\n background-color: #0D0D4D;\n grid-column: 2/2;\n grid-row: 4/4;\n z-index: 1;\n}\n.GridContainer .BlogTitle {\n font-size: 24px;\n color: #FFF;\n margin-top: 20px;\n grid-column: 3/5;\n}\n.GridContainer .BlogContent {\n font-size: 14px;\n color: #FFF;\n width: 90%;\n max-height: 80px;\n overflow: hidden;\n text-overflow: ellipsis;\n grid-column: 3/5;\n}\n.GridContainer .BlogLink {\n grid-column: 3/5;\n color: #FFF;\n}\n.GridContainer .BlogLink button {\n font-size: 14px;\n border: none;\n padding: 0;\n background: none;\n color: #D0046C;\n cursor: pointer;\n}\n\n@container (max-width: 475px) {\n .GridContainerWrapper {\n display: grid;\n }\n\n .GridContainer {\n margin: auto;\n width: 100%;\n min-height: 400px;\n gap: 10%;\n padding-bottom: 30px;\n border-radius: 5px;\n background-color: #07072A;\n margin-bottom: 20px;\n display: grid;\n grid-template-rows: repeat(auto-fit, minmax(50px, 1fr));\n grid-template-rows: auto auto auto 50px;\n grid-template-columns: 15px auto auto 15px;\n gap: 10px;\n }\n .GridContainer .BlogBanner {\n grid-column: 1/5;\n grid-row: 1/3;\n margin: 0;\n }\n .GridContainer .BlogBanner img {\n width: 100%;\n height: 232px;\n border-radius: 5px 5px 0 0;\n }\n .GridContainer .BlogDate {\n grid-column: 2/3;\n grid-row: 2/3;\n font-size: 12px;\n border-radius: 5px 5px 0 0;\n padding: 10px;\n width: fit-content;\n text-align: center;\n color: #FFFFFF;\n background-color: #0D0D4D;\n z-index: 1;\n }\n .GridContainer .BlogTitle {\n grid-column: 2/4;\n font-size: 24px;\n color: #FFF;\n }\n .GridContainer .BlogContent {\n grid-column: 2/4;\n font-size: 14px;\n color: #FFF;\n }\n .GridContainer .BlogLink {\n grid-column: 2/4;\n color: #FFF;\n cursor: pointer;\n }\n .GridContainer .BlogLink button {\n font-size: 14px;\n border: none;\n background: none;\n color: #D0046C;\n cursor: pointer;\n }\n}";
|
|
30
52
|
|
|
31
53
|
const BlogArticlesGrid$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
|
|
@@ -80,6 +102,7 @@ const BlogArticlesGrid$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEl
|
|
|
80
102
|
this.bannerMatrixReady = false;
|
|
81
103
|
this.nextPage = '';
|
|
82
104
|
this.previousPage = '';
|
|
105
|
+
this.device = '';
|
|
83
106
|
this.defaultStyling = `
|
|
84
107
|
div#PaginationContainer {
|
|
85
108
|
justify-content: right;
|
|
@@ -152,10 +175,10 @@ const BlogArticlesGrid$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEl
|
|
|
152
175
|
return;
|
|
153
176
|
const hasBanner = content.indexOf('<bannermatrix-banner') !== -1;
|
|
154
177
|
if (!hasBanner) {
|
|
155
|
-
return h("div", { class: "BlogContent", innerHTML:
|
|
178
|
+
return h("div", { class: "BlogContent", innerHTML: content });
|
|
156
179
|
}
|
|
157
180
|
if (this.bannerMatrixReady) {
|
|
158
|
-
return h("div", { class: "BlogContent", innerHTML:
|
|
181
|
+
return h("div", { class: "BlogContent", innerHTML: content });
|
|
159
182
|
}
|
|
160
183
|
return null;
|
|
161
184
|
};
|
|
@@ -179,6 +202,8 @@ const BlogArticlesGrid$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEl
|
|
|
179
202
|
var _a, _b;
|
|
180
203
|
this.paginationBlogList = event.detail;
|
|
181
204
|
this.currentPage = Math.floor(((_a = this.paginationBlogList) === null || _a === void 0 ? void 0 : _a.offset) / ((_b = this.paginationBlogList) === null || _b === void 0 ? void 0 : _b.limit));
|
|
205
|
+
if (this.currentPage + 1 > this.lastPage)
|
|
206
|
+
return;
|
|
182
207
|
this.getBlogArticleGrid();
|
|
183
208
|
}
|
|
184
209
|
handleAction(postId) {
|
|
@@ -191,6 +216,10 @@ const BlogArticlesGrid$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEl
|
|
|
191
216
|
}
|
|
192
217
|
componentDidLoad() {
|
|
193
218
|
window.postMessage({ type: 'BlogArticlesGridLoaded' }, window.location.href);
|
|
219
|
+
this.detectAndAlertDeviceType();
|
|
220
|
+
}
|
|
221
|
+
detectAndAlertDeviceType() {
|
|
222
|
+
this.device = checkDeviceType();
|
|
194
223
|
}
|
|
195
224
|
sortArticlesByDate(arr) {
|
|
196
225
|
arr.sort((a, b) => {
|
|
@@ -232,6 +261,7 @@ const BlogArticlesGrid$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEl
|
|
|
232
261
|
return res.json();
|
|
233
262
|
})
|
|
234
263
|
.then((blogContent) => {
|
|
264
|
+
this.lastPage = +blogContent.pages.last.slice(blogContent.pages.last.lastIndexOf('=') + 1);
|
|
235
265
|
let blogItems = blogContent.items;
|
|
236
266
|
this.nextPage = blogContent.pages.next;
|
|
237
267
|
this.previousPage = blogContent.pages.previous;
|
|
@@ -260,6 +290,13 @@ const BlogArticlesGrid$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEl
|
|
|
260
290
|
}
|
|
261
291
|
// end custom styling area
|
|
262
292
|
}
|
|
293
|
+
formatDateToYearMonthDay(dateString) {
|
|
294
|
+
let date = new Date(dateString);
|
|
295
|
+
let year = date.getFullYear();
|
|
296
|
+
let month = String(date.getMonth() + 1).padStart(2, '0');
|
|
297
|
+
let day = String(date.getDate()).padStart(2, '0');
|
|
298
|
+
return `${day}-${month}-${year}`;
|
|
299
|
+
}
|
|
263
300
|
render() {
|
|
264
301
|
var _a, _b;
|
|
265
302
|
if (this.hasErrors) {
|
|
@@ -267,10 +304,9 @@ const BlogArticlesGrid$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEl
|
|
|
267
304
|
}
|
|
268
305
|
return (h("div", { ref: el => this.stylingContainer = el }, h("div", { class: "BlogGridPaginationWrapper" }, this.paginationActive == true && h("helper-pagination", { "next-page": this.nextPage, "prev-page": this.previousPage, offset: this.paginationBlogList.offset, limit: this.blogsLimit, total: (_b = (_a = this.blogData) === null || _a === void 0 ? void 0 : _a.items) === null || _b === void 0 ? void 0 : _b.length, language: this.language, "client-styling": this.clientStyling || this.defaultStyling, "arrows-active": this.arrowsActive || false, "secondary-arrows-active": this.secondaryArrowsActive || false, "numbered-nav-active": this.numberedNavActive || false })), (!this.isLoading) &&
|
|
269
306
|
h("div", { class: "GridContainerWrapper" }, this.blogData.map((data) => {
|
|
270
|
-
var _a;
|
|
307
|
+
var _a, _b;
|
|
271
308
|
return h("div", { class: "GridContainer" }, this.showPublishingDate &&
|
|
272
|
-
h("div", { class: "BlogDate" }, data === null || data === void 0 ? void 0 : data.publishingDate), this.showImage &&
|
|
273
|
-
h("div", { class: "BlogBanner" }, h("img", { src: (_a = data === null || data === void 0 ? void 0 : data.image) === null || _a === void 0 ? void 0 : _a.src, alt: data === null || data === void 0 ? void 0 : data.title })), this.showTitle &&
|
|
309
|
+
h("div", { class: "BlogDate" }, this.formatDateToYearMonthDay(data === null || data === void 0 ? void 0 : data.publishingDate)), this.showImage && (h("div", { class: "BlogBanner" }, ((_a = data.image) === null || _a === void 0 ? void 0 : _a.src) ? (h("img", { src: data.image.src, alt: data.image.src })) : (((_b = data.video) === null || _b === void 0 ? void 0 : _b.sources[this.device]) ? (h("video", { src: data.video.sources[this.device], controls: true })) : (h("h1", { style: { color: "white" } }, "No Image"))))), this.showTitle &&
|
|
274
310
|
h("div", { class: "BlogTitle" }, data === null || data === void 0 ? void 0 : data.title), this.showContent &&
|
|
275
311
|
this.renderContentConditionally(data === null || data === void 0 ? void 0 : data.content), this.showButton &&
|
|
276
312
|
h("div", { class: "BlogLink" }, h("button", { onClick: () => this.handleAction(data === null || data === void 0 ? void 0 : data.postID) }, translate('readmore', this.language))));
|
|
@@ -306,8 +342,9 @@ const BlogArticlesGrid$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEl
|
|
|
306
342
|
"isLoading": [32],
|
|
307
343
|
"bannerMatrixReady": [32],
|
|
308
344
|
"nextPage": [32],
|
|
309
|
-
"previousPage": [32]
|
|
310
|
-
|
|
345
|
+
"previousPage": [32],
|
|
346
|
+
"device": [32]
|
|
347
|
+
}, [[8, "BannerMatrixReady", "handleBannerReady"], [0, "hpPageChange", "hpPageChange"]]]);
|
|
311
348
|
function defineCustomElement$1() {
|
|
312
349
|
if (typeof customElements === "undefined") {
|
|
313
350
|
return;
|
|
@@ -14,7 +14,7 @@ const isMobile = (userAgent) => {
|
|
|
14
14
|
};
|
|
15
15
|
|
|
16
16
|
const DEFAULT_LANGUAGE = 'en';
|
|
17
|
-
const SUPPORTED_LANGUAGES = ['ro', 'en'];
|
|
17
|
+
const SUPPORTED_LANGUAGES = ['ro', 'en', 'hu'];
|
|
18
18
|
const TRANSLATIONS = {
|
|
19
19
|
en: {
|
|
20
20
|
firstPage: 'First',
|
|
@@ -39,6 +39,12 @@ const TRANSLATIONS = {
|
|
|
39
39
|
previousPage: 'Previous',
|
|
40
40
|
nextPage: 'Next',
|
|
41
41
|
lastPage: 'Last'
|
|
42
|
+
},
|
|
43
|
+
hu: {
|
|
44
|
+
firstPage: 'First',
|
|
45
|
+
previousPage: 'Previous',
|
|
46
|
+
nextPage: 'Következő',
|
|
47
|
+
lastPage: 'Last'
|
|
42
48
|
}
|
|
43
49
|
};
|
|
44
50
|
const translate = (key, customLang) => {
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { p as promiseResolve, b as bootstrapLazy } from './index-
|
|
1
|
+
import { p as promiseResolve, b as bootstrapLazy } from './index-c02b7464.js';
|
|
2
2
|
|
|
3
3
|
/*
|
|
4
4
|
Stencil Client Patch Browser v2.15.2 | MIT Licensed | https://stenciljs.com
|
|
@@ -13,5 +13,5 @@ const patchBrowser = () => {
|
|
|
13
13
|
};
|
|
14
14
|
|
|
15
15
|
patchBrowser().then(options => {
|
|
16
|
-
return bootstrapLazy([["blog-articles-grid_2",[[1,"blog-articles-grid",{"cmsEndpoint":[1,"cms-endpoint"],"language":[1],"handleClick":[1,"handle-click"],"clientStyling":[1,"client-styling"],"clientStylingUrl":[1,"client-styling-url"],"showPublishingDate":[4,"show-publishing-date"],"showImage":[4,"show-image"],"showTitle":[4,"show-title"],"showContent":[4,"show-content"],"showButton":[4,"show-button"],"usePostmessage":[4,"use-postmessage"],"postMessageEvent":[1,"post-message-event"],"blogsLimit":[514,"blogs-limit"],"paginationActive":[516,"pagination-active"],"arrowsActive":[516,"arrows-active"],"secondaryArrowsActive":[516,"secondary-arrows-active"],"numberedNavActive":[516,"numbered-nav-active"],"paginationBlogList":[32],"currentPage":[32],"hasErrors":[32],"limitStylingAppends":[32],"isLoading":[32],"bannerMatrixReady":[32],"nextPage":[32],"previousPage":[32]},[[8,"
|
|
16
|
+
return bootstrapLazy([["blog-articles-grid_2",[[1,"blog-articles-grid",{"cmsEndpoint":[1,"cms-endpoint"],"language":[1],"handleClick":[1,"handle-click"],"clientStyling":[1,"client-styling"],"clientStylingUrl":[1,"client-styling-url"],"showPublishingDate":[4,"show-publishing-date"],"showImage":[4,"show-image"],"showTitle":[4,"show-title"],"showContent":[4,"show-content"],"showButton":[4,"show-button"],"usePostmessage":[4,"use-postmessage"],"postMessageEvent":[1,"post-message-event"],"blogsLimit":[514,"blogs-limit"],"paginationActive":[516,"pagination-active"],"arrowsActive":[516,"arrows-active"],"secondaryArrowsActive":[516,"secondary-arrows-active"],"numberedNavActive":[516,"numbered-nav-active"],"paginationBlogList":[32],"currentPage":[32],"hasErrors":[32],"limitStylingAppends":[32],"isLoading":[32],"bannerMatrixReady":[32],"nextPage":[32],"previousPage":[32],"device":[32]},[[8,"BannerMatrixReady","handleBannerReady"],[0,"hpPageChange","hpPageChange"]]],[1,"helper-pagination",{"nextPage":[1537,"next-page"],"prevPage":[1537,"prev-page"],"offset":[1538],"limit":[1538],"total":[1538],"language":[1537],"clientStyling":[1537,"client-styling"],"clientStylingUrlContent":[1537,"client-styling-url-content"],"arrowsActive":[1540,"arrows-active"],"secondaryArrowsActive":[1540,"secondary-arrows-active"],"numberedNavActive":[1540,"numbered-nav-active"],"offsetInt":[32],"lastPage":[32],"previousPage":[32],"limitInt":[32],"totalInt":[32],"pagesArray":[32],"endInt":[32],"limitStylingAppends":[32]}]]]], options);
|
|
17
17
|
});
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { r as registerInstance, c as createEvent, h } from './index-
|
|
1
|
+
import { r as registerInstance, c as createEvent, h } from './index-c02b7464.js';
|
|
2
2
|
|
|
3
3
|
const DEFAULT_LANGUAGE$1 = 'en';
|
|
4
|
-
const SUPPORTED_LANGUAGES$1 = ['ro', 'en', 'fr', 'ar'];
|
|
4
|
+
const SUPPORTED_LANGUAGES$1 = ['ro', 'en', 'fr', 'ar', 'hu'];
|
|
5
5
|
const TRANSLATIONS$1 = {
|
|
6
6
|
en: {
|
|
7
7
|
error: 'Error',
|
|
@@ -18,6 +18,10 @@ const TRANSLATIONS$1 = {
|
|
|
18
18
|
ar: {
|
|
19
19
|
error: 'خطأ',
|
|
20
20
|
readmore: 'Read more',
|
|
21
|
+
},
|
|
22
|
+
hu: {
|
|
23
|
+
error: 'Error',
|
|
24
|
+
readmore: 'Read more',
|
|
21
25
|
}
|
|
22
26
|
};
|
|
23
27
|
const translate$1 = (key, customLang) => {
|
|
@@ -25,6 +29,24 @@ const translate$1 = (key, customLang) => {
|
|
|
25
29
|
return TRANSLATIONS$1[lang !== undefined && SUPPORTED_LANGUAGES$1.includes(lang) ? lang : DEFAULT_LANGUAGE$1][key];
|
|
26
30
|
};
|
|
27
31
|
|
|
32
|
+
function checkDeviceType() {
|
|
33
|
+
const userAgent = navigator.userAgent.toLowerCase();
|
|
34
|
+
const width = screen.availWidth;
|
|
35
|
+
const height = screen.availHeight;
|
|
36
|
+
if (userAgent.includes('iphone')) {
|
|
37
|
+
return 'mobile';
|
|
38
|
+
}
|
|
39
|
+
if (userAgent.includes('android')) {
|
|
40
|
+
if (height > width && width < 800) {
|
|
41
|
+
return 'mobile';
|
|
42
|
+
}
|
|
43
|
+
if (width > height && height < 800) {
|
|
44
|
+
return 'tablet';
|
|
45
|
+
}
|
|
46
|
+
}
|
|
47
|
+
return 'desktop';
|
|
48
|
+
}
|
|
49
|
+
|
|
28
50
|
const blogArticlesGridCss = ":host {\n display: block;\n}\n\n.GridContainerWrapper {\n display: grid;\n}\n\n.GridContainer {\n margin: auto;\n width: 100%;\n height: 280px;\n border-radius: 15px;\n background-color: #07072A;\n margin-bottom: 20px;\n display: grid;\n gap: 30px;\n grid-template-rows: 1fr 4fr 1fr 1fr;\n grid-template-columns: 30px 1fr 1fr 30px;\n}\n.GridContainer .BlogBanner {\n grid-column: 1/3;\n grid-row: 1/5;\n}\n.GridContainer .BlogBanner img {\n border-radius: 5px 0 0 5px;\n width: 100%;\n height: 280px;\n}\n.GridContainer .BlogDate {\n font-size: 12px;\n border-radius: 5px 5px 0 0;\n padding: 10px;\n width: fit-content;\n text-align: center;\n color: #FFFFFF;\n background-color: #0D0D4D;\n grid-column: 2/2;\n grid-row: 4/4;\n z-index: 1;\n}\n.GridContainer .BlogTitle {\n font-size: 24px;\n color: #FFF;\n margin-top: 20px;\n grid-column: 3/5;\n}\n.GridContainer .BlogContent {\n font-size: 14px;\n color: #FFF;\n width: 90%;\n max-height: 80px;\n overflow: hidden;\n text-overflow: ellipsis;\n grid-column: 3/5;\n}\n.GridContainer .BlogLink {\n grid-column: 3/5;\n color: #FFF;\n}\n.GridContainer .BlogLink button {\n font-size: 14px;\n border: none;\n padding: 0;\n background: none;\n color: #D0046C;\n cursor: pointer;\n}\n\n@container (max-width: 475px) {\n .GridContainerWrapper {\n display: grid;\n }\n\n .GridContainer {\n margin: auto;\n width: 100%;\n min-height: 400px;\n gap: 10%;\n padding-bottom: 30px;\n border-radius: 5px;\n background-color: #07072A;\n margin-bottom: 20px;\n display: grid;\n grid-template-rows: repeat(auto-fit, minmax(50px, 1fr));\n grid-template-rows: auto auto auto 50px;\n grid-template-columns: 15px auto auto 15px;\n gap: 10px;\n }\n .GridContainer .BlogBanner {\n grid-column: 1/5;\n grid-row: 1/3;\n margin: 0;\n }\n .GridContainer .BlogBanner img {\n width: 100%;\n height: 232px;\n border-radius: 5px 5px 0 0;\n }\n .GridContainer .BlogDate {\n grid-column: 2/3;\n grid-row: 2/3;\n font-size: 12px;\n border-radius: 5px 5px 0 0;\n padding: 10px;\n width: fit-content;\n text-align: center;\n color: #FFFFFF;\n background-color: #0D0D4D;\n z-index: 1;\n }\n .GridContainer .BlogTitle {\n grid-column: 2/4;\n font-size: 24px;\n color: #FFF;\n }\n .GridContainer .BlogContent {\n grid-column: 2/4;\n font-size: 14px;\n color: #FFF;\n }\n .GridContainer .BlogLink {\n grid-column: 2/4;\n color: #FFF;\n cursor: pointer;\n }\n .GridContainer .BlogLink button {\n font-size: 14px;\n border: none;\n background: none;\n color: #D0046C;\n cursor: pointer;\n }\n}";
|
|
29
51
|
|
|
30
52
|
const BlogArticlesGrid = class {
|
|
@@ -77,6 +99,7 @@ const BlogArticlesGrid = class {
|
|
|
77
99
|
this.bannerMatrixReady = false;
|
|
78
100
|
this.nextPage = '';
|
|
79
101
|
this.previousPage = '';
|
|
102
|
+
this.device = '';
|
|
80
103
|
this.defaultStyling = `
|
|
81
104
|
div#PaginationContainer {
|
|
82
105
|
justify-content: right;
|
|
@@ -149,10 +172,10 @@ const BlogArticlesGrid = class {
|
|
|
149
172
|
return;
|
|
150
173
|
const hasBanner = content.indexOf('<bannermatrix-banner') !== -1;
|
|
151
174
|
if (!hasBanner) {
|
|
152
|
-
return h("div", { class: "BlogContent", innerHTML:
|
|
175
|
+
return h("div", { class: "BlogContent", innerHTML: content });
|
|
153
176
|
}
|
|
154
177
|
if (this.bannerMatrixReady) {
|
|
155
|
-
return h("div", { class: "BlogContent", innerHTML:
|
|
178
|
+
return h("div", { class: "BlogContent", innerHTML: content });
|
|
156
179
|
}
|
|
157
180
|
return null;
|
|
158
181
|
};
|
|
@@ -176,6 +199,8 @@ const BlogArticlesGrid = class {
|
|
|
176
199
|
var _a, _b;
|
|
177
200
|
this.paginationBlogList = event.detail;
|
|
178
201
|
this.currentPage = Math.floor(((_a = this.paginationBlogList) === null || _a === void 0 ? void 0 : _a.offset) / ((_b = this.paginationBlogList) === null || _b === void 0 ? void 0 : _b.limit));
|
|
202
|
+
if (this.currentPage + 1 > this.lastPage)
|
|
203
|
+
return;
|
|
179
204
|
this.getBlogArticleGrid();
|
|
180
205
|
}
|
|
181
206
|
handleAction(postId) {
|
|
@@ -188,6 +213,10 @@ const BlogArticlesGrid = class {
|
|
|
188
213
|
}
|
|
189
214
|
componentDidLoad() {
|
|
190
215
|
window.postMessage({ type: 'BlogArticlesGridLoaded' }, window.location.href);
|
|
216
|
+
this.detectAndAlertDeviceType();
|
|
217
|
+
}
|
|
218
|
+
detectAndAlertDeviceType() {
|
|
219
|
+
this.device = checkDeviceType();
|
|
191
220
|
}
|
|
192
221
|
sortArticlesByDate(arr) {
|
|
193
222
|
arr.sort((a, b) => {
|
|
@@ -229,6 +258,7 @@ const BlogArticlesGrid = class {
|
|
|
229
258
|
return res.json();
|
|
230
259
|
})
|
|
231
260
|
.then((blogContent) => {
|
|
261
|
+
this.lastPage = +blogContent.pages.last.slice(blogContent.pages.last.lastIndexOf('=') + 1);
|
|
232
262
|
let blogItems = blogContent.items;
|
|
233
263
|
this.nextPage = blogContent.pages.next;
|
|
234
264
|
this.previousPage = blogContent.pages.previous;
|
|
@@ -257,6 +287,13 @@ const BlogArticlesGrid = class {
|
|
|
257
287
|
}
|
|
258
288
|
// end custom styling area
|
|
259
289
|
}
|
|
290
|
+
formatDateToYearMonthDay(dateString) {
|
|
291
|
+
let date = new Date(dateString);
|
|
292
|
+
let year = date.getFullYear();
|
|
293
|
+
let month = String(date.getMonth() + 1).padStart(2, '0');
|
|
294
|
+
let day = String(date.getDate()).padStart(2, '0');
|
|
295
|
+
return `${day}-${month}-${year}`;
|
|
296
|
+
}
|
|
260
297
|
render() {
|
|
261
298
|
var _a, _b;
|
|
262
299
|
if (this.hasErrors) {
|
|
@@ -264,10 +301,9 @@ const BlogArticlesGrid = class {
|
|
|
264
301
|
}
|
|
265
302
|
return (h("div", { ref: el => this.stylingContainer = el }, h("div", { class: "BlogGridPaginationWrapper" }, this.paginationActive == true && h("helper-pagination", { "next-page": this.nextPage, "prev-page": this.previousPage, offset: this.paginationBlogList.offset, limit: this.blogsLimit, total: (_b = (_a = this.blogData) === null || _a === void 0 ? void 0 : _a.items) === null || _b === void 0 ? void 0 : _b.length, language: this.language, "client-styling": this.clientStyling || this.defaultStyling, "arrows-active": this.arrowsActive || false, "secondary-arrows-active": this.secondaryArrowsActive || false, "numbered-nav-active": this.numberedNavActive || false })), (!this.isLoading) &&
|
|
266
303
|
h("div", { class: "GridContainerWrapper" }, this.blogData.map((data) => {
|
|
267
|
-
var _a;
|
|
304
|
+
var _a, _b;
|
|
268
305
|
return h("div", { class: "GridContainer" }, this.showPublishingDate &&
|
|
269
|
-
h("div", { class: "BlogDate" }, data === null || data === void 0 ? void 0 : data.publishingDate), this.showImage &&
|
|
270
|
-
h("div", { class: "BlogBanner" }, h("img", { src: (_a = data === null || data === void 0 ? void 0 : data.image) === null || _a === void 0 ? void 0 : _a.src, alt: data === null || data === void 0 ? void 0 : data.title })), this.showTitle &&
|
|
306
|
+
h("div", { class: "BlogDate" }, this.formatDateToYearMonthDay(data === null || data === void 0 ? void 0 : data.publishingDate)), this.showImage && (h("div", { class: "BlogBanner" }, ((_a = data.image) === null || _a === void 0 ? void 0 : _a.src) ? (h("img", { src: data.image.src, alt: data.image.src })) : (((_b = data.video) === null || _b === void 0 ? void 0 : _b.sources[this.device]) ? (h("video", { src: data.video.sources[this.device], controls: true })) : (h("h1", { style: { color: "white" } }, "No Image"))))), this.showTitle &&
|
|
271
307
|
h("div", { class: "BlogTitle" }, data === null || data === void 0 ? void 0 : data.title), this.showContent &&
|
|
272
308
|
this.renderContentConditionally(data === null || data === void 0 ? void 0 : data.content), this.showButton &&
|
|
273
309
|
h("div", { class: "BlogLink" }, h("button", { onClick: () => this.handleAction(data === null || data === void 0 ? void 0 : data.postID) }, translate$1('readmore', this.language))));
|
|
@@ -294,7 +330,7 @@ const isMobile = (userAgent) => {
|
|
|
294
330
|
};
|
|
295
331
|
|
|
296
332
|
const DEFAULT_LANGUAGE = 'en';
|
|
297
|
-
const SUPPORTED_LANGUAGES = ['ro', 'en'];
|
|
333
|
+
const SUPPORTED_LANGUAGES = ['ro', 'en', 'hu'];
|
|
298
334
|
const TRANSLATIONS = {
|
|
299
335
|
en: {
|
|
300
336
|
firstPage: 'First',
|
|
@@ -319,6 +355,12 @@ const TRANSLATIONS = {
|
|
|
319
355
|
previousPage: 'Previous',
|
|
320
356
|
nextPage: 'Next',
|
|
321
357
|
lastPage: 'Last'
|
|
358
|
+
},
|
|
359
|
+
hu: {
|
|
360
|
+
firstPage: 'First',
|
|
361
|
+
previousPage: 'Previous',
|
|
362
|
+
nextPage: 'Következő',
|
|
363
|
+
lastPage: 'Last'
|
|
322
364
|
}
|
|
323
365
|
};
|
|
324
366
|
const translate = (key, customLang) => {
|
|
@@ -246,6 +246,31 @@ const setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags) => {
|
|
|
246
246
|
classList.remove(...oldClasses.filter((c) => c && !newClasses.includes(c)));
|
|
247
247
|
classList.add(...newClasses.filter((c) => c && !oldClasses.includes(c)));
|
|
248
248
|
}
|
|
249
|
+
else if (memberName === 'style') {
|
|
250
|
+
// update style attribute, css properties and values
|
|
251
|
+
{
|
|
252
|
+
for (const prop in oldValue) {
|
|
253
|
+
if (!newValue || newValue[prop] == null) {
|
|
254
|
+
if (prop.includes('-')) {
|
|
255
|
+
elm.style.removeProperty(prop);
|
|
256
|
+
}
|
|
257
|
+
else {
|
|
258
|
+
elm.style[prop] = '';
|
|
259
|
+
}
|
|
260
|
+
}
|
|
261
|
+
}
|
|
262
|
+
}
|
|
263
|
+
for (const prop in newValue) {
|
|
264
|
+
if (!oldValue || newValue[prop] !== oldValue[prop]) {
|
|
265
|
+
if (prop.includes('-')) {
|
|
266
|
+
elm.style.setProperty(prop, newValue[prop]);
|
|
267
|
+
}
|
|
268
|
+
else {
|
|
269
|
+
elm.style[prop] = newValue[prop];
|
|
270
|
+
}
|
|
271
|
+
}
|
|
272
|
+
}
|
|
273
|
+
}
|
|
249
274
|
else if (memberName === 'ref') {
|
|
250
275
|
// minifier will clean this up
|
|
251
276
|
if (newValue) {
|
package/dist/esm/loader.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { p as promiseResolve, b as bootstrapLazy } from './index-
|
|
1
|
+
import { p as promiseResolve, b as bootstrapLazy } from './index-c02b7464.js';
|
|
2
2
|
|
|
3
3
|
/*
|
|
4
4
|
Stencil Client Patch Esm v2.15.2 | MIT Licensed | https://stenciljs.com
|
|
@@ -10,7 +10,7 @@ const patchEsm = () => {
|
|
|
10
10
|
const defineCustomElements = (win, options) => {
|
|
11
11
|
if (typeof window === 'undefined') return Promise.resolve();
|
|
12
12
|
return patchEsm().then(() => {
|
|
13
|
-
return bootstrapLazy([["blog-articles-grid_2",[[1,"blog-articles-grid",{"cmsEndpoint":[1,"cms-endpoint"],"language":[1],"handleClick":[1,"handle-click"],"clientStyling":[1,"client-styling"],"clientStylingUrl":[1,"client-styling-url"],"showPublishingDate":[4,"show-publishing-date"],"showImage":[4,"show-image"],"showTitle":[4,"show-title"],"showContent":[4,"show-content"],"showButton":[4,"show-button"],"usePostmessage":[4,"use-postmessage"],"postMessageEvent":[1,"post-message-event"],"blogsLimit":[514,"blogs-limit"],"paginationActive":[516,"pagination-active"],"arrowsActive":[516,"arrows-active"],"secondaryArrowsActive":[516,"secondary-arrows-active"],"numberedNavActive":[516,"numbered-nav-active"],"paginationBlogList":[32],"currentPage":[32],"hasErrors":[32],"limitStylingAppends":[32],"isLoading":[32],"bannerMatrixReady":[32],"nextPage":[32],"previousPage":[32]},[[8,"
|
|
13
|
+
return bootstrapLazy([["blog-articles-grid_2",[[1,"blog-articles-grid",{"cmsEndpoint":[1,"cms-endpoint"],"language":[1],"handleClick":[1,"handle-click"],"clientStyling":[1,"client-styling"],"clientStylingUrl":[1,"client-styling-url"],"showPublishingDate":[4,"show-publishing-date"],"showImage":[4,"show-image"],"showTitle":[4,"show-title"],"showContent":[4,"show-content"],"showButton":[4,"show-button"],"usePostmessage":[4,"use-postmessage"],"postMessageEvent":[1,"post-message-event"],"blogsLimit":[514,"blogs-limit"],"paginationActive":[516,"pagination-active"],"arrowsActive":[516,"arrows-active"],"secondaryArrowsActive":[516,"secondary-arrows-active"],"numberedNavActive":[516,"numbered-nav-active"],"paginationBlogList":[32],"currentPage":[32],"hasErrors":[32],"limitStylingAppends":[32],"isLoading":[32],"bannerMatrixReady":[32],"nextPage":[32],"previousPage":[32],"device":[32]},[[8,"BannerMatrixReady","handleBannerReady"],[0,"hpPageChange","hpPageChange"]]],[1,"helper-pagination",{"nextPage":[1537,"next-page"],"prevPage":[1537,"prev-page"],"offset":[1538],"limit":[1538],"total":[1538],"language":[1537],"clientStyling":[1537,"client-styling"],"clientStylingUrlContent":[1537,"client-styling-url-content"],"arrowsActive":[1540,"arrows-active"],"secondaryArrowsActive":[1540,"secondary-arrows-active"],"numberedNavActive":[1540,"numbered-nav-active"],"offsetInt":[32],"lastPage":[32],"previousPage":[32],"limitInt":[32],"totalInt":[32],"pagesArray":[32],"endInt":[32],"limitStylingAppends":[32]}]]]], options);
|
|
14
14
|
});
|
|
15
15
|
};
|
|
16
16
|
|
|
@@ -79,6 +79,8 @@ export declare class BlogArticlesGrid {
|
|
|
79
79
|
bannerMatrixReady: boolean;
|
|
80
80
|
nextPage: string;
|
|
81
81
|
previousPage: string;
|
|
82
|
+
device: string;
|
|
83
|
+
lastPage: number;
|
|
82
84
|
handleBannerReady(): void;
|
|
83
85
|
watchEndpoint(newValue: string, oldValue: string): void;
|
|
84
86
|
private stylingContainer;
|
|
@@ -88,6 +90,7 @@ export declare class BlogArticlesGrid {
|
|
|
88
90
|
handleAction(postId: any): void;
|
|
89
91
|
connectedCallback(): void;
|
|
90
92
|
componentDidLoad(): void;
|
|
93
|
+
detectAndAlertDeviceType(): void;
|
|
91
94
|
sortArticlesByDate(arr: any): any;
|
|
92
95
|
findLatestFeatured(array: any): any;
|
|
93
96
|
moveLatestFeatureToStart(articlesArray: any, latestFeatured: any): any;
|
|
@@ -95,6 +98,7 @@ export declare class BlogArticlesGrid {
|
|
|
95
98
|
componentDidRender(): void;
|
|
96
99
|
setClientStyling: () => void;
|
|
97
100
|
setClientStylingURL: () => void;
|
|
101
|
+
formatDateToYearMonthDay(dateString: any): string;
|
|
98
102
|
renderContentConditionally: (content: string) => HTMLElement;
|
|
99
103
|
render(): void;
|
|
100
104
|
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function checkDeviceType(): 'mobile' | 'tablet' | 'desktop';
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@everymatrix/blog-articles-grid",
|
|
3
|
-
"version": "1.13.
|
|
3
|
+
"version": "1.13.12",
|
|
4
4
|
"main": "./dist/index.cjs.js",
|
|
5
5
|
"module": "./dist/index.js",
|
|
6
6
|
"es2015": "./dist/esm/index.mjs",
|
|
@@ -17,7 +17,7 @@
|
|
|
17
17
|
"access": "public"
|
|
18
18
|
},
|
|
19
19
|
"dependencies": {
|
|
20
|
-
"@everymatrix/helper-
|
|
20
|
+
"@everymatrix/helper-pagination": "*",
|
|
21
21
|
"@stencil/core": "2.17.4"
|
|
22
22
|
}
|
|
23
23
|
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{r as t,c as i,h as n}from"./p-f0d2badc.js";const s=["ro","en","fr","ar"],e={en:{error:"Error",readmore:"Read more"},ro:{error:"Eroare",readmore:"Read more"},fr:{error:"Error",readmore:"Read more"},ar:{error:"خطأ",readmore:"Read more"}},o=(t,i)=>{const n=i;return e[void 0!==n&&s.includes(n)?n:"en"][t]},r=class{constructor(s){t(this,s),this.articleActionButton=i(this,"articleActionButton",7),this.language="en",this.clientStyling="",this.clientStylingUrl="",this.showPublishingDate=!0,this.showImage=!0,this.showTitle=!0,this.showContent=!0,this.showButton=!0,this.postMessageEvent="articleActionButton",this.paginationBlogList={offset:0},this.currentPage=0,this.hasErrors=!1,this.limitStylingAppends=!1,this.isLoading=!0,this.bannerMatrixReady=!1,this.nextPage="",this.previousPage="",this.defaultStyling="\n div#PaginationContainer {\n justify-content: right;\n }\n .LeftItems button .NavigationButton {\n display: none;\n }\n .LeftItems button:after, .RightItems button:after {\n padding: 7px 12px;\n font-size: 18px;\n font-weight: 700;\n line-height: 46px;\n }\n .LeftItems button:after {\n content: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1.2em' viewBox='0 0 320 512'%3E%3C!--! Font Awesome Free 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --%3E%3Cpath d='M9.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l192 192c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L77.3 256 246.6 86.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-192 192z'/%3E%3C/svg%3E\");\n }\n .RightItems button:after {\n content: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1.2em' viewBox='0 0 320 512'%3E%3C!--! Font Awesome Free 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --%3E%3Cpath d='M310.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-192 192c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L242.7 256 73.4 86.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l192 192z'/%3E%3C/svg%3E\");\n display: block;\n height: 38px;\n }\n div.LeftItems button, div.RightItems button {\n width: unset;\n height: 40px;\n background-color: #fff;\n color: #000;\n border: 1px solid #000;\n overflow: hidden;\n &:disabled {\n background-color: #989898;\n }\n }\n div.LeftItems button {\n min-width: 60px;\n border-radius: 20px 0 0 20px;\n border-right: 0;\n }\n div.RightItems button {\n display: flex;\n min-width: 100px;\n justify-content: space-evenly;\n align-items: center;\n border-radius: 0 20px 20px 0;\n text-transform: none;\n }\n .RightItems button .NavigationButton {\n padding: 12px 0 12px 12px;\n font-weight: 700;\n }",this.setClientStyling=()=>{let t=document.createElement("style");t.innerHTML=this.clientStyling,this.stylingContainer.prepend(t)},this.setClientStylingURL=()=>{let t=new URL(this.clientStylingUrl),i=document.createElement("style");fetch(t.href).then((t=>t.text())).then((t=>{i.innerHTML=t,setTimeout((()=>{this.stylingContainer.prepend(i)}),1)})).catch((t=>{console.log("error ",t)}))},this.renderContentConditionally=t=>{if(t)return-1!==t.indexOf("<bannermatrix-banner")?this.bannerMatrixReady?n("div",{class:"BlogContent",innerHTML:this.blogData.content}):null:n("div",{class:"BlogContent",innerHTML:this.blogData.content})}}getArticleId(t){this.articleActionButton.emit({postId:t}),this.usePostmessage&&window.postMessage({type:this.postMessageEvent,postId:t})}handleBannerReady(){this.bannerMatrixReady=!0}watchEndpoint(t,i){t&&t!=i&&this.cmsEndpoint&&this.getBlogArticleGrid()}hpPageChange(t){var i,n;this.paginationBlogList=t.detail,this.currentPage=Math.floor((null===(i=this.paginationBlogList)||void 0===i?void 0:i.offset)/(null===(n=this.paginationBlogList)||void 0===n?void 0:n.limit)),this.getBlogArticleGrid()}handleAction(t){this.getArticleId(t)}connectedCallback(){this.cmsEndpoint&&this.language&&this.getBlogArticleGrid()}componentDidLoad(){window.postMessage({type:"BlogArticlesGridLoaded"},window.location.href)}sortArticlesByDate(t){return t.sort(((t,i)=>t.publishingDate>i.publishingDate?-1:t.publishingDate<i.publishingDate?1:0)),t}findLatestFeatured(t){let i=t.filter((t=>t.isFeaturedPost));return 0===i.length?null:(i=this.sortArticlesByDate(i),i[0])}moveLatestFeatureToStart(t,i){const n=t.indexOf(i);return-1!==n&&(t.splice(n,1),t.unshift(i)),t}getBlogArticleGrid(){this.isLoading=!0;let t=new URL(`${this.cmsEndpoint}/${this.language}/blog-posts`);t.searchParams.append("per_page",JSON.stringify(this.blogsLimit)),t.searchParams.append("page",JSON.stringify(this.currentPage+1)),fetch(t.href).then((t=>{if(t.status>=300)throw this.hasErrors=!0,new Error("There was an error while fetching the data");return t.json()})).then((t=>{let i=t.items;this.nextPage=t.pages.next,this.previousPage=t.pages.previous;const n=this.findLatestFeatured(i);this.blogData=this.sortArticlesByDate(i),this.blogData=this.moveLatestFeatureToStart(i,n),this.blogData.items=i.map((t=>Object.assign(Object.assign({},t),{publishingDate:new Date(t.publishingDate).toLocaleDateString()}))),this.isLoading=!1})).catch((t=>{this.hasErrors=!0,console.log("Error",t)})).finally((()=>this.isLoading=!1))}componentDidRender(){!this.limitStylingAppends&&this.stylingContainer&&(this.clientStyling&&this.setClientStyling(),this.clientStylingUrl&&this.setClientStylingURL(),this.limitStylingAppends=!0)}render(){var t,i;return this.hasErrors?n("div",{class:"BlogArticleDetails"},n("div",{class:"Title"},o("error",this.language))):n("div",{ref:t=>this.stylingContainer=t},n("div",{class:"BlogGridPaginationWrapper"},1==this.paginationActive&&n("helper-pagination",{"next-page":this.nextPage,"prev-page":this.previousPage,offset:this.paginationBlogList.offset,limit:this.blogsLimit,total:null===(i=null===(t=this.blogData)||void 0===t?void 0:t.items)||void 0===i?void 0:i.length,language:this.language,"client-styling":this.clientStyling||this.defaultStyling,"arrows-active":this.arrowsActive||!1,"secondary-arrows-active":this.secondaryArrowsActive||!1,"numbered-nav-active":this.numberedNavActive||!1})),!this.isLoading&&n("div",{class:"GridContainerWrapper"},this.blogData.map((t=>{var i;return n("div",{class:"GridContainer"},this.showPublishingDate&&n("div",{class:"BlogDate"},null==t?void 0:t.publishingDate),this.showImage&&n("div",{class:"BlogBanner"},n("img",{src:null===(i=null==t?void 0:t.image)||void 0===i?void 0:i.src,alt:null==t?void 0:t.title})),this.showTitle&&n("div",{class:"BlogTitle"},null==t?void 0:t.title),this.showContent&&this.renderContentConditionally(null==t?void 0:t.content),this.showButton&&n("div",{class:"BlogLink"},n("button",{onClick:()=>this.handleAction(null==t?void 0:t.postID)},o("readmore",this.language))))}))))}static get watchers(){return{cmsEndpoint:["watchEndpoint"],language:["watchEndpoint"]}}};r.style=":host {\n display: block;\n}\n\n.GridContainerWrapper {\n display: grid;\n}\n\n.GridContainer {\n margin: auto;\n width: 100%;\n height: 280px;\n border-radius: 15px;\n background-color: #07072A;\n margin-bottom: 20px;\n display: grid;\n gap: 30px;\n grid-template-rows: 1fr 4fr 1fr 1fr;\n grid-template-columns: 30px 1fr 1fr 30px;\n}\n.GridContainer .BlogBanner {\n grid-column: 1/3;\n grid-row: 1/5;\n}\n.GridContainer .BlogBanner img {\n border-radius: 5px 0 0 5px;\n width: 100%;\n height: 280px;\n}\n.GridContainer .BlogDate {\n font-size: 12px;\n border-radius: 5px 5px 0 0;\n padding: 10px;\n width: fit-content;\n text-align: center;\n color: #FFFFFF;\n background-color: #0D0D4D;\n grid-column: 2/2;\n grid-row: 4/4;\n z-index: 1;\n}\n.GridContainer .BlogTitle {\n font-size: 24px;\n color: #FFF;\n margin-top: 20px;\n grid-column: 3/5;\n}\n.GridContainer .BlogContent {\n font-size: 14px;\n color: #FFF;\n width: 90%;\n max-height: 80px;\n overflow: hidden;\n text-overflow: ellipsis;\n grid-column: 3/5;\n}\n.GridContainer .BlogLink {\n grid-column: 3/5;\n color: #FFF;\n}\n.GridContainer .BlogLink button {\n font-size: 14px;\n border: none;\n padding: 0;\n background: none;\n color: #D0046C;\n cursor: pointer;\n}\n\n@container (max-width: 475px) {\n .GridContainerWrapper {\n display: grid;\n }\n\n .GridContainer {\n margin: auto;\n width: 100%;\n min-height: 400px;\n gap: 10%;\n padding-bottom: 30px;\n border-radius: 5px;\n background-color: #07072A;\n margin-bottom: 20px;\n display: grid;\n grid-template-rows: repeat(auto-fit, minmax(50px, 1fr));\n grid-template-rows: auto auto auto 50px;\n grid-template-columns: 15px auto auto 15px;\n gap: 10px;\n }\n .GridContainer .BlogBanner {\n grid-column: 1/5;\n grid-row: 1/3;\n margin: 0;\n }\n .GridContainer .BlogBanner img {\n width: 100%;\n height: 232px;\n border-radius: 5px 5px 0 0;\n }\n .GridContainer .BlogDate {\n grid-column: 2/3;\n grid-row: 2/3;\n font-size: 12px;\n border-radius: 5px 5px 0 0;\n padding: 10px;\n width: fit-content;\n text-align: center;\n color: #FFFFFF;\n background-color: #0D0D4D;\n z-index: 1;\n }\n .GridContainer .BlogTitle {\n grid-column: 2/4;\n font-size: 24px;\n color: #FFF;\n }\n .GridContainer .BlogContent {\n grid-column: 2/4;\n font-size: 14px;\n color: #FFF;\n }\n .GridContainer .BlogLink {\n grid-column: 2/4;\n color: #FFF;\n cursor: pointer;\n }\n .GridContainer .BlogLink button {\n font-size: 14px;\n border: none;\n background: none;\n color: #D0046C;\n cursor: pointer;\n }\n}";const a=t=>!!(t.toLowerCase().match(/android/i)||t.toLowerCase().match(/blackberry|bb/i)||t.toLowerCase().match(/iphone|ipad|ipod/i)||t.toLowerCase().match(/windows phone|windows mobile|iemobile|wpdesktop/i)),h=["ro","en"],l={en:{firstPage:"First",previousPage:"Previous",nextPage:"Next",lastPage:"Last"},ro:{firstPage:"Prima",previousPage:"Anterior",nextPage:"Urmatoarea",lastPage:"Ultima"},fr:{firstPage:"First",previousPage:"Previous",nextPage:"Next",lastPage:"Last"},ar:{firstPage:"First",previousPage:"Previous",nextPage:"Next",lastPage:"Last"}},d=(t,i)=>{const n=i;return l[void 0!==n&&h.includes(n)?n:"en"][t]},c=class{constructor(n){t(this,n),this.hpPageChange=i(this,"hpPageChange",7),this.nextPage="",this.prevPage="",this.offset=0,this.limit=1,this.total=1,this.language="en",this.clientStyling="",this.clientStylingUrlContent="",this.lastPage=!1,this.previousPage=!1,this.pagesArray=[],this.endInt=0,this.userAgent=window.navigator.userAgent,this.currentPage=1,this.limitStylingAppends=!1,this.navigateTo=t=>{switch(t){case"firstPage":this.offsetInt=0;break;case"lastPage":this.offsetInt=this.endInt*this.limitInt;break;case"previousPage":this.offsetInt-=this.limitInt;break;case"nextPage":this.offsetInt+=this.limitInt;break;case"fivePagesBack":this.offsetInt-=5*this.limitInt,this.offsetInt=this.offsetInt<=0?0:this.offsetInt;break;case"fivePagesForward":this.offsetInt+=5*this.limitInt,this.offsetInt=this.offsetInt/this.limitInt>=this.endInt?this.endInt*this.limitInt:this.offsetInt}this.previousPage=!!this.offsetInt,this.hpPageChange.emit({offset:this.offsetInt,limit:this.limitInt,total:this.totalInt})},this.paginationNavigation=(t,i)=>{this.previousPage=!0,isNaN(t)?0===i&&this.currentPage<=4?this.navigateTo("firstPage"):0===i&&this.currentPage>4?this.navigateTo("fivePagesBack"):4===i&&this.endInt-this.currentPage>=2&&this.navigateTo("fivePagesForward"):1===t?(this.offsetInt=t-1,this.previousPage=!1):this.offsetInt=(t-1)*this.limitInt,this.hpPageChange.emit({offset:this.offsetInt,limit:this.limitInt,total:this.totalInt})},this.setClientStyling=()=>{let t=document.createElement("style");t.innerHTML=this.clientStyling,this.stylingContainer.prepend(t)},this.setClientStylingURL=()=>{let t=document.createElement("style");setTimeout((()=>{t.innerHTML=this.clientStylingUrlContent,this.stylingContainer.prepend(t)}),1)}}componentWillRender(){this.offsetInt=this.offset,this.limitInt=this.limit,this.currentPage=this.offsetInt/this.limitInt+1,this.limitInt=this.limit,this.totalInt=this.total,this.endInt=Math.ceil(this.totalInt/this.limitInt)-1,this.lastPage=!(this.offsetInt>=this.endInt*this.limitInt),1==this.currentPage||2==this.currentPage?(this.pagesArray=Array.from({length:4},((t,i)=>i+1)),this.pagesArray.push("...")):this.currentPage>=3&&this.endInt-this.currentPage>=2?(this.pagesArray=Array.from({length:3},((t,i)=>this.currentPage+i-1)),this.pagesArray.push("..."),this.pagesArray.unshift("...")):this.endInt-this.currentPage<3&&(this.pagesArray=Array.from({length:4},((t,i)=>this.endInt-2+i)),this.pagesArray.unshift("..."))}componentDidRender(){!this.limitStylingAppends&&this.stylingContainer&&(this.clientStyling&&this.setClientStyling(),this.clientStylingUrlContent&&this.setClientStylingURL(),this.limitStylingAppends=!0)}render(){let t=n("ul",{class:"PaginationArea"},this.pagesArray.map(((t,i)=>n("li",{class:"PaginationItem"+(t===this.currentPage?" ActiveItem":" ")+" "+(a(this.userAgent)?"MobileButtons":"")},n("button",{disabled:t===this.currentPage,onClick:this.paginationNavigation.bind(this,t,i)},n("span",null,t)))))),i=n("button",{disabled:!this.prevPage,onClick:this.navigateTo.bind(this,"firstPage")},n("span",{class:"NavigationButton"},d("firstPage",this.language)),n("span",{class:"NavigationIcon"})),s=n("div",{class:"LeftItems"},this.secondaryArrowsActive&&i,n("button",{disabled:!this.prevPage,onClick:this.navigateTo.bind(this,"previousPage")},n("span",{class:"NavigationButton"},d("previousPage",this.language)),n("span",{class:"NavigationIcon"})));a(this.userAgent)&&(s=n("div",{class:"LeftItems"},n("button",{disabled:!this.prevPage,onClick:this.navigateTo.bind(this,"previousPage")},n("span",{class:"NavigationButton"},d("previousPage",this.language)),n("span",{class:"NavigationIcon"}))));let e=n("button",{disabled:!this.nextPage,onClick:this.navigateTo.bind(this,"lastPage")},n("span",{class:"NavigationButton"},d("lastPage",this.language)),n("span",{class:"NavigationIcon"})),o=n("div",{class:"RightItems"},n("button",{disabled:!this.nextPage,onClick:this.navigateTo.bind(this,"nextPage")},n("span",{class:"NavigationButton"},d("nextPage",this.language)),n("span",{class:"NavigationIcon"})),this.secondaryArrowsActive&&e);return a(this.userAgent)&&(o=n("div",{class:"RightItems"},n("button",{disabled:!this.nextPage,onClick:this.navigateTo.bind(this,"nextPage")},n("span",{class:"NavigationButton"},d("nextPage",this.language)),n("span",{class:"NavigationIcon"})))),n("div",{id:"PaginationContainer",ref:t=>this.stylingContainer=t},this.arrowsActive&&s,this.numberedNavActive&&t,this.arrowsActive&&o)}};c.style='@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap");:host{display:block;font-family:"Roboto", sans-serif}#PaginationContainer{width:100%;margin:20px 0;display:inline-flex;justify-content:space-between;align-items:center}.LeftItems button:not(:first-child),.RightItems button:not(:last-child){margin:0 10px}.LeftItems button,.RightItems button{padding:0;background-color:#009993;border-color:#009993}.PaginationArea{display:inline-flex;gap:10px;list-style:none}.PaginationArea li{margin:0;padding:0}.PaginationArea li button{width:24px;height:24px;display:flex;border:0;padding:0;justify-content:center;align-items:center;background-color:transparent;color:#000;cursor:pointer;pointer-events:all}.PaginationItem.ActiveItem button{background:#009993;border-color:#009993;color:#fff}.PaginationItem.ActiveItem button:disabled{pointer-events:none;cursor:not-allowed}.PaginationItem button:hover,.PaginationItem button:active{background:#009993;border-color:#009993;color:#fff;opacity:0.8}button{width:100px;height:32px;border:1px solid #524e52;border-radius:5px;background:#524e52;color:#fff;font-size:14px;font:inherit;cursor:pointer;transition:all 0.1s linear;text-transform:uppercase;text-align:center;letter-spacing:0}button:hover,button:active{background:#004D4A;border-color:#004D4A}button:disabled{background-color:#ccc;border-color:#ccc;color:#fff;cursor:not-allowed}@media screen and (max-width: 720px){button{width:90px;font-size:14px}}@media screen and (max-width: 480px){button{width:70px;font-size:14px}.paginationArea{padding:5px}}@media screen and (max-width: 320px){button{width:58px;font-size:12px}.paginationArea{padding:5px;gap:5px}}@media (hover: none){.paginationItem button:hover{background:inherit;border-color:inherit;color:inherit;opacity:1}.paginationItem.activeItem button:hover{background:#009993;border-color:#009993;color:#fff}}';export{r as blog_articles_grid,c as helper_pagination}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
let e,t,n=!1;const l="undefined"!=typeof window?window:{},s=l.document||{head:{}},o={t:0,l:"",jmp:e=>e(),raf:e=>requestAnimationFrame(e),ael:(e,t,n,l)=>e.addEventListener(t,n,l),rel:(e,t,n,l)=>e.removeEventListener(t,n,l),ce:(e,t)=>new CustomEvent(e,t)},c=e=>Promise.resolve(e),r=(()=>{try{return new CSSStyleSheet,"function"==typeof(new CSSStyleSheet).replace}catch(e){}return!1})(),i=(e,t,n)=>{n&&n.map((([n,l,s])=>{const c=u(e,n),r=a(t,s),i=f(n);o.ael(c,l,r,i),(t.o=t.o||[]).push((()=>o.rel(c,l,r,i)))}))},a=(e,t)=>n=>{try{256&e.t?e.i[t](n):(e.u=e.u||[]).push([t,n])}catch(e){K(e)}},u=(e,t)=>8&t?l:e,f=e=>0!=(2&e),d=new WeakMap,h=e=>"sc-"+e.h,$={},m=e=>"object"==(e=typeof e)||"function"===e,p=(e,t,...n)=>{let l=null,s=!1,o=!1,c=[];const r=t=>{for(let n=0;n<t.length;n++)l=t[n],Array.isArray(l)?r(l):null!=l&&"boolean"!=typeof l&&((s="function"!=typeof e&&!m(l))&&(l+=""),s&&o?c[c.length-1].$+=l:c.push(s?y(null,l):l),o=s)};if(r(n),t){const e=t.className||t.class;e&&(t.class="object"!=typeof e?e:Object.keys(e).filter((t=>e[t])).join(" "))}const i=y(e,null);return i.m=t,c.length>0&&(i.p=c),i},y=(e,t)=>({t:0,S:e,$:t,g:null,p:null,m:null}),b={},w=(e,t,n,s,c,r)=>{if(n!==s){let i=J(e,t),a=t.toLowerCase();if("class"===t){const t=e.classList,l=g(n),o=g(s);t.remove(...l.filter((e=>e&&!o.includes(e)))),t.add(...o.filter((e=>e&&!l.includes(e))))}else if("ref"===t)s&&s(e);else if(i||"o"!==t[0]||"n"!==t[1]){const l=m(s);if((i||l&&null!==s)&&!c)try{if(e.tagName.includes("-"))e[t]=s;else{let l=null==s?"":s;"list"===t?i=!1:null!=n&&e[t]==l||(e[t]=l)}}catch(e){}null==s||!1===s?!1===s&&""!==e.getAttribute(t)||e.removeAttribute(t):(!i||4&r||c)&&!l&&e.setAttribute(t,s=!0===s?"":s)}else t="-"===t[2]?t.slice(3):J(l,a)?a.slice(2):a[2]+t.slice(3),n&&o.rel(e,t,n,!1),s&&o.ael(e,t,s,!1)}},S=/\s/,g=e=>e?e.split(S):[],j=(e,t,n,l)=>{const s=11===t.g.nodeType&&t.g.host?t.g.host:t.g,o=e&&e.m||$,c=t.m||$;for(l in o)l in c||w(s,l,o[l],void 0,n,t.t);for(l in c)w(s,l,o[l],c[l],n,t.t)},v=(t,n,l)=>{let o,c,r=n.p[l],i=0;if(null!==r.$)o=r.g=s.createTextNode(r.$);else if(o=r.g=s.createElement(r.S),j(null,r,!1),null!=e&&o["s-si"]!==e&&o.classList.add(o["s-si"]=e),r.p)for(i=0;i<r.p.length;++i)c=v(t,r,i),c&&o.appendChild(c);return o},M=(e,n,l,s,o,c)=>{let r,i=e;for(i.shadowRoot&&i.tagName===t&&(i=i.shadowRoot);o<=c;++o)s[o]&&(r=v(null,l,o),r&&(s[o].g=r,i.insertBefore(r,n)))},k=(e,t,n,l,s)=>{for(;t<=n;++t)(l=e[t])&&(s=l.g,P(l),s.remove())},C=(e,t)=>e.S===t.S,O=(e,t)=>{const n=t.g=e.g,l=e.p,s=t.p,o=t.$;null===o?(j(e,t,!1),null!==l&&null!==s?((e,t,n,l)=>{let s,o=0,c=0,r=t.length-1,i=t[0],a=t[r],u=l.length-1,f=l[0],d=l[u];for(;o<=r&&c<=u;)null==i?i=t[++o]:null==a?a=t[--r]:null==f?f=l[++c]:null==d?d=l[--u]:C(i,f)?(O(i,f),i=t[++o],f=l[++c]):C(a,d)?(O(a,d),a=t[--r],d=l[--u]):C(i,d)?(O(i,d),e.insertBefore(i.g,a.g.nextSibling),i=t[++o],d=l[--u]):C(a,f)?(O(a,f),e.insertBefore(a.g,i.g),a=t[--r],f=l[++c]):(s=v(t&&t[c],n,c),f=l[++c],s&&i.g.parentNode.insertBefore(s,i.g));o>r?M(e,null==l[u+1]?null:l[u+1].g,n,l,c,u):c>u&&k(t,o,r)})(n,l,t,s):null!==s?(null!==e.$&&(n.textContent=""),M(n,null,t,s,0,s.length-1)):null!==l&&k(l,0,l.length-1)):e.$!==o&&(n.data=o)},P=e=>{e.m&&e.m.ref&&e.m.ref(null),e.p&&e.p.map(P)},R=(e,t,n)=>{const l=(e=>B(e).j)(e);return{emit:e=>x(l,t,{bubbles:!!(4&n),composed:!!(2&n),cancelable:!!(1&n),detail:e})}},x=(e,t,n)=>{const l=o.ce(t,n);return e.dispatchEvent(l),l},E=(e,t)=>{t&&!e.v&&t["s-p"]&&t["s-p"].push(new Promise((t=>e.v=t)))},L=(e,t)=>{if(e.t|=16,!(4&e.t))return E(e,e.M),oe((()=>N(e,t)));e.t|=512},N=(e,t)=>{const n=e.i;let l;return t&&(e.t|=256,e.u&&(e.u.map((([e,t])=>F(n,e,t))),e.u=null)),l=U(l,(()=>F(n,"componentWillRender"))),U(l,(()=>T(e,n,t)))},T=async(e,t,n)=>{const l=e.j,o=l["s-rc"];n&&(e=>{const t=e.k,n=e.j,l=t.t,o=((e,t)=>{let n=h(t),l=Y.get(n);if(e=11===e.nodeType?e:s,l)if("string"==typeof l){let t,o=d.get(e=e.head||e);o||d.set(e,o=new Set),o.has(n)||(t=s.createElement("style"),t.innerHTML=l,e.insertBefore(t,e.querySelector("link")),o&&o.add(n))}else e.adoptedStyleSheets.includes(l)||(e.adoptedStyleSheets=[...e.adoptedStyleSheets,l]);return n})(n.shadowRoot?n.shadowRoot:n.getRootNode(),t);10&l&&(n["s-sc"]=o,n.classList.add(o+"-h"))})(e);W(e,t),o&&(o.map((e=>e())),l["s-rc"]=void 0);{const t=l["s-p"],n=()=>A(e);0===t.length?n():(Promise.all(t).then(n),e.t|=4,t.length=0)}},W=(n,l)=>{try{l=l.render(),n.t&=-17,n.t|=2,((n,l)=>{const s=n.j,o=n.k,c=n.C||y(null,null),r=(e=>e&&e.S===b)(l)?l:p(null,null,l);t=s.tagName,o.O&&(r.m=r.m||{},o.O.map((([e,t])=>r.m[t]=s[e]))),r.S=null,r.t|=4,n.C=r,r.g=c.g=s.shadowRoot||s,e=s["s-sc"],O(c,r)})(n,l)}catch(e){K(e,n.j)}return null},A=e=>{const t=e.j,n=e.i,l=e.M;F(n,"componentDidRender"),64&e.t||(e.t|=64,q(t),F(n,"componentDidLoad"),e.P(t),l||D()),e.v&&(e.v(),e.v=void 0),512&e.t&&se((()=>L(e,!1))),e.t&=-517},D=()=>{q(s.documentElement),se((()=>x(l,"appload",{detail:{namespace:"blog-articles-grid"}})))},F=(e,t,n)=>{if(e&&e[t])try{return e[t](n)}catch(e){K(e)}},U=(e,t)=>e&&e.then?e.then(t):t(),q=e=>e.classList.add("hydrated"),H=(e,t,n)=>{if(t.R){e.watchers&&(t.L=e.watchers);const l=Object.entries(t.R),s=e.prototype;if(l.map((([e,[l]])=>{(31&l||2&n&&32&l)&&Object.defineProperty(s,e,{get(){return((e,t)=>B(this).N.get(t))(0,e)},set(n){((e,t,n,l)=>{const s=B(e),o=s.j,c=s.N.get(t),r=s.t,i=s.i;if(n=((e,t)=>null==e||m(e)?e:4&t?"false"!==e&&(""===e||!!e):2&t?parseFloat(e):1&t?e+"":e)(n,l.R[t][0]),(!(8&r)||void 0===c)&&n!==c&&(!Number.isNaN(c)||!Number.isNaN(n))&&(s.N.set(t,n),i)){if(l.L&&128&r){const e=l.L[t];e&&e.map((e=>{try{i[e](n,c,t)}catch(e){K(e,o)}}))}2==(18&r)&&L(s,!1)}})(this,e,n,t)},configurable:!0,enumerable:!0})})),1&n){const n=new Map;s.attributeChangedCallback=function(e,t,l){o.jmp((()=>{const t=n.get(e);if(this.hasOwnProperty(t))l=this[t],delete this[t];else if(s.hasOwnProperty(t)&&"number"==typeof this[t]&&this[t]==l)return;this[t]=(null!==l||"boolean"!=typeof this[t])&&l}))},e.observedAttributes=l.filter((([e,t])=>15&t[0])).map((([e,l])=>{const s=l[1]||e;return n.set(s,e),512&l[0]&&t.O.push([e,s]),s}))}}return e},V=e=>{F(e,"connectedCallback")},_=(e,t={})=>{const n=[],c=t.exclude||[],a=l.customElements,u=s.head,f=u.querySelector("meta[charset]"),d=s.createElement("style"),$=[];let m,p=!0;Object.assign(o,t),o.l=new URL(t.resourcesUrl||"./",s.baseURI).href,e.map((e=>{e[1].map((t=>{const l={t:t[0],h:t[1],R:t[2],T:t[3]};l.R=t[2],l.T=t[3],l.O=[],l.L={};const s=l.h,u=class extends HTMLElement{constructor(e){super(e),I(e=this,l),1&l.t&&e.attachShadow({mode:"open"})}connectedCallback(){m&&(clearTimeout(m),m=null),p?$.push(this):o.jmp((()=>(e=>{if(0==(1&o.t)){const t=B(e),n=t.k,l=()=>{};if(1&t.t)i(e,t,n.T),V(t.i);else{t.t|=1;{let n=e;for(;n=n.parentNode||n.host;)if(n["s-p"]){E(t,t.M=n);break}}n.R&&Object.entries(n.R).map((([t,[n]])=>{if(31&n&&e.hasOwnProperty(t)){const n=e[t];delete e[t],e[t]=n}})),(async(e,t,n,l,s)=>{if(0==(32&t.t)){{if(t.t|=32,(s=X(n)).then){const e=()=>{};s=await s,e()}s.isProxied||(n.L=s.watchers,H(s,n,2),s.isProxied=!0);const e=()=>{};t.t|=8;try{new s(t)}catch(e){K(e)}t.t&=-9,t.t|=128,e(),V(t.i)}if(s.style){let e=s.style;const t=h(n);if(!Y.has(t)){const l=()=>{};((e,t,n)=>{let l=Y.get(e);r&&n?(l=l||new CSSStyleSheet,l.replace(t)):l=t,Y.set(e,l)})(t,e,!!(1&n.t)),l()}}}const o=t.M,c=()=>L(t,!0);o&&o["s-rc"]?o["s-rc"].push(c):c()})(0,t,n)}l()}})(this)))}disconnectedCallback(){o.jmp((()=>(()=>{if(0==(1&o.t)){const e=B(this);e.o&&(e.o.map((e=>e())),e.o=void 0)}})()))}componentOnReady(){return B(this).W}};l.A=e[0],c.includes(s)||a.get(s)||(n.push(s),a.define(s,H(u,l,1)))}))})),d.innerHTML=n+"{visibility:hidden}.hydrated{visibility:inherit}",d.setAttribute("data-styles",""),u.insertBefore(d,f?f.nextSibling:u.firstChild),p=!1,$.length?$.map((e=>e.connectedCallback())):o.jmp((()=>m=setTimeout(D,30)))},z=new WeakMap,B=e=>z.get(e),G=(e,t)=>z.set(t.i=e,t),I=(e,t)=>{const n={t:0,j:e,k:t,N:new Map};return n.W=new Promise((e=>n.P=e)),e["s-p"]=[],e["s-rc"]=[],i(e,n,t.T),z.set(e,n)},J=(e,t)=>t in e,K=(e,t)=>(0,console.error)(e,t),Q=new Map,X=e=>{const t=e.h.replace(/-/g,"_"),n=e.A,l=Q.get(n);return l?l[t]:import(`./${n}.entry.js`).then((e=>(Q.set(n,e),e[t])),K)},Y=new Map,Z=[],ee=[],te=(e,t)=>l=>{e.push(l),n||(n=!0,t&&4&o.t?se(le):o.raf(le))},ne=e=>{for(let t=0;t<e.length;t++)try{e[t](performance.now())}catch(e){K(e)}e.length=0},le=()=>{ne(Z),ne(ee),(n=Z.length>0)&&o.raf(le)},se=e=>c().then(e),oe=te(ee,!0);export{_ as b,R as c,p as h,c as p,G as r}
|