Quoting Zibi Braniecki (2014-07-04 02:51:09)
> That's an interesting problem. I think that originally we planned not
> to allow developers to create nodes that cannot be replaced by the
> localizer.
> But your use case makes sense.
>
> Stas, do you have any opinion on what we should do here?
That's a very interesting usecase indeed. I think there are four
solutions that I'd like to explore:
1. Give more control to developers and third-party libs like Angular
over when L20n's logic is run. This would allow to first translate
a DOM element and then apply Angular's bindings. However, with the
work we've been doing to put L20n into Mutation Observers and
possibly into Shadow DOM, this would seem to be orthogonal to where
we want to move L20n in the future.
2. Introduce a new data-l10n-* attribute, similar to what Igor
suggested, that allows developers to control which descendants can
be localized and which cannot, in a declarative manner.
3. Split our current DOM overlays implementation into two separate
components:
1. text-level semantics, like <sup> and <em>, which localizers
should always be able to use,
2. projected content declared by the developer in the source HTML
as descendant elements, which localizers should be able to
position inside of the translation; if developer allows it,
they should also be able to provide the translation for the
content of the element.
4. Improve the interaction between third-party libs (MV*) and L20n
wrt. context data. For instance, the MV* framework could simpy
change the context data used by L20n, and L20n would be responsible
for retranslating the element and re-rendering it.
So instead of this:
<msg_forwarded_header """
Forwarded message from <a></a>, <span></span>
""">
<div
class="im_message_fwd_header"
ng-if="historymessage._ == 'messageforwarded'"
data-l20n="msg_forwarded_header">
<a
class="im_message_fwd_author"
ng-click="openuser(historymessage.fwd_from_id)"
ng-bind-html="historymessage.fwduser.rfirstname"></a>
<span
class="im_message_fwd_date"
ng-bind="historymessage.fwd_date | dateortime"></span>
</div>
You'd do this:
<msg_forwarded_header """
Forwarded message from <a>{{ firstname }}</a>,
<span>{{ date }}</span>
""">
<div
class="im_message_fwd_header"
ng-if="historymessage._ == 'messageforwarded'"
data-l20n="msg_forwarded_header">
<a
class="im_message_fwd_author"
ng-click="openuser(historymessage.fwd_from_id)"></a>
<span
class="im_message_fwd_date"></span>
</div>
document.l10n.updateData({
firstname: historymessage.fwduser.rfirstname
date: historymessage.fwd_date | dateortime
});
This will also make sure that the translation make sense
grammatically with the new values of firstname and date.
#2 is an easy solution but I'm a little bit reluctant to extending the
public data-l10n-* API. #3 is something I'd like to give more thought
to. As is #4, which looks compelling, but I'm uncertain of the
performance consequences it may have.
An interesting use-case indeed!
-stas
--
@stas
_______________________________________________
tools-l10n mailing list
[email protected]
https://lists.mozilla.org/listinfo/tools-l10n
