Contact form, brackground image and such

botanjs/src/Astro/Blog/Layout/MainFrame.js

@@ -3,6 +3,8 @@
 
 	/** @type {System.Cycle} */
 	var Cycle                                         = __import( "System.Cycle" );
+	/** @type {System.Cycle.Trigger} */
+	var Trigger                                       = __import( "System.Cycle.Trigger" );
 	/** @type {System.utils.IKey} */
 	var IKey                                          = __import( "System.utils.IKey" );
 	/** @type {Dandelion} */
@@ -26,6 +28,9 @@
 	// __import( "Dandelion.CSSAnimations" ); CSS_RESERVATION
 	// __import( "Astro.Blog.Element.Layer" ); CSS_RESERVATION
 
+	/** @function {System.Net.getData} */
+	var getData = __import( "System.Net.getData" );
+
 	var main;
 	var header;
 	var main_h;
@@ -59,7 +64,6 @@
 
 		content_wrapper.appendChild( padder );
 
-
 		IDOMObject( window ).addEventListener( "Resize", responsify );
 
 		initTopButton();
@@ -84,7 +88,7 @@
 			= "purple";
 
 		contact = Dand.id( "menu_cont", true );
-		contact.addEventListener( "Click", expandContact );
+		contact.addEventListener( "Click", loadContactForm );
 
 		Dand.id( "menu", true ).foreach(
 			1, function( e )
@@ -98,6 +102,24 @@
 		);
 	};
 
+	var loadContactForm = function( e )
+	{
+		getData( "/ajax/get-snippet/ContactForm", function( data )
+		{
+			var data = JSON.parse( data );
+			var wrapper = IDOMElement( contact_page ).first( 1 );
+			if ( wrapper )
+			{
+				wrapper.innerHTML = data["mesg"];
+				Cycle.next( function()
+				{
+					expandContact( e );
+					wrapper.style.marginTop = .5 * ( 400 - wrapper.clientHeight ) + "px";
+				} );
+			}
+		} );
+	};
+
 	var navControl = function ()
 	{
 		// Page control
@@ -146,7 +168,7 @@
 	var expandContact = function ()
 	{
 		// disable click event on the button
-		contact.removeEventListener( "Click", expandContact );
+		contact.removeEventListener( "Click", loadContactForm );
 		// enable click event for collapse
 		collapse_panel.onclick = doCollapse;
 
@@ -170,8 +192,12 @@
 	{
 		// disable click event for collapse
 		collapse_panel.onclick = null;
-		// enable click event on the button
-		contact.addEventListener( "Click", expandContact );
+
+		Trigger.height( contact_page, 0, function()
+		{
+			// enable click event on the button
+			contact.addEventListener( "Click", loadContactForm );
+		} );
 		
 		// Reverting states
 		contact_page.style.height