Scribd
Upload
393 views

Importing and Using Javascript Libraries in Your Visual Builder Custom Code

This document discusses how to import and use external JavaScript libraries in Oracle Visual Builder custom code. It uses the glmatrix library as an example. The library needs to be imported as a zip file at the App, Flow, or Page level. It can then be referenced in custom code using a define statement that specifies the import path and alias. This allows using the functions, objects and variables from the imported library.

Uploaded by

Vijay Gupta
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
393 views

Importing and Using Javascript Libraries in Your Visual Builder Custom Code

This document discusses how to import and use external JavaScript libraries in Oracle Visual Builder custom code. It uses the glmatrix library as an example. The library needs to be imported as a zip file at the App, Flow, or Page level. It can then be referenced in custom code using a define statement that specifies the import path and alias. This allows using the functions, objects and variables from the imported library.

Uploaded by

Vijay Gupta
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 5

Importing and Using Javascript libraries in your Visual Builder custom c... https://blogs.oracle.com/vbcs/importing-and-using-javascript-libraries-in...

Oracle Visual Builder Cloud Service Blog


MENU

Oracle Visual Builder Cloud Service Blog

Try Oracle Cloud Platform


For Free

ORACLE VISUAL BUILDER CLOUD SERVICE

June 27, 2018

Importing and Using Javascript


libraries in your Visual Builder
custom code
JT Thomas
DIRECTOR OF PRODUCT MANAGEMENT

In a recent post, I shared the prescriptive model for


creating custom code within Visual Builder. Namely,
using Javascript modules at the App, Flow, or Page
level to create custom functions within the module. In
this post, I want to talk about importing and using
external Javascript libraries so you can use functions,
objects and variables within that library.

For this example, I will use the glmatrix library, a


collection of Vectors, Matrices, and associated linear

1 of 5 9/2/2019, 6:55 PM
Importing and Using Javascript libraries in your Visual Builder custom c... https://blogs.oracle.com/vbcs/importing-and-using-javascript-libraries-in...

algebra operations. These types of operations can be


used for more than just graphics so they live in their
own library. The glmatrix library is provided in a "min"
format. Essentially one free of whitespace and
newline characters and in one file.

So, the library I am importing is the glmatrixmin.js


library which can be downloaded from the "dist"
directory within the project github
page: https://github.com/toji/gl-matrix/tree/master/dist.

First, you'll need to import the library into your project.


With Visual Builder, you can import resources at each
of the levels, App, Flow, and Page and that resource
will be accessible via that path. To import the file, right
click on the project App, Flow, or Page node and
select Import Resource.

The resource needs to be uploaded as a zip file. So


compress the glmatrixmin.js into a zip and select it
from your files system in the Import Resources dialog.
The dialog will show the import location. Remember
this as this is how we reference the file later.

2 of 5 9/2/2019, 6:55 PM
Importing and Using Javascript libraries in your Visual Builder custom c... https://blogs.oracle.com/vbcs/importing-and-using-javascript-libraries-in...

Now the file is imported, you can see it in your code


view under the Resources folder of the "main" Flow
within which it was imported.

Now, we can write some custom code in our


PageModule and reference the file to load it into our

3 of 5 9/2/2019, 6:55 PM
Importing and Using Javascript libraries in your Visual Builder custom c... https://blogs.oracle.com/vbcs/importing-and-using-javascript-libraries-in...

module. To do that we use a define statement, which


provides the path to the file and the alias with which
we will refer to the imported library in our code.

See the below code example, for the define


statement and usage. The full path to the file is used
combining the import location with the flow name and
resources directory. Note, the .js file extension is not
necessary. Also, note the alias "glmatrix" is used to
reference the objects and functions within the library.

Join the discussion

Comments ( 3 )

4 of 5 9/2/2019, 6:55 PM
Importing and Using Javascript libraries in your Visual Builder custom c... https://blogs.oracle.com/vbcs/importing-and-using-javascript-libraries-in...

Recent Content

ORACLE VISUAL BUILDER CLOUD ORACLE VISUAL BUILDER CLOUD


SERVICE SERVICE
Complex Queries in Visual Builder Adventures in Mutation - Adding
Rows to a Table or ListView in Oracle
Often, you have to filter a data set
Visual Builder
based on multiple search criteria
like in the above image. In this
case, you want to only create...

Site Map Legal Notices Terms of Use Privacy Cookie Preferences Ad Choices
Oracle Content Marketing Login

5 of 5 9/2/2019, 6:55 PM

You might also like