Permalink
Browse files

FEATURE: added support for sass 3.0 and scss file extensions. ENHANCE…

…MENT: moved configuration out to template to allow custom configuration.
  • Loading branch information...
1 parent 2a8ac1c commit 52810f3e228a9673cb03d891e05e32b8b2bef23e @wilr wilr committed Feb 4, 2011
Showing with 154 additions and 54 deletions.
  1. +1 −2 _config.php
  2. +31 −26 code/Compass.php
  3. +1 −1 code/Rubygems.php
  4. +65 −25 docs/getting-started.md
  5. +37 −0 docs/installation.md
  6. +19 −0 templates/CompassConfig.ss
View
3 _config.php
@@ -4,5 +4,4 @@
Object::add_extension('SiteTree', 'Compass_RebuildDecorator');
// Add the dev/compass tools into the URL map
-Director::addRules(20, array('dev/compass' => 'Compass'));
-
+Director::addRules(20, array('dev/compass' => 'Compass'));
View
57 code/Compass.php
@@ -11,7 +11,7 @@ class Compass extends Controller {
/**
* @var bool Are compass errors actually errors, or should we just ignore them?
- * True means complain, false means don't, null means don't complain on live servers, do otherwise
+ * True means complain, false means don't, null means don't complain on live servers, do otherwise
*/
static $errors_are_errors = null;
@@ -33,10 +33,10 @@ class Compass extends Controller {
'yard', 'maruku', 'haml' => '~> 2.2', 'compass' => '~> 0.8.0', 'compass-colors'
),
3 => array(
- 'yard', 'maruku', 'haml' => '~> 3.0', 'compass' => '~> 0.10.6', 'compass-colors'
+ 'yard', 'maruku', 'haml-edge' => '~> 3.0', 'compass' => '~> 0.10.6', 'compass-colors' // requires edge as it has scss support
),
'latest' => array(
- 'yard', 'maruku', 'haml-edge', 'compass'
+ 'yard', 'maruku', 'haml-edge', 'compass', 'compass-colors'
)
);
@@ -113,31 +113,15 @@ function convert($verbose = false) {
exit();
}
- // And doesn't have sass or compass commands in it
- if (is_file($dir . DIRECTORY_SEPARATOR . 'config.rb') || is_dir($dir . DIRECTORY_SEPARATOR . 'sass')) {
+ // And doesn't have sass commands in it
+ if(is_dir($dir . DIRECTORY_SEPARATOR . 'sass')) {
if (!@$_GET['force'] && array_search('--force', (array)@$_GET['args']) === false) {
echo "\nERROR:\n\nPath $dir is already a compass or sass based theme or module.\nUse --force to force overwriting\n\n";
exit();
}
}
- // Create the config.rb file to configure compass
- // @todo Allow tweaking this definition via command line arguments
- file_put_contents($dir . DIRECTORY_SEPARATOR . 'config.rb', '
-# Require any additional compass plugins here.
-require "compass-colors"
-
-project_type = :stand_alone
-# Set this to the root of your project when deployed:
-http_path = "/"
-css_dir = "css"
-sass_dir = "sass"
-images_dir = "images"
-javascripts_dir = "javascript"
-output_style = :compact
-# To enable relative paths to assets via compass helper functions. Uncomment:
-relative_assets = true
-');
+ self::generate_config($dir);
// Make sure the gems we need are available
if (($error = $this->checkGems()) !== true) return self::error($error);
@@ -219,7 +203,6 @@ protected function getAllModules() {
* Note that errors get output independent of this argument - use errors_are_errors = false to suppress them.
*/
function rebuild($verbose = false) {
-
// Make sure the gems we need are available
if (($error = $this->checkGems()) !== true) return self::error($error);
@@ -260,13 +243,18 @@ function rebuild($verbose = false) {
protected function rebuildDirectory($dir) {
if (!is_dir($dir)) return self::error("Could not rebuild $dir, as it doesn't exist");
- $orig = getcwd();
+ self::generate_config($dir);
+ $orig = getcwd();
chdir($dir);
- $code = Rubygems::run(self::$required_gems[self::$sass_version], "compass", @$_GET['flush'] ? " --force" : "", $out, $err);
+
+ $args = (self::$sass_version > 2) ? "compile -e production ": "";
+ if(isset($_REQUEST['flush'])) $args .= "--force";
+
+ $code = Rubygems::run(self::$required_gems[self::$sass_version], "compass", $args, $out, $err);
chdir($orig);
- if ($code !== 0) return self::error($err);
+ //if ($code !== 0) return self::error($err);
}
/**
@@ -289,6 +277,21 @@ function updategems($verbose = false) {
if ($verbose) echo "\nGem update succesfull\n";
}
+ /**
+ * Generate a configuration file for a given directory
+ *
+ * @param string - folder name
+ */
+ protected function generate_config($dir) {
+ if(!is_file($dir . DIRECTORY_SEPARATOR . 'config.rb')) {
+ file_put_contents(
+ $dir . DIRECTORY_SEPARATOR . 'config.rb',
+ $this->customise(new ArrayData(array(
+ 'TmpDir' => TEMP_FOLDER
+ )))->renderWith('CompassConfig')
+ );
+ }
+ }
}
/**
@@ -304,9 +307,11 @@ class Compass_RebuildDecorator extends DataObjectDecorator {
function contentcontrollerInit($controller) {
// Don't auto-rebuild if explicitly disabled
if (Compass::$force_no_rebuild) return;
+
// Don't auto-rebuild in test mode
$runningTest = class_exists('SapphireTest',false) && SapphireTest::is_running_test();
if ($runningTest) return;
+
// If we are in dev mode, or flush called, auto-rebuild
if (Director::isDev() || @$_GET['flush']) singleton('Compass')->rebuild();
}
View
2 code/Rubygems.php
@@ -43,7 +43,7 @@ static protected function _run($cmd, &$stdout, &$stderr) {
$stderr = "";
if (!is_resource($process)) return -1;
-
+
fclose($pipes[0]); // close child's input immediately
stream_set_blocking($pipes[1],false);
stream_set_blocking($pipes[2],false);
View
90 docs/getting-started.md
@@ -1,7 +1,60 @@
+# Getting Started
-## Getting Started
+Sass has two syntaxes. The new main syntax (as of Sass 3) is known as "SCSS" (for "Sassy CSS"), and is a superset of
+CSS3's syntax. This means that every valid CSS3 stylesheet is valid SCSS as well. SCSS files use the extension .scss.
-### Convert your theme to sass
+The second, older syntax is known as the indented syntax (or just "Sass"). Inspired by Haml’s terseness, it’s intended
+for people who prefer conciseness over similarity to CSS. Instead of brackets and semicolons, it uses the indentation
+of lines to specify blocks. Although no longer the primary syntax, the indented syntax will continue to be supported.
+Files in the indented syntax use the extension .sass.
+
+The module provides support for both but no matter what variation you wish to use the folder should be called `sass`.
+
+If you wish to use scss syntax make sure your file extension is `.scss`. If you wish to use sass use the file
+extension `.sass` on your files.
+
+## How Compass Works
+
+The module watches for any changes in your theme or modules `sass/` directory and if it detects changes it recompiles
+your `.sass` or `.scss` file into a valid `.css` file.
+
+Take for instance the following module called `cms`. You need to create a directory `sass`. This is where you will
+write your sass files.
+
+ cms/
+ sass/
+ styles.scss
+ reset.scss
+ css/
+
+You should make all your changes in the `sass` directory then the next time you visit your website Compass will
+generate the actual css files for you.
+
+ cms/
+ sass/
+ styles.scss
+ reset.scss
+ css/
+ styles.css
+ reset.css
+
+You can then link to the paths of the CSS file generated.
+
+
+## Rebuild Compass Files Manually
+
+The task `dev/compass/rebuild` rebuilds all Compass themes and modules. You can pass --theme=themename or
+--module=modulename to just rebuild a specific theme or module. In devmode this is automatic.
+
+Rebuilding a theme via sake:
+
+ sake dev/compass/rebuild --theme=blackcandy
+
+Rebuilding a module via sake:
+
+ sake dev/compass/rebuild --module=cms
+
+## Convert your theme to sass
sapphire/sake dev/compass/convert --theme=blackcandy
@@ -14,7 +67,7 @@ we force the recompile of all css files.
The original css files are still available at css/.backup
-## WARNING
+**WARNING**
Once you've converted a theme to Compass, the css files in the css directory will be automatically overwritten by
the compiled sass. It is not recommended to mix sass-compiled and non-compiled css in the same directory
@@ -26,30 +79,17 @@ the compiled sass. It is not recommended to mix sass-compiled and non-compiled c
The task dev/compass/convert creates the required config.rb file to mark a theme or module as being compass based,
and converts any existing css files into sass files
-You need to pass --theme=themename or --module=modulename to specify which theme or module to convert
-
-By default, if there are any sass files already present, the conversion is aborted. You can pass --force to convert
-anyway, overwriting any existing sass files.
-
-### Rebuild one or all themes & modules from the command line
+Converting a theme:
-The task dev/compass/rebuild rebuilds all Compass themes and modules. You can pass --theme=themename or
---module=modulename to just rebuild a specific theme or module
+ sake dev/compass/convert --theme=blackcandy
-### Update your gems to the latest version
+Converting a module:
+
+ sake dev/compass/convert --module=cms
-When rebuild is triggered, the module will download the latest version of Compass if it is not present. Once it has
-downloaded Compass it will not re-check to see if a new version is available (for speed).
-
-To force updating Compass to the lastest version, use the updategems action
-
-sapphire/sake dev/compass/updategems
-
-### Share the Compass gem amongst several websites
+By default, if there are any sass files already present, the conversion is aborted. You can pass --force to convert
+anyway, overwriting any existing sass files.
-By default the module installed Compass into the sites temporary directory. This means that each site will have
-it's own copy of the gems, and that any temp clearing will remove the gems. You can set the constant `SS_GEM_PATH`
-to a common path.
### Change error handling
@@ -62,8 +102,8 @@ who will not be doing sass edits.
### Un-compassing a theme or module
-The Compass module uses the presence of a config.rb file to detect the location of Compass-based themes and modules.
-Remove the config.rb file to stop that theme or module from being automatically rebuilt.
+The Compass module uses the presence of a `config.rb` file to detect the location of Compass-based themes and modules.
+Remove the `config.rb` file to stop that theme or module from being automatically rebuilt.
### Base rewriting
View
37 docs/installation.md
@@ -0,0 +1,37 @@
+# Installing
+
+Compass is a collection of ruby gems and dependencies. By default the module installed Compass into the sites temporary
+directory. This means that each site will have it's own copy of the gems, and that any temp clearing will remove the gems.
+
+## Share the Compass gem amongst several websites
+
+If you are running several websites with Compass and are using the same version of the gem it is better to install
+the gems to a common path and link each site to this path. Set the constant `SS_GEM_PATH` to define your common path in
+either your `_ss_environment.php` or `_config.php`.
+
+ define('SS_GEM_PATH', '/usr/bin/');
+
+For the module to install the gems you need to ensure that path is writable by the webserver
+
+## Installing the gems manually
+
+When the webserver cannot write to your `SS_GEM_PATH` you may need to install this manually. In a terminal run the
+following commands
+
+ gem install compass compass-colors maruku yard haml
+
+
+### Update your gems to the latest version
+
+When rebuild is triggered, the module will download the latest version of Compass if it is not present. Once it has
+downloaded Compass it will not re-check to see if a new version is available (for speed).
+
+To force updating Compass to the lastest version, use the updategems action either via sake or the web browser
+
+sake:
+
+ sake dev/compass/updategems
+
+web:
+
+ http://yoursite.com/dev/compass/updategems
View
19 templates/CompassConfig.ss
@@ -0,0 +1,19 @@
+# Require any additional compass plugins here.
+require "compass-colors"
+
+project_type = :stand_alone
+
+# Set this to the root of your project when deployed:
+http_path = "/"
+css_dir = "css"
+sass_dir = "sass"
+images_dir = "images"
+javascripts_dir = "javascript"
+output_style = :compact
+
+sass_options = {
+ :cache_location => $TmpPath
+}
+
+# To enable relative paths to assets via compass helper functions. Uncomment:
+relative_assets = true

0 comments on commit 52810f3

Please sign in to comment.