Search UI

This is a purely Front End project ( only static files ).

The only dependencies you need is NodeJS and Gulp installed.

NodeJS: https://nodejs.org/en/download/

Gulp: npm install -g gulp

To Get Started:

• Check out the repo locally
• run npm install inside the directory. (You only have to do this once)

Running the project:

Inside the directory run:

gulp

There are several options when using gulp, to list them, run:

gulp --help

Running with Remote API:

You can point the API requests at client-test enviroment by using the following flag:

gulp --remote

or shorthand:

gulp -r

Running with Local API:

By default the project runs pointing at your local API: https://amatravel.localhost

You can point the front end to use any API url you like by using the following:

gulp --api http://amatravel.localhost

Which will point all API requests at the specified url.

Running with certain Feature Toggles enabled:

By default the project runs using the feature settings specified in config/features.js

If you would like to override one of the feature toggles at runtime, you can enable features by doing:

gulp --features sponsoredListings,feature2,feature3

or shorthand:

gulp -f sponsoredListings,feature2,feature3

!~! WARNING !~! Features must be comma seperated, and no spaces between them.

Generating the Docs:

Gulp can automatically generate JS/HTML doc files from the source code. This is useful for when you want to read through some source code in a annotated and user friendly way.

We currently use docker.js for this, you can learn more here: docker.js docs

To generate and view the docs, run:

gulp docs

This will generate docs for any .js or .html file in the app/ directory. After docs are generated it will automatically open a tab with the generated docs. Any subsequent changes to .js or .html files will auto regenerate the associated doc file and refresh the browser, showing the updated doc.

Disabling the proxy:

The project runs with NodeJS proxying all API requests to the desired api url.

You can disable the proxy and point the front end directly at the api url by running:

gulp --dontproxy

or shorthand:

gulp -d

Building the project:

To build the project, which puts all built files into dist/ run the following:

gulp build

This will:

• minify all javascript files
• optimize all image files
• minify css files
• remove all console.log in the code

Running with locally linked common and styleguide repo's:

By default NPM downloads common and styleguide as normal npm packages.

If you would like to work on something in common or styleguide and see the results instantly inside of search-ui you need to locally link the NPM projects.

To do so, download both common and styleguide repo's locally. In each directory run:

npm link

This will give you an output similar to:

/usr/local/lib/node_modules/styleguide -> /Users/qrpike/tst/styleguide

We only need the 2nd part. Go into the search-ui directory and run the following:

npm link /Users/qrpike/tst/styleguide

Now NPM symlinks the npm package to your local copy so all changes are instantly seen inside of search-ui project. You need to do this for both common and styleguide repos.

More details and documents to come...