Add support for LESS compiled stylesheets.

r2/Makefile

@@ -95,6 +95,7 @@ clean_ini:
 
 #################### CSS file lists
 SPRITED_STYLESHEETS += reddit.css compact.css
+LESS_STYLESHEETS :=
 OTHER_STYLESHEETS := reddit-ie6-hax.css reddit-ie7-hax.css mobile.css highlight.css
 
 #################### Static Files
@@ -134,15 +135,18 @@ endef
 $(foreach plugin,$(PLUGINS),$(eval $(call PLUGIN_STATIC_TEMPLATE,$(plugin))))
 
 #### Stylesheets
+LESSC := lessc
 CSS_COMPRESS := $(PYTHON) r2/lib/contrib/rcssmin.py
 CSS_SOURCE_DIR := $(STATIC_BUILD_DIR)/css
 
 PROCESSED_SPRITED_STYLESHEETS := $(addprefix $(STATIC_BUILD_DIR)/, $(SPRITED_STYLESHEETS))
 SPRITES := $(addprefix $(STATIC_BUILD_DIR)/, $(patsubst %.css,sprite-%.png, $(SPRITED_STYLESHEETS)))
 
+LESS_OUTPUTS := $(addprefix $(STATIC_BUILD_DIR)/, $(patsubst %.less,%.css, $(LESS_STYLESHEETS)))
+
 MINIFIED_OTHER_STYLESHEETS := $(addprefix $(STATIC_BUILD_DIR)/, $(OTHER_STYLESHEETS))
 
-PROCESSED_STYLESHEETS := $(PROCESSED_SPRITED_STYLESHEETS) $(MINIFIED_OTHER_STYLESHEETS)
+PROCESSED_STYLESHEETS := $(PROCESSED_SPRITED_STYLESHEETS) $(MINIFIED_OTHER_STYLESHEETS) $(LESS_OUTPUTS)
 RTL_STYLESHEETS := $(PROCESSED_STYLESHEETS:.css=-rtl.css)
 
 CSS_OUTPUTS = $(PROCESSED_STYLESHEETS) $(RTL_STYLESHEETS) $(SPRITES)
@@ -152,6 +156,10 @@ CSS_OUTPUTS = $(PROCESSED_STYLESHEETS) $(RTL_STYLESHEETS) $(SPRITES)
 css: $(STATIC_BUILDSTAMP) $(CSS_OUTPUTS)
 
 
+$(LESS_OUTPUTS): $(STATIC_BUILD_DIR)/%.css : $(CSS_SOURCE_DIR)/%.less
+	rm -f $@
+	$(LESSC) $< | $(CSS_COMPRESS) > $@
+
 $(MINIFIED_OTHER_STYLESHEETS): $(STATIC_BUILD_DIR)/%.css: $(CSS_SOURCE_DIR)/%.css
 	# when static file names are mangled, the original becomes a symlink to the mangled name
 	# remove the original file here in case it's a symlink so we don't just rewrite the old file

r2/r2/lib/js.py

@@ -331,6 +331,11 @@ module["highlight"] = Module("highlight.js",
     "highlight.js",
 )
 
+module["less"] = Module('less.js',
+    'lib/less-1.3.0.min.js',
+    should_compile=False,
+)
+
 def use(*names):
     return "\n".join(module[name].use() for name in names)
 

r2/r2/lib/template_helpers.py

@@ -42,6 +42,11 @@ def is_encoding_acceptable(encoding_to_check):
     header = request.headers.get('Accept-Encoding', '')
     return 'gzip' in desired_matches(['gzip'], header)
 
+static_text_extensions = {
+    '.js': 'js',
+    '.css': 'css',
+    '.less': 'css'
+}
 def static(path, allow_gzip=True):
     """
     Simple static file maintainer which automatically paths and
@@ -53,7 +58,7 @@ def static(path, allow_gzip=True):
     """
     dirname, filename = os.path.split(path)
     extension = os.path.splitext(filename)[1]
-    is_text = extension in ('.js', '.css')
+    is_text = extension in static_text_extensions
     can_gzip = is_text and is_encoding_acceptable('gzip')
     should_gzip = allow_gzip and can_gzip
 
@@ -79,7 +84,7 @@ def static(path, allow_gzip=True):
 
             # unminified static files are in type-specific subdirectories
             if not dirname and is_text:
-                path_components.append(extension[1:])
+                path_components.append(static_text_extensions[extension])
 
             actual_filename = filename
 

r2/r2/templates/less.html

@@ -0,0 +1,24 @@
+<%!
+   from r2.lib.template_helpers import static
+   from r2.lib import js
+%>
+
+<%def name="less_stylesheet(*names)">
+  %for name in names:
+    <% name = name[:name.rfind('.less')] %>
+    %if g.uncompressedJS:
+      <link rel="stylesheet/less" type="text/css" href="${static(name+'.less')}" />
+    %else:
+      <link rel="stylesheet" type="text/css" href="${static(name+'.css')}" />
+    %endif
+  %endfor
+</%def>
+
+<%def name="less_js()">
+  %if g.uncompressedJS:
+    <script type="text/javascript">
+      less = {env: 'development'};
+    </script>
+    ${unsafe(js.use('less'))}
+  %endif
+</%def>

r2/r2/templates/reddit.html

@@ -31,6 +31,7 @@
 %>
 <%namespace file="login.html" import="login_panel, login_form"/>
 <%namespace file="framebuster.html" import="framebuster"/>
+<%namespace file="less.html" import="less_js"/>
 <%namespace file="utils.html" import="tags, css_class"/>
 <%inherit file="base.html"/>
 
@@ -109,6 +110,7 @@
   <!--[if lt IE 9]>
     ${unsafe(js.use('html5shiv'))}
   <![endif]-->
+  ${less_js()}
 </%def>
 
 <%def name="javascript_run()">