Name: example-requirejs-autosuggest-plugin
Owner: what3words
Description: null
Created: 2017-09-08 08:49:58.0
Updated: 2017-09-08 09:34:58.0
Pushed: 2017-09-08 09:34:57.0
Homepage: null
Size: 472
Language: JavaScript
GitHub Committers
User | Most Recent Commit | # Commits |
---|
Other Committers
User | Most Recent Commit | # Commits |
---|
Using requireJS with our jquery-autosuggest-plugin can be tricky; indeed we use jquery-typeahead and, it needs a special configuration, not like classic AMD modules.
This example is based on requireJS example loading jquery from a CDN.
You will be prompt for your W3W_API_KEY
to fully run the sample. You can sign up for an API key for free here.
Just serve up the www
folder using any web server you'd like.
For example, with Python:
$ cd www
$ python -m SimpleHTTPServer
ing HTTP on 0.0.0.0 port 8000 ...
www
??? css
? ??? flags.png
? ??? jquery.w3w-autosuggest-plugin.bundle.min.css
??? index.html
??? js
??? app
? ??? config.js
? ??? main.js
??? config.js
??? lib
? ??? jquery.w3w-autosuggest-plugin.js
? ??? jquery.w3w-autosuggest-plugin.min.js
? ??? require.js
??? vendor
??? jquery.typeahead.js
??? jquery.typeahead.min.js
For development/test purposes, the minified and non minified versions of the modules are provided
The main file of this setup is www/js/config.js
. It is loaded from index.html
by this line:
ipt data-main="js/config" src="js/lib/require.js"></script>
config.js
is mainly about path configuration. We point out the special paths to the application code, to the jquery-typeahead plugin and to the CDN for jQuery. Finally, the app main code is loaded at the bottom of the file:
irejs.config({
aseUrl': 'js/lib',
aths': {
'app': '../app',
'jquery': 'https://code.jquery.com/jquery-2.2.4.min',
'jquery-typeahead': '../vendor/jquery.typeahead.min'
oad the main app module to start the app
irejs(['app/main']);
app/main.js
is where the app logic is:
ne(['jquery', 'jquery-typeahead', 'jquery.w3w-autosuggest-plugin.min'], function($) {
the jquery-typeahead and jquery.w3w-autosuggest plugins have been loaded.
function() {
$('#w3w').w3wAddress({
key: 'YOUR-API-KEY',
validation: false
});
;
The MIT License (MIT)
A copy of the license is available in the repository's license file.