Componette

Componette

janmarek

janmarek / WebLoader v2.5.0

Nette Framework addon for CSS and JS files loading

download-cloud-line composer require janmarek/webloader

WebLoader Build Status

Component for CSS and JS files loading

Author: Jan Marek Licence: MIT

Example

Control factory in Nette presenter:

<?php

protected function createComponentCss()
{
	$files = new WebLoader\FileCollection(WWW_DIR . '/css');
	$files->addFiles(array(
		'style.css',
		WWW_DIR . '/colorbox/colorbox.css',
	));

	$files->addWatchFiles(Finder::findFiles('*.css', '*.less')->in(WWW_DIR . '/css'));

	$compiler = WebLoader\Compiler::createCssCompiler($files, WWW_DIR . '/temp');

	$compiler->addFilter(new WebLoader\Filter\VariablesFilter(array('foo' => 'bar')));
	$compiler->addFilter(function ($code) {
		return cssmin::minify($code, "remove-last-semicolon");
	});

	$control = new WebLoader\Nette\CssLoader($compiler, '/webtemp');
	$control->setMedia('screen');

	return $control;
}

Template:

{control css}

Example with Nette Framework extension used

Configuration in app/config/config.neon:

extensions:
	webloader: WebLoader\Nette\Extension

services:
	wlCssFilter: WebLoader\Filter\CssUrlsFilter(%wwwDir%)
	lessFilter: WebLoader\Filter\LessFilter
	jwlCssMinFilter: Joseki\Webloader\CssMinFilter

webloader:
	css:
		default:
			files:
				- style.css
				- {files: ["*.css", "*.less"], from: %appDir%/presenters} # Nette\Utils\Finder support
			filters:
				- @jwlCssMinFilter
			fileFilters:
				- @lessFilter
				- @wlCssFilter
			watchFiles:		# only watch modify file
				- {files: ["*.css", "*.less"], from: css}
				- {files: ["*.css", "*.less"], in: css}

	js:
		default:
			remoteFiles:
				- http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js
				- http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js
			files:
				- %appDir%/../libs/nette/nette/client-side/netteForms.js
				- web.js

For older versions of Nette, you have to register the extension in app/bootstrap.php:

$webloaderExtension = new \WebLoader\Nette\Extension();
$webloaderExtension->install($configurator);

Usage in app/presenters/BasePresenter.php:

	/** @var \WebLoader\Nette\LoaderFactory @inject */
	public $webLoader;

	/** @return CssLoader */
	protected function createComponentCss()
	{
		return $this->webLoader->createCssLoader('default');
	}

	/** @return JavaScriptLoader */
	protected function createComponentJs()
	{
		return $this->webLoader->createJavaScriptLoader('default');
	}

Template:

{control css}
{control js}
  • v2.5.0 v2.5.0

    • added TypeScriptFilter by @JanTvrdik
    • added LessFilter2 by @JanTvrdik
    • added Tracy panel by @adawolfa
    • added PHPCoffeeScriptFilter by @janci
    • added Extension: added file watching by @geniv
    • added Suggest joseki/webloader-filters by @geniv

    This release is for Nette ~2.3

  • v2.4.0 v2.4.0

    • suggest oyejorge/less.php instead of leafo/lessphp
    • CssUrlsFilter: accepts Http\IRequest
    • Extension: debug option
    • scss filter using leafo/scssphp

    This release is for Nette ~2.3

  • v2.3.1 v2.3.1

    • suggest oyejorge/less.php instead of leafo/lessphp
    • CssUrlsFilter: accepts Http\IRequest
    • Extension: debug option
    • scss filter using leafo/scssphp

    This release is for Nette 2.2.*

  • v2.3.0 v2.3.0

    • Renamed WebLoader\LoaderFactory to WebLoader\Nette\LoaderFactory
    • Better DI Extension exceptions

    This release is for Nette 2.2.*

  • v2.2.1 v2.2.1

    • Renamed WebLoader\LoaderFactory to WebLoader\Nette\LoaderFactory
    • Better DI Extension exceptions

    This release is for Nette 2.1.*

  • v2.1.2 v2.1.2

    • Added WebLoader\Nette\LoaderFactory
    • Better DI Extension exceptions

    This release is for Nette 2.0.*

  • 2.2.0 2.2.0

    • Compatibility with Nette 2.1
    • Contains new service WebLoader\LoaderFactory that helps you with creating asset controls
Componette Componette felix@nette.org