CassetteConfiguration.cs

namespace NancySample.Backbone.Todos
{
    using System;
    using System.Collections.Generic;
    using System.IO;
    using System.Linq;
    using System.Text;
    using Cassette;
    using Cassette.BundleProcessing;
    using Cassette.HtmlTemplates;
    using Cassette.Scripts;
    using Cassette.Stylesheets;
    using Cassette.TinyIoC;
    using Nancy;
    using Sprockets;

    /// <summary>
    /// Configures the Cassette asset bundles for the web application.
    /// </summary>
    public class CassetteBundleConfiguration : IConfiguration<BundleCollection>
    {
        private readonly TinyIoCContainer container;
        private readonly CassetteSettings settings;
        private readonly string rootPath;

        public CassetteBundleConfiguration(IRootPathProvider rootPathProvider, Cassette.TinyIoC.TinyIoCContainer container, CassetteSettings settings)
        {
            this.container = container;
            this.settings = settings;
            this.rootPath = rootPathProvider.GetRootPath();
        }

        public void Configure(BundleCollection bundles)
        {
            // Please read http://getcassette.net/documentation/configuration

            bundles.Add<StylesheetBundle>("assets/stylesheets/style.less");

            bundles.Add<ScriptBundle>("assets/javascripts/_vendors/jquery.js", b => b.PageLocation = "jquery");

            var sprockets = new Sprockets();

            var node = sprockets.Scan(Path.Combine(this.rootPath, "assets/javascripts/main.js"));
            var deps = node.ResolveDependencies();
            bundles.Add<ScriptBundle>("assets/javascripts/main.js", deps.Select(d => d.Data.AbsolutePath), b => b.PageLocation = "app");

            node = sprockets.Scan(Path.Combine(this.rootPath, "assets/templates/templates.js"));
            deps = node.ResolveDependencies();
            bundles.Add<HtmlTemplateBundle>("assets/templates", deps.Select(d => d.Data.AbsolutePath).Where(f => f.EndsWith(".html") || f.EndsWith(".htm")),
                b =>
                {
                    b.Pipeline = new JavascriptStringArrayTemplatePipeline(this.container, this.settings);
                });
        }

        public class JavascriptStringArrayTemplatePipeline : JavaScriptHtmlTemplatePipeline
        {
            public JavascriptStringArrayTemplatePipeline(Cassette.TinyIoC.TinyIoCContainer container, CassetteSettings settings, string variableName = null)
                : base(container, settings)
            {
                var factory = container.Resolve<HtmlTemplateToJavaScriptTransformer.Factory>();
                base.RemoveAt(0);
                base.Insert(0, new AddHtmlTemplateToJavaScriptArrayTransformers(factory));

                base.RemoveAt(3);
                base.Insert(3, new WrapJavaScriptArrayHtmlTemplates("JST"));
            }
        }

        public class WrapJavaScriptArrayHtmlTemplates : IBundleProcessor<HtmlTemplateBundle>
        {
            private readonly string variableName;

            public WrapJavaScriptArrayHtmlTemplates(string variableName)
            {
                this.variableName = variableName;
            }

            public void Process(HtmlTemplateBundle bundle)
            {
                if (bundle.Assets.Count == 0)
                    return;
                if (bundle.Assets.Count > 1)
                    throw new ArgumentException("WrapJavaScriptArrayHtmlTemplates should only process a bundle where the assets have been concatenated.", "bundle");
                var templatesTransformer = new WrapJavaScriptArrayHtmlTemplatesTransformer(this.variableName);
                bundle.Assets[0].AddAssetTransformer(templatesTransformer);
            }
        }

        public class WrapJavaScriptArrayHtmlTemplatesTransformer : IAssetTransformer
        {
            private readonly string variableName;

            public WrapJavaScriptArrayHtmlTemplatesTransformer(string variableName)
            {
                this.variableName = variableName;
            }

            public Func<Stream> Transform(Func<Stream> openSourceStream, IAsset asset)
            {
                return () =>
                {
                    string source;
                    using (var reader = new StreamReader(openSourceStream()))
                    {
                        source = reader.ReadToEnd();
                    }

                    var output = string.Format(@"window.{0} = {{}};{1}", this.variableName, source);
                    return new MemoryStream(Encoding.UTF8.GetBytes(output));
                };
            }
        }

        public class AddHtmlTemplateToJavaScriptArrayTransformers : IBundleProcessor<HtmlTemplateBundle>
        {
            private readonly string variableName;
            private readonly HtmlTemplateToJavaScriptTransformer.Factory createTransformer;

            public AddHtmlTemplateToJavaScriptArrayTransformers(HtmlTemplateToJavaScriptTransformer.Factory createTransformer, string variableName = null)
            {
                if (string.IsNullOrEmpty(variableName))
                    variableName = "JST";
                this.variableName = variableName;
                this.createTransformer = createTransformer;
            }

            public void Process(HtmlTemplateBundle bundle)
            {
                bundle.ContentType = "text/javascript";
                HtmlTemplateToJavaScriptTransformer scriptTransformer = this.createTransformer(this.variableName + "[{0}]={1};", bundle);
                foreach (IAsset asset in (IEnumerable<IAsset>)bundle.Assets)
                    asset.AddAssetTransformer((IAssetTransformer)scriptTransformer);
            }
        }


    }
}

templates.js

window.JST = {};(function(d) {
var addTemplate = function(id, content) {
    var script = d.createElement('script');
    script.type = 'text/javascript';
    script.id = id;
    if (typeof script.textContent !== 'undefined') {
        script.textContent = content;
    } else {
        script.innerText = content;
    }
    var x = d.getElementsByTagName('script')[0];
    x.parentNode.insertBefore(script, x);
};
JST["todo/index"]="<div id=\"todo-container\">\r\n    Todo\r\n</div>";
}(document));