Folder Structure and Library Files

The MVC folder structure of our validation application extends the structure of the minimal application by adding a lib folder containing the generic code libraries browserShims.js, errorTypes.js, and util.js.

As a result, we get the following folder structure:

publicLibrary
 css
   main.css
   normalize.min.css
 lib
   browserShims.js
   errorTypes.js
   util.js
 src
   c
   m
   v
 index.html

We discuss the contents of the added files in the following sub-sections.

General utility functions and library files fixes

We add three library files to the lib folder:

1. browserShims.js: This contains a definition of the string trim function for older browsers that don’t support this function (which was only added to JavaScript in ES5, defined in 2009). More browser shims for other recently defined functions, such as querySelector and classList, could also be added to browserShims.js.

2. util.js: This contains the definitions of a few utility functions such as isNonEmptyString(x) to test if x is a non-empty string.

3. errorTypes.js: This defines classes for error (or exception) types that correspond to the basic types of [property constraints], listed as follows: (https://www.educative.io/collection/page/10370001/5397377793392640/5644866681307136):

   • StringLengthConstraintViolation
   • MandatoryValueConstraintViolation
   • RangeConstraintViolation
   • IntervalConstraintViolation
   • PatternConstraintViolation
   • UniquenessConstraintViolation

In addition, a class NoConstraintViolation is defined to allow us to return a validation result object in the case of no constraint violation.

The start page

The start page index.html takes care of loading CSS page styling files with the help of the following two link elements:

<link rel="stylesheet" href="css/normalize.min.css">
<link rel="stylesheet" href="css/main.css">

Then it loads the following JavaScript files:

1. browserShims.js and util.js from the lib folder.

2. errorTypes.js from the lib folder, a file that defines exception classes.

3. initialize.js from the src/c folder, a file that defines the app’s MVC namespaces.

4. Book.js from the src/m folder, a model class file that provides data management and other functions.

You can click the “Run” button below to launch the application. The view and model code does not have the constraint validation in place yet.

Note: We’ve added an Edition column but its entries do not show up on the retrieve view. This is because we haven’t updated the view code yet. You can check out the src/v/retrieveAndListAll.js file and notice that we’re only retrieving isbn, title, and year for now.