diff --git a/docz/docs/03-demos/30-cloud/03-oraclecloud.md b/docz/docs/03-demos/30-cloud/03-oraclecloud.md index a7141dc..c19e3f8 100644 --- a/docz/docs/03-demos/30-cloud/03-oraclecloud.md +++ b/docz/docs/03-demos/30-cloud/03-oraclecloud.md @@ -140,27 +140,27 @@ be processed before loading Oracle Visual Builder scripts. ## Business Objects -`Business Objects`[^2] in Oracle VBS provides a server-side model implementation +"Business Objects"[^2] in Oracle VBS provides a server-side model implementation for persistent data storage. -Think of them as a combination of a data model and database table that handles both data storage and -UI binding. +Think of them as a combination of a data model and database table that handles +both data storage and UI binding. ### Business Object Definition -#### Schema - The example [presidents sheet](https://docs.sheetjs.com/pres.xlsx) has a header row with "Name" and "Index" columns. In Oracle VBS, we model this as a Business Object with two fields. +#### Schema + Fields in Business Objects must have a specified type. A sample business object definition for the following schema is shown below: -| Field Label | Type | Field ID | -|:------------|:---------|:---------| -| Name | `string` | `name` | -| Index | `number` | `index1` | +| Field ID | Type | Field Label | +|:---------|:---------|:------------| +| `name` | `string` | Name | +| `index1` | `number` | Index | ```json title="Sample Business Object Definition" { "items" : [ { @@ -203,11 +203,13 @@ Fields are identified by Field ID. The field names do not appear in the result. #### Updating Business Object -Starting from a spreadsheet file, the SheetJS [`read`](/docs/api/parse-options) method parses the data into a workbook object. After -selecting a worksheet, [`sheet_to_json`](/docs/api/utilities/array#array-output) generates row objects that can be created as Business Object -records using the auto-generated REST API. +Starting from a spreadsheet file, the SheetJS [`read`](/docs/api/parse-options) +method parses the data into a workbook object. After selecting a worksheet, +[`sheet_to_json`](/docs/api/utilities/array#array-output) generates row objects. +Using the auto-generated REST API, new Business Object records can be created. -Here is a sample flow diagram and method for downloading a workbook, generating rows from the first worksheet, and updating a `Business Object`[^2]: +Here is a sample flow diagram and method for downloading a workbook, generating +rows from the first worksheet, and updating a Business Object[^2]: ```mermaid flowchart LR @@ -262,10 +264,13 @@ flowchart LR #### Rendering Data -In Oracle VBS, the table component `oj-table` supports direct binding to Business Objects for data display. -The view structure defines both the data source binding and column layout: +In Oracle VBS, the table component `oj-table`[^4] supports direct binding to +Business Objects for data display. The view structure specifies the data source +binding and column layout. -The following example uses the `Table`[^4] component to display data. +When using the design mode to add a Table, VBS will use a `ServiceDataProvider` +with columns based on the specified Endpoint Structure. The following view code +was generated when testing the ["Complete Example"](#complete-example): {`\
@@ -283,7 +288,6 @@ The following example uses the `Table`[^4] component to display data. `} - #### Exporting Business Objects The export functionality converts Business Object data into an Excel spreadsheet. The process involves retrieving data through @@ -307,100 +311,91 @@ flowchart LR linkStyle 2,3,4 color:blue,stroke:blue; ``` -{` - define(['vb/action/actionChain', 'vb/action/actions', 'xlsx'], (ActionChain, Actions, XLSX) => { - class ButtonActionChain1 extends ActionChain { - async run(context) { - // get pres data - const presDataResponse = await Actions.callRest(context, { - endpoint: 'businessObjects/getall_Pres', - parameters: { - fields: 'name,index1' - } - }); +{`\ +define(['vb/action/actionChain', 'vb/action/actions', 'xlsx'], (ActionChain, Actions, XLSX) => { + class ButtonActionChain1 extends ActionChain { + async run(context) { + // get pres data + const presDataResponse = await Actions.callRest(context, { + endpoint: 'businessObjects/getall_Pres', + parameters: { + fields: 'name,index1' + } + }); - // transform to simple array - const simplifiedData = presDataResponse.body.items.map(item => ({ - Name: item.name, - Index: item.index1 - })); + // transform to simple array + const simplifiedData = presDataResponse.body.items.map(item => ({ + Name: item.name, + Index: item.index1 + })); - // generate workbook - const ws = XLSX.utils.json_to_sheet(simplifiedData); - const wb = XLSX.utils.book_new(ws, "Presidents"); + // generate workbook + const ws = XLSX.utils.json_to_sheet(simplifiedData); + const wb = XLSX.utils.book_new(ws, "Presidents"); - // export to XLSX which triggers a download - XLSX.writeFileXLSX(wb, "SheetJSOracleVisualBuilderAoO.xlsx"); - } + // export to XLSX which triggers a download + XLSX.writeFileXLSX(wb, "SheetJSOracleVisualBuilderAoO.xlsx"); } - return ButtonActionChain1; - }); -`} + } + return ButtonActionChain1; +});`} -:::note pass - -Visual Builder Studio provides a visual development environment and handles the build and -deployment process automatically. - -::: - - ### Importing Data {#importing-data-snippet} -The import functionality enables data transfer from an Excel spreadsheet into your Oracle VBS -application. The process begins by fetching the XLSX file, parsing it using SheetJS, and then -creating corresponding Business Object records. +The import functionality enables data transfer from an Excel spreadsheet into +the Oracle VBS application. The process begins by fetching the XLSX file, +parsing it using SheetJS, and then creating corresponding Business Object records. -```javascript title="" +```js title="Importing Data code" define([ - 'vb/action/actionChain', - 'vb/action/actions', - 'vb/action/actionUtils', - 'xlsx' + 'vb/action/actionChain', + 'vb/action/actions', + 'vb/action/actionUtils', + 'xlsx' ], ( - ActionChain, - Actions, - ActionUtils, - XLSX + ActionChain, + Actions, + ActionUtils, + XLSX ) => { - 'use strict'; + 'use strict'; - class ButtonActionChain extends ActionChain { + class ButtonActionChain extends ActionChain { - /** - * @param {Object} context - */ - async run(context) { - const { $page, $flow, $application, $constants, $variables } = context; + /** + * @param {Object} context + */ + async run(context) { + const { $page, $flow, $application, $constants, $variables } = context; - // fetch XLSX file - const url = "https://docs.sheetjs.com/pres.xlsx"; - const data = await (await fetch(url)).arrayBuffer(); - const wb = XLSX.read(data); + // fetch XLSX file + const url = "https://docs.sheetjs.com/pres.xlsx"; + const data = await (await fetch(url)).arrayBuffer(); + const wb = XLSX.read(data); - // get the first worksheet - const ws = wb.Sheets[wb.SheetNames[0]]; + // get the first worksheet + const ws = wb.Sheets[wb.SheetNames[0]]; - // convert to json - const jsonData = XLSX.utils.sheet_to_json(ws); + // convert to json + const jsonData = XLSX.utils.sheet_to_json(ws); - // process each row and create business object records - for (const row of jsonData) { - const presData = { - name: row.Name, - index1: Number(row.Index) - }; + // process each row and create business object records + for (const row of jsonData) { + const presData = { + name: row.Name, + index1: Number(row.Index) + }; - // create a business object record - await Actions.callRest(context, { - endpoint: 'businessObjects/create_Pres', - body: presData - }); - } - } + // create a business object record + await Actions.callRest(context, { + endpoint: 'businessObjects/create_Pres', + body: presData + }); + } } - return ButtonActionChain; + } + return ButtonActionChain; }); ``` @@ -410,52 +405,52 @@ The export functionality allows you to convert Business Object data into Excel s This process involves retrieving data from the Business Object using REST API calls, transforming it into a format suitable for SheetJS, and generating an XLSX file. -```javascript +```js title="Exporting Data code" define([ - 'vb/action/actionChain', - 'vb/action/actions', - 'vb/action/actionUtils', - 'xlsx' + 'vb/action/actionChain', + 'vb/action/actions', + 'vb/action/actionUtils', + 'xlsx' ], ( - ActionChain, - Actions, - ActionUtils, - XLSX + ActionChain, + Actions, + ActionUtils, + XLSX ) => { - 'use strict'; + 'use strict'; - class ButtonActionChain1 extends ActionChain { + class ButtonActionChain1 extends ActionChain { - /** - * @param {Object} context - */ - async run(context) { - const { $page, $flow, $application, $constants, $variables } = context; - - // get pres data - const presDataResponse = await Actions.callRest(context, { - endpoint: 'businessObjects/getall_Pres', - parameters: { - fields: 'name,index1' - } - }); - - // transform to simple array - const simplifiedData = presDataResponse.body.items.map(item => ({ - Name: item.name, - Index: item.index1 - })); - - // generate workbook - const ws = XLSX.utils.json_to_sheet(simplifiedData); - const wb = XLSX.utils.book_new(ws, "Presidents"); - - /* export to XLSX */ - XLSX.writeFileXLSX(wb, "SheetJSOracleVisualBuilderAoO.xlsx"); + /** + * @param {Object} context + */ + async run(context) { + const { $page, $flow, $application, $constants, $variables } = context; + // get pres data + const presDataResponse = await Actions.callRest(context, { + endpoint: 'businessObjects/getall_Pres', + parameters: { + fields: 'name,index1' } + }); + + // transform to simple array + const simplifiedData = presDataResponse.body.items.map(item => ({ + Name: item.name, + Index: item.index1 + })); + + // generate workbook + const ws = XLSX.utils.json_to_sheet(simplifiedData); + const wb = XLSX.utils.book_new(ws, "Presidents"); + + /* export to XLSX */ + XLSX.writeFileXLSX(wb, "SheetJSOracleVisualBuilderAoO.xlsx"); + } - return ButtonActionChain1; + } + return ButtonActionChain1; }); ``` @@ -468,78 +463,211 @@ Visual Builder Studio access. ::: -0. If you do not have an account create a new Oracle Cloud free tier account[^3]. +0. If you do not have one, create a new Oracle Cloud free tier account[^3]. + +1. Sign in to the [Oracle Cloud Management Console](https://cloud.oracle.com/). ### Visual Builder Setup -1. Sign in to the [Oracle Cloud Management Console](https://cloud.oracle.com/) with your created account. +:::note pass -2. Type "Visual Builder Studio" in the top search box and click Visual Builder Studio (under services). +In this section, we will configure VBS and create a new instance. + +::: + +2. Type "Visual Builder Studio" in the top search box and click "Visual Builder +Studio" in the "Services" section. ![Oracle Cloud search for "Visual Builder Studio"](pathname:///oraclecloud/search_box_visual_builder.png) -3. Before creating Visual Builder Studio Instances we need to create an instance. Click `Visual Builder` in the left sidebar, ensure a Compartment is selected in the dropdown, and click "Create Instance". +3. Click `Visual Builder` in the left sidebar. In the "List scope" section, if +no Compartment is selected, click the dropdown and select a Compartment. + +!["Visual Builder" create instance](pathname:///oraclecloud/create_new_instance.png) + +4. Click "Create Instance". + +In the Create Instance panel, enter the following options: + +- Name: `sheetjs-demo-vb-instance` +- Nodes: `1` (it cannot be changed in a Free account) +- Choose network access: `Default (No access rules.)` + +The panel should look like the following screenshot: ![Create Visual Builder Instance](pathname:///oraclecloud/create_vb_instance.png) -- Give it a name: `sheetjs-demo-vb-instance` -- Select network access: `Default (No access rules.)` -- Nodes: `1` +5. Click "Create Visual Builder Instance". The panel will close. -4. Now click `Visual Builder Studio` from the left sidebar and click `Create Visual Builder Studio` and give it instance name: `sheetjs-vbs-instance` and click next and set - select compartment to `yourusername (root)`. Lastly, click `Create Visual Builder Studio` (this will take 5-15 minutes to fully setup). +The instances table will include a new row for `sheetjs-demo-vb-instance`. When +the instance is ready, the status will change to "ACTIVE". -- Click link name `sheetjs-vbs-instance` +![Instance is ready](pathname:///oraclecloud/instances_table_ready.png) -5. Click `Service Console` create a new project and fill it with the following inputs. +6. Click "Visual Builder Studio" in the left sidebar. -- Project Details: `sheetjs-demo-project` -- Project Template: `Empty Project` -- Project Properties: `Markdown` -- Click Finish +7. Click "Create Visual Builder Studio" in the main area. -6. Select `Project Home` from the left sidebar and create an environment. -- Environment Name: `sheetjs-demo-env` -- Click Create -- Click `Add Instance` +In the Create Visual Builder Studio Instance panel, type `sheetjs-vbs-instance` +in the Instance Name textbox and click "Next" + +In the "CI/CD Setup" page, ensure "Yes, I authorize this" is checked. Select the +compartment in the dropdown and click `Create Visual Builder Studio`. + +You will be redirected to the instance page. + +8. Wait for the instance to be completed. The large circle will be green. + +![VBS Instance is ready](pathname:///oraclecloud/instance_green.png) + +9. Click `Service Console`. You will be redirected to the organization page. + +10. Scroll down and select the "Projects" tab. Click the "+ Create" button to +create a new project. The "New Project" wizard has 4 steps: + +- In "Project Details", enter the Name `sheetjs-demo-project` and click "Next" + +- In "Project Template", select `Empty Project` and click "Next" + +- In "Project Properties" page, select `Markdown` and click "Next" + +- Click "Finish" (by default, the current user will be the "Project Owner") + +You will be redirected to a provisioning page while resources are allocated: + +![Provisioning page](pathname:///oraclecloud/provisioning.png) + +Once allocated, you will be redirected to the project page. + +11. Click "⌂ Project Home" in the left sidebar and click "+ Create Environment". + +In the popup, type `sheetjs-demo-env` in the "Environment Name" text box and +click "Create". You will be redirected to the Environments page. + +12. Click `+ Add Instance`. In the modal, select the following: + +- Instance Type: "Visual Builder and Oracle Integration" +- Add Instance Using: "Instance List" +- Check the box in the `sheetjs-demo-vb-instance` table row. + +The selections should match the following screenshot: ![Connect instance to environment](pathname:///oraclecloud/env_connect_to_instance.png) -7. In Environments select the Service Instances tab and search for `Instance URL` if not shown click details to expand Visual Builder `sheetjs-demo-vb-instance` and open `Instance URL` - This will open Visual Builder Studio. +After making the selections, click "Add". Once the instance is created, there +will be a checkmark next to `sheetjs-demo-env` in the main area. -8. Click `New Application` and set +![Instance created](pathname:///oraclecloud/instance_created.png) + +13. Select the "Service Instances" tab and find the `sheetjs-demo-vb-instance` +card. If "Instance URL" is not shown, click "Details" to show the URL. + +![Environment card](pathname:///oraclecloud/env_card.png) + +Click the "Instance URL". Visual Builder will be launched in a new window. + +14. Click "+ New Application". In the popup, enter the following options: - Application Display Name: `sheetjs-vbs-demo` -- Application Template: `Empty Application` -- Click Finish +- Application Name: `sheetjs_vbs_demo` (automatic) +- Application Template: `Empty Application` (default) -9. Create a new Business Object by clicking **Business Object** card in the Welcome tab or from the sidebar as shown - ![Create a new Business Object](pathname:///oraclecloud/create_business_object.png) +Click "Finish". After a short wait, the browser will redirect to the new app. + +### Business Object Setup + +:::note pass + +In this section, we will create a new Business Object. + +::: + +15. Click the **Business Objects** card in the Welcome tab or the "**⛁**" icon +in the left sidebar. The "Business Objects" panel will be displayed. + +![Create a new Business Object](pathname:///oraclecloud/create_business_object.png) + +Click "+ Business Object". In the popup, enter the following: - Name: `Pres` -- Display: `President` +- Display Label: `President` -10. Click `Pres` Business Object and select Fields tab. Then, create a new field by clicking the `+Fields` button and select first drop-down `Field`. +Click "Create". You will be redirected to the Business Object page. -- Label1: `Name` -- Type1: Click `A` (`String`) +16. Select `Pres` in the Business Objects panel and select the "Fields" tab. -- Label2: `Index` -- Type2: Click `#` (`Number`) +![Business Object - Fields](pathname:///oraclecloud/business_object_fields.png) + +17. Click "+ Field" and select "Field" in the dropdown. In the displayed form, +enter the following options: + +- Label: `Name` +- Type: Click `A` (`String` will be displayed next to Type) + +Click "Create Field". + +18. Click "+ Field" and select "Field" in the dropdown. In the displayed form, +enter the following options: (we are creating a second field) + +- Label: `Index` +- Type: Click `#` (`Number` will be displayed next to Type) + +Click "Create Field". + +19. Scan the main table and verify that two new rows were added: ![Add two new fields](pathname:///oraclecloud/creating_new_fields_name_index.png) -11. Click 🖥️ Web Applications from the left sidebar and create a new Web Application by clicking `+Web Application` - You should have the following fields. +### Web App Creation + +:::note pass + +In this section, we will create a new web application. + +::: + +20. Click "🖥️ Web Applications" in the left bar and click "+ Web Application". +In the popup, enter the following options: - Application Name: `sheetjs_demo_app` - Navigation Style: `None` -- Click Create -12. [Adding SheetJS Module](#installation) to the App Click 📄 `Source` from the left sidebar and paste the following on `webApps/sheetjs_demo_app/app-flow.json` +Click "Create". You will be redirected to the page designer. -{`\ +:::note pass + +If prompted to share clipboard, select "Allow". + +::: + +### SheetJS Alias + +:::note pass + +In this section, we will create an alias to the SheetJS standalone script hosted +on the [SheetJS CDN](/docs/getting-started/installation/standalone) + +::: + +21. Click 📄 `Source` from the left sidebar. + +22. In the file tree, if `app-flow.json` is not visible, click the triangle next +to `sheetjs_demo_app` to expand the folder. + +:::caution pass + +Clicking on the `sheetjs_demo_app` name has no effect! You must click the +triangle next to the label to expand the folder. + +::: + +23. Select `app-flow.json` within the `sheetjs_demo_app` folder. + +A new code window will be displayed in the main area. + +24. Copy the following codeblock and insert it after line 5 in the code editor: + +{`\ "requirejs": { "paths": { "xlsx": "https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.full.min" @@ -548,64 +676,171 @@ Visual Builder Studio access. `} +The following screenshot shows the result after inserting the code: + ![Adding Sheetjs to the web application](pathname:///oraclecloud/adding_sheetjs_to_app.png) +### App Interface -13. Let's create the UI for our application we will be creating a table and two buttons one for import XLSX and one for export XLSX. +:::note pass -- From the left sidebar click the 🖥️ `Web Applications` and select `main-start` -- Select Page Designer and drag and drop two `Button` components and one `Table` Component to the canvas +In this section, we will create the UI for the application. It will include two +buttons for import/export and a table for displaying data. -![Darg and drop ui components to canvas](pathname:///oraclecloud/drag_drop_components_to_canvas.png) +::: -14. Creating our button event handler -- Now select the left button in the canvas and on the right side on `General` tab set ID to `import-xlsx` and label to `Import XLSX`. -- Now select the `Events` tab and click `+ Event Listener` drop down button and select `On 'ojAction'` -- Now it should auto-select `Action Chains` if not click from top tab option. -- Switch from `Design` to `Code` from top right +25. Click "🖥️ Web Applications" in the left sidebar. + +26. In the tree, if `main-start` is not visible, click the triangle next to +`main` to expand the folder. + +:::caution pass + +Clicking on the `main` name does not expand the tree! You must click the +triangle next to the label to expand the subtree. + +::: + +27. Select `main-start` within the `main` section. + +28. Select the "Page Designer" tab and select the "Design" tab. + +In the page designer, drag and drop two `Button` components and one `Table` +Component to the canvas. + +:::caution pass + +The "Table" component is in the "Collections" section. Do not add a "Dynamic Table"! + +::: + +![Drag and drop UI components to canvas](pathname:///oraclecloud/drag_drop_components_to_canvas.png) + +### Actions Setup + +:::note pass + +In this section, we will add event handlers for the import and export buttons. + +::: + +29. Select the first button in the canvas. + +30. In the right panel, select the "General" tab. Enter the following details: + +- ID: `import-xlsx` +- Label: `Import XLSX` + +Press Enter after typing the label. The canvas will refresh. + +31. Select the "Events" tab and click "+ Event Listener". In the dropdown, click +`🔔 On 'ojAction'`. + +32. Click "Action Chains" in the top bar (next to "Page Designer"). + +33. Select "Code" in the top-right tab. ![Switch from Design to Code in Action Chains for the button](pathname:///oraclecloud/action_chain_select_code.png) -15. Replace `Action Chains > ButtonActionChain > Code` with the importing data snippet in the - ["Importing Data"](#importing-data-snippet) example code. +The main area will show a code editor. -16. Now repeat step 14 for the second button -- Now select the first button in the canvas and on the right side on `General` tab set ID to `export-xslx` and label to `Export XLSX`. -- Now select the `Events` tab and click `+ Event Listener` drop down button and select `On 'ojAction'` -- Now it should auto-select `Action Chains` if not click from top tab option. -- Switch from `Design` to `Code` from top right +34. Copy the ["Importing Data code"](#importing-data-snippet) example code and +paste in the code editor. -17. Replace `Action Chains > ButtonActionChain1 > Code` with the exporting data snippet in the - ["Exporting Data"](#exporting-data-snippet) example code. +35. Click "Page Designer" to return to the page designer. -18. Connect the Business Object `Pres` to the table. -- Now select `Page Designer` and in the canvas select the table component from the right sidebar select `Quick Start` and then `Add Data` -- This opens up a modal on `Choose the source of your data` select `Pres` Business Object and click next. +36. Select the second button in the canvas (not the "Import XLSX" button!) + +37. In the right panel, select the "General" tab. Enter the following details: + +- ID: `export-xlsx` +- Label: `Import XLSX` + +Press Enter after typing the label. The canvas will refresh. + +38. Select the "Events" tab and click "+ Event Listener". In the dropdown, click +`🔔 On 'ojAction'`. + +39. Click "Action Chains" in the top bar (next to "Page Designer"). + +40. Select "Code" in the top-right tab. + +41. Copy the ["Exporting Data code"](#exporting-data-snippet) example code and +paste in the code editor. + +### Data Binding + +:::note pass + +In this section, we will connect the `Pres` Business object to the Table. + +::: + +42. Click "Page Designer" to return to the page designer. + +43. Select the Table component in the canvas. + +44. In the right panel, select the "Quick Start" tab and click "Add Data". ![Connecting Business Object Pres to the table](pathname:///oraclecloud/connecting_business_object.png) -- On Bind Data step 2 from the left sidebar named `Endpoint Structure` check box `name` and `index1` then click next and lastly click finish. +45. Complete the "Add Data" wizard: + +- In "Choose the source of your data", select "Pres" in the "Business Objects" +section and click "Next". + +- In the next section ("Bind Data"), check the box next to `name` and the box +next to `index1`. After confirming the page looks like the following screenshot, +click "Next". ![Bind columns to field name and index1](pathname:///oraclecloud/bind_columns_to_fields_name_index1.png) -19. Testing the Application - - a) Launch the Preview: - - Look for the Play (▶️) icon in the top-right corner of the Visual Builder Studio - - Click it to open your application in a new browser tab - - b) Test the Import Function: - - In the preview tab, click the "Import XLSX" button - - Navigate back to Visual Builder Studio - - Select the `Pres` business object - - Click the "Data" tab - - Verify that new records have been created with the president names and index - - Return to your application preview tab - - Refresh the page - - You should now see the table populated with the imported president data - - c) Test the Export Function: - - Click the "Export XLSX" button - - This will trigger an automatic download of a file named "SheetJSOracleVisualBuilderAoO.xlsx" - - Open the downloaded file using a spreadsheet editor. - - Verify that the exported data matches what was displayed in your application's table +- In the next section ("Define Query") click "Finish". + +### App Testing + +:::note pass + +In this section, we will test import and export functionality. + +::: + +46. Click the Preview button (▶️ icon) in the top-right corner of the page. + +The application will be launched in a new browser tab. + +47. Click "Import XLSX". + +48. Switch back to the Visual Builder window. + +49. Click the "⛁" icon in the left sidebar and click the "Pres" Business Object. + +50. Switch to the "Data" tab and verify that new data has been added. + +:::caution pass + +In some test runs, no data was added. + +Repeat the ["SheetJS Alias"](#sheetjs-alias) steps and confirm the alias exists. + +If the alias is missing, add the alias and launch a new Preview window. + +::: + +![Expected data for Pres Business Object](pathname:///oraclecloud/pres_data.png) + +51. Switch back to the "Preview" window and refresh the page. + +The preview will now show the data from the "Pres" Business Object. + +![Preview of Pres Business Object](pathname:///oraclecloud/pres_preview.png) + +52. Click the "Export XLSX" button. + +The app will attempt to download `SheetJSOracleVisualBuilderAoO.xlsx` + +Save the file and open with a spreadsheet editor. Confirm the spreadsheet +matches the data shown in the app. [^1]: See ["Oracle Visual Builder Studio"](https://docs.oracle.com/en/cloud/paas/visual-builder/) in the Oracle Cloud documentation. [^2]: See ["Work With Business Objects"](https://docs.oracle.com/en/cloud/paas/visual-builder/visualbuilder-building-applications/working-business-objects1.html) in the Oracle Visual Build Studio documentation. diff --git a/docz/docs/03-demos/42-engines/02-v8.md b/docz/docs/03-demos/42-engines/02-v8.md index 8fb62e0..6def59d 100644 --- a/docz/docs/03-demos/42-engines/02-v8.md +++ b/docz/docs/03-demos/42-engines/02-v8.md @@ -1081,7 +1081,7 @@ curl -L -o src/main.rs https://docs.sheetjs.com/v8/main.rs There was a breaking change in version `0.102.0` affecting `v8::Context::new`. When targeting older versions of the crate, remove the second argument: -```rs title="src/main.rs" +```rust title="src/main.rs" let context = v8::Context::new(handle_scope); // v8 <= 0.101.0 //let context = v8::Context::new(handle_scope, Default::default()); // v8 >= 0.102.0 ``` diff --git a/docz/static/oraclecloud/business_object_fields.png b/docz/static/oraclecloud/business_object_fields.png new file mode 100644 index 0000000..b23f5e9 Binary files /dev/null and b/docz/static/oraclecloud/business_object_fields.png differ diff --git a/docz/static/oraclecloud/create_new_instance.png b/docz/static/oraclecloud/create_new_instance.png new file mode 100644 index 0000000..28152be Binary files /dev/null and b/docz/static/oraclecloud/create_new_instance.png differ diff --git a/docz/static/oraclecloud/env_card.png b/docz/static/oraclecloud/env_card.png new file mode 100644 index 0000000..ba28f6d Binary files /dev/null and b/docz/static/oraclecloud/env_card.png differ diff --git a/docz/static/oraclecloud/instance_created.png b/docz/static/oraclecloud/instance_created.png new file mode 100644 index 0000000..3a56f02 Binary files /dev/null and b/docz/static/oraclecloud/instance_created.png differ diff --git a/docz/static/oraclecloud/pres_data.png b/docz/static/oraclecloud/pres_data.png new file mode 100644 index 0000000..c4bfdff Binary files /dev/null and b/docz/static/oraclecloud/pres_data.png differ diff --git a/docz/static/oraclecloud/pres_preview.png b/docz/static/oraclecloud/pres_preview.png new file mode 100644 index 0000000..9f2e237 Binary files /dev/null and b/docz/static/oraclecloud/pres_preview.png differ