lavinjj / angular-responsive Goto Github PK

.directive('arMobile', ['responsiveHelper', function (responsiveHelper) 
{
    return {
        restrict    : "EAC",
        transclude  : 'element',
        template    : '<div></div>',
        compile     : buildCompileFn( 'arMobile', responsiveHelper.isMobile )
    };
}])
.directive('arMobile', ['responsiveHelper', function (responsiveHelper) 
{
    return {
        restrict    : "EAC",
        transclude  : 'element',
        template    : '<div></div>',
        compile     : buildCompileFn( 'arTablet', responsiveHelper.isTablet )
    };
}])
.directive('arMobile', ['responsiveHelper', function (responsiveHelper) 
{
    return {
        restrict    : "EAC",
        transclude  : 'element',
        template    : '<div></div>',
        compile     : buildCompileFn( 'arDesktop', responsiveHelper.isDesktop )
    };
}])
.directive('arResponsive', ['responsiveHelper', function (responsiveHelper) 
{
    return {
        restrict    : "EAC",
        transclude  : 'element',
        template    : '<div></div>',
        compile     : buildCompileFn( 'arResponsive', checkAllTypes(responsiveHelper) )
    };
}])

/**
 * Partial application for DRY construction of a directive compile function
 */
function buildCompileFn(responsiveType, verifyFn )
{
  return function (element, attr, transclude) 
  {
      return function postLink(scope, element, attr) 
      {
          var childElement, childScope,
          var deviceTypes = scope.$eval( attr[responsiveType] );

          scope.$watch( deviceTypes, function () 
          {
              // attribute changed, delete existing element & $scope

              if (childElement) {
                  childElement.remove();
                  childScope.$destroy();
                  childElement = undefined;
                  childScope = undefined;
              }

              if ( verifyFn(deviceTypes) ) 
              {
                  // Create a new element and $scope...

                  childScope = scope.$new();
                  childElement = transclude(childScope, function (clone) {
                      element.after(clone);
                  });
              }
          });
      };
  };
}

/**
 * Partial application for DRY construction of function to scan of any valid responsive types 
 */
function checkAllTypes(responsiveHelper)
{
    return function( deviceTypes )
    {
        return  ( deviceTypes['Mobile'] && responsiveHelper.isMobile() ) || 
                ( deviceTypes['Tablet'] && responsiveHelper.isTablet() ) || 
                ( deviceTypes['Desktop'] && responsiveHelper.isDesktop() );
    };
}