Yii with coffee script and less css

Do you already use less css? I do. It’s nice. and css looks really good. And what about coffee script?

There’s great assetic manager that provide such functionality. But how I could use it with yii?  I didn’t find good receipt. So I made mine. We extend CClientScript registerScriptFile and registerCssFile functions. We will check .less and coffee extensions. And if so will handle it by exited assetic manager. That’s it. Nothing fancy I did quite fast and didn’t test a lot. It works for me.


<?php

include_once Yii::getPathOfAlias('application.vendors.lessphp') . '/lessc.inc.php';

class RsClientScript extends CClientScript
{

    public function init()
    {
        Yii::setPathOfAlias('Assetic', Yii::getPathOfAlias('application.vendors.assetic.src.Assetic'));
        Yii::setPathOfAlias('Symfony', Yii::getPathOfAlias('application.vendors.Symfony'));

        parent::init();
    }

    public function registerCssFile($url,$media='')
	{
        $url = $this->_handleCssFile($url);
        return parent::registerCssFile($url, $media);
	}

    public function registerScriptFile($url)
    {
        $url = $this->_handleJsFile($url);
        return parent::registerScriptFile($url);
    }

    private function _handleJsFile($url)
    {

        if (preg_match('~^(.)*(.coffee)$~', $url)) {
            $path = Yii::getPathOfAlias('webroot') . $url;

            $filter = new \Assetic\Filter\CoffeeScriptFilter('/usr/local/bin/coffee');
            $asset = new Assetic\Asset\AssetCache(
                new Assetic\Asset\FileAsset($path, array($filter)),
                new Assetic\Cache\FilesystemCache(Yii::getPathOfAlias('application.runtime.assetic_cache'))
            );

            $newUrl = substr($url, 0, -7);
            $newPath = Yii::getPathOfAlias('webroot') . $newUrl;

            file_put_contents($newPath, $asset->dump());

            return $newUrl;
        }
        return $url;
    }

    private function _handleCssFile($url)
    {
        if (preg_match('~^(.)*(.less)$~', $url)) {
            $path = Yii::getPathOfAlias('webroot') . $url;

            $filter = new \Assetic\Filter\LessphpFilter();
            //$filter = new \Assetic\Filter\LessFilter(null, array('/usr/local/lib/node_modules/'));
            $asset = new Assetic\Asset\AssetCache(
                new Assetic\Asset\FileAsset($path, array($filter)),
                new Assetic\Cache\FilesystemCache(Yii::getPathOfAlias('application.runtime.assetic_cache'))
            );

            $newUrl = substr($url, 0, -5);
            $newPath = Yii::getPathOfAlias('webroot') . $newUrl;

            file_put_contents($newPath, $asset->dump());

            return $newUrl;
        }
        return $url;
    }
}

Perhaps in future I will use something more complex. As you see right now even if file wasn’t changed and we have cache for css file you have write them again to result file. The problem that I can’t check does cache exist by Assetic\Asset\AssetCache without extending it.

Well right now I use it only for dev so it’s ok.

One thought on “Yii with coffee script and less css

  1. Igor Timoshenko

    I see that you have tried to use Assetic with Yii. I’m working on extension that integrates Assetic into Yii. The main goal of this extension is to provide a rich set of Assetic filters to Yii. I would really appreciate your feedback and any comments. Thanks!

    Reply

Leave a Reply

Your email address will not be published. Required fields are marked *