First of all: great package. Great resource for learning razor etc.
We're using ClientDepedency 1.4 (why doesn't Umbraco use this version standard??) in our environment and that doesn't work out of the box with the supplied cdloader.cshtml. I managed to get it working so I thought I would share my solution here.
I'm not using the html5standardrenderer. The ClientDependency standardrenderer works ok for me. As far as I can see the only difference is the addition of type="text/css" in the output. (If that's not right, please explain in a reply)
In my solution I also implemented a third standard path for .less files. I added an extra parameter "LessPaths" to the CD Loader macro. It saves you from having to add /less/ for each file. As you can see in the code, the priority for the .less files is continued from the css files. Css file calls will be placed before less files in the html.
Here is the code:
@* This class will help you to load all scripts and stylesheets using ClientDependency Parameters: CssPaths (string) Pipe-separated css. The order how you put them is important LessPaths (string) Pipe-separated less. The order how you put them is important JsPaths (string) Pipe-separated js IncludeDefaultPaths (bool, default false) If true, it will prepend ~/css, ~/less and ~/scripts *@ @inherits umbraco.MacroEngines.DynamicNodeContext @using ClientDependency.Core @using ClientDependency.Core.Controls @{ var cssPaths = Parameter.CssPaths; var lessPaths = Parameter.LessPaths; var jsPaths = Parameter.JsPaths; bool includeDefaultPaths; bool.TryParse(Parameter.IncludeDefaultPaths, out includeDefaultPaths); CdObjects cdPaths = GetClientDependencyPaths(cssPaths, lessPaths, jsPaths, includeDefaultPaths); @Html.Raw(cdPaths.Styles) @Html.Raw(cdPaths.Scripts) } @functions { CdObjects GetClientDependencyPaths(string cssPaths, string lessPaths, string jsPaths, bool includeDefaultPaths) { var paths = new HashSet<IClientDependencyPath> { new ClientDependencyPath {Name = "Styles", Path = "~/css"}, new ClientDependencyPath {Name = "Less", Path = "~/less"}, new ClientDependencyPath {Name = "Scripts", Path = "~/scripts"} }; var allDependencies = new List<IClientDependencyFile>(); string cssOutput, jsOutput; int priority = 0; if (!string.IsNullOrEmpty(cssPaths)) { allDependencies.AddRange(cssPaths.Split('|').Select(path => new CssInclude { PathNameAlias = includeDefaultPaths ? "Styles" : string.Empty, FilePath = path, Priority = priority++ })); } if (!string.IsNullOrEmpty(lessPaths)) { allDependencies.AddRange(lessPaths.Split('|').Select(path => new CssInclude { PathNameAlias = includeDefaultPaths ? "Less" : string.Empty, FilePath = path, Priority = priority++ })); } if (!string.IsNullOrEmpty(jsPaths)) { priority = 0; allDependencies.AddRange(jsPaths.Split('|').Select(path => new JsInclude { PathNameAlias = includeDefaultPaths ? "Scripts" : string.Empty, FilePath = path, Priority = priority++ })); } var renderer = new ClientDependency.Core.FileRegistration.Providers.StandardRenderer(); renderer.RegisterDependencies(allDependencies, paths, out jsOutput, out cssOutput, Context); return new CdObjects { Styles = cssOutput, Scripts = jsOutput }; } class CdObjects { public string Styles { get; set; } public string Scripts { get; set; } } }
Remember this needs an extra parameter on the macro. See screenshot
Hope this helps someone. Comments? Errors? Please reply.
Thanks for sharing this. I'm currently working on a new version where the parameters are specified in the macro so it is compatible with Umbraco version 4.7.1.1.
One of the reasons why I used the Html5StandardRenderer apart from removing the type="text/css" attribute, it is because encodes the & symbol so it produces a valid html and also because when working in debug mode you can see the scripts/css one on each line, which I found easier to read.
Regarding Umbraco to use the latest ClientDependency version, I have created a new topic in http://umbraco.codeplex.com/workitem/30684. If you agree with it, maybe you can upvote
I just ran into this issue when upgrading to Umbraco 4.7.1.1 see my blogpost . How can implement your new version 1.0.4 so that my upgrade to Umbraco 4.7.1.1 works?
I implemented the CdLoader.cshtml for my Umbraco 4.7.1.1 website.
These are the steps I took:
I downloaded the uBootstrap 1.0.4 package and unzipped it Copy and pasted the code for the CdLoader.cshtml script file Created the macro parameters on the CdLoader macro (see screenshot) Copied the Bootstrap.Logic.dll from the unzipped uBootstrap package Changed the version number in the config/ClientDependency.config file
The layout of my website is now fine again, it uses the Client Depency Framework and it is upgraded to Umbraco 4.7.1.1 :)
Solution for using ClientDependency 1.4
Hi,
First of all: great package. Great resource for learning razor etc.
We're using ClientDepedency 1.4 (why doesn't Umbraco use this version standard??) in our environment and that doesn't work out of the box with the supplied cdloader.cshtml. I managed to get it working so I thought I would share my solution here.
I'm not using the html5standardrenderer. The ClientDependency standardrenderer works ok for me. As far as I can see the only difference is the addition of type="text/css" in the output. (If that's not right, please explain in a reply)
In my solution I also implemented a third standard path for .less files. I added an extra parameter "LessPaths" to the CD Loader macro. It saves you from having to add /less/ for each file. As you can see in the code, the priority for the .less files is continued from the css files. Css file calls will be placed before less files in the html.
Here is the code:
Remember this needs an extra parameter on the macro. See screenshot
Hope this helps someone. Comments? Errors? Please reply.
Hi Vincent,
Thanks for sharing this. I'm currently working on a new version where the parameters are specified in the macro so it is compatible with Umbraco version 4.7.1.1.
One of the reasons why I used the Html5StandardRenderer apart from removing the type="text/css" attribute, it is because encodes the & symbol so it produces a valid html and also because when working in debug mode you can see the scripts/css one on each line, which I found easier to read.
Regarding Umbraco to use the latest ClientDependency version, I have created a new topic in http://umbraco.codeplex.com/workitem/30684. If you agree with it, maybe you can upvote
Thanks,
Jorge
Hi Vincent,
I have just release a new version 1.0.4 which solved the issue with the missing macro parameters.
Thanks,
J
Hi Jorge,
I just ran into this issue when upgrading to Umbraco 4.7.1.1 see my blogpost . How can implement your new version 1.0.4 so that my upgrade to Umbraco 4.7.1.1 works?
Thanks for your help,
Anthony
I implemented the CdLoader.cshtml for my Umbraco 4.7.1.1 website.
These are the steps I took:
I downloaded the uBootstrap 1.0.4 package and unzipped it
Copy and pasted the code for the CdLoader.cshtml script file
Created the macro parameters on the CdLoader macro (see screenshot)
Copied the Bootstrap.Logic.dll from the unzipped uBootstrap package
Changed the version number in the config/ClientDependency.config file
The layout of my website is now fine again, it uses the Client Depency Framework and it is upgraded to Umbraco 4.7.1.1 :)
Greetings,
Anthony
is working on a reply...