TSidebar - Nuevo

Esta es una libreria en PHP para desarrollo de aplicaciones WEB
Responder
Avatar de Usuario
administrador
Site Admin
Mensajes: 74
Registrado: Mar Nov 24, 2020 1:56 am
Contactar:

TSidebar - Nuevo

Mensaje por administrador »

Control TSidebar - Nuevo !!!

Codigo de ejemplo :

Código: Seleccionar todo

<?php
include( 'config.php' );
include( TWEB_PATH . 'core.php' );

	$oWeb = new TWeb( "TEST TSIDEBAR" );
	$oWeb->lAwesome = true; 
	$oWeb->SetIcon( IMAGE_PATH . 'tweb.png' );
	$oWeb->Activate();

	$cIdWnd = 'main';
	
	  $oSidebar = new TSidebar( "mysidebar", "PROBANDO TWEB", 200, IMAGE_PATH . 'user.png' );
	  $oSidebar->Title("MENU PRINCIPAL", "Red", "18px" );
	  $oSidebar->SetImageCss( 'width : 80px; height : 80px' );
	  $oSidebar->OverItem( "white", "#66ccff" );
	  $oSidebar->AddWindow( $cIdWnd );
	  $oSidebar->ColorBack  = 'white';
    $oSidebar->ColorItem  = 'black';
    
    $oSidebar->AddOption( "item1", "Item 1", "doClick('1')", "fa-address-book" );
		$oSidebar->AddOption( "item1", "Item 2", "doClick('2')", "fa-database" );
		$oSidebar->AddOption( "item2", "Item 3", [  [ "Item 3.1", "doClick('3.1')", "fa-money" ],
																								[ "Item 3.2", "doClick('3.2')", "fa-archive"],
																								[ "Item 3.3", "doClick('3.3')", "fa-archive"],
																								[ "Item 3.4", "doClick('3.4')", "fa-archive"] ] );
		$oSidebar->AddOption( "item3", "Item 5", "doClick('5')", "fa-money" );
		$oSidebar->AddOption( "item4", "Item 6", "doClick('6')", "fa-file" );
		$oSidebar->AddOption( "item5", "Salir" , "Exit()", "fa-power-off" );	
	  
	  $oSidebar->Activate();

	  $Name = "TEST DEL MENU SIDEBAR / TWEB PLUS v1.0";
	  
	  $oWnd = new TWindow( $cIdWnd, null, null, null, null );
	  $oWnd->SetColor( 'transparent' );
	
	  $oFont 	= new TFont( 'Verdana', 14, true, false, false, 'black' );
	
	  $osay 	= new TSay( $oWnd, "say1",  0, 0, $Name, '98%', 20, $oFont );
	
	$oWnd->Activate();
	
	$oWeb->End();

?>

<script type="text/javascript">

	$(function() {
		oMenuSide.show();
	});

	function doClick( item ) {
		oMenuSide.toogle();
		MsgNotify( 'Click ' + item, 'info', true );
		JMsgPrompt( 'Item ' + item, lectura, '19.500' );
  }

	function lectura( data ) {
		JMsgInfo(data);
    oMenuSide.toogle();
	}
	
	function ClickMenu( cId ) {
		if ( document.getElementById( cId ) ) {
			oMenuSide.toogle();
  		if ( $('#' . cId ).css( 'width' ) == '0px' )
     		$('#' . cId ).animate( {width: "200px"});
  		else
     		$('#' . cId ).animate( {width: "0px"});     
		}		 
	}

	function Exit() {
		JMsgYesNo( 'Cerrar Sesion ?', doLogout );
	}
	
	function doLogout() {
		console.log("doLogout");
		location.href = "http://avcsistemas.com/foro";
	}

</script>

<style> 

	.load-gif {
		width: 200px;
		height: 100px;
	}

	#say1 {
		text-align: center;
		margin : auto !important;
	}

</style>

Link del Test del ejemplo : Test del ejemplo
Saludos.

Albeiro Valencia
Imagen Bienvenidas las Donaciones Gracias https://www.paypal.me/valenciaim5

Avatar de Usuario
administrador
Site Admin
Mensajes: 74
Registrado: Mar Nov 24, 2020 1:56 am
Contactar:

Re: TSidebar - Nuevo

Mensaje por administrador »

Agregada la parte javascript a TSideBar.


oMenuSide.show(); <-- inicia el Menu
oMenuSide.toogle(); <-- oculta o muestra el menu
Saludos.

Albeiro Valencia
Imagen Bienvenidas las Donaciones Gracias https://www.paypal.me/valenciaim5

Responder