JAVASCRIPT   125

accordion view js

Guest on 9th May 2022 02:00:24 AM

  1. angular.module(angAppName)
  2.     .directive('viewmodeAccordion', function(customFilterService){
  3.        
  4.         return{
  5.            
  6.             restrict:"AE",
  7.             scope:true,
  8.             bindToController: true,
  9.             controllerAs: 'vm',
  10.                         templateUrl: capfData.plugin_url + 'app/views/posts-accordion.html',
  11.             link:function(scope, elem, attrs){
  12.  
  13.                                 var accordionPosts = new lscfAccordionPosts();
  14.                                
  15.                                 scope.actionSettings.initPostTheme = true;
  16.  
  17.                                 scope.directiveInfo.ready = function(){
  18.                                        
  19.                                         accordionPosts.options.link_type = ( 'undefined' !== typeof scope.pluginSettings.filterSettings.theme.link_type ? scope.pluginSettings.filterSettings.theme.link_type : 0 );
  20.  
  21.                                         setTimeout(function(){
  22.                                                 accordionPosts.init();
  23.                                         }, 500);
  24.                                        
  25.  
  26.                                 };                                     
  27.                                        
  28.                                 scope.directiveInfo.afterPostsLoadCallback = function(){
  29.  
  30.                                         setTimeout(function(){
  31.                                                 accordionPosts.init();
  32.                                         }, 500);
  33.                                 };
  34.  
  35.                         }
  36.                 };
  37.         });
  38.  
  39. function lscfAccordionPosts(){
  40.        
  41.         var $j = jQuery,
  42.                 self = this;
  43.  
  44.         this.options = {
  45.                 "link_type":0
  46.         };
  47.  
  48.         this.init = function(){
  49.                
  50.                 $j('.lscf-posts-accordion .lscf-title').unbind('click');
  51.  
  52.                 if ( 'link-only' === self.options.link_type ) {
  53.                         return false;
  54.                  }
  55.                
  56.                 $j('.lscf-posts-accordion .lscf-title').bind( 'click', function(event){
  57.  
  58.                         var parentContainer = $j(this).closest('.lscf-accordion-post');
  59.  
  60.                         if ( parentContainer.hasClass('active') ) {
  61.                                 parentContainer.find('.post-caption').animate({
  62.                                         height:0
  63.                                 }, 400);       
  64.                                 parentContainer.removeClass('active');
  65.                                 parentContainer.addClass('inactive');
  66.                                 return false;
  67.                         }
  68.  
  69.                         $j('.lscf-accordion-post').removeClass('active');
  70.                         $j('.lscf-accordion-post').addClass('inactive');
  71.  
  72.                        
  73.                         parentContainer.addClass('active');
  74.                         parentContainer.removeClass('inactive');
  75.  
  76.                         var animateHeight = parentContainer.find('.caption').height()+40;
  77.  
  78.                         parentContainer.find('.post-caption').animate({
  79.                                 height:animateHeight
  80.                         }, 400);
  81.  
  82.                         $j('.lscf-accordion-post.inactive').find('.post-caption').animate({
  83.                                 height:0
  84.                         }, 300);
  85.  
  86.                         event.preventDefault();
  87.                         event.stopPropagation();
  88.  
  89.                         return false;
  90.                 });
  91.  
  92.         };
  93.  
  94. }

Raw Paste


Login or Register to edit or fork this paste. It's free.