DisDis 12 дек 2012 в 00:00

Closure Platform. Костыли для Google Closure Library

17 мин

13K

JavaScript * Веб-разработка *

+16

Комментарии 14

raven 12 дек 2012 в 08:18

Спасибо за статью!
Не могли бы вы рассказать как писать плагины для soy компилятора и как их спользовать? — в документации об этом написано очень мало… Например, я бы хотел в soy шаблоне делать так:

/**
 * @param date Some date.
 */
{template .showDate}
  <span>{$date |myFormatDateFunction}</span>
{/template}

или так:

/**
 * @param date Some date.
 */
{template .showDate}
  <span>{myFormatDateFunction($date)}</span>
{/template}

Здесь myFormatDateFunction — это некая функция форматирования даты.

DisDis 12 дек 2012 в 08:26

themes/default/templates/example/ui/test1.soy пример для библеотеки moment

/**
Время вида Дата: DD MMM YYYY
@param? cssClass
@param date
**/
{template .dateShort}
{if $date}
<span class="{css nowrap}{sp}{if $cssClass}{$cssClass|id}{/if}">
    {let $dFormat}{msg desc="time"}DD MMM YYYY{/msg}{/let}
    {dateTimeFormat($date,$dFormat)|id}
</span>
{else}-{/if}
{/template}

Создаёте DateTimeFormaterFunction.java
implements SoyJsSrcFunction
…

@Override
	public JsExpr computeForJsSrc(List<JsExpr> args) {
		JsExpr timestampArg = args.get(0);
		JsExpr formatArg = args.get(1);
		if (args.size() == 2) {
			return new JsExpr("moment(" + timestampArg.getText()
					+ ").format(" + formatArg.getText() + ")",
					Integer.MAX_VALUE);
		} else {
			JsExpr deltaArg = args.get(2);
			return new JsExpr("moment(" + timestampArg.getText() + "+("
					+ deltaArg.getText() + ")\").format("
					+ formatArg.getText() + ")", Integer.MAX_VALUE);
		}
	}

Ну и биндить нужно еще всё это
MyprojectPluginModule.java

public class MyprojectPluginModule extends AbstractModule 
{ 
  @Override public void configure() { 
    Multibinder<SoyFunction> soyFunctionsSetBinder = 
        Multibinder.newSetBinder(binder(), SoyFunction.class); 
    soyFunctionsSetBinder.addBinding().to(DateTimeFormaterFunction.class);
//...
    soyFunctionsSetBinder.addBinding().to(FormatNumberFunction.class);    
    soyFunctionsSetBinder.addBinding().to(SubstringFunction.class);
    soyFunctionsSetBinder.addBinding().to(ToFixedFunction.class);
    soyFunctionsSetBinder.addBinding().to(ReplaceRegularExpressionFunction.class);
    soyFunctionsSetBinder.addBinding().to(RandomFloatFunction.class);
    soyFunctionsSetBinder.addBinding().to(RandomIntFunction.class);
  } 
}

raven 12 дек 2012 в 08:38

А как затем использовать эти два класса при компиляции шаблонов в js? Должен ли я самостоятельно скомпилировать SoyToJsSrcCompiler.jar вместе с этими классами? Или есть возможность использовать стандартный, но с какими-то дополнительными флагами?

DisDis 12 дек 2012 в 08:44

Стандартный.
tools/compile.templates.sh
Параметер
--pluginModules closure.plugins.MyprojectPluginModule

Но запускать надо вот так

java -cp ./cl-templates/js/SoyToJsSrcCompiler.jar:./cl-templates/plugins/cl-t-plugin.jar com.google.template.soy.SoyToJsSrcCompiler --pluginModules closure.plugins.MyprojectPluginModule <еще параметры>

иначе компилятор не подхватит ваш плагин.

raven 12 дек 2012 в 08:51

Большое спасибо!

tenshi 12 дек 2012 в 12:38

получать имя класса исключительно через их апи, которое потом может быть статически проанализировано лишь их инструментом (а там ведь не простая регулярка?) — достаточно кривое решение. лучше всего гугловцам было бы воспользоваться концепцией атомов (http://habrahabr.ru/post/97670/) тогда можно достаточно легко связывать имена из разных типов файлов и сжимать их синхронно. собственно я у себя это и реализовал. правда особой пользы от этого не было так как все ресурсы грузятся лишь один раз, да её и по зипованному каналу, уменьшение объёма не такое уж и значительное. так что читабельность на мой взгляд куда важнее.

TrueMaker 12 дек 2012 в 16:18

На своем опыте полный переход на GCL избавил от множества проблем. Если писать код правильно и не стараться избавится от всех ограничений в виде непонятных хаков над SOY и прочим как это описано в статье. Получается продукт весьма легко саппортабельный с минимальным временем вхождения для нового человека.
Написание SinglePage app превращается в нечто естественное и простое.

У гугла правда интеграция компонентов еще лучше чем можно себе предствить и описано в статье. К примеру у них еще есть своя система спрайтов. Скрипты автоматического поиска транзитивных зависимостей и автоматическое удаление/добавление goog.require — что упрощает жизнь очень сильно.

Хотя в домашних условиях написать все скрипты которые делают все описанное заняло не более половины дня.