general.js-lib v1.0.0

general.js

JS Library

Do more - Write Less

JS Library that handles DOM / Events - DOM / AJAX - FETCH / WebSockets-Webworkers / Carousel / Watch - UnWatch / - Accordion - Datepicker - Colorpicker - Calendar - Crypto - expansible

How to init the library

g.docready(function(){
//write code below
});

How to select a DOMElement By ID

	g.dom("#element");

How to select a DOMElement By ClassName

	g.dom(".element");

How to set CSS attributes

	g.dom("#element").css({
		'height': '400px',
		'width': '200px',
		'opacity': '1'
	});

How to get an attribute of a DOMElement

	idelement=g.dom("#element").getAttrb("id");

How to set an attribute of a DOMElement

	g.dom("#element").setAttrb("attribRandom","test");

AJAX Calls

GET

	g.get(
	{
		id:"321654"
	},
	"socket.php",
	function(data){
		g.log("DATA: ");
		g.log(data.data);
		g.dom("#ajaxresponse").html("RESPONSE AJAX \n" + data.data);
	}
);

POST

	g.post(
	{
		name:"peter",
		lastname:"smitth"
	},
	"socket.php",
	function(data){
		g.log("DATA: ");
		g.log(data.data);
		g.dom("#ajaxresponse").html("RESPONSE AJAX \n" + data.data);
	}
);

Asynchronous Files UPLOAD for General.JS

Client Side

	g.upload("#filetoupload",function(data){
		g.log("*******************data.file*******************");
		g.log("DATA");
		g.log(data);
		g.log("DATA FILE NAME");
		g.log(data.file);
		g.log("DATA FILE STATUS");
		g.log(data.status);
		g.log("*******************data.file*******************");
		//////////////////////////////////////////////////
	});

Server Side

<?php
	$JSON    =file_get_contents("php://input");
	$request =json_decode($JSON);
	$data=base64_decode($request->data);
	$fileName=$request->name;
	$serverFile=time().$fileName;
	$fp=fopen('uploads/'.$serverFile,'w'); //Prepends timestamp to prevent overwriting
	fwrite($fp,$data);
	fclose($fp);
	$returnData[]=array("file"=>$serverFile);
	echo(json_encode($returnData));
?>

Asynchronous JS FETCH API

	g.log("*****FETCH API*****");
	var fapi=g.fetchapi.getFetch();
	if(fetchapi){
		g.log("FETCH API ha sido cargada exitosamente!");
		g.log("***************************************");
		var dataSrc={};
		dataSrc={
			method:'fetch',
			name:"arturo",
			lastname:"vasquez"
		}
		g.fetchapi.post(
			"socket_fetch.php",
			dataSrc,
			function(data){
				g.log("DATA FETCH");
				g.log(data);
			}
		);
		g.fetchapi.get(
			"example.json",
			function(data){
				var datappal;
				var datos;
				g.log("DATA FETCH GET");
				g.log(data);
				datappal=data.data;
				g.log("PERSONA");
				g.log(datappal.persona);
				var datos=datappal.persona;
				g.log(datos.ciudad);
				g.log("**************");
				g.log(datos.nombre);
				g.log("**************");
				g.log(datos.apellido);
			}
		);
	}

GCycle - Slideshow for General.JS

How to init:

	var slider=gcycle.run({
		container:"#slideshowslide",
		slidesToShow:1,
		dots:".dots",
		draggable:true,
		duration:1,
		rewind:true,
		autoplay:true,
		durationbs:3000,
		arrows:{
			prev:'.glider-prev',
			next:'.glider-next',
		},
		getobject:true
	});

Modal Window

How to init:

	g.dom("#btnmodal").click(function(){
		var modalwin=g.modalapi.getModal({
			title:"Hola",
			html:true,
			close:true,
			content:"Este es el contenido"
		});
		modalwin.open();
	});

Datepicker

How to init:

	var datepicker=g.datepickerapi.getDatepicker("#inputdatepicker");

Calendar

How to init:

	var calendargrande=g.calendarapi.getCalendar("#contentCalendar");

ColorPicker

How to init:

	var colorpicker=g.colorpickerapi.getColorpicker("#divcolorpicker");
	colorpicker.on();

Accordion JS API

How to init:

	var accordion=g.accordionapi.get(".accordion-container");

How to extend the library

Creates a new function

	g.extend({
		myfunction:function(options){
			//write code below
		});
	});

Use new function

	g.myfunction(options);

Use the Source...

The Source be with you...