Skip to content

Instantly share code, notes, and snippets.

@ptgamr
Last active August 29, 2015 14:18
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save ptgamr/d43bdd11225b9ee3c68d to your computer and use it in GitHub Desktop.
Save ptgamr/d43bdd11225b9ee3c68d to your computer and use it in GitHub Desktop.
vbus-widget.js

VBUS search widget

  • The widget should be allocated a space to put the search box
  • The search action will open up a modal, which contains result
  • Initialization code should be easy
  • Widget's markup should be namespaced with vbusvn- to avoid conflict with current page
<script type="text/javascript" src="http://vbus.vn/vbus-widget.js"></script>
...
<div id="vbus-vn-search-widget"></div> <!-- the place where the widget put content -->

Script loader

  • Download scripts
  • Download css (seperate css for widget)

Search box

  • JSONP (list of countries)
  • Build search box
  • Select2 plugin
  • Date picker
  • Bind actions

Search result (after click search button):

  • Open the modal
  • JSONP call to get the result
  • Display it

Reference links

http://alexmarandon.com/articles/web_widget_jquery/

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment