(function() {
   tinymce.create('tinymce.plugins.fun2', {
      init : function(ed, url) {
         ed.addButton('fun2', {
            title : 'Fun Facts2',
            image : url+'/skill.png',
            onclick : function() {
               // triggers the thickbox
                var width = jQuery(window).width(), H = jQuery(window).height(), W = ( 720 < width ) ? 720 : width;
                W = W - 80;
                H = H - 84;
                tb_show( 'Fun Facts Shortcode', '#TB_inline?width=' + W + '&height=' + H + '&inlineId=fun2-form' );
            }
         });
      },
      createControl : function(n, cm) {
         return null;
      },
      getInfo : function() {
         return {
            longname : "Fun Facts2",
            author : 'RMS IT',
            authorurl : 'http://www.themeonlab.com',
            infourl : 'http://www.themeonlab.com',
            version : "1.0"
         };
      }
   });
   tinymce.PluginManager.add('fun2', tinymce.plugins.fun2);
   // executes this when the DOM is ready
	jQuery(function(){
		// creates a form to be displayed everytime the button is clicked
		// you should achieve this using AJAX instead of direct html code like this
		var form = jQuery('<div id="fun2-form"><table id="fun2-table" class="form-table">\
			<tr>\
				<th><label for="fun2_facts">Fun Facts Shortcode</label></th>\
				<td><small>\
                                Please Press Insert button. You will get a Demo Shortcode.<br/>\
                                Edit the shortcode to achive your requirement.<br/><br/>\
                                <strong>Demo Shortcode</strong><br/>\
                                [rms-funs2]<br/>\
                                [rms-fun2 icon="coffee" count="4780"]hours week[/rms-fun2]<br/>\
                                [rms-fun2 icon="coffee" count="1570"]coffees drank[/rms-fun2]<br/>\
                                [rms-fun2 icon="coffee" count="4870"]tracks played[/rms-fun2]<br/>\
                                [rms-fun2 icon="coffee" count="150"]clients work[/rms-fun2]<br/>\
                                [/rms-funs2]<br/>\
                                </small></td>\
			</tr>\
		</table>\
		<p class="submit">\
			<input type="button" id="fun2_submit" class="button-primary" value="Insert Fun" name="submit" />\
		</p>\
		</div>');
		
		var table = form.find('table');
		form.appendTo('body').hide();
		
		// handles the click event of the submit button
		form.find('#fun2_submit').click(function(){
			// defines the options and their default values
			// again, this is not the most elegant way to do this
			// but well, this gets the job done nonetheless
			
			var shortcode = '[rms-funs2]';
                            shortcode += '[rms-fun2 icon="coffee" count="4780"]hours week[/rms-fun2]';
                            shortcode += '[rms-fun2 icon="coffee" count="1570"]coffees drank[/rms-fun2]';
                            shortcode += '[rms-fun2 icon="coffee" count="4870"]tracks played[/rms-fun2]';
                            shortcode += '[rms-fun2 icon="coffee" count="150"]clients work[/rms-fun2]';
                            shortcode += '[/rms-funs2]';
			// inserts the shortcode into the active editor
			tinyMCE.activeEditor.execCommand('mceInsertContent', 0, shortcode);
			
			// closes Thickbox
			tb_remove();
		});
	});
})();