main_view_slider.php 6.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211
  1. <?php
  2. use app\models\front\News;
  3. /*
  4. $newsDataProvider = new \yii\data\ActiveDataProvider(
  5. [
  6. "query"=>\app\models\News::getMainView()->orderBy(["dt_pub"=>SORT_DESC])->limit(3),
  7. "pagination" =>[
  8. "pageSize"=>4
  9. ],
  10. ]
  11. );
  12. */
  13. $keyadd = News::keyFilter();
  14. $NHDataProvider = new \yii\data\ActiveDataProvider(
  15. [
  16. "query"=>News::getNH()->limit(4),
  17. "pagination" => false
  18. ]
  19. );
  20. $NH = $NHDataProvider->getModels();
  21. $arrayNH = [];
  22. foreach( $NH as $item ){
  23. $arrayNH[] = $item->id;
  24. }
  25. if( $auto ){
  26. $newsDataProvider = new \yii\data\ActiveDataProvider(
  27. [
  28. "query"=>News::findFilter()->andWhere(["(flags & 1)"=>0])->andWhere(['not',[ 'id' => $arrayNH]])->andWhere(['or',['NH'=>'Y'],['top'=>'Y']])->limit(3),
  29. "pagination" => false
  30. ]
  31. );
  32. }else{
  33. $newsDataProvider = new \yii\data\ActiveDataProvider(
  34. [
  35. "query"=>\app\models\Kd::find()->orderBy(["order"=>SORT_ASC])->limit(3),
  36. "pagination" => false
  37. ]
  38. );
  39. }
  40. $sort = $newsDataProvider->getModels();
  41. $news = new \yii\data\ActiveDataProvider();
  42. $models = [];
  43. //if($NH[0] instanceof \app\models\front\News) $models[] = $NH[0] ;
  44. foreach( $sort as $item ){
  45. $model = News::findOne($item->id);
  46. if($model instanceof \app\models\front\News) $models[] = $model;
  47. }
  48. $news->setModels($models);
  49. echo \yii\helpers\Html::beginTag("div",["class"=>"main-view"]);
  50. echo \yii\helpers\Html::beginTag('div',['id'=>"top_mslider","class"=>""]);
  51. if(count($NH)>1){
  52. echo \yii\helpers\Html::beginTag('div',['class'=>'arrows']);
  53. echo \yii\helpers\Html::tag('div','<svg class="icon icon-h-slider-prev"><use xlink:href="/svg/symbol/sprite-clear.svg#h-slider-prev"></use></svg>',['class'=>"prev"]);
  54. echo \yii\helpers\Html::tag('div','<svg class="icon icon-h-slider-prev"><use xlink:href="/svg/symbol/sprite-clear.svg#h-slider-next"></use></svg>',['class'=>"next"]);
  55. echo \yii\helpers\Html::endTag('div');
  56. }
  57. echo \yii\helpers\Html::beginTag('div',["class"=>"slides"]);
  58. echo Yii::$app->cache->getOrSet("main-page-main-views",function () use ($NHDataProvider,$NH){
  59. return \yii\widgets\ListView::widget([
  60. "dataProvider" => $NHDataProvider,
  61. 'options' => [
  62. 'tag' => false,
  63. 'class' => 'list-wrapper',
  64. 'id' => 'list-wrapper',
  65. ],
  66. "itemOptions"=>[
  67. "tag"=>false
  68. ],
  69. 'viewParams' => [
  70. 'elcount' => count($NH)
  71. ],
  72. "itemView" => "_main_view_item_slider",
  73. "layout" => "{items}"
  74. ]);
  75. },News::$keysCache['main-page-main-view']);
  76. echo \yii\helpers\Html::endTag('div');
  77. ?>
  78. <span class="slpager">
  79. <?
  80. for( $i = 0; $i < count($NH); $i++ ){
  81. ?>
  82. <span class="slider-indicator"></span>
  83. <?
  84. }
  85. ?>
  86. </span>
  87. <?
  88. echo \yii\helpers\Html::endTag('div');
  89. echo Yii::$app->cache->getOrSet("main-page-main-view",function () use ($news){
  90. return \yii\widgets\ListView::widget([
  91. "dataProvider" => $news,
  92. 'options' => [
  93. 'tag' => false,
  94. 'class' => 'list-wrapper',
  95. 'id' => 'list-wrapper',
  96. ],
  97. "itemOptions"=>[
  98. "tag"=>false
  99. ],
  100. "itemView" => "_main_view_item_pod",
  101. "layout" => "{items}"
  102. ]);
  103. },News::$keysCache['main-page-main-view']);
  104. echo \yii\helpers\Html::endTag("div");
  105. echo \yii\helpers\Html::endTag("div");
  106. ?>
  107. <script>
  108. (function (){
  109. let shift = 0;
  110. let delta = -15;
  111. const slider = document.getElementById('top_mslider');
  112. let slides = Array.from(slider.getElementsByClassName('slides')[0].children);
  113. const buttons = slider.getElementsByClassName('arrows')[0];
  114. function next(){
  115. let width = (slides.length -1)* Math.ceil(slider.offsetWidth)-delta;
  116. // $('.slinner').css('display','none');
  117. slides.map((slide) => {
  118. slide.addEventListener('transitionend', () => {
  119. $('.slinner').css('display','block');
  120. });
  121. });
  122. resetInterval()
  123. shift = shift - ((slider.offsetWidth) - delta);
  124. if(shift<(width*-1)+delta*<?=count($NH)-2?>-1){
  125. shift = 0;
  126. return slides.map((slide) => {
  127. slide.style.transform = "translate("+ shift +"px,0px)";
  128. })
  129. }
  130. slides.map((slide) => {
  131. slide.style.transform = "translate("+ shift +"px,0px)"
  132. })
  133. }
  134. function prev(){
  135. let width = (slides.length -1)* Math.ceil(slider.offsetWidth)-delta;
  136. // $('.slinner').css('display','none');
  137. slides.map((slide) => {
  138. slide.addEventListener('transitionend', () => {
  139. $('.slinner').css('display','block');
  140. });
  141. });
  142. resetInterval()
  143. shift = shift + (Math.ceil(slider.offsetWidth) - delta);
  144. if(shift>0){
  145. shift = width*-1+(delta*<?=count($NH)-2?>);
  146. return slides.map((slide) => {
  147. slide.style.transform = "translate("+ shift +"px,0px)"
  148. })
  149. }
  150. slides.map((slide) => {
  151. slide.style.transform = "translate("+ shift +"px,0px)"
  152. })
  153. }
  154. function reset(){
  155. shift = 0
  156. let width = (slides.length -1)* Math.ceil(slider.offsetWidth)-delta;
  157. // $('.slinner').css('display','none');
  158. slides.map((slide) => {
  159. slide.addEventListener('transitionend', () => {
  160. $('.slinner').css('display','block');
  161. });
  162. });
  163. resetInterval()
  164. shift = shift ;
  165. slides.map((slide) => {
  166. slide.style.transform = "translate("+ shift +"px,0px)"
  167. })
  168. }
  169. if(typeof buttons !== 'undefined'){
  170. const arrows = Array.from(buttons.children)
  171. arrows.map((arrow) => {
  172. arrow.addEventListener('mousedown', e => {
  173. if(arrow.classList.contains('next')){
  174. next()
  175. } else {
  176. prev()
  177. }
  178. });
  179. })
  180. }
  181. window.addEventListener("resize", function() { console.log('resize'); reset();}, false);
  182. let interval = setInterval(()=>next(),30000)
  183. const resetInterval = function()
  184. {
  185. clearInterval(interval);
  186. interval = setInterval(()=>next(),30000)
  187. }
  188. window.onSwipe(slider,function (){prev();return true;},function (){next();return true;});
  189. })()
  190. </script>