2013-05-22 29 views
2

我有一個網站,我需要多個主題。如何在Twitter中使用參數Bootstrap從數據庫中動態加載

所以www.mysite.com/Client1/使用紅色按鈕和www.mysite.com/Client2/使用藍色按鈕。 客戶端數量是動態存儲在數據庫中的,並且顏色也存儲在數據庫中。客戶可隨時更改。

目前我正在使用Twitter Bootstrap LESS文件和ASP MVC優化(捆綁)。

我App_Start BundleConfig看起來是這樣的:

var cssTransformer = new CssTransformer(); 
var stylesBundle = new StyleBundle("~/Content/bootstrap"); 
    .Include("~/Content/less/bootstrap.less") 
stylesBundle.Transforms.Add(cssTransformer); 
bundles.Add(stylesBundle); 

在variables.less

@btnPrimaryBackground:    @linkColor; 

當不同的網址稱爲@btnPrimaryBackground的顏色應改變。

如何更改less變量以使用另一個來源(數據庫或其他)的參數?

回答

4

由於Web Optimization與動態資源不兼容,因此我決定不使用它。

相反,我已經爲LESS做了一個ASP MVC ActionResult,並且引用了它。

<link rel="stylesheet" type="text/css" href="@Url.Action("Styles", "Theme")"> 

我的ASP MVC控制器看起來是這樣的:

public class ThemeController : Controller 
{ 

    public ActionResult Styles() 
    { 
     var parameters = new Dictionary<string, string> 
      { 
       {"themeColor1", "Get theme color 1 here"}, 
       {"themeColor2", "Get theme color 2 here"} 
      }; 

     var themeLessFilePath = Server.MapPath("~/Content/less/theme.less"); 
     using (var stream = System.IO.File.OpenRead(themeLessFilePath)) 
     { 
      return new DotLessResult(stream, parameters, true); 
     } 
    } 
} 

愈少的ActionResult是這樣的:

public class DotLessResult : ActionResult 
{ 
    public IDictionary<string, string> Parameters { get; set; } 
    public string Less { get; set; } 
    public bool Minify { get; set; } 

    public DotLessResult(string less, IDictionary<string, string> parameters = null, bool minify = false) 
    { 
     Less = less; 
     Parameters = parameters ?? new Dictionary<string, string>(); 
     Minify = minify; 
    } 

    public DotLessResult(Stream stream, IDictionary<string, string> parameters = null, bool minify = false) 
     : this(new StreamReader(stream).ReadToEnd(), parameters, minify) { } 

    public override void ExecuteResult(ControllerContext context) 
    { 
     var output = Less; 
     //TODO: Not the way to do this! 

     foreach (var key in Parameters.Keys) 
     { 
      output = Regex.Replace(output, @"@" + key + @":\s*\S+;", "@" + key + ":" + Parameters[key] + ";"); 
     } 
     var lessEngine = dotless.Core.LessWeb.GetEngine(new DotlessConfiguration { MinifyOutput = Minify, MapPathsToWeb = true, Web = true, CacheEnabled = false}); 

     var css = lessEngine.TransformToCss(output, (string)null); 

     context.HttpContext.Response.ContentType = "text/css"; 
     using (var writer = new StreamWriter(context.HttpContext.Response.OutputStream, Encoding.UTF8)) 
     { 
      writer.Write(css); 
      writer.Flush(); 
     } 
    } 
} 

它不是最好的解決方案,但它工作在我的機器TM。

不要忘了實現某種輸出緩存,因爲它最喜歡被擊中很多,而且不會經常更改。

相關問題