penguin/AstroJS

Javascript framework for my blog

botanjs/src/Astro/Blog/AstroEdit/Draft.js

raw ยท 3868 bytes

(function(){
	var ns = __namespace( "Astro.Blog.AstroEdit" );

	/** @type {System.Cycle} */
	var Cycle                        = __import( "System.Cycle" );
	/** @type {System.utils.IKey} */
	var IKey                         = __import( "System.utils.IKey" );
	/** @type {Dandelion} */
	var Dand                         = __import( "Dandelion" );

	var postData                     = __import( "System.Net.postData" );

	/** @param {Astro.Blog.AstroEdit.Article} article */
	var Draft = function ( article, draftsUri )
	{
		/** @type {Astro.Blog.AstroEdit.Article} */
		var Article = ns[ NS_INVOKE ]( "Article" );

		if ( !( article instanceof Article ) ) return;
		
		// Drafts Container
		var ae_expand = Dand.id("ae_expand")
		, ae_drafts = Dand.id("ae_user_drafts")
		, ae_drafts_h = null
		
		////// Draft Section
		, showDrafts = function ()
		{
			showDrafts = function() { };
			// One-time trigger only.
			getDraftList({offset: 0});
		}
		
		, getDraftList = function ( p )
		{
			postData( draftsUri, p, listDraft.bind(p), draftFailed );
		}

		/** @param {_AstJson_.AJaxGetDrafts} obj */
		, listDraft = function ( obj )
		{
			var entries = obj.entries, entry;
			
			for ( var i in entries )
			{
				/** @param {_AstJson_.AJaxGetDrafts.entry} */
				entry = entries[i];
				// Insert entries
				ae_drafts.appendChild(
					entry = Dand.wrapc(
						"ae_dEntry"
						, [
							Dand.wrapc(
								"ae_dEntry_title fls"
								, entry.active
								?
								[
									Dand.textNode( entry.title )
									, Dand.wrap( "span", null, "ae_dActive_bubble", "\u25CF" )
								]
								: entry.title
							)
							, Dand.wrapc( "ae_dEntry_content flsf", entry.content )
							, Dand.wrapc( "ae_dEntry_date fsf", entry.date )
						]
					, entry.active
						? [ new IKey ( "value", entry._id ), new IKey( "active" ) ]
						: new IKey( "value", entry._id ) )
				);
				
				// Register on click function
				entry.addEventListener( "click", function() {
					article.load( entry.getAttribute( "value" ), __pushState );
				} );
			}
			
			ae_drafts_h = ae_drafts.clientHeight;
			ae_drafts.style.height = 0;

			Cycle.next(function(){
				// This doesn't make sense
				// but we need to actually access the clientHeight
				// to get the height animation working
				ae_drafts.clientHeight;
				ae_drafts.style.height = String( ae_drafts_h ) + "px";
			});
		}
		
		, draftFailed = function (obj)
		{
			
		}
		
		
		// Handlers
		, setupExpand = function ()
		{
			ae_expand.className = "ae_expand_btn";
			var panel = Dand.id("ae_minor_panel");
			panel.onmouseover = function()
			{
				ae_expand.style.height = "20px";
			}
			panel.onmouseout = function()
			{
				ae_expand.style.height = "";
			}
			panel.onclick = function()
			{
				ae_expand.style.height = "";
				ae_drafts.style.height = String(ae_drafts_h) + "px";
				Cycle.delay(setupCollapse , 250);

				// Disable mouse events
				panel.onmouseover = panel.onmouseout = panel.onclick = null;

				showDrafts();
			}
		}
		
		, setupCollapse = function ()
		{
			ae_expand.className = "ae_callapse_btn";
			Cycle.delay(function()
			{
				ae_expand.onclick = function()
				{
					ae_expand.style.backgroundColor = "";
					ae_drafts.style.height = "0";
					Cycle.delay(setupExpand, 250);

					// Disable mouse events
					ae_expand.onmouseover = ae_expand.onmouseout = ae_expand.onclick = null;
				}
				ae_expand.onmouseover = function()
				{
					ae_expand.style.backgroundColor = "rgba(255, 255, 255, 0.2)";
				}
				ae_expand.onmouseout = function()
				{
					ae_expand.style.backgroundColor = "";
				}
			}, 250);
		}
		// End Handlers
		
		
		, __pushState = function ( obj, article_id )
		{
			window.history.pushState( obj, "", "../" + article_id + "/" );
		}

		setupExpand();
		article.invoke( this );
	};

	ns[ NS_EXPORT ]( EX_CLASS, "Draft", Draft );
})();