From 436c05ae050ffa17a3c682c21bdffe5490908996 Mon Sep 17 00:00:00 2001 From: buttle Date: Mon, 31 May 2021 20:28:57 +0200 Subject: [PATCH] renders source link and subtitle --- LICENSE | 21 ++++ Module.php | 14 +++ README.md | 30 +++++ asset/caret.png | Bin 0 -> 7901 bytes asset/css/carousel.css | 51 ++++++++ asset/js/siema.min.js | 1 + config/module.config.php | 36 ++++++ config/module.ini | 12 ++ src/Form/CarouselBlockForm.php | 119 ++++++++++++++++++ src/Service/BlockLayout/CarouselFactory.php | 18 +++ src/Site/BlockLayout/Carousel.php | 111 ++++++++++++++++ .../common/block-layout/simple-carousel.phtml | 73 +++++++++++ 12 files changed, 486 insertions(+) create mode 100644 LICENSE create mode 100644 Module.php create mode 100644 README.md create mode 100644 asset/caret.png create mode 100644 asset/css/carousel.css create mode 100644 asset/js/siema.min.js create mode 100644 config/module.config.php create mode 100644 config/module.ini create mode 100644 src/Form/CarouselBlockForm.php create mode 100644 src/Service/BlockLayout/CarouselFactory.php create mode 100644 src/Site/BlockLayout/Carousel.php create mode 100644 view/common/block-layout/simple-carousel.phtml diff --git a/LICENSE b/LICENSE new file mode 100644 index 0000000..9bd6b00 --- /dev/null +++ b/LICENSE @@ -0,0 +1,21 @@ +MIT License + +Copyright (c) 2018 Neo-Inspiration + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all +copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE +SOFTWARE. diff --git a/Module.php b/Module.php new file mode 100644 index 0000000..3da17ce --- /dev/null +++ b/Module.php @@ -0,0 +1,14 @@ +S(R1$TOEXzi@J;Po%M4xqdJ*<)*MY^K zD{^*v8wY%!{PAh>H?gMS&MxV^;ft5^Vm>b{d_hJ3kAI{c788i@&RoYW_$S^w^`;c4 zE`oF1ZG!h)D%E&OeM){xDZz5eQ&3jD<7QREFU8%vpO1MGi&oS(GAg69G54hJp-Iv* zU#A`)L;pl4;HCx~ACHU2F*zB%JXfkO^#t{Ga&pz8v^H|SQ`D_U(5+xy=UOrqRFgXo zGmGvv*j#T~yx3m4oSUG)?v(z;{JV-Ux;EfR9!yNIji8?)G@JB&06TErpPmBIkmCKWyfrfAWmnNtp5l@ zk(XB)qs#sD58GRL=KHhO%D718mKVzudAIk5(b$cNv$?k#T&#s5+weCp`hCWmU&Fn; z+}>(lfM?CHt5h9Bq{-ptrO0*uDIZGB20~|!4ZxzS_ifo9l#N#RB>PPJYJR`(;}BvT@D_bKclE>+urRe^h#4XTZ->* zN}3*d+D)jh)w33AnssHh`NdZa7UN#x!EH7EY3`3+Hx|YwlmLWct|n?`u|`Xb?=-nEz=!`^x2m30gkS> zH%lkr#>3u<%O}l&}y7!78 z@OKsIosGeRtwV+c6Z4Zh8p6s*sOr)*;cm>K>(_+H3`V7Q5o#ZzZyRQl08I@R7$l~T zIE(9E$s2h%8>#VsaedUt&VsCr%TZCqbYdy)0{0lVi+A#w0T@@SP;RL|>*R%+L=UKb zyl_?|u2W$Yt}MI`UOhy|ZJ9rEc2rzf9;V94qBjN6_N%lcU3BuY1)#J&a(~!6_ZKX! zL5HCq`(bvgKmL5DJTxWu%B5}2-E4H{o&d?NLEXWrm)qMbPOX@dtz9~Wp=CxV&60a7 zJ=OTFa3#4O`8R*Y(3GTon<_UylJ+i66Xv1fHg7$LflrwDX_tUcl-kqVj7XFDLc;io zpS6}#H?)}+#-!HY*cBhlOc+8NNnc`;S-#jvXCs`06y zsAH@{SXYd@UEf=UzuYuws!b8bW_o^JoBFqzzQEL1JUf{=~2|Y*nD%>Gdm$Z5y z+yjxiVk*ta>kEZg@_j=wU0rfF+l%RiL6|aBPKN1c?0mk>BgILBvty35%<`4*EQiW> z?-$5l+lXJmTFV|9x4eBSFtxo^?K>v91ef*fGdG&MWkN3q+>2f-m3s|D@x0BSc7tdH zL{2CNAG|@%9!}EzzF@6_iDy@&Ss-&V*0hat=`^-G0ewh{xD8_p zj`{CJc1axy2B@e|wF!kI6k_%pN1ozdECF!{{ifG#^T_@1>^6kJ8SW~Hy|so=CtmbLl(bZY_xJ z8X5FsgX#r~CsG1e8ry05S?gScRf3~PjX%wyU+EG>Ha9FuJU$&Q0id*YInK|s@KDHp z^UY~=I}$j!M4&-qKR7T;_O-xLka4$h7oO>Ju@g!(2<$@g6^{LJv;?RqAODowYjZL> z`ThV@dr4?+bS4uw;&~KeUvm`OHm(mc!!GB<$TLyg{Y`P(vrT+Hn_Z_nu|KO23e)H# zkxBIi*23945F~g8-K;!{CyER|enDfp(zGjU{n}c&I%%HG``tM-J2g(0&Dj{IT2(?} z+!0tO0cwQ=AUf8<#y~u8v{Mv`s8DLDF9%zb$jDUmutg+6H>`lpdH4sbDy_%7{V{d3 zNwYlzT0HhxfCQ}&>IxHjeYS+6xjBRBgjrRI5SxbF7lf%RoEfM-8hZ7>*|8wu+k?w| zTj(PJ>-M7mRW-}4__CC`S71j|`skA5+gvF}ku$G=6cI?36ZnET`@%!LtyaP+61HW= z#!7aX@2w*v0g4}0TO-Wjv;N-VK0SB~7qReOY&v`bQps)b*itFRb1?|do8xy^--(x^ zY}IU;v81X}oLdrRFMVv{sh?`;aZ{mdXlQ{+%W zkvPrxP?BXOxT4A};r=tBmtCmqkQ229aQFwX%8EI<@MTY@o|S5csTvlloE_Uql_C@t zH!|94T@sY7w&fe1#xUP;FTz)l2}KhF$__;~XUCF-n*3dfxV@+x--ge!`Dmci3*2U2 zSXE4~Tcsm~*xP`aN@}C;PEf3MoOJXUJz-VunY8x=n*J^KAt zzHrud+G(gIU<09OkE7DhGADO~$0mnLeS=aptLY#Hd zba0h`GSw_?cisl}=~NR2Sz99W|C^7zwg`BRfqCzqL5}&sx_FysaFj z5YN}Iw!)HqA!UZ}mRG?ERB987o|4r$GCv{Zq43>UI2$b0zUS6!#S)ldJCFij4ik8~fdfWZ7i zr3!JL&gS-eWpjLo8LXdf3pX7+W%r{anPEL{mD`;^Pc&Pi?fpEaA0p#Y&$UW9i^mHZ zQp@@dNFcm<@apfiaM&g}zWn0~ob-MtKU$5FVd1*7N#yfK-t^iIU&{y1O#8bfGD2sz zW7wWm!HNQa<)VNy12NV~vj_L1i|N@C3NoVF3Up{nwo`X2)(#`9Z>0&3sP{`P%ZTC` z7BvpA9asqx6dJ4Y>0g$OS^Zj)!T3F745`=`Z3v%qhCp`N|3jEfsm-B4n7Q9bLmtFmh?s32(}QlGdJjyKje5%%-!VQC#4Rd? z8J9?ug2LOz^r$EQKvmt{2cY^f!|4)VS;7ga^Vu5H56fYP9k+7$FS))w`YMf@KXs-` zoY*0*Lx4#&2A*`mBY>-wG@B2|5+5 z@(jlRBXUdJ(SkB?DKy!Lg3ue1ide^C8~$(aTdPF%N_B4z z-;|WK=#=sexu!wy^7!kyHLUXzEo}!9Xj%La=gl}ZUjjrr_~HLH$28{f-*K}g$Cle4 zzdw2xJ##KCuYPp?y_MkbrNoOLk}oAC-;Jt_C;BFag^Fjh__UF34{aIJH{rP6q1V1} z;q6QMYs*OJ zeQ078E`qcMR;baK+e1}3(&P|WvH5^`QE3lyjv6E|7SvDZMF(X?&JNb#UU(Ks?~{U3 zJAxz)Yl_OgEVZdnlD;d6qA#$fiJ8)?KeuzGwe+tGAnF2&wT)nRiMV78a_PJUzT!Og4e0=*9*(Gp%#Xs7fL`03!kI{Em77(op;`jVgPIsd)}e)MtDX)%i)cGq;O7*d~{a!PtU=#>Os79%-VS6)*oL@LM- zF!%g1)&XVyvxvbhYA<#rrmM*)pEJF$I%ak8cId3DIZ+$wTn0%}FJjY^bU2+(Qi~W# zXKNr`Ao97c0_}(pR!BSqF+xXQ_JcJfhd0dn)G(jUJ=fbr=qWg!V_uM+)dl9%{ctAH zw~x-cI{(tdIRj-s<1-f^wzaDM60^uymy_g7@<}XLe?lqxeBkC;gtKp@_M=f?idx#AJ{40Qhm&eme7_bgk}#mUY+*KotU{m=;g3w7L` zwRQL#xD$s-wGSBR$LKgT~B=!j02{idhhs_hyHew&i4k9XVgQ>jsn72MFblh_U?YyqvzLJIS#N%(vxZ8Ql z|8$a?670xRh%Sl7iFrG)(qA0~>eMyBNrY740O# z>)i8PEfDS?6uoU^J6w400wG7-n#OztRP=2`Jl@>S-tc_$%4?U|$}gNiaUG%PQR5Yd zWpm*WTO>W%SQp^YWx&Bhh&1F|e;~wlZ1ndOD6x)n7;|IBR5Jk$G_wt4V*x-F*c{)* zq0NH|c3WX{BX%=&Ih3Ze6yokdk3q$CK_F~NH9G@MM%|r8#;aM?T1P8M|JK4ZW8Vnr z)cRX=v9G`#*?bd%-M}4r9x8Sl&})+GSEKuY-V?5f`vdsj8H$#lW>%wPzU{3IW7M|!rXu# zrVE&ygCc9%!OvB(?9_@Eo3(50w&Qu_FcWk3RSBrYNJ75gKo`djnd6(Z)mZk!_Qdo+ zpX>Qy#LDNe@Q1dwbki0Ic36hJ`jtm1L@i6yRb{i{EeUFg|K^2cG%^luH@+7!SPfBq zT|%2AJVCdrj2jyf%)sJM#S zk1|G~d)&<7E*TFu=3|c+fbbaNF;{xmj6nRn{TT1d^j=6@nx1i9H00~YiL)bPF4SYf z13?AUf0e%kd3g{}L8?VW%%Vw)V zYyU!$9G5Y#viOkgBcYo~G_KRA`wJC{2iDn&=V`Ty0NHbls`h2$~E7X>KVt748cOMHCARp8!- zqWc7e_-%T*@K8^%#G!mnMC=CWCf7nYIbX=pO_nsV=al((B{+GMINQT7f(VwB-7Rdx z5KoBU$wtP+xKA;&5XK2q<%p0cv9KHt{`e3&PUfMcJyR0+3m+Y;SOO-8`Y{Pb=}^*azjg-dD&h|$ zWad%*a6pnqyTAn-C+iG-rmIadQPDNKBiJ}eE<}niXx9s6Z~9*0qHh4hm8JZ(OY4%_2`Pv zpxmKGP>f6+*dFdGk^QFY{zN8j*n_=i)Fl-P(_|b>Hg@PLwFc))3P=qhxi6#a)Fl|G zn06oz8R-mWQ&(FTP{{b3y9l~lZlU`N=(O;YS-eh-bD#zumYp||1bKpBv+%ej!ydXOx zwHH^oom{AN%E7NryDV~=128?SHx(5cgui(f#&8LCb-I-j7U84pkww9nGOe79GRl%q z?w{l;9`F(O5j(bF%2Z%B7rtKmxwS-bDR59I%*oz~tsB~zpP4WpQz5g+n6FD|nX6!; zh^vOwY4L|yy6*pm77?a>+2=NKf25)(D)u=F`7>K-nfZ+ja}#^j!>9g0#>O2P4*?DH zV9}^OZ_~*dxV2iT1iYm2)do$^#~3?I3D9-z%EXozPhoNiQ?u%Q7(4WKXy2%QLa)9o z7&U^h>-YLJW+6@I6m>M&|}n zlb*pSaFveUzKitDAY}30-m4R8`@=Z;!U@Dx1Vq4!7aoIRCm+0fizqT^W(lwe)HGI1 zhwZz3VNRQq5%f}(r}k+Q63tx|Oy%ba+^aZPUH+W6;R6Qn5sOUToSzsDuPhaJp1UK5 zB(wPET(=3OPKd$sV`s?N;~5Z_CQ3OL>U>e85xr0YIV5R?tm{uK1wh`S=aI1soYpC*xgl*XGNT1-8SSgUi`XGmZYoE~t-onca zYYLH6ZqK&8ULzUXDMGOs=AjI-JNH@f%pLGWfR>#8+|VQN8Z`8aH@!3mj$Movpr`=* z-!Lx30|-{^^RjqykJ}RXkO@nd*|MA7@gYm?G7}sSCfwN!S_OB}O~@Dt_+&XMWH0

@oABg>O6#3y(BRJ|rU|{{ ztC#%Dc5;saj|!WvIAnhV*bqa*@Yif5k4h9@ZSO_Ek1m7sU&)X+rE}(rlb59hG*fx) zt(E(e<>K5LJY3}}&<981rKxG1(#M$XewZ=?Ft9l2qxJ&E<1U%KSDhrkhc>CbNSe@_ znJ#v6mF&6ti#{&tga`iSa>+{-tlu)0OjV`cacF%wzx6*`hAwUZJdrTt5i-+^Rd74? zUw`|gF?HZoW(4Uhwyrpx!cwkZw8xCyZ+LYb_cDZNBG)-xE$Cf2A2J96K#?~&fBCI6a!N ztXVTY^BXxI9A*|UI)A1#Jo?*L=UT@EPgUZ_B5roUITL&EX7p%k?#ZE7T>ej8Dm~0B z!*0rU4#3jK=w`m;NuRb=J@MI$r2rSUV*1~$kitu>3piJ1o47kv7|pFL{F~6%52`Nj z#y;Bqk7(xWZo72}_q0M08rV;$N;&hMe-^)>1#W`%5xkkB1B^4OjxGsZe}bW+v6uBN z_1td~nxxludnrAI9{p9LZr=x7g#E(ejz-EYv9<00_E+!p>x8v(a_QfbN21`_8nJ1k Lk9+lc>dF5D0H{vf literal 0 HcmV?d00001 diff --git a/asset/css/carousel.css b/asset/css/carousel.css new file mode 100644 index 0000000..eb552d6 --- /dev/null +++ b/asset/css/carousel.css @@ -0,0 +1,51 @@ +#content { + display: block !important; + flex-wrap: nowrap !important; +} +.siema { + margin: 1rem 0; + background-color: #000; + position: relative; +} + +.siema-img { + display: block; + margin-left: auto; + margin-right: auto; +} + +#siema-ui { + display: flex; + justify-content: space-between; + position: absolute; + top: 0; + width: 100%; + height: 100%; +} + +.caret { + opacity: 0.5; + width: 5%; + align-self: center; +} + +.caret:hover { + opacity: 1; +} + +.caret#left { + margin-left: 20px; +} + +.caret#right { + transform: rotate(180deg); + margin-right: 20px; +} + +#carousel-title {color: #FFF; + font-size: 30px; + border: 3px solid; + padding: 20px; + margin: 0; + align-self: center; +} diff --git a/asset/js/siema.min.js b/asset/js/siema.min.js new file mode 100644 index 0000000..48e29c7 --- /dev/null +++ b/asset/js/siema.min.js @@ -0,0 +1 @@ +!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define("Siema",[],t):"object"==typeof exports?exports.Siema=t():e.Siema=t()}("undefined"!=typeof self?self:this,function(){return function(e){function t(r){if(i[r])return i[r].exports;var n=i[r]={i:r,l:!1,exports:{}};return e[r].call(n.exports,n,n.exports,t),n.l=!0,n.exports}var i={};return t.m=e,t.c=i,t.d=function(e,i,r){t.o(e,i)||Object.defineProperty(e,i,{configurable:!1,enumerable:!0,get:r})},t.n=function(e){var i=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(i,"a",i),i},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="",t(t.s=0)}([function(e,t,i){"use strict";function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var n="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},s=function(){function e(e,t){for(var i=0;i=e&&(this.perPage=this.config.perPage[e])}}},{key:"prev",value:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:1,t=arguments[1];if(!(this.innerElements.length<=this.perPage)){var i=this.currentSlide;if(this.config.loop){if(this.currentSlide-e<0){this.disableTransition();var r=this.currentSlide+this.innerElements.length,n=this.perPage,s=r+n,l=(this.config.rtl?1:-1)*s*(this.selectorWidth/this.perPage),o=this.config.draggable?this.drag.endX-this.drag.startX:0;this.sliderFrame.style[this.transformProperty]="translate3d("+(l+o)+"px, 0, 0)",this.currentSlide=r-e}else this.currentSlide=this.currentSlide-e}else this.currentSlide=Math.max(this.currentSlide-e,0);i!==this.currentSlide&&(this.slideToCurrent(this.config.loop),this.config.onChange.call(this),t&&t.call(this))}}},{key:"next",value:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:1,t=arguments[1];if(!(this.innerElements.length<=this.perPage)){var i=this.currentSlide;if(this.config.loop){if(this.currentSlide+e>this.innerElements.length-this.perPage){this.disableTransition();var r=this.currentSlide-this.innerElements.length,n=this.perPage,s=r+n,l=(this.config.rtl?1:-1)*s*(this.selectorWidth/this.perPage),o=this.config.draggable?this.drag.endX-this.drag.startX:0;this.sliderFrame.style[this.transformProperty]="translate3d("+(l+o)+"px, 0, 0)",this.currentSlide=r+e}else this.currentSlide=this.currentSlide+e}else this.currentSlide=Math.min(this.currentSlide+e,this.innerElements.length-this.perPage);i!==this.currentSlide&&(this.slideToCurrent(this.config.loop),this.config.onChange.call(this),t&&t.call(this))}}},{key:"disableTransition",value:function(){this.sliderFrame.style.webkitTransition="all 0ms "+this.config.easing,this.sliderFrame.style.transition="all 0ms "+this.config.easing}},{key:"enableTransition",value:function(){this.sliderFrame.style.webkitTransition="all "+this.config.duration+"ms "+this.config.easing,this.sliderFrame.style.transition="all "+this.config.duration+"ms "+this.config.easing}},{key:"goTo",value:function(e,t){if(!(this.innerElements.length<=this.perPage)){var i=this.currentSlide;this.currentSlide=this.config.loop?e%this.innerElements.length:Math.min(Math.max(e,0),this.innerElements.length-this.perPage),i!==this.currentSlide&&(this.slideToCurrent(),this.config.onChange.call(this),t&&t.call(this))}}},{key:"slideToCurrent",value:function(e){var t=this,i=this.config.loop?this.currentSlide+this.perPage:this.currentSlide,r=(this.config.rtl?1:-1)*i*(this.selectorWidth/this.perPage);e?requestAnimationFrame(function(){requestAnimationFrame(function(){t.enableTransition(),t.sliderFrame.style[t.transformProperty]="translate3d("+r+"px, 0, 0)"})}):this.sliderFrame.style[this.transformProperty]="translate3d("+r+"px, 0, 0)"}},{key:"updateAfterDrag",value:function(){var e=(this.config.rtl?-1:1)*(this.drag.endX-this.drag.startX),t=Math.abs(e),i=this.config.multipleDrag?Math.ceil(t/(this.selectorWidth/this.perPage)):1,r=e>0&&this.currentSlide-i<0,n=e<0&&this.currentSlide+i>this.innerElements.length-this.perPage;e>0&&t>this.config.threshold&&this.innerElements.length>this.perPage?this.prev(i):e<0&&t>this.config.threshold&&this.innerElements.length>this.perPage&&this.next(i),this.slideToCurrent(r||n)}},{key:"resizeHandler",value:function(){this.resolveSlidesNumber(),this.currentSlide+this.perPage>this.innerElements.length&&(this.currentSlide=this.innerElements.length<=this.perPage?0:this.innerElements.length-this.perPage),this.selectorWidth=this.selector.offsetWidth,this.buildSliderFrame()}},{key:"clearDrag",value:function(){this.drag={startX:0,endX:0,startY:0,letItGo:null,preventClick:this.drag.preventClick}}},{key:"touchstartHandler",value:function(e){-1!==["TEXTAREA","OPTION","INPUT","SELECT"].indexOf(e.target.nodeName)||(e.stopPropagation(),this.pointerDown=!0,this.drag.startX=e.touches[0].pageX,this.drag.startY=e.touches[0].pageY)}},{key:"touchendHandler",value:function(e){e.stopPropagation(),this.pointerDown=!1,this.enableTransition(),this.drag.endX&&this.updateAfterDrag(),this.clearDrag()}},{key:"touchmoveHandler",value:function(e){if(e.stopPropagation(),null===this.drag.letItGo&&(this.drag.letItGo=Math.abs(this.drag.startY-e.touches[0].pageY)=this.innerElements.length)throw new Error("Item to remove doesn't exist 😭");var i=ethis.innerElements.length+1)throw new Error("Unable to inset it at this index 😭");if(-1!==this.innerElements.indexOf(e))throw new Error("The same item in a carousel? Really? Nope 😭");var r=t<=this.currentSlide>0&&this.innerElements.length;this.currentSlide=r?this.currentSlide+1:this.currentSlide,this.innerElements.splice(t,0,e),this.buildSliderFrame(),i&&i.call(this)}},{key:"prepend",value:function(e,t){this.insert(e,0),t&&t.call(this)}},{key:"append",value:function(e,t){this.insert(e,this.innerElements.length+1),t&&t.call(this)}},{key:"destroy",value:function(){var e=arguments.length>0&&void 0!==arguments[0]&&arguments[0],t=arguments[1];if(this.detachEvents(),this.selector.style.cursor="auto",e){for(var i=document.createDocumentFragment(),r=0;r [ + 'template_path_stack' => [ + dirname(__DIR__) . '/view', + ] + ], + 'block_layouts' => [ + 'factories' => [ + 'carousel' => Service\BlockLayout\CarouselFactory::class, + ], + ], + 'form_elements' => [ + 'invokables' => [ + Form\CarouselBlockForm::class => Form\CarouselBlockForm::class, + ], + ], + 'DefaultSettings' => [ + 'CarouselBlockForm' => [ + 'height' => '500px', + 'duration' => 200, + 'perPage' => 1, + 'loop' => true, + 'draggable' => true, + 'subTitle' => '', + 'renderSourceLink' => true, + 'autoSlide' => false, + 'autoSlideInt' => 5000, + 'wrapStyle' => 'overflow-y: hidden;display: flex;flex-direction: column;justify-content: center;', + 'imgStyle' => '', + 'ui_background' => 'rgba(0,0,0,0.1)', + ] + ] +]; diff --git a/config/module.ini b/config/module.ini new file mode 100644 index 0000000..93bed85 --- /dev/null +++ b/config/module.ini @@ -0,0 +1,12 @@ +[info] +name = "Simple Carousel" +description = "Display carousels into pages" +tags = "" +license = "MIT" +author = "ESnark" +author_link = "https://github.com/ESnark" +module_link = "https://github.com/Neo-Inspiration/Omeka-S-SimpleCarousel" +support_link = "https://github.com/Neo-Inspiration/Omeka-S-SimpleCarousel/issues" +configurable = false +version = "1.3.0" +omeka_version_constraint = "^3.0.0" \ No newline at end of file diff --git a/src/Form/CarouselBlockForm.php b/src/Form/CarouselBlockForm.php new file mode 100644 index 0000000..1921730 --- /dev/null +++ b/src/Form/CarouselBlockForm.php @@ -0,0 +1,119 @@ +add([ + 'name' => 'o:block[__blockIndex__][o:data][height]', + 'type' => Element\Text::class, + 'options' => [ + 'label' => 'Carousel height', + 'info' => 'Please enter a number with CSS units.', + ], + ]); + + $this->add([ + 'name' => 'o:block[__blockIndex__][o:data][duration]', + 'type' => Element\Number::class, + 'options' => [ + 'label' => 'Duration (milliseconds)', + 'info' => 'Slide transition duration in milliseconds.' + ], + ]); + + $this->add([ + 'name' => 'o:block[__blockIndex__][o:data][perPage]', + 'type' => Element\Number::class, + 'options' => [ + 'label' => 'Image Per page', + 'info' => 'The number of slides to be shown.' + ], + 'attributes' => [ + 'min' => 1, + 'max' => 10, + ] + ]); + + $this->add([ + 'name' => 'o:block[__blockIndex__][o:data][loop]', + 'type' => Element\Checkbox::class, + 'options' => [ + 'label' => 'Loop', + ] + ]); + + $this->add([ + 'name' => 'o:block[__blockIndex__][o:data][draggable]', + 'type' => Element\Checkbox::class, + 'options' => [ + 'label' => 'Draggable', + ] + ]); + + $this->add([ + 'name' => 'o:block[__blockIndex__][o:data][autoSlide]', + 'type' => Element\Checkbox::class, + 'options' => [ + 'label' => 'Auto Slide', + ] + ]); + + $this->add([ + 'name' => 'o:block[__blockIndex__][o:data][autoSlideInt]', + 'type' => Element\Text::class, + 'options' => [ + 'label' => 'Slide Interval (milliseconds)', + 'info' => 'Shows next slide every given millisecond.' + ] + ]); + + $this->add([ + 'name' => 'o:block[__blockIndex__][o:data][wrapStyle]', + 'type' => Element\Text::class, + 'options' => [ + 'label' => 'image wrapper Style', + ] + ]); + $this->add([ + 'name' => 'o:block[__blockIndex__][o:data][imgStyle]', + 'type' => Element\Text::class, + 'options' => [ + 'label' => 'img tag Style', + ] + ]); + + $this->add([ + 'name' => 'o:block[__blockIndex__][o:data][ui_background]', + 'type' => Element\Text::class, + 'options' => [ + 'label' => 'siema UI style', + 'info' => 'Styling #siema-ui including UI element. commonly used for background setup.' + ] + ]); + + $this->add([ + 'type' => Element\Checkbox::class, + 'name' => 'o:block[__blockIndex__][o:data][renderSourceLink]', + 'options' => [ + 'label' => 'Display a link to the item', + //'use_hidden_element' => true, + 'checked_value' => true, + 'unchecked_value' => false, + ], + ]); + + $this->add([ + 'name' => 'o:block[__blockIndex__][o:data][subTitle]', + 'type' => Element\Text::class, + 'options' => [ + 'label' => 'Sub-title', + ] + ]); + + } +} diff --git a/src/Service/BlockLayout/CarouselFactory.php b/src/Service/BlockLayout/CarouselFactory.php new file mode 100644 index 0000000..fb3c52a --- /dev/null +++ b/src/Service/BlockLayout/CarouselFactory.php @@ -0,0 +1,18 @@ +get('FormElementManager'), + $services->get('Config')['DefaultSettings']['CarouselBlockForm'] + ); + } +} +?> \ No newline at end of file diff --git a/src/Site/BlockLayout/Carousel.php b/src/Site/BlockLayout/Carousel.php new file mode 100644 index 0000000..20b0d92 --- /dev/null +++ b/src/Site/BlockLayout/Carousel.php @@ -0,0 +1,111 @@ +formElementManager = $formElementManager; + $this->defaultSettings = $defaultSettings; + } + + public function getLabel() { + return 'SimpleCarousel'; + } + + public function form(PhpRenderer $view, SiteRepresentation $site, + SitePageRepresentation $page = null, SitePageBlockRepresentation $block = null + ) { + $form = $this->formElementManager->get(CarouselBlockForm::class); + $data = $block + ? $block->data() + $this->defaultSettings + : $this->defaultSettings; + $form->setData([ + 'o:block[__blockIndex__][o:data][height]' => $data['height'], + 'o:block[__blockIndex__][o:data][duration]' => $data['duration'], + 'o:block[__blockIndex__][o:data][perPage]' => $data['perPage'], + 'o:block[__blockIndex__][o:data][loop]' => $data['loop'], + 'o:block[__blockIndex__][o:data][draggable]' => $data['draggable'], + 'o:block[__blockIndex__][o:data][subTitle]' => $data['subTitle'], + 'o:block[__blockIndex__][o:data][autoSlide]' => $data['autoSlide'], + 'o:block[__blockIndex__][o:data][autoSlideInt]' => $data['autoSlideInt'], + 'o:block[__blockIndex__][o:data][wrapStyle]' => $data['wrapStyle'], + 'o:block[__blockIndex__][o:data][imgStyle]' => $data['imgStyle'], + 'o:block[__blockIndex__][o:data][ui_background]' => $data['ui_background'], + 'o:block[__blockIndex__][o:data][renderSourceLink]' => $data['renderSourceLink'], + ]); + $form->prepare(); + + $html = ''; + $html .= $view->blockAttachmentsForm($block); + $html .= '

' . $view->translate('Options'). '

'; + $html .= '
'; + $html .= $view->formCollection($form); + $html .= '
'; + return $html; + } + + public function render(PhpRenderer $view, SitePageBlockRepresentation $block) + { + $attachments = $block->attachments(); + if (!$attachments) { + return ''; + } + + $urls = []; + + foreach ($attachments as $attachment) + { + foreach($attachment->item()->media() as $media) + { + $mediaType = $media->mediaType(); + $mediaRenderer = $media->renderer(); + if ((strpos($mediaType, 'image/') !== false) || (strpos($mediaRenderer, 'youtube') !== false)) { + array_push($urls, $media->thumbnailUrl('large')); + } + } + } + + return $view->partial('common/block-layout/simple-carousel', [ + 'height' => $block->dataValue('height'), + 'duration' => $block->dataValue('duration'), + 'perPage' => $block->dataValue('perPage'), + 'loop' => $block->dataValue('loop'), + 'draggable' => $block->dataValue('draggable'), + 'subTitle' => $block->dataValue('subTitle'), + 'urls' => $urls, + 'autoSlide' => $block->dataValue('autoSlide'), + 'autoSlideInt' => $block->dataValue('autoSlideInt'), + 'wrapStyle' => $block->dataValue('wrapStyle'), + 'imgStyle' => $block->dataValue('imgStyle'), + 'ui_background' => $block->dataValue('ui_background'), + 'item_url' => $attachments[0]->item()->url(), + //'item_title' => $attachments[0]->item()->title(), + 'renderSourceLink' => $block->dataValue('renderSourceLink'), + ]); + } +} diff --git a/view/common/block-layout/simple-carousel.phtml b/view/common/block-layout/simple-carousel.phtml new file mode 100644 index 0000000..d8c0194 --- /dev/null +++ b/view/common/block-layout/simple-carousel.phtml @@ -0,0 +1,73 @@ +
+ headLink()->appendStylesheet($this->assetUrl('css/carousel.css', 'SimpleCarousel')); + $this->headScript()->appendFile($this->assetUrl('js/siema.min.js', 'SimpleCarousel')); + + $title = false; + + + $caret = sprintf('', $this->assetUrl('caret.png', 'SimpleCarousel')); + $caret_r = sprintf('', $this->assetUrl('caret.png', 'SimpleCarousel')); + ?> + +
+ + +
+ Source +
+ + +
+
', $wrapStyle, $imgStyle, $url); + echo $html; + } + ?> +
+
+
+ +
+ +
+ + + + +