Prototypical ember-flexberry applications based on OData
You want to create a new ember-flexberry app. The installation details required to develop ember applications of tools can be found at the website EmberJS.com. Version ember-cli must match a supported version from the addon ember-flexberry (see section devDependencies version ember-cli).
ember new foo-bar-sample
cd foo-bar-sample
ember install ember-flexberry
To perform prototypical you should be available OData Feed that returns the metadata. To check the availability of metadata, you can use the browser, putting in the query string of the URL parameter $metadata. An example of such URL:
https://flexberry-ember-dummy.azurewebsites.net/odata/$metadata
After checking the availability of metadata, you can perform prototypical application with the command:
ember g flexberry-app-prototype --metadata-dir=vendor/Flexberry --odata-feed-url=https://flexberry-ember-dummy.azurewebsites.net/odata/
$metadata don’t.After the implementation of prototypization you can check that in the directory specified by the–metadata option -dir you have a file of the appropriate format that you can edit if necessary. Now you need to perform a full generation of ember-flexberry application on the basis of existing metadata (see below).
Rules of prototypical applications
Metadata for the OData v4 data description present, but no description of the visual component ember-flexberry applications. The data is designed to generate forms automatically generated by the following rules:
- Each model is created 2 forms:
- The list form. In the view list of forms submitted all the proper attributes, as well as the first string attribute of the master (a’s belongsto) of the first level. Decalogue relationships (hasMany) are ignored.
- Edit form. In the view to edit forms and add all your own attributes, the wizard (a’s belongsto) are added with the first string field (it will be used for completion in the component flexberry-lookup), also added all detaily (hasMany) of the first level.
- In the navigation tree and add all of the list forms.
Generate ember-flexberry applications based on metadata
Full generation app
Running the following command:
ember g flexberry-application app --metadata-dir=vendor/Flexberry
Generation forms
Generation models
Metadata format ember-flexberry
To generate the application ember-flexberry technology Blueprints, built in EmberJS uses a special kind of metadata. Are metadata files of a specific format that contains a description of the models, enums, forms, etc.. Metadata can be retrieved using CASE-tool-generated based on the OData metadata (in your OData metadata format, which does not have a description of the forms and other elements ember-flexberry applications). Metadata can be created by the user.
Generate ember-flexberry application is iterative, i.e. it is assumed that, first and foremost, change the metadata and that they contain the correct description of the structure of the application. After you change metadata re-generation of ember-flexberry application.
The directory structure metadata
The metadata may be located in any directory, but typically, they are placed in the folder vendor/flexberry/.
root folder- models
- foo.json
- counrty.json
- …
- enums
- sex.json
- state.json
- …
- application
- sitemap.json
- edit-forms
- foo-e.json
- country-e.json
- …
- list-forms
- foo-l.json
- country-l.json
- …
- schema-edit-form.json
- schema-enum.json
- schema-list-form.json
- schema-model.json
- schema-the sitemap.json
In the root directory contain files with the JSON schema to validate metadata.
Metadata models
Metadata models are in the directory models. Example metadata model:
{
"name": "ApplicationUser", // The full name of the class in CASE-tools.
"modelName": "application-user", // The name of the model in ember application.
"className": "ApplicationUser", // Short name of the class in CASE-tools.
"parentModelName": null, // Name of the parent model.
"parentClassName": null, //Name of parent class in CASE-tools.
"attrs": [ // Description of model attributes.
{
"name": "name", // Name of the attribute.
"type": "string", // The attribute type.
"flexberryType": "string", // The attribute type in CASE-tools.
"notNull": true, // Is it permissible for null values.
"defaultValue": "" // Value of the default attribute.
},
{
"name": "birthday",
"type": "date",
"flexberryType": "NullableDateTime",
"notNull": false,
"defaultValue": ""
},
{
"name": "gender",
"type": "gender", // Specify the ember-enumeration type
"flexberryType": "Gender",
"notNull": true,
"defaultValue": ""
}
],
"a's belongsto": [], // connection's belongsto (masters).
"hasMany": [], // hasMany (detali).
"projections": [ // Description of projections (views).
{
"name": "FriendsL",
"modelName": "application-user",
"attrs": [
{
"name": "name",
"caption": "Name",
"hidden": false,
"index": 0
}
],
"a's belongsto": [],
"hasMany": []
},
{
"name": "UserProfileE",
"modelName": "application-user",
"attrs": [
{
"name": "name",
"caption": "Name",
"hidden": false,
"index": 0
},
{
"name": "birthday",
"caption": "Birthday",
"hidden": false,
"index": 3
},
{
"name": "gender",
"caption": "Gender",
"hidden": false,
"index": 4
}
],
"a's belongsto": [],
"hasMany": []
}
]
}
Data transfers
An example of metadata is an enumerated type:
{
"nameSpace": "MonstersInc.MonsterEcm", // Namespace in CASE-tools.
"className": "Gender", // The class name in CASE-tools.
"enumObjects": { // Values of enumerated type.
"Male": "Male", // "Value": "Header"
"Female": "Female",
"Unknown": "Not specified"
}
}
Metadata application-level
Application-level metadata refers to the description of the navigation menu (sitemap.json). An example of such sitmap:
{
"applicationCaption": "My application",
"applicationTitle": "My application",
"items": [
{
"link": null,
"menuName": "my-application",
"caption": "My application",
"title": "My application",
"children": [
{
"link": "topics-l",
"menuName": null,
"caption": My themes,
"title": "The topics that I created",
"children": null
},
{
"link": "invites-l",
"menuName": null,
"caption": "Invitations",
"title": "Topics to participate in which invited me",
"children": null
},
{
"link": "friends-l",
"menuName": null,
"caption": "Friends",
"title": My friends,
"children": null
}
]
}
]
}
Metadata edit forms
For each form edit the application creates your metadata file. The file name of the metadata must match the name of future forms in the app. An example of a metadata editing form:
{
"propertyLookup": [],
"caption": "Friend",
"name": "UserProfileE",
"className": "UserProfileE",
"attrs": [],
"projections": [
{
"modelName": "application-user",
"modelProjection": "UserProfileE"
}
]
}
Metadata list forms
For each list form in the app is created your metadata file. The file name of the metadata must match the name of future forms in the app. Example metadata list form:
{
"newForm": "user-profile-e",
"editForm": "user-profile-e",
"caption": "Friends",
"name": "FriendsL",
"className": "FriendsL",
"attrs": [],
"projections": [
{
"modelName": "application-user",
"modelProjection": "FriendsL"
}
]
}
Development Blueprints-generators
When developing the Blueprint generator is used TypeScript. As a code editor for TypeScript is recommended to use Visual Studio Code with the configured Task-om compile TypeScript to JavaScript. For debugging you want to customize the configuration to a file launch.json. Example configuration for debugging:
{
"version": "0.2.0",
"configurations": [
{
"name": "Run",
"type": "node",
"request": "launch",
"program": "C:/Users/WindowsUserName/AppData/Roaming/npm/node_modules/ember-cli/bin/ember",
"stopOnEntry": false,
"args": [
"g",
"flexberry-app-prototype",
"--odata-feed-url=http://server:8080/odata"
],
"cwd": "D:/CodeGen/Samples/foo-bar-sample/",
"preLaunchTask": null,
"runtimeExecutable": null,
"runtimeArgs": [
"--nolazy"
],
"env": {
"NODE_ENV": "development"
},
"sourceMaps": true,
"console": "externalTerminal"
}
]
}