跳转到主要内容

将JavaScript配置(以及i18n数据)添加到Plone产品的通用方法

项目描述

简介

此产品针对需要将JavaScript配置数据或i18n字符串与其Plone产品一起分发的开发者。

注入到页面中的数据可以来自您想要的服务器端配置设置,但大多数情况下,您希望从Plone注册表读取应用程序配置,从页面模板中读取翻译。

工作原理

将在站点的HTML头部注册一个新的小部件。这个小部件通常是空的,并且将不执行任何操作,直到第三方产品注册新的IJSDataProvider适配器。

适配器有三种子类型,选择其中一种取决于您想要在您的附加组件中实现什么。

建议注册命名适配器,这样就可以通过更具体的一个来覆盖注册。在IJSObjectDataProvider的情况下,名称是必需的,因为它用作定义的变量的名称(见下文)。

IJSONDataProvider

当您想以JSON 模板的形式添加新的JavaScript数据时使用它。

适配器必须是一个可调用的对象,返回一个可以被视为JSON字符串的字符串。它将以“text/collective.jsconfiguration.json”类型的脚本添加到页面中。

例如

<script type="text/collective.jsconfiguration.json"
        id="your_adapter_name_if_any">
    {"foo": ... }
</script>

这个包的职责不是告诉你如何读取数据,但例如你可以这样做

var configuration = $.parseJSON($('#your_adapter_name_if_any').text());

IDOMDataProvider

当你想要以XML节点形式添加新的JavaScript数据时使用它。

适配器必须是一个可调用的对象,返回你想要放在页面中的内容。它将以“text/collective.jsconfiguration.xml”类型的脚本添加到页面中。

一个例子

<script type="text/collective.jsconfiguration.xml"
        id="your_adapter_name_if_any">
    <foo data-i18n-label1="Benvenuto"
         data-i18n-label2="Questo è un esempio di traduzione">
         ...
    </foo>
</script>

尽管使用这个提供者没有真正的限制,但它被设计用于注入XML子DOM。如果可调用对象使用模板来渲染其内容,你可以使用浏览器视图。这对你JavaScript界面的国际化(因为你可以依赖Zope i18n支持和像i18ndude这样的工具)非常有用。

从JavaScript中读取翻译字符串将非常简单

var label1 = $($('#your_adapter_name_if_any').text()).attr('data-i18n-label1');
var label2 = $($('#your_adapter_name_if_any').text()).attr('data-i18n-label2');

IJSObjectDataProvider

当你想要以变量形式添加新的JavaScript数据时使用它。因此,数据将用于标准的脚本标签。

这与上面的IJSONDataProvider非常相似(可调用对象必须返回有效的JSON字符串),但有一些重要的区别

  • 需要一个适配器的名称

  • 适配器的名称将被用作变量的名称,数据将被分配到该变量

如果名称是点分隔的,将创建嵌套的JavaScript对象结构。

一个名为“foo.bar”的适配器的例子

<script type="text/javascript">
if (typeof foo==='undefined') {
    foo = {};
}

foo.bar = {"baz": "Hello World"};
</script>

虽然使用IJSONDataProvider不会在JavaScript全局命名空间中包含新的JavaScript数据,而是留给开发者访问新数据,但使用IJSObjectDataProvider你可以直接将新数据添加到JavaScript环境中

alert(foo.bar.baz); // whil be "Hello World"

注册新的配置

无论你选择什么,你只需注册一个适配器,该适配器适配当前上下文、请求和当前视图。

一个例子

<adapter
    factory="your.package.adapter.YourXMLAdapter"
    provides="collective.jsconfiguration.interfaces.IDOMDataProvider"
    for="* * *"
    name="your_zml_configuration"
    />

在上面的例子中,配置将被添加到网站的每个页面。

<adapter
    factory="your.package.adapter.AnotherXMLAdapter"
    provides="collective.jsconfiguration.interfaces.IDOMDataProvider"
    for="Products.CMFPlone.interfaces.siteroot.IPloneSiteRoot
         your.package.browser.interfaces.IYourProductLayer
         your.package.browser.interfaces.IYourSpecialView"
    name="your_zml_configuration"
    />

在最后一个例子中,另一个配置将仅在网站根目录添加,仅在注册了第三方浏览器层(通常是:你的附加产品已安装)且仅当调用特定视图时。

由于适配器注册使用与第一个例子相同的名称,因此最后一个注册将在适用时覆盖第一个。

最后,是适配器类

class YourXMLAdapter(object):
    implements(IDOMDataProvider)

    def __init__(self, context, request, view):
        self.context = context
        self.request = request
        self.view = view

    def __call__(self):
        ...

当使用IJSONDataProviderIJSObjectDataProvider并直接从Plone注册表中读取数据时,你可以依赖collective.regjsonify包,它可以快速帮助你完成这项任务

from collective.regjsonify.interfaces import IJSONifier
from collective.jsconfiguration.interfaces import IJSONDataProvider
from plone.registry.interfaces import IRegistry
from zope.interface import implements

class YourXMLAdapter(object):
    implements(IJSONDataProvider)

    def __init__(self, context, request, view):
        self.context = context
        self.request = request
        self.view = view

    def __call__(self):
        registry = queryUtility(IRegistry)
        settings = registry.forInterface(IMyRegistrySettings)
        return IJSONifier(settings).json()

示例应用

你可以在collective.externalizelink Plone插件中找到所有这些功能。

变更日志

0.1.1 (2015-08-25)

  • IJSONDataProvider遮蔽了HTML输出[keul]

  • 测试损坏了[keul]

0.1.0 (2014-05-02)

  • 初始版本

项目详情


下载文件

下载适合您平台的文件。如果您不确定选择哪个,请了解更多关于安装包的信息。

源分布

collective.jsconfiguration-0.1.1.tar.gz (17.9 kB 查看哈希值)

上传时间

由以下提供支持

AWS AWS 云计算和安全赞助商 Datadog Datadog 监控 Fastly Fastly CDN Google Google 下载分析 Microsoft Microsoft PSF 赞助商 Pingdom Pingdom 监控 Sentry Sentry 错误日志 StatusPage StatusPage 状态页面