Permalink
Browse files

#41: creating a "Supler" module which is a namespace for all Supler-r…

…elated classes. Instead of SuplerForm, Supler.Form should now be used
  • Loading branch information...
adamw committed Feb 24, 2015
1 parent 4b1639f commit b8fbf31f1d5f27e2d4bca64481d115d03991ae48
Showing with 3,282 additions and 3,088 deletions.
  1. +1 −1 design/js-design.md
  2. +4 −4 docs/first.rst
  3. +1 −1 docs/frontend/clientsideval.rst
  4. +2 −2 docs/frontend/customdata.rst
  5. +7 −8 docs/frontend/customizingrender.rst
  6. +2 −2 docs/frontend/i18n.rst
  7. +1 −1 docs/frontend/options.rst
  8. +1 −1 docs/frontend/refreshes.rst
  9. +2 −2 docs/frontend/rendering.rst
  10. +1 −1 docs/frontend/serializing.rst
  11. +1 −1 examples/src/main/resources/forms.js
  12. +22 −20 supler-js/src/Constants.ts
  13. +234 −228 supler-js/src/CreateFormFromJson.ts
  14. +46 −44 supler-js/src/ElementSearch.ts
  15. +39 −38 supler-js/src/FieldData.ts
  16. +23 −21 supler-js/src/FieldOptions.ts
  17. +21 −18 supler-js/src/FormElement.ts
  18. +57 −55 supler-js/src/HtmlUtil.ts
  19. +41 −39 supler-js/src/I18n.ts
  20. +116 −114 supler-js/src/ReadFormValues.ts
  21. +209 −197 supler-js/src/RenderOptions.ts
  22. +104 −99 supler-js/src/SendController.ts
  23. +76 −74 supler-js/src/SuplerForm.ts
  24. +64 −62 supler-js/src/Util.ts
  25. +60 −58 supler-js/src/templates/FieldMatcher.ts
  26. +28 −26 supler-js/src/templates/HtmlRenderTemplateParser.ts
  27. +17 −15 supler-js/src/templates/RenderOptionsGetter.ts
  28. +163 −149 supler-js/src/templates/SingleTemplateParser.ts
  29. +22 −20 supler-js/src/validation/ElementValidator.ts
  30. +124 −123 supler-js/src/validation/Validation.ts
  31. +37 −26 supler-js/src/validation/ValidationScope.ts
  32. +57 −55 supler-js/src/validation/ValidatorFn.ts
  33. +15 −13 supler-js/src/validation/ValidatorRenderOptions.ts
  34. +1 −1 supler-js/tests/common.js
  35. +5 −5 supler-js/tests/conditionalTests.js
  36. +3 −3 supler-js/tests/customDataTests.js
  37. +5 −5 supler-js/tests/fieldMatcherTests.js
  38. +14 −14 supler-js/tests/formValidationTests.js
  39. +4 −4 supler-js/tests/frontendRenderHintTests.js
  40. +10 −10 supler-js/tests/selectSingleTests.js
  41. +6 −6 supler-js/tests/sendTests.js
  42. +14 −14 supler-js/tests/serializeTests.js
  43. +3 −3 supler-js/tests/templatesTests.js
  44. +1,617 −1,504 supler.js
  45. +2 −1 supler.min.js
View
@@ -51,7 +51,7 @@ Basic form workflow
````javascript
// show
var form = new SuplerForm(
var form = new Supler.Form(
document.getElementById("form-container"),
{
// options - see below
View
@@ -108,7 +108,7 @@ of course any way of doing AJAX calls/networking will work, JQuery is not a depe
.. code-block:: javascript
var form = new SuplerForm(
var form = new Supler.Form(
document.getElementById('person_form_container'),
{}
);
@@ -119,7 +119,7 @@ of course any way of doing AJAX calls/networking will work, JQuery is not a depe
});
});
Here we are creating a ``SuplerForm`` instance which as the first arguments requires the HTML element where the form
Here we are creating a ``Supler.Form`` instance which as the first arguments requires the HTML element where the form
should be rendered, and as the second options, which we'll be using shortly. Then, when the document is ready, we are
calling the endpoint to get the JSON form description, and we render the results. This will display a 4-field &
1-button form to the user.
@@ -131,7 +131,7 @@ of doing network communication we are using:
.. code-block:: javascript
var form = new SuplerForm(
var form = new Supler.Form(
document.getElementById('person_form_container'),
{
send_form_function: sendForm
@@ -165,7 +165,7 @@ which will handle such responses:
.. code-block:: javascript
var form = new SuplerForm(
var form = new Supler.Form(
document.getElementById('person_form_container'),
{
send_form_function: sendForm,
@@ -1,7 +1,7 @@
Frontend: Client-side validation
================================
To perform and display client side validation, use the ``SuplerForm.validate()`` method. It will return ``true`` if
To perform and display client side validation, use the ``Form.validate()`` method. It will return ``true`` if
there are any validation errors.
Any existing errors will be cleared upon next invocation of ``validate()``.
@@ -14,10 +14,10 @@ with ``render`` (or calling the ``renderResponseFn``):
$('#messages').html('Server response: ' + data);
}
var form = new SuplerForm(formContainer, {
var form = new Supler.Form(formContainer, {
custom_data_handler: handleData,
// other options
});
The second way is to get the custom data by hand, using ``SuplerForm.getCustomData(json)`` (where ``json`` is what you
The second way is to get the custom data by hand, using ``Form.getCustomData(json)`` (where ``json`` is what you
receive from the server), and if the result is not null, handling it as desired.
@@ -19,7 +19,7 @@ This can be done through the the ``field_options`` option passed when creating a
.. code-block:: javascript
new SuplerForm(container, {
new Supler.Form(container, {
field_options: {
'secretField': {
'render_hint': 'password'
@@ -215,12 +215,12 @@ Customizing via options
-----------------------
To override how a particular type of form elements are rendered, simply provide a method in the ``render_options``
option passed to ``SuplerForm``:
option passed to ``Supler.Form``:
.. code-block:: javascript
var formContainer = document.getElementById('form-container');
var form = = new SuplerForm(formContainer, {
var form = = new Supler.Form(formContainer, {
render_options: {
renderStringField: function(label, id, validationId, name, value, options, compact) {
return someHtml;
@@ -234,11 +234,9 @@ Methods available for overriding:
.. code-block:: javascript
// basic types
renderStringField: (fieldData: FieldData, options: any, compact: boolean): string
renderIntegerField: (fieldData: FieldData, options: any, compact: boolean): string
renderDoubleField: (fieldData: FieldData, options: any, compact: boolean): string
renderPasswordField: (fieldData: FieldData, compact: boolean): string
renderTextareaField: (fieldData: FieldData, compact: boolean): string
renderTextField: (fieldData: FieldData, options: any, compact: boolean): string
renderHiddenField: (fieldData: FieldData, options: any, compact: boolean): string
renderTextareaField: (fieldData: FieldData, options: any, compact: boolean): string
renderMultiChoiceCheckboxField: (fieldData: FieldData, possibleValues: SelectValue[], options: any, compact: boolean): string
renderMultiChoiceSelectField: (fieldData: FieldData, possibleValues: SelectValue[], options: any, compact: boolean): string
renderSingleChoiceRadioField: (fieldData: FieldData, possibleValues: SelectValue[], options: any, compact: boolean): string
@@ -267,3 +265,4 @@ Methods available for overriding:
// misc
additionalFieldOptions: () => any
inputTypeFor: (fieldData:FieldData) => string
View
@@ -6,12 +6,12 @@ Frontend: i18n
Both the labels and the conversion/validation errors may be i18n keys (any place on the backend of frontend that takes
a user-visible string, can be a i18n key instead). Some default keys are provided for the standard
validators, but custom ones can be provided as well simply by specifying them as members of the ``i18n`` option to
``SuplerForm``:
``Supler.Form``:
.. code-block:: javascript
var formContainer = document.getElementById('form-container');
var form = = new SuplerForm(formContainer, {
var form = = new Supler.Form(formContainer, {
i18n: {
error_custom_lastNameLongerThanFirstName: "Last name must be longer than first name!",
error_custom_illegalDateFormat: function(detail) { return "Illegal date format: " + detail; }
@@ -5,7 +5,7 @@ Here's a summary of all options that can be used when defining a Supler form.
.. code-block:: javascript
new SuplerForm(container, {
new Supler.Form(container, {
send_form_function: doAjax, // [1]
i18n: { // [2]
error_custom_someDescription: 'You cannot do that!',
@@ -23,7 +23,7 @@ this can be:
});
}
var form = new SuplerForm(formContainer, {
var form = new Supler.Form(formContainer, {
send_form_function: sendForm,
// other options
});
@@ -2,7 +2,7 @@ Frontend: Rendering the form
============================
At the minimum, you need a designated container on your page, where the form will be rendered, and when
the form JSON is available, create a new ``SuplerForm``:
the form JSON is available, create a new ``Supler.Form``:
.. code-block:: html
@@ -15,7 +15,7 @@ the form JSON is available, create a new ``SuplerForm``:
.. code-block:: javascript
var formContainer = document.getElementById('form-container');
var form = new SuplerForm(formContainer, {});
var form = new Supler.Form(formContainer, {});
form.render(formJson); // formJson is received from the server
If the JSON received from the server contains validation errors, they will be displayed as well.
@@ -1,7 +1,7 @@
Frontend: Serializing the form
==============================
To read the value of a form as a JSON object, simply use the ``SuplerForm.getValue()`` method. The resulting JSON can
To read the value of a form as a JSON object, simply use the ``Supler.Form.getValue()`` method. The resulting JSON can
be sent to the server for processing.
The resulting JSON is what you might expect, mirroring the form's structure through objects, JSON arrays, nested
@@ -1,5 +1,5 @@
var formContainer = document.getElementById('form-container');
var form = new SuplerForm(formContainer, {
var form = new Supler.Form(formContainer, {
send_form_function: sendForm,
i18n: {
error_custom_lastNameLongerThanFirstName: "Last name must be longer than first name!",
View
@@ -1,23 +1,25 @@
class FieldTypes {
static STRING = 'string';
static INTEGER = 'integer';
static FLOAT = 'float';
static BOOLEAN = 'boolean';
static SELECT = 'select';
static SUBFORM = 'subform';
static STATIC = 'static';
static ACTION = 'action';
static META = 'meta';
}
module Supler {
export class FieldTypes {
static STRING = 'string';
static INTEGER = 'integer';
static FLOAT = 'float';
static BOOLEAN = 'boolean';
static SELECT = 'select';
static SUBFORM = 'subform';
static STATIC = 'static';
static ACTION = 'action';
static META = 'meta';
}
class SuplerAttributes {
static FIELD_TYPE = 'supler:fieldType';
static MULTIPLE = 'supler:multiple';
static FIELD_NAME = 'supler:fieldName';
static VALIDATION_ID = 'supler:validationId';
static PATH = 'supler:path';
}
export class SuplerAttributes {
static FIELD_TYPE = 'supler:fieldType';
static MULTIPLE = 'supler:multiple';
static FIELD_NAME = 'supler:fieldName';
static VALIDATION_ID = 'supler:validationId';
static PATH = 'supler:path';
}
class FormSections {
static META = 'supler_meta';
export class FormSections {
static META = 'supler_meta';
}
}
Oops, something went wrong.

0 comments on commit b8fbf31

Please sign in to comment.