Skip to content

Commit f8043ef

Browse files
curent javadoc and jsdoc
1 parent ac66577 commit f8043ef

File tree

5 files changed

+45
-45
lines changed

5 files changed

+45
-45
lines changed

content/CTG_40_platform/CTG_50_userinterface/CTG_30_externalobjects/LSN_10_basic/basic.md

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -4,9 +4,9 @@
44

55
It is an object that allows for customized interactions and behaviors within Simplicité. They are objects that you will implement to serve specific needs.
66

7-
In such objects you will be able to interact with Simplicité by using the [Ajax Library](https://platform.simplicite.io/6.2/jsdoc/index.html) to properly interact with the native part of your solution.
7+
In such objects you will be able to interact with Simplicité by using the [Ajax Library](https://platform.simplicite.io/current/jsdoc/index.html) to properly interact with the native part of your solution.
88

9-
There are several types of *External Objects*, that all serve a certain use-case of type of need:
9+
There are several types of *External Objects*, that all serve a certain use-case of type of need:
1010
- Basic
1111
- [UI page or component](/lesson/docs/platform/userinterface/externalobjects/uicomponent)
1212
- [Web-page](/lesson/docs/platform/userinterface/externalobjects/webpage)
@@ -30,7 +30,7 @@ The most used are:
3030
All **External Objects** are organized as web elements, thus are composed of 3 [resources](/lesson/docs/platform/userinterface/resources):
3131
- **HTML** is the resource containing the *html* code of your object that defines its core structure and organization.
3232
- **STYLES** is the resource containing the stylesheet (*css* or *less*) associated with your object's HTML.
33-
- **CLASS** is the resource with the javascript file inside of which you will code the behaviors and interactions for your External Object.
33+
- **CLASS** is the resource with the javascript file inside of which you will code the behaviors and interactions for your External Object.
3434

3535
And in addition, all external objects works with a **Java Class** that ensures both their proper setup, and the rendering of the web resources.
3636

@@ -56,14 +56,14 @@ The **Basic** nature refers directly to the mother class `com.simplicite.util.Ex
5656
- **Nature** shall be **Basic**.
5757
- **Module Name** for the module containing your external object.
5858
- **UI Widget** to **Yes** if your object can be added to a [dashboard](/lesson/docs/platform/userinterface/views/dashboard) and **No** otherwise.
59-
> Example values:
59+
> Example values:
6060
> <img src="basic_extobj_fields.png" alt="fields values" width="65%">
6161
4. Click **Save**.
62-
5. Click **Create Resources** to create the web-resources (html|css|js) for your object.
62+
5. Click **Create Resources** to create the web-resources (html|css|js) for your object.
6363
<img src="basic_resources.png" alt="web resources" width="65%">
6464

6565
6. (optional) Click **Edit Code** to generate the custom java class for your object.
66-
<details>
66+
<details>
6767
<summary>Default java code</summary>
6868

6969
```java
@@ -101,13 +101,13 @@ The **Basic** nature refers directly to the mother class `com.simplicite.util.Ex
101101
}
102102
}
103103
```
104-
</details>
105-
104+
</details>
105+
106106
7. Click **Save** and your object is ready to be implemented.
107107

108108
## Configuration
109109

110-
| Field | Description |
110+
| Field | Description |
111111
| ----- | ----------- |
112112
| Code | External Object's unique identifier |
113113
| Nature | Type of the External Object, here **UI page or component** |

content/CTG_40_platform/CTG_50_userinterface/CTG_30_externalobjects/LSN_20_uicomponent/uicomponent.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -337,7 +337,7 @@ There are several keypoints to understand and keep in mind while developing in t
337337

338338
### JS behavior
339339

340-
In the **CLASS** resource, you will write the JS script for your component's behavior. Here you will have the possibility to use both the [JSDoc](https://platform.simplicite.io/6.2/jsdoc/) for frontend operations direclty in the **CLASS** resource's script, and to make few calls to the *Java* code of your component to add custom server-side operations.
340+
In the **CLASS** resource, you will write the JS script for your component's behavior. Here you will have the possibility to use both the [JSDoc](https://platform.simplicite.io/current/jsdoc/) for frontend operations direclty in the **CLASS** resource's script, and to make few calls to the *Java* code of your component to add custom server-side operations.
341341

342342
> By default the only call from **CLASS** to **Java** is through `render()` that allows for your component's correct display and instantiation. But later on we'll see another method that allow for more custom calls: `service()`.
343343
@@ -352,7 +352,7 @@ Simplicite.UI.ExternalObjects.TestWebPage = class extends Simplicite.UI.External
352352

353353
The key concepts and understanding that you need are:
354354
- Every instantiation has to be within the ```async render(){ ... }```
355-
- You can work with Simplicité's API and core library using several entry points such as `$ui`, `$app` or `$grant` (documented in the [Ajax library](https://platform.simplicite.io/6.2/jsdoc/global.html)).
355+
- You can work with Simplicité's API and core library using several entry points such as `$ui`, `$app` or `$grant` (documented in the [Ajax library](https://platform.simplicite.io/current/jsdoc/global.html)).
356356
- You can manipulate most of the *BusinessObjects* and elements through the `BusinessObject.search( function() {...} )` method.
357357

358358
You may need to implement some behaviors and features specifically on the *server-side* (though in the java code). Such workflow is required when you don't want to share informations with the front (public) or you just want the calculations to be done by the backend.

content/CTG_40_platform/CTG_50_userinterface/CTG_30_externalobjects/LSN_50_staticsite/staticsite.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@ The creation process is similar to the one for any *External Object*:
3030
3131
## Usage
3232

33-
As a *Static Web Page* isn't interacting with Simplicité's API or backend, you only have the 3 resources to worry about. For the development specific to Simplicité refer to the [JSdoc](https://platform.simplicite.io/6.2/jsdoc/global.html).
33+
As a *Static Web Page* isn't interacting with Simplicité's API or backend, you only have the 3 resources to worry about. For the development specific to Simplicité refer to the [JSdoc](https://platform.simplicite.io/current/jsdoc/global.html).
3434

3535
> Specific use case and code examples can be found in the following lessons: [WebPage](/lesson/docs/platform/userinterface/externalobjects/webpage), [UI Component](/lesson/docs/platform/userinterface/externalobjects/uicomponent), [External Objects](/lesson/docs/platform/userinterface/externalobjects/basic).
3636
@@ -76,5 +76,5 @@ Simplicite.UI.ExternalObjects.TrnStaticPage = class extends Simplicite.UI.Extern
7676

7777
## Read More
7878

79-
- [JSDoc](https://platform.simplicite.io/6.2/jsdoc/global.html)
79+
- [JSDoc](https://platform.simplicite.io/current/jsdoc/global.html)
8080
- [StaticSiteExternalObject](https://platform.simplicite.io/current/javadoc/com/simplicite/webapp/web/StaticSiteExternalObject.html) (javadoc)

content/CTG_50_docs/CTG_25_front/LSN_30_javascript-dev/javascript-dev.md

Lines changed: 22 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -78,9 +78,9 @@ try
7878
catch (err) console.error(err.message);
7979
```
8080

81-
The rest of this example is focusing on a Native based web-page using basic web technologies: **HTML**, **CSS**, **JS**.
81+
The rest of this example is focusing on a Native based web-page using basic web technologies: **HTML**, **CSS**, **JS**.
8282

83-
### Basic Setup
83+
### Basic Setup
8484

8585
The first step to create your custom front with the NPM Simplicite library is the same as for most of other **Node.js** projects:
8686

@@ -92,19 +92,19 @@ The first step to create your custom front with the NPM Simplicite library is th
9292

9393
Once the basic setup for your Simplicité-powered project is installed, the next step is to *structure it* like any standard web project using **Node.js**. This typically results in the following file structure:
9494

95-
CustomNativeFront/
96-
&nbsp;&nbsp;&nbsp;&nbsp;public/
97-
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;style.css
98-
&nbsp;&nbsp;&nbsp;&nbsp;views/
99-
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;index.html
100-
&nbsp;&nbsp;&nbsp;&nbsp;app.js
101-
&nbsp;&nbsp;&nbsp;&nbsp;package.json
102-
95+
CustomNativeFront/
96+
&nbsp;&nbsp;&nbsp;&nbsp;public/
97+
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;style.css
98+
&nbsp;&nbsp;&nbsp;&nbsp;views/
99+
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;index.html
100+
&nbsp;&nbsp;&nbsp;&nbsp;app.js
101+
&nbsp;&nbsp;&nbsp;&nbsp;package.json
102+
103103

104104
- Place all *dynamically accessed* resources, such as stylesheets and scripts for specific pages, in the **public** folder (for now, this may only include `index.html`).
105105
- Store all your `.html` files representing *individual pages* in the **views** folder.
106106
- Your main javascript code (for project's setting up at least) will be written in the `app.js` file.
107-
107+
108108
> ***Note:*** Properly setting up and understanding why your project directory is organized this way is important to later properly implement your javascript code and ensure consistency throughout your project if you want to scale it.
109109
110110
### Javascript Code
@@ -170,7 +170,7 @@ const app = simplicite.session({
170170
- `url` defines the url for your Simplicité session, for most of the demos we use `https://demo.dev2.simplicite.io`.
171171
- `username` sets the username to access the session, ensure this is a valid one.
172172
- `password` sets the password to access the session, ensure it's the good one for your user and session.
173-
- `debug` defines if yes or not your session is used in debug mode.
173+
- `debug` defines if yes or not your session is used in debug mode.
174174
</details>
175175

176176
In the code, you’ll notice that your information can either be hardcoded with *string* values or secured by referencing a `.env` file created in your root directory. For this use case, the `.env` file might look like this:
@@ -213,7 +213,7 @@ server.use(express.static(dir + '/public'));
213213
<summary>Code Details</summary>
214214
215215
- `serverHost` and `serverPort` are instanciated either from your **.env** file, **command line arguments**, or **hardcoded values**, and defines the host *IP address* and *Port* where your app should run.
216-
- `const server = express()` creates an express application instance, that will handle incoming HTTP requests and also manage routes & responses.
216+
- `const server = express()` creates an express application instance, that will handle incoming HTTP requests and also manage routes & responses.
217217
- `server.disable('x-powered-by');` disables the specified header in HTTP responses, included for security reasons as it prevents revealing that app is runing on express (supposed to make it less vulnerable).
218218
- `const dir` stores the directory path for current module/file, converting the `import.meta.url` into a regular file path with `fileURLToPath()`, and extracting the directory part for this part using `dirname()`. It ensures the proper referencing of files relative to current **app.js** script.
219219
- `server.use()` serves static files from `/public` directory, and can be accessed by visiting `/filename` in browser. It enables frontend assets (images, stylesheets, additional scripts, ...).
@@ -370,12 +370,12 @@ The Simplicité JavaScript API repositories provide a wealth of examples and dem
370370
371371
# Core Javascript usages
372372
373-
**JavaScript development** in Simplicité plays a critical role in extending and customizing front-end functionalities. While Simplicité's core architecture is mainly *Java-based*, JavaScript is most frequently encountered in specific contexts, particularly in *External Objects* and *front-end development* scenarios. These use cases arise when there is a need to create specific, client-side behaviors or *integrate external components* into the Simplicité platform.
373+
**JavaScript development** in Simplicité plays a critical role in extending and customizing front-end functionalities. While Simplicité's core architecture is mainly *Java-based*, JavaScript is most frequently encountered in specific contexts, particularly in *External Objects* and *front-end development* scenarios. These use cases arise when there is a need to create specific, client-side behaviors or *integrate external components* into the Simplicité platform.
374374
375-
The *recurring use* of JavaScript in these contexts stems from its ability to:
376-
- Enhance user interaction with *responsive* front-end elements.
377-
- Provide flexibility in implementing custom *business logic* at the client level.
378-
- Seamlessly integrate *external libraries* or *APIs* that complement Simplicité’s core functionalities.
375+
The *recurring use* of JavaScript in these contexts stems from its ability to:
376+
- Enhance user interaction with *responsive* front-end elements.
377+
- Provide flexibility in implementing custom *business logic* at the client level.
378+
- Seamlessly integrate *external libraries* or *APIs* that complement Simplicité’s core functionalities.
379379
380380
By focusing on these key contexts, JavaScript development within Simplicité complements its Java-based backend, enabling a richer, more adaptable, and interactive front-end experience. Whether building custom components, enhancing default UI behaviors, or connecting external systems, JavaScript is an indispensable tool for unlocking the full potential of the Simplicité platform.
381381
@@ -388,7 +388,7 @@ The main utility for javascript development within Simplicité is the implementa
388388
The javascript development will happen within the *SCRIPT* resource of your *External Object*, and will allow you to do two things:
389389
390390
1) **Customized behaviors:** first, you are gonna be able to apply custom behaviors and interactions for your custom object
391-
2) **Communicate with Simplicité:** then, you will be able to make your widget even more interactive by allowing it to discuss in various ways
391+
2) **Communicate with Simplicité:** then, you will be able to make your widget even more interactive by allowing it to discuss in various ways
392392
393393
In this case, you can declare all your javascript code within the *SCRIPT* resource, make sure that you respect common rules and methodologies, so define your methods thoughfully, don't make redundant code, don't hesitate to document your code and make reusable functions in case you need it.
394394
@@ -497,7 +497,7 @@ public class MyExternalObject extends ExternalObject {
497497
498498
// Bootstrap page
499499
BootstrapWebPage wp = new BootstrapWebPage(params.getRoot(), getDisplay());
500-
500+
501501
wp.appendAjax();
502502
wp.appendJSInclude(HTMLTool.getResourceJSURL(this, "CLASS"));
503503
wp.appendCSSInclude(HTMLTool.getResourceCSSURL(this, "STYLES"));
@@ -537,9 +537,9 @@ var MyExternalObject = (function($) {
537537
```
538538

539539
***Code Overview:***
540-
- `var MyExternalPage = ...`, here the code is encapsulatied within a local variable in order to avoid polluting the global namespace.
540+
- `var MyExternalPage = ...`, here the code is encapsulated within a local variable in order to avoid polluting the global namespace.
541541
- `(function($) {...})(jQuery)` defines an immediately-invoked function expression receiving `jQuery` as an argument.
542-
- `new Simplicite.Ajax()` declares a new instance for the Simplicité session, with parameters `approot = ""` and `gateway = "uipublic"`. To make sure you are applying the right parameters, refer to [this part](https://platform.simplicite.io/6.1/jsdoc/Simplicite.Ajax.html) of the documentation.
542+
- `new Simplicite.Ajax()` declares a new instance for the Simplicité session, with parameters `approot = ""` and `gateway = "uipublic"`. To make sure you are applying the right parameters, refer to [this part](https://platform.simplicite.io/current/jsdoc/Simplicite.Ajax.html) of the documentation.
543543
- `function render(params) {...}` is the method called in the **Java code** to be executed when DOM is fully loaded (by `setReady()` method).
544544

545545
To keep on going with your javascript development with this setup, you just have to declare your functions in the encapsulated function, and make sure to call the functions using the correct namespace in your `.html` resource file. In our case if you declare a *sayHello* function in yoir javascript code, then you must call `MyExternalPage.sayHello` inside of your html file.

0 commit comments

Comments
 (0)