working on help tips

--HG--
branch : rc-botanic-webdev

code/ryzom/tools/server/ryzom_ams/www/html/js/charisma.js

@@ -3,9 +3,9 @@ $(document).ready(function(){
 	//default theme(CSS) is cerulean, change it if needed
 	var current_theme = $.cookie('current_theme')==null ? 'cerulean' :$.cookie('current_theme');
 	switch_theme(current_theme);
-	
+
 	$('#themes a[data-value="'+current_theme+'"]').find('i').addClass('icon-ok');
-				 
+
 	$('#themes a').click(function(e){
 		e.preventDefault();
 		current_theme=$(this).attr('data-value');
@@ -14,19 +14,19 @@ $(document).ready(function(){
 		$('#themes i').removeClass('icon-ok');
 		$(this).find('i').addClass('icon-ok');
 	});
-	
+
-	
+
 	function switch_theme(theme_name)
 	{
 		$('#bs-css').attr('href','css/bootstrap-'+theme_name+'.css');
 	}
-	
+
 	//ajax menu checkbox
 	$('#is-ajax').click(function(e){
 		$.cookie('is-ajax',$(this).prop('checked'),{expires:365});
 	});
 	$('#is-ajax').prop('checked',$.cookie('is-ajax')==='true' ? true : false);
-	
+
 	//disbaling some functions for Internet Explorer
 	if($.browser.msie)
 	{
@@ -34,16 +34,16 @@ $(document).ready(function(){
 		$('#for-is-ajax').hide();
 		$('#toggle-fullscreen').hide();
 		$('.login-box').find('.input-large').removeClass('span10');
-		
+
 	}
-	
+
-	
+
 	//highlight current / active link
 	$('ul.main-menu li a').each(function(){
 		if($($(this))[0].href==String(window.location))
 			$(this).parent().addClass('active');
 	});
-	
+
 	//establish history variables
 	var
 		History = window.History, // Note: We are using a capital H instead of a lower h
@@ -65,7 +65,7 @@ $(document).ready(function(){
 			}
 		});
 	});
-	
+
 	//ajaxify menus
 	$('a.ajax-link').click(function(e){
 		if($.browser.msie) e.which=1;
@@ -80,9 +80,9 @@ $(document).ready(function(){
 		var $clink=$(this);
 		History.pushState(null, null, $clink.attr('href'));
 		$('ul.main-menu li.active').removeClass('active');
-		$clink.parent('li').addClass('active');	
+		$clink.parent('li').addClass('active');
 	});
-	
+
 	//animating menus on hover
 	$('ul.main-menu li:not(.nav-header)').hover(function(){
 		$(this).animate({'margin-left':'+=5'},300);
@@ -90,24 +90,24 @@ $(document).ready(function(){
 	function(){
 		$(this).animate({'margin-left':'-=5'},300);
 	});
-	
+
 	//other things to do on document ready, seperated for ajax calls
 	docReady();
 });
-		
+
-		
+
 function docReady(){
 	//prevent # links from moving to top
 	$('a[href="#"][data-top!=true]').click(function(e){
 		e.preventDefault();
 	});
-	
+
 	//rich text editor
 	$('.cleditor').cleditor();
-	
+
 	//datepicker
 	$('.datepicker').datepicker();
-	
+
 	//notifications
 	$('.noty').click(function(e){
 		e.preventDefault();
@@ -226,7 +226,7 @@ function docReady(){
 	});
 
 	//tour
-	if($('.tour').length && typeof(tour)=='undefined')
+	if($('.index').length && typeof(tour)=='undefined')
 	{
 		var tour = new Tour();
 		tour.addStep({
@@ -246,18 +246,7 @@ function docReady(){
 			title: "Dashboard",
 			content: "This is your dashboard from here you will find highlights."
 		});
-		tour.addStep({
+
-			element: "#for-is-ajax",
-			title: "Ajax",
-			content: "You can change if pages load with Ajax or not."
-		});
-		tour.addStep({
-			element: ".top-nav a:first",
-			placement: "bottom",
-			title: "Visit Site",
-			content: "Visit your front end from here."
-		});
-		
 		tour.restart();
 	}
 
@@ -284,10 +273,13 @@ function docReady(){
 		e.preventDefault();
 		$('#myModal').modal('show');
 	});
+	$('.btn-help').click(function(e){
+		alert('test');
+	});
+
 
 
 
-		
 	//initialize the external events for calender
 
 	$('#external-events div.external-event').each(function() {
@@ -296,17 +288,17 @@ function docReady(){
 		var eventObject = {
 			title: $.trim($(this).text()) // use the element's text as the event title
 		};
-		
+
 		// store the Event Object in the DOM element so we can get to it later
 		$(this).data('eventObject', eventObject);
-		
+
 		// make the event draggable using jQuery UI
 		$(this).draggable({
 			zIndex: 999,
 			revert: true,      // will cause the event to go back to its
 			revertDuration: 0  //  original position after the drag
 		});
-		
+
 	});
 
 
@@ -320,31 +312,31 @@ function docReady(){
 		editable: true,
 		droppable: true, // this allows things to be dropped onto the calendar !!!
 		drop: function(date, allDay) { // this function is called when something is dropped
-		
+
 			// retrieve the dropped element's stored Event Object
 			var originalEventObject = $(this).data('eventObject');
-			
+
 			// we need to copy it, so that multiple events don't have a reference to the same object
 			var copiedEventObject = $.extend({}, originalEventObject);
-			
+
 			// assign it the date that was reported
 			copiedEventObject.start = date;
 			copiedEventObject.allDay = allDay;
-			
+
 			// render the event on the calendar
 			// the last `true` argument determines if the event "sticks" (http://arshaw.com/fullcalendar/docs/event_rendering/renderEvent/)
 			$('#calendar').fullCalendar('renderEvent', copiedEventObject, true);
-			
+
 			// is the "remove after drop" checkbox checked?
 			if ($('#drop-remove').is(':checked')) {
 				// if so, remove the element from the "Draggable Events" list
 				$(this).remove();
 			}
-			
+
 		}
 	});
-	
+
-	
+
 	//chart with points
 	if($("#sincos").length)
 	{
@@ -401,7 +393,7 @@ function docReady(){
 					previousPoint = null;
 				}
 		});
-		
+
 
 
 		$("#sincos").bind("plotclick", function (event, pos, item) {
@@ -411,14 +403,14 @@ function docReady(){
 			}
 		});
 	}
-	
+
 	//flot chart
 	if($("#flotchart").length)
 	{
 		var d1 = [];
 		for (var i = 0; i < Math.PI * 2; i += 0.25)
 			d1.push([i, Math.sin(i)]);
-		
+
 		var d2 = [];
 		for (var i = 0; i < Math.PI * 2; i += 0.25)
 			d2.push([i, Math.cos(i)]);
@@ -426,7 +418,7 @@ function docReady(){
 		var d3 = [];
 		for (var i = 0; i < Math.PI * 2; i += 0.1)
 			d3.push([i, Math.tan(i)]);
-		
+
 		$.plot($("#flotchart"), [
 			{ label: "sin(x)",  data: d1},
 			{ label: "cos(x)",  data: d2},
@@ -449,7 +441,7 @@ function docReady(){
 			}
 		});
 	}
-	
+
 	//stack chart
 	if($("#stackchart").length)
 	{
@@ -502,7 +494,7 @@ function docReady(){
 	{ label: "Firefox",  data: 90},
 	{ label: "Chrome",  data: 112}
 	];
-	
+
 	if($("#piechart").length)
 	{
 		$.plot($("#piechart"), data,
@@ -520,7 +512,7 @@ function docReady(){
 				show: false
 			}
 		});
-		
+
 		function pieHover(event, pos, obj)
 		{
 			if (!obj)
@@ -530,7 +522,7 @@ function docReady(){
 		}
 		$("#piechart").bind("plothover", pieHover);
 	}
-	
+
 	//donut chart
 	if($("#donutchart").length)
 	{
@@ -603,7 +595,7 @@ function docReady(){
 			plot.setData([ getRandomData() ]);
 			// since the axes don't change, we don't need to call plot.setupGrid()
 			plot.draw();
-			
+
 			setTimeout(update, updateInterval);
 		}
 

code/ryzom/tools/server/ryzom_ams/www/html/js/help.js

@@ -0,0 +1,26 @@
+function show_help(help_tip)
+{
+	if(help_tip =='test')
+	{
+		var tour = new Tour();
+		tour.addStep({
+			element: ".span10:first", /* html element next to which the step popover should be shown */
+			placement: "top",
+			title: "Custom Tour", /* title of the popover */
+			content: "You can create tour like this. Click Next." /* content of the popover */
+		});
+		tour.addStep({
+			element: ".theme-container",
+			placement: "left",
+			title: "Themes",
+			content: "You change your theme from here."
+		});
+		tour.addStep({
+			element: "ul.main-menu a:first",
+			title: "Dashboard",
+			content: "This is your dashboard from here you will find highlights."
+		});
+
+		tour.restart();
+	}
+}

code/ryzom/tools/server/ryzom_ams/www/html/templates/home.tpl

@@ -31,7 +31,7 @@
 					</ul>
 				</div>
 				<!-- theme selector ends -->
-
+				<button onclick="show_help('test')">Help Test</button>
 				<!-- user dropdown starts -->
 				<div class="btn-group pull-right">
 					<a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
@@ -114,6 +114,7 @@
 					<div class="box-header well">
 						<h2><i class="icon-info-sign"></i> Introduction</h2>
 						<div class="box-icon">
+							<a href="#" class="btn btn-help btn-round"><i class="icon-info-sign"></i></a>
 							<a href="#" class="btn btn-setting btn-round"><i class="icon-cog"></i></a>
 							<a href="#" class="btn btn-minimize btn-round"><i class="icon-chevron-up"></i></a>
 							<a href="#" class="btn btn-close btn-round"><i class="icon-remove"></i></a>

code/ryzom/tools/server/ryzom_ams/www/html/templates/layout.tpl

@@ -233,6 +233,9 @@
 	<script src="js/jquery.history.js"></script>
 	<!-- application script for Charisma demo -->
 	<script src="js/charisma.js"></script>
+	<!-- help script for page help -->
+	<script src="js/help.js"></script>
+
 
 
 </body>

code/ryzom/tools/server/ryzom_ams/www/html/templates/register.tpl

@@ -12,7 +12,7 @@
 		<div class="alert alert-info">
 			 {$welcome_message}
 		</div>
-		
+
 
 		  <form name="Page1"method="post">
 		    <table>
@@ -27,7 +27,7 @@
 			       onfocus=
 			       "javascript:showTooltip('{$username_tooltip}', this);" />
 			</td>
-		
+
 			<td id="comment-Username" {if isset($USERNAME_ERROR) && $USERNAME_ERROR eq "TRUE"}class="error"{/if} width="42%">{if isset($Username)}{$Username}{/if}</td>
 		      </tr>
 
@@ -124,7 +124,7 @@
 			</div>
 		  </div>
 
-		
+
 	</div><!--/span-->
 </div><!--/row-->
 {/block}