The Perl Toolchain Summit needs more sponsors. If your company depends on Perl, please support this very important event.
<!DOCTYPE html>
<html>
  <head>
    <title>Yote Admin</title>
    <script src="/yote/js/jquery-latest.js"></script>
    <script src="/yote/js/jquery.cookie.js"></script>
    <script src="/yote/js/jquery.base64.min.js"></script>
    <script src="/yote/js/json2.js"></script>

    <script src="/js/main.js"></script>
    <script src="/yote/js/yote.js"></script>
    <script src="/yote/js/yote.util.js"></script>
    <link href="/yote.css" rel="stylesheet" type="text/css" media="all" />
    <link href="/css/main.css" rel="stylesheet" type="text/css" media="all" />

    <META NAME="Author" CONTENT="Eric Wolf, coyocanid@gmail.com">

    <STYLE>
      .mainpanel { top:0px; width:900px; display:inline-block; }
      .tabs {  
	  position: relative;   
	  min-height: 300px; /* This part sucks */
	  clear: both;
	  margin: 25px 0;
      }
      .tab {
	  float: left;
      }
      .tab label {
	  background: #eee; 
	  padding: 10px; 
	  border: 1px solid #ccc; 
	  margin-left: -1px; 
	  position: relative;
	  left: 1px; 
      }
      .tab [type=radio] {
	  display: none;   
      }
      .content {
	  position: absolute;
	  top: 28px;
	  left: 0;
	  background: white;
	  right: 0;
	  bottom: 0;
	  padding: 20px;
	  border: 1px solid #ccc; 
      }
      [type=radio]:checked ~ label {
	  background: white;
	  border-bottom: 1px solid white;
	  z-index: 2;
      }
      [type=radio]:checked ~ label ~ .content {
	  z-index: 1;
      }
    </STYLE>

<!--
there is a beauty that we experience as kids that only leaves tiny hints of itself when we are older.
it hides in smells and in the whispered wind.
if we are our experiences then we are both sides of them.

-->

    <script>
    $().ready(function(){

	$.yote.init();
	make_menus( '#top_nav' );

	var root = $.yote.fetch_root();

	var madyote_app = $.yote.fetch_app('Yote::Util::MadYote');

	function fill_data() {

	    var chat = madyote_app.get_chat_board();

	    $( '#motd_div' ).empty().append( 'Click to Edit<BR>' + $.yote.util.prep_edit( madyote_app, 'MOTD' ) );

	    $.yote.util.implement_edit( madyote_app, 'MOTD' ); //called after the control is placed	
	    
	    var blog = madyote_app.get_news_blog();

	    // edit the blog
	    //  show the entries in an editable table
	    //  allow for deletion
	    // have a new entry add at the top
	    
	    $( '#news_div' ).empty().append(
		'<div id="new_blog_div"></div><div id="news_list"></div>'
	    );

	    $.yote.util.control_table( {
		item            : blog,
		list_name       : 'posts',
		attachpoint     : '#news_list',
		remove_function : function( item ) {
		    blog.remove_post( item );
		},
		column_headers  : [ 'Subject', 'Content', 'Time' ],
		columns         : [
		    $.yote.util.col_edit( 'subject' ),
		    $.yote.util.col_edit( 'content' ),
		    function( row, is_html ) { if( is_html ) { var dt = new Date( 1000 * row.get_created_on() ); return dt.toLocaleTimeString(); } }
		],
		plimit          : 20,
		
		new_attachpoint : '#new_blog_div',
		new_columns     : [ 'subject', 
				    { html     : function( id ) { return '<TEXTAREA id="' + id + '" placeholder="Content"></TEXTAREA><BR>'; },
				      field    : 'content'
				    }
				  ],
		new_column_titles : [ 'Subject', 'Content' ],
		new_button        : 'New News',
		new_function      : function() {
		    return blog.post( { content : '', subject : '' } )
		}
	    } );

	    var cv = $.yote.util.col_edit;

	    $.yote.util.control_table( {
		item           : chat,
		list_name      : 'posts',
		attachpoint    : '#chat_div',
		column_headers : [ 'Name', 'Message', 'Time' ], 
		remove_function : function( item ) {
		    chat.remove_post( item );
		},
		columns        : [ 0, 1, 2 ],

		//include delete or archive
		plimit : 20
	    } );

	    $.yote.util.control_table( {
		item           : madyote_app,
		list_name      : '_suggestion_box',
		attachpoint   : '#suggestion_div',
		plimit         : 20,
		column_headers : [ 'From', 'Message' ],
		columns        : [ 'from', 'message' ],
		remove_function : function( item ) {
		    madyote_app.remove_suggestion( item );
		}
	    } );

	    $.yote.util.control_table( { 
		item          : root,
		paginate_type : 'hash',
		list_name     : '_handles',
		attachpoint   : '#accounts_div',
		column_headers : [ 'Handle', 'Email', 'Is Root' ],
		plimit  : 10,
		columns : [ 'handle', 'email', function( acct, is_html ) { if( is_html ) { return acct.is_root() == '1' ? 'Y' : 'N';  } }  ]
	    } );
	    var page_counter = $.yote.fetch_app('Yote::Util::Counter');
	    page_counter.increment( 'Admin Page',
				    function( count ) {
					$('#counter').empty().append( count );
				    },
				    function( err ) {},
				    1
				  );
	}//fill_data


	function check_perms() {
	    if( $.yote.is_logged_in() && 1*$.yote.get_login().is_root() ) {
		$( '#logged_in_status' ).empty().append( 
		    'Logged in as ' + madyote_app.account().get_login().get_handle() + '<BR><A href="#" id="logout">Log Out</A>'
		);
		$( '#logout' ).click( function() {
		    $.yote.logout();
		    $( '#header_bar' ).empty();
	    se.splash_screen( 'Logged Out');
		    $( '#logged_in_status' ).empty();
		} );
		
		fill_data();
		$( '#mainpanel' ).show();
		$( '#errpanel' ).hide();
	    } else {
		$( '#mainpanel' ).hide();
		$( '#errpanel' ).show();
	    } 
	}

	attach_login( {
	    attachpoint         : '#logged_in_status',
	    message_attachpoint : '#msg_div',
	    after_login  : check_perms,
	    after_logout : check_perms
	} );

	check_perms();

	var tabs = [ '#motd_div', '#news_div', '#suggestion_div',
		     '#chat_div', '#accounts_div' ];
	var min = 0;
	for( var i=0; i < tabs.length; i++ ) {
	    min = min > $( tabs[ i ] ).height() ? min : $( tabs[ i ] ).height();
	}
	$( '.content' ).css( 'min-height', min + 'px' );
	$( '#bottom_half' ).css( 'min-height', ( $('#bottom_header' ).height() + min + 100 ) + 'px' );
    });
    </script>
  </head>

  <BODY>

    <DIV class="header">
      <A href="/index.html" style="display:block">
	<img height="70px" width="151px" src="yotelogo.png">
      </A>
      <UL id="top_nav" class="nav"></UL>
      <DIV class="login logged_in" id="logged_in_status"></DIV>
      <DIV id="msg_div"></DIV>
    </DIV>
    
    <DIV id="errpanel" class="err">
      Must be logged in with a root account to view this page.
    </DIV>

    <DIV class="mainpanel" id="mainpanel">

	<!--
	    accounts, with pagination and search
	    edit motd
            add and edit news
	    show apps	    
	  -->

	<SECTION>
	  <DIV class="page-header">
	    <H1>Yote Admin Page</H1>
	  </DIV>
	  <P>
	    Welcome to the Yote Admin Page.
	  </P>
	</SECTION>

	<SECTION id="bottom_half">
	  <DIV class="page-header" id="bottom_header">
	    <H1>News Control Panel</H1>
	  </DIV>

	  <DIV class="tabs">

	    <DIV class="tab" id="sugbox">
	      <input type="radio" id="sb-tab" name="tab-group-1" checked>
	      <label for="sb-tab">Suggestion Box</label>
	      <DIV class="content"><DIV id="suggestion_div"></DIV></DIV>
	    </DIV>

	    <DIV class="tab" id="motd">
	      <input type="radio" id="motd-tab" name="tab-group-1">
	      <label for="motd-tab">Edit the Message of the Day</label>
	      <DIV class="content"><DIV id="motd_div"></DIV></DIV>
	    </DIV>

	    <DIV class="tab" id="newsblog">
	      <input type="radio" id="newsblog-tab" name="tab-group-1">
	      <label for="newsblog-tab">Edit News Blog</label>
	      <DIV class="content"><DIV id="news_div"></DIV></DIV>
	    </DIV>

	    <DIV class="tab" id="chatadmin">
	      <input type="radio" id="chatadmin-tab" name="tab-group-1">
	      <label for="chatadmin-tab">Chat Admin</label>
	      <DIV class="content"><DIV id="chat_div"></DIV></DIV>
	    </DIV>

	    <DIV class="tab" id="accts">
	      <input type="radio" id="accts-tab" name="tab-group-1">
	      <label for="accts-tab">Accounts Control Panel</label>
              <DIV class="content"><DIV id="accounts_div"></DIV></DIV>
	    </DIV>
	  </DIV>
        </SECTION>
    </DIV>

    <footer>
      This page has been viewed <span id="counter"></span> times.
    </footer>
    <script src="/js/local.js"></script>
  </body>
</html>