Improved Plugins SCSS management

- Moves the import of plugins for both mobile and desktop from common after discourse loading, allowing plugins to overwrite
 - Make desktop-option behave like the mobile-option: SCSS/CSS marked with that option will only be loaded for desktop from now on and ignored in mobile
 - Add variables-keyword, allowing plugins to ship and overwrite variables before they get imported by discourse (great for theming)

app/assets/stylesheets/common.scss

@@ -8,6 +8,4 @@
 @import "common/components/*";
 @import "common/admin/*";
 @import "common/input_tip";
-@import "common/base/*";
+@import "common/base/*";
-/* This file doesn't actually exist, it is injected by DiscourseSassImporter. */
-@import "plugins";

app/assets/stylesheets/common/foundation/variables.scss

@@ -183,3 +183,7 @@ $quote-background: lighten($black, 76%);
 
 $topicMenuColor: darken($white, 80%);
 $bookmarkColor: $blue;
+
+
+/* This file doesn't actually exist, it is injected by DiscourseSassImporter. */
+@import "plugins_variables";

app/assets/stylesheets/desktop.scss

@@ -1,2 +1,7 @@
 @import "common";
 @import "desktop/*";
+
+/* These files doesn't actually exist, they are injected by DiscourseSassImporter. */
+
+@import "plugins";
+@import "plugins_desktop";

app/assets/stylesheets/mobile.scss

@@ -1,5 +1,8 @@
 @import "common";
 @import "mobile/*";
 
-/* This file doesn't actually exist, it is injected by DiscourseSassImporter. */
+
+/* These files doesn't actually exist, they are injected by DiscourseSassImporter. */
+
+@import "plugins";
 @import "plugins_mobile";

lib/discourse_plugin_registry.rb

@@ -9,6 +9,8 @@ class DiscoursePluginRegistry
     attr_accessor :admin_javascripts
     attr_accessor :stylesheets
     attr_accessor :mobile_stylesheets
+    attr_accessor :desktop_stylesheets
+    attr_accessor :sass_variables
     attr_accessor :handlebars
 
     # Default accessor values
@@ -31,6 +33,15 @@ class DiscoursePluginRegistry
     def mobile_stylesheets
       @mobile_stylesheets ||= Set.new
     end
+
+    def desktop_stylesheets
+      @desktop_stylesheets ||= Set.new
+    end
+
+    def sass_variables
+      @sass_variables ||= Set.new
+    end
+
     def handlebars
       @handlebars ||= Set.new
     end
@@ -66,6 +77,14 @@ class DiscoursePluginRegistry
     self.class.mobile_stylesheets
   end
 
+  def desktop_stylesheets
+    self.class.desktop_stylesheets
+  end
+
+  def sass_variables
+    self.class.sass_variables
+  end
+
   def handlebars
     self.class.handlebars
   end
@@ -75,6 +94,8 @@ class DiscoursePluginRegistry
     self.server_side_javascripts = nil
     self.stylesheets = nil
     self.mobile_stylesheets = nil
+    self.desktop_stylesheets = nil
+    self.sass_variables = nil
     self.handlebars = nil
   end
 

lib/discourse_sass_importer.rb

@@ -26,6 +26,15 @@ class DiscourseSassImporter < Sass::Importers::Filesystem
     }.merge!(super)
   end
 
+  def special_imports
+    {
+      "plugins" => DiscoursePluginRegistry.stylesheets,
+      "plugins_mobile" => DiscoursePluginRegistry.mobile_stylesheets,
+      "plugins_desktop" => DiscoursePluginRegistry.desktop_stylesheets,
+      "plugins_variables" => DiscoursePluginRegistry.sass_variables
+    }
+  end
+
   def find_relative(name, base, options)
     if name =~ GLOB
       glob_imports(name, Pathname.new(base), options)
@@ -35,12 +44,8 @@ class DiscourseSassImporter < Sass::Importers::Filesystem
   end
 
   def find(name, options)
-    if name == "plugins" || name == "plugins_mobile"
+    if special_imports.has_key? name
-      if name == "plugins"
+      stylesheets = special_imports[name]
-        stylesheets = DiscoursePluginRegistry.stylesheets
-      elsif name == "plugins_mobile"
-        stylesheets = DiscoursePluginRegistry.mobile_stylesheets
-      end
       contents = ""
       stylesheets.each do |css_file|
         if css_file =~ /\.scss$/

lib/plugin/instance.rb

@@ -222,12 +222,14 @@ class Plugin::Instance
           DiscoursePluginRegistry.javascripts << asset
         end
       elsif asset =~ /\.css$|\.scss$/
-
+        if opts == :mobile
-        unless opts == :mobile
-          DiscoursePluginRegistry.stylesheets << asset
-        end
-        unless opts == :desktop
           DiscoursePluginRegistry.mobile_stylesheets << asset
+        elsif opts == :desktop
+          DiscoursePluginRegistry.desktop_stylesheets << asset
+        elsif opts == :variables
+          DiscoursePluginRegistry.sass_variables << asset
+        else
+          DiscoursePluginRegistry.stylesheets << asset
         end
 
       elsif asset =~ /\.js\.handlebars$/

spec/components/plugin/instance_spec.rb

@@ -9,6 +9,8 @@ describe Plugin::Instance do
     DiscoursePluginRegistry.server_side_javascripts.clear
     DiscoursePluginRegistry.stylesheets.clear
     DiscoursePluginRegistry.mobile_stylesheets.clear
+    DiscoursePluginRegistry.desktop_stylesheets.clear
+    DiscoursePluginRegistry.sass_variables.clear
   end
 
   context "find_all" do
@@ -35,7 +37,7 @@ describe Plugin::Instance do
 
       plugin.send :register_assets!
 
-      DiscoursePluginRegistry.mobile_stylesheets.count.should == 2
+      DiscoursePluginRegistry.mobile_stylesheets.count.should == 0
       DiscoursePluginRegistry.stylesheets.count.should == 2
     end
 
@@ -45,7 +47,8 @@ describe Plugin::Instance do
       plugin.send :register_assets!
 
       DiscoursePluginRegistry.mobile_stylesheets.count.should == 0
-      DiscoursePluginRegistry.stylesheets.count.should == 1
+      DiscoursePluginRegistry.desktop_stylesheets.count.should == 1
+      DiscoursePluginRegistry.stylesheets.count.should == 0
     end
 
     it "registers mobile css properly" do
@@ -57,6 +60,26 @@ describe Plugin::Instance do
       DiscoursePluginRegistry.stylesheets.count.should == 0
     end
 
+    it "registers desktop css properly" do
+      plugin = Plugin::Instance.new nil, "/tmp/test.rb"
+      plugin.register_asset("test.css", :desktop)
+      plugin.send :register_assets!
+
+      DiscoursePluginRegistry.desktop_stylesheets.count.should == 1
+      DiscoursePluginRegistry.stylesheets.count.should == 0
+    end
+
+
+    it "registers sass variable properly" do
+      plugin = Plugin::Instance.new nil, "/tmp/test.rb"
+      plugin.register_asset("test.css", :variables)
+      plugin.send :register_assets!
+
+      DiscoursePluginRegistry.sass_variables.count.should == 1
+      DiscoursePluginRegistry.stylesheets.count.should == 0
+    end
+
+
     it "registers admin javascript properly" do
       plugin = Plugin::Instance.new nil, "/tmp/test.rb"
       plugin.register_asset("my_admin.js", :admin)
@@ -116,6 +139,9 @@ describe Plugin::Instance do
       plugin.register_asset("desktop.css", :desktop)
       plugin.register_asset("desktop2.css", :desktop)
 
+      plugin.register_asset("variables1.scss", :variables)
+      plugin.register_asset("variables2.scss", :variables)
+
       plugin.register_asset("code.js")
 
       plugin.register_asset("server_side.js", :server_side)
@@ -128,8 +154,10 @@ describe Plugin::Instance do
       DiscoursePluginRegistry.javascripts.count.should == 3
       DiscoursePluginRegistry.admin_javascripts.count.should == 2
       DiscoursePluginRegistry.server_side_javascripts.count.should == 1
-      DiscoursePluginRegistry.stylesheets.count.should == 4
+      DiscoursePluginRegistry.desktop_stylesheets.count.should == 2
-      DiscoursePluginRegistry.mobile_stylesheets.count.should == 3
+      DiscoursePluginRegistry.sass_variables.count.should == 2
+      DiscoursePluginRegistry.stylesheets.count.should == 2
+      DiscoursePluginRegistry.mobile_stylesheets.count.should == 1
     end
   end