Sdl.Web.Mvc/Html/BaseMediaHelper.cs
/// <summary>
/// Calulated the responsive media width based on client display size and pixel ration, grid container size and width factor. 
/// </summary>
/// <param name="widthFactor">The width factor</param>
/// <param name="containerSize">The grid container size containing the media (in grid units)</param>
/// <returns>The optimal media width</returns>
Calulated the responsive media width based on client display size and pixel ration, grid container size and width factor.
Calulated the responsive media width based on client display size and pixel ration grid container size and width factor .
public virtual int GetResponsiveWidth(string widthFactor, int containerSize = 0)
        {
            if (containerSize == 0)
            {
                containerSize = GridSize;
            }
            if (string.IsNullOrEmpty(widthFactor))
            {
                widthFactor = DefaultMediaFill;
            }
            double width = 0;
            if (!widthFactor.EndsWith("%"))
            {
                if (!double.TryParse(widthFactor, out width))
                {
                    Log.Warn("Invalid width factor (\"{0}\") when resizing image, defaulting to {1}", widthFactor, DefaultMediaFill);
                    widthFactor = DefaultMediaFill;
                }
                else
                {
                    width = width * WebRequestContext.ContextEngine.GetClaims<DeviceClaims>().PixelRatio;
                }
            }
            if (widthFactor.EndsWith("%"))
            {
                int fillFactor;
                if (!int.TryParse(widthFactor.Substring(0, widthFactor.Length - 1), out fillFactor))
                {
                    Log.Warn("Invalid width factor (\"{0}\") when resizing image, defaulting to {1}", widthFactor, DefaultMediaFill);
                }
                if (fillFactor == 0)
                {
                    fillFactor = int.Parse(DefaultMediaFill.Substring(0, DefaultMediaFill.Length - 1));
                }
                switch (WebRequestContext.ScreenWidth)
                {
                    case ScreenWidth.ExtraSmall:
                        containerSize = SiteConfiguration.MediaHelper.GridSize;
                        break;
                    case ScreenWidth.Small:
                        containerSize = (containerSize <= SiteConfiguration.MediaHelper.GridSize / 2 ? SiteConfiguration.MediaHelper.GridSize / 2 : SiteConfiguration.MediaHelper.GridSize);
                        break;
                }
                int cols = SiteConfiguration.MediaHelper.GridSize / containerSize;
                int padding = (cols - 1) * 30;
                width = WebRequestContext.MaxMediaWidth;
                width = (fillFactor * containerSize * width / (SiteConfiguration.MediaHelper.GridSize * 100)) - padding;
            }
            return (int)Math.Ceiling(width);
        }
public virtual int GetResponsiveWidth ( string widthFactor , int containerSize = 0 ) { if ( containerSize == 0 ) { containerSize = GridSize ; } if ( string . IsNullOrEmpty ( widthFactor ) ) { widthFactor = DefaultMediaFill ; } double width = 0 ; if ( ! widthFactor . EndsWith ( " " ) ) { if ( ! double . TryParse ( widthFactor , out width ) ) { Log . Warn ( " \" \" " , widthFactor , DefaultMediaFill ) ; widthFactor = DefaultMediaFill ; } else { width = width * WebRequestContext . ContextEngine . GetClaims < DeviceClaims > ( ) . PixelRatio ; } } if ( widthFactor . EndsWith ( " " ) ) { int fillFactor ; if ( ! int . TryParse ( widthFactor . Substring ( 0 , widthFactor . Length - 1 ) , out fillFactor ) ) { Log . Warn ( " \" \" " , widthFactor , DefaultMediaFill ) ; } if ( fillFactor == 0 ) { fillFactor = int . Parse ( DefaultMediaFill . Substring ( 0 , DefaultMediaFill . Length - 1 ) ) ; } switch ( WebRequestContext . ScreenWidth ) { case ScreenWidth . ExtraSmall : containerSize = SiteConfiguration . MediaHelper . GridSize ; break ; case ScreenWidth . Small : containerSize = ( containerSize <= SiteConfiguration . MediaHelper . GridSize / 2 ? SiteConfiguration . MediaHelper . GridSize / 2 : SiteConfiguration . MediaHelper . GridSize ) ; break ; } int cols = SiteConfiguration . MediaHelper . GridSize / containerSize ; int padding = ( cols - 1 ) * 30 ; width = WebRequestContext . MaxMediaWidth ; width = ( fillFactor * containerSize * width / ( SiteConfiguration . MediaHelper . GridSize * 100 ) ) - padding ; } return ( int ) Math . Ceiling ( width ) ; }
Calulated the responsive media width based on client display size and pixel ration, grid container size and width factor.
Calulated the responsive media width based on client display size and pixel ration grid container size and width factor .
//default is full width //For absolute fill factors, we should have a number //Change the fill factor to the default (100%) //For percentage fill factors, we need to do some calculation of container size etc. //TODO make the screen width behaviour configurable? //Extra small screens are only one column //Small screens are max 2 columns //TODO - should we make padding configurable? //Get the max possible width //Factor the max possible width by the fill factor and container size and remove padding
The optimal media width
The optimal media width
widthFactor
string
The width factor
The width factor
containerSize
int
The grid container size containing the media (in grid units)
The grid container size containing the media ( in grid units )