Methods

Methods

The following methods are available to you after init.

(note: or you can just call show(args) and the args will be passed to init(args)):

• _mb.show(args);

  • advanced args :

     	var args = {
     			header: "header content with <span>markup</span>",
     			body: "body content with <span>markup</span>, if you're into that kinda thing ...",
     			footer: "footer content without markup, but this can take markup too.",
     			addClass : "the_class_you_want_to_add_to_the_wrap or_classes",
     			showFor : 5000 // number of milliseconds to show the modal for, before hiding it automatically
     		};

  • most basic example :

     	_mb.show({body : 'hello'});

• _mb.hide(); - you guessed it.
  • this is also called by, hitting the ESC key, clicking close button, or anything outside the content wrap.

Confirm / Prompt

• Based on the window.confirm method, but with greater styling and functional possibilities.

• We're using a "yarp/narp" convention instead of "confirm/cancel".

• Specify button text like (defaults to 'confirm' and 'cancel'):

   var confrimArgs = {
   	yarp : {
   		text: "the confirm button text",
   		disabled: true // optional
   	},
   	narp : { 
   		text: { // if you want translations
   			"en" : "cancel in english",
   			"es" : "como se dice, 'cancel'?"
   		}
   	}
   };
   
   // then you'd pass it to the show method like
   _mb.show({
   		body: "whatever?",
   		confirm: confrimArgs
   	});

• Specify functionality within the callbacks 'yarp' and 'narp' :

   var confirmAction = function(_mb) {
   		// whatver you want, really ...
   	},
   	cancelAction = function(_mb) {
   		// whatver you want, really ...
   	};
   	
    _mb.show({
    		body: "whatever?",
    		callbacks: {
    			yarp : confirmAction,
    			narp : cancelAction
    		}
    	});

Translations

• tries to grab the "lang" property from the html tag (defaults to "en"). (see ref for iso codes here)

• you can manually override this: _mb.state.lang = "jp";

• to use this feature you can:

  • ignore it and just provide single strings.

  • provide translation objects like :

     	var hello = {
     			"en" : "hello",
     			"es" : "hola",
     			"fr" : "bonjour"
     			// ... etc
     		};

• you can call this method directly like :

   	var hello = {
   			"en" : "hello",
   			"es" : "hola",
   			"fr" : "bonjour"
   			// ... etc
   		};
   	// auto lang choice ...
   	var helloTranslated = _mb.translate(hello);
   	// or override for aspecific lang ...
   	var helloFrance = _mb.translate(hello, 'fr');