How to Support User Selectable Locales in AngularJS Application - javascript

It sounds like this question has been asked a few times before, but I am not seeing a solution. So here goes the question!
I am using the date filter in an HTML page of an AngularJS application to display dates in a page as follows:
{{item.dateCreated | date:'mediumDate'}}
I have a menu item on my page that allows the user to select the language to be used to display the page. I am using the excellent ngTranslate module to perform the translation of the strings on the page, but it does not handle the date display above.
The AngularJS docs indicate that there is a $locale service with one member called id - not sure if this is a property to view the locale or a method to set it. The docs also say that I need to include the i18n script file appropriate for the locale in the page after the angularjs library has been included, but of course I don't know the locale until runtime when the user selects it.
So the question is, how can I support multiple locales in an angularjs application such that filters such as date translate and format dates for the locale, and how do I tell angularjs what locale to use if the user changes it at runtime? I suppose I could build a set of format strings by hand and apply them to the date filter as the user selects a language, but that might get difficult as we decide to support more and more languages??
I would really appreciate any expert suggestions!

To change the locale dynamically you could test the package Angular Dynamic Locale.

Related

Strapi, :collection-type/:id with locale

I'm currently trying to get localized data for one specific instance of a Collection Type.
Let's say I have a Collection Type called Project.
If I want to get all Projects in french I just need to call the exposed endpoint myApi/projects with the parameter _locale=fr myApi/projects?_locale=fr and it's working pretty well.
But if I try to get one specific project for example myApi/projects/1?_locale=fr it returns a 404 not found.
By the way, myApi/projects/1 return the project but in the default locale which is english.
Thanks for helping me.
Localized entries on collection types are considered as a separate entry, rather than a "localized version of the entry". i.e. myApi/projects/1's french version will have a different id, such as myApi/projects/7.
To see which id corresponds with which language, call myApi/projects?locale=<lang>.

CKEditor 5 - allow span elements and attributes

I am trying to make a custom plugin with CKEditor 5 Framework. However I am not able to insert (via editor.setData()) any attributes for paragraphs and other elements like span. Is there any way to achieve that?
Thanks!
CKEditor 5 implements a custom data model about which you can read more in the Architecture introduction guide.
The existence of a custom data model means that the editor needs to know how to convert that model to a view structure (the DOM) for editing. Also, since typically the editor outputs HTML (or a structurally "compatible" format as Markdown, BBCode, etc.) similar conversion needs to be done to get the data from the editor. Finally, the editor needs to be able to convert the view to the model so you are able to load data into the editor.
Side note: You might also want to save the model directly into your database which would save you from converting the view to the model (on setData()), but while possible it still means that the editor needs to know how to convert the model to the view for editing and the view to the model for pasting.
What does all this mean? It means that unless a particular piece of content can be picked by an existing editor feature, it will be dropped. It simply won't be converted from the view to the model on data load and hence will be forgotten.
Therefore, it's all about converters. You need to teach your editor how to understand HTML and how to render HTML. Actually, you also need to teach it how these particular pieces of (at this point) the model can be edited (by configuring the schema and implementing a proper UI).
So, how to write converters and configure the schema?
Well, this is a problem at the moment because right now (as of Dec 2017) we're in a middle of a CKEditor 5 engine refactoring. The architecture we have is great but the APIs proved to be too hard to use, so we're now improving them which means that whatever I'd write here would be invalid next month. So, instead, I recommend going through the source of the CKEditor 5 packages (e.g. see the plugins in the basic styles package).

CRM 2013 Limit the date field

I have 3 date and time fields (its date only).
But I want to limit the user not to be able to select future date.
I mean dates after today's couldn't be selected in the date picker.
How can I do it?
Crm datetime field doesn't support this type of functionality. You'll need to create your own html webresource and use a well-known library / control such as jquery datepicker.
Once you have the resource in place syncing the picker value with the hidden datetime value should be relatively easy using the form onload and onsave events.
You have to write a validator, either in plugin or JavaScript (or business rules), or perhaps both.
JS only works in the forms but has the possibility to give a prettier error message, with the business rules you can have a valitation which gives messages inline. If you only add data using the GUI, it might be enough to just use JS/business rules but if data can come any other way I would secure it with a plugin as well.
The validator is pretty simple, retrieve the field and compare it with a date object today. It could be a bit worse if there are a lot of timezones involved, we don't like timezones....

Access jQuery Controls on Server Side?

Is there a library or framework built for invoking jQuery / Javascript functions from the server side?
For example, say I'm using a jQuery UI datepicker control on my page. The datepicker's format (e.g., MM/dd/yyyy) is configurable on a per-user basis. In this scenario I'd have to retrieve user preferences on the server, record the user-chosen format in a hidden control, send the HTML page to the client, and finally extract the format from the hidden control on the client side. Does any library exist that facilitates this long-winded process?
I like to use custom attributes for this sort of thing.
<asp:TextBox runat="server" id="myDatePicker" ClientIDMode="Static"
format="MM/dd/yyyy" />
Render the attribute when you render the page based on the user settings, then the client code can just grab it whenever it's needed and apply as appropriate:
var format = $('#myDatePicker').attr('format');
I sometimes use a simple infrastructure for this purpose which can JSON+base64 encode objects to include in a generic "data" property, then unwind it at the client, to add more complex information to a control.
In other situations I just grab the settings when I need them from the client using a service called through ajax, but this way is more efficient, if you already know what it is when the page is rendered.
You'd need to incorporate some sort of server side scripting language such as MySQL/PHP to pull the users preferences, then it shouldn't be too hard to bundle in. You would just need to make the storage "dynamic" in that it accepts a wide range of date formats, or convert to a more standardized format.
Until I know what languages you are using, or some sample code, its hard for me to answer.
Depends on how your site and page is setup. But, if you are storing the user's selected date picker format in a cookie or session variable you could expose this value through a string property on the page (e.g. DatePickerFormat) and then make the jQuery datepicker dateFormat dynamic something like this:
$(document).ready(function() {
$('#idOfDataPickerControl').datepicker('option', 'dateFormat', '<%=DatePickerFormat%>');
});

jQuery form generation

I'm basically looking for the client-side equivalent of Django's ModelForm: I want to be able to specify the general schema of my data (what the fields are, which ones are required, what kinds of fields to use, etc.), and I want to be able to dynamically generate the form, itself, fill it with any initial data, validate it, and extract an object containing the validated data that I can Ajaxily submit places when the form has been filled out.
Dos this exist? Something jQuery-flavored would be preferred.
You might also check out Alpaca (http://www.alpacajs.org). It's similar in some ways to Joshfire's JSON Form library. It uses JSON Schema and features a JSON-based way of specifying your layout and additional rendering options. It also uses templates for flexibility.
You can register your own controls for different data types. It comes with a whole bunch of controls already defined for things like simple text entry all the way to Google Maps and more.
Best of all, it's open-source and based on jQuery. It's been around for the better part of two years and we've been using it with Cloud CMS at my company. (disclaimer: I'm biased + I haven't tried any of the other tools suggested, they're likely awesome as well)
http://neyric.github.com/inputex/examples/json-schema.html
This is very likely what you want. Give YUI a whirl ;)
May I also humbly suggest Metawidget? It supports a broad range of back-end definitions and UI frameworks.
Joshfire's JSON Form library does just that.
It uses the IETF standard JSON Schema format to describe your models, and it can validate your data against it using JSV.
It lets you specify the form layout, but it generates a default form if you don't.
It's based on JQuery.

Categories