Class Index | File Index

## Classes

- _global_
- jQuery
- jQuery.fn
- sg

# Namespace sg

Version 1.0.
Librería para la producción de contenidos de la web
Defined in: sg-1.0.js.

Namespace Summary
Constructor Attributes | Constructor Name and Description
--- | ---
| sg sg library es una librería que requiere jQuery.

Field Summary
Field Attributes | Field Name and Description
--- | ---
<static> | sg.$body [Read Only] $("body")
<static> | sg.$content [Read Only] Es un contenedor que contiene los elementos hijos de stage.
<static> | sg.$stage [Read Only] Es un elemento configurado como stage.
<static> | sg.$window [Read Only] $(window)
<static> | sg.scaleMode [Read Only] Método de escala de stage.
<static> | sg.scaleX [Read Only] Es el valor del eje X de stage.
<static> | sg.scaleY [Read Only] stage의 Es el valor del eje Y de stage.
<static> | sg.stageHeight [Read Only] El valor de height de stage.
<static> | sg.stageWidth [Read Only] El valor de width de stage.
<static> | sg.version [Read Only] es información sobre versions de la librería sg.

Method Summary
Method Attributes | Method Name and Description
--- | ---
<static> | sg.actionAttr(element) Ejecuta la función action del atributo personalizado definedo en la etiqueta personalizada.
<static> | sg.addCustomAttr(option) Añadir atributos personalizados.
<static> | sg.addCustomTag(option) Añadir etiquetas personalizadas.
<static> | sg.addInit(callback) Añadir la función de inicialización (callback).
<static> | sg.disabled(elementOrSelector) Deshabilitar los eventos en el componente, y configura el cursor por defecto.
<static> | sg.enabled(elementOrSelector) Deshabilitar los eventos en el componente, y configura el cursor como puntero.
<static> | sg.extend(property) Se puede añadir o extender funciones en sg.
<static> | sg.fadeIn(elementOrSelector) jQuery.fadeIn("slow")
<static> | sg.fadeOut(elementOrSelector) jQuery.fadeOut("slow")
<static> | sg.hide(elementOrSelector) jQuery.hide
<static> | sg.inArray(element, array, index) Verificar si el objeto está incluido en el array.
<static> | sg.init(callback) En el caso de que se pase la función (callback) como función de inicialización o parámetro, se ejecuta primero la inicialización y luego la función.
<static> | sg.initAttr(element) La función de inicialización sobre los atributos configurados al definir la etiqueta personalizada.
<static> | sg.isArray(object) Verificar si el objeto es array.
<static> | sg.isEmptyObject(object) Verificar si el objeto es un objeto vacío.
<static> | sg.isFunction(object) Verificar si el objeto es función.
<static> | sg.isNumeric(object) Verificar si el objeto es número.
<static> | sg.isWindow(object) Verificar si el objeto es objeto de window.
<static> | sg.setLoadingImage(path) Configurar la ruta de la imagen de cargando.
<static> | sg.setOption(elementOrSelector, options) Se guarda el valor a ser aplicado al ejecutar la etiqueta personalizada en $(target).data("options").
<static> | sg.setScaleMode(scaleMode) Configura scaleMode.
<static> | sg.setStage(elementOrSelector) Configura stage.
<static> | sg.show(elementOrSelector) jQuery.show
<static> | sg.super(arguments) importa la etiqueta original desde la función extendida a través de sg.extend.
<static> | sg.type() Devuelve data type del objeto.

Namespace Detail
sg
sg library es una librería que requiere jQuery.
Ofrece configuración de scaleMode, atributos personalizados y API para la producción de etiquetas personalizadas.
Author: taejin (drumtj@gmail.com).

Since:
  2014.09.22

Field Detail
<static> {jQuery Object} sg.$body
[Read Only] $("body")

<static> {jQuery Object} sg.$content
[Read Only] Es un contenedor que contiene los elementos hijos de stage. Se crea cuando se configura $stage.

<static> {jQuery Object} sg.$stage
[Read Only] Es un elemento configurado como stage. Se lo configura con sg.setStage.

<static> {jQuery Object} sg.$window
[Read Only] $(window)

<static> {string} sg.scaleMode
[Read Only] Método de escala de stage. Se lo configura con Sg.setScaleMode y se puede colocar "showall", "exactfit" o "none" como su valor.

<static> {number 0.0 ~ 1.0} sg.scaleX
[Read Only] Es el valor del eje X de stage. Se calcula el valor cuando se ajusta scaleMode como la función de sg.set. Su proporción se calcula en base del width de stage.

<static> {number 0.0 ~ 1.0} sg.scaleY
[Read Only] stage의 Es el valor del eje Y de stage. Se calcula el valor cuando se ajusta scaleMode como la función de sg.set. Su proporción se calcula en base del width de stage.

<static> {number} sg.stageHeight
[Read Only] El valor de height de stage. Se importa el valor de height de stage al configurar stage con la función de set Stage.

<static> {number} sg.stageWidth
[Read Only] El valor de width de stage. Se importa el valor de width de stage al configurar stage con la función de set Stage.

<static> {string} sg.version
[Read Only] es información sobre versions de la librería sg.
Method Detail
<static> sg.actionAttr(element)
Ejecuta la función action del atributo personalizado definedo en la etiqueta personalizada.

    sg.actionAttr( element );

Parameters:
{object} element

<static> sg.addCustomAttr(option)
Añadir atributos personalizados.
Al definir los atributos, se puede colocar true en el valor de applyAll con el fin de utlizarlos en todas las etiquetas.
Cuando el valor es false, se habilita la función del atributo al usarlo en la etiqueta personalizada. En general, los atributos personalizados definidos poseen una función especial, y esta función es habilitada con los eventos de las etiquetas personalizadas, y por ende, se deja el valor básico de applyAll como false.

    //script
    sg.addCustomAttr({
    	name: "sg-fadeIn",
    	init: function( element, attrValue ){
    		$( element ).fadeIn();
    	},
    	applyAll: true
    });
    //html
    <div sg-fadeIn> ABCD </div>

    //script
    sg.addCustomAttr({
    	name: "sg-color",
    	init: function( element, attrValue ){
    		$( element ).css( "color", attrValue );
    	},
    	applyAll: true
    });
    //html
    <div sg-color="red"> ABCD </div>

    sg.addCustomAttr({
    	name: "sg-alert",
    	action: function( element, attrValue ){
    		if( attrValue ) alert( attrValue );
    	}
    });

Parameters:
{object} option
  - inicializar el objeto de atributo personalizado
{string} option.name
  - nombre de atributo personalizado.
{function} option.init Optional, Default: undefined
  - función de inicialización.
{function} option.action Optional, Default: undefined
  - función a ejecutar: se ejecuta cuando se procede los eventos de la etiquetas personalizadas que utilitza estos atributos personalizados.
{boolean} option.applyAll Optional, Default: true
  - determina si se habilita la función de este atributo en todas las etiquetas básicas.

See:
  sg.addCustomTag referir la función definida para etiquetas personalizdas.

<static> sg.addCustomTag(option)
Añadir etiquetas personalizadas.
El mecanismo básico de la etiqueta personalizada es reemplazar las líneas de código html.
Después de la carga de la página, se busca las etiquetas personalizadas en el body de html, y las reemplaza a las etiquetas básicas definidas.
Al definir las etiquetas personalizadas, se escribe el nombre de la etiqueta original en originTag. Puede ser que las etiquetas personalizadas tengan evento o no. Se puede crear una etiqueta personalizada que sirve para cambiar la estructura interna de la etiqueta definiendo una función en tagInit. Por otra parte, se puede crear las etiquetas personalizadas que se habilitan con eventos específicos con una definión de función eventHandle.

    //script
    sg.addCustomTag({
    	name: "sg-depth",
    	tagInit: function( element ){
    		$("<p></p>").append( $( element ).contents() ).appendTo( $( element ) );
    	}
    });
    //html
    <sg-depth> ABCD <sg-depth>
    //result
    <sg-depth> <p>ABCD</p> <sg-depth>

    //script
    sg.addCustomTag({
    	name: "sg-h1",
    	attr: [ "sg-color", "sg-alert" ],
    	tagInit: function( element ){
    		$( element ).css( "font-size", "40pt" );
    	},
    	event: "click",
    	eventHandle: function( element ){
    		$( element ).animate( {"font-size": "80pt"} );
    	}
    });
    //html
    <sg-h1 sc-color="blue" sg-alert="hello!"> ABCD </sg-h1>

Parameters:
{object} option
  - inicializar el objeto de etiqueta personalizado
{string} option.name
  - Nombre de etiqueta personalizada.
{string} option.originTag Optional, Default: "div"
  - El nombre de la etiqueta a ser reemplazada.
{string} option.id Optional, Default: "data-sg-id={name of custom tag}"
  - Identificador de etiqueta personalizada. Si no es un caso específico, se usa el valor básico.
{array} option.attr Optional, Default: undefined
  - un array donde se listan los nombres de los atributos personalizados a ser usados en la etiqueta personalizada.
{function} option.init Optional, Default: undefined
  - se define las funciones si hay algo que se tiene que ejecutar al inicializar.
{function} option.tagInit Optional, Default: undefined
  - se define las funciones si hay algo que se tiene que ejecutar en cada etiqueta al inicializar.
{string} option.event Optional, Default: undefined
  - si se habilita con un evento específico, se escribe el nombre.
{function} option.eventHandle Optional, Default: undefined
  - se define la función que ejecute evento.

See:
  jQuery.getCustomTag Hacer referencia la función extraída de la etiqueta personalizada.
  sg.addCustomAttr Hacer referencia la función definida del atributo personalizado.

<static> sg.addInit(callback)
Añadir la función de inicialización (callback). Las funciones (callback) añadidas se ejecutan después de la inicialización.

    sg.addInit( function(){} );

Parameters:
{function} callback

<static> {jQuery Object} sg.disabled(elementOrSelector)
Deshabilitar los eventos en el componente, y configura el cursor por defecto.

    sg.disabled( this );
    sg.disabled( '#myButton' );
    sg.disabled( $.getCustomTag( 'sg-btn-hide' ) );

Parameters:
{object} elementOrSelector

Returns:
  objeto de jQuery

<static> {jQuery Object} sg.enabled(elementOrSelector)
Deshabilitar los eventos en el componente, y configura el cursor como puntero.

    sg.enabled( this );
    sg.enabled( '#myButton' );
    sg.enabled( $.getCustomTag( 'sg-btn-hide' ) );

Parameters:
{object} elementOrSelector

Returns:
  objeto de jQuery

<static> sg.extend(property)
Se puede añadir o extender funciones en sg.

    sg.extend({
    	myfunc: function( ){
    		//TO DO
    	}
    });

    sg.myfunc();

Parameters:
{object} property

See:
  sg.super Referencia

<static> sg.fadeIn(elementOrSelector)
jQuery.fadeIn("slow")

    sg.fadeIn( 'p' );	//$( 'p' ).fadeIn( 'slow' );
    sg.fadeIn( this );	//$( this ).fadeIn( 'slow' );

Parameters:
{object} elementOrSelector

<static> sg.fadeOut(elementOrSelector)
jQuery.fadeOut("slow")

    sg.fadeOut( 'p' );	//$( 'p' ).fadeOut( 'slow' );
    sg.fadeOut( this );	//$( this ).fadeOut( 'slow' );

Parameters:
{object} elementOrSelector

<static> sg.hide(elementOrSelector)
jQuery.hide

    sg.hide( 'p' );	//$( 'p' ).hide();
    sg.hide( this ); //$( this ).hide();

Parameters:
{object} elementOrSelector

<static> {string} sg.inArray(element, array, index)
Verificar si el objeto está incluido en el array. Usar la función inArray de jQuery.

Parameters:
{object} element
{array} array
{number} index

Returns:
  true o false

<static> sg.init(callback)
En el caso de que se pase la función (callback) como función de inicialización o parámetro, se ejecuta primero la inicialización y luego la función.
En el caso de sg.init(), se ejecuta primero html content(contenido de html) internamente y la inicialización.
Si hay algo que se debe ejecutar después de la inicialización, se pasa la función (callback) al parámetro de init().

    sg.setStage( "#stage" );
    sg.setScaleMode( "showall" );
    sg.init();

    sg.setStage( "#stage" );
    sg.setScaleMode( "showall" );
    sg.init( function(){} );

Parameters:
{function} callback Optional, Default: undefined

<static> sg.initAttr(element)
La función de inicialización sobre los atributos configurados al definir la etiqueta personalizada.

    sg.initAttr( element );

Parameters:
{object} element

<static> {boolean} sg.isArray(object)
Verificar si el objeto es array. Usar la función isArray de jQuery.

Parameters:
{object} object

Returns:
  true o false

<static> {boolean} sg.isEmptyObject(object)
Verificar si el objeto es un objeto vacío. Usar la función isEmptyObject de jQuery.

Parameters:
{object} object

Returns:
  true o false

<static> {boolean} sg.isFunction(object)
Verificar si el objeto es función. Usar isFunction de jQuery.

Parameters:
{object} object

Returns:
  true o false

<static> {boolean} sg.isNumeric(object)
Verificar si el objeto es número. Usar la función isNumeric de jQuery.

Parameters:
{object} object

Returns:
  true o false

<static> {boolean} sg.isWindow(object)
Verificar si el objeto es objeto de window. Usar la función isWindow de jQuery.

Parameters:
{object} object

Returns:
  true o false

<static> sg.setLoadingImage(path)
Configurar la ruta de la imagen de cargando. La imagen configurada se visualiza en la pantalla durante la ejecución de página.

    sg.setLoadingImage( '../common/img/progress.gif' );

Parameters:
{string} path

<static> sg.setOption(elementOrSelector, options)
Se guarda el valor a ser aplicado al ejecutar la etiqueta personalizada en $(target).data("options").

    sg.setOption( element );

    sg.setOption( element , {myClicked: false} );

Parameters:
{object} elementOrSelector
  - elemento o selector de jQuery
{object} options Optional, Default: undefined
  - Objeto con el conjunto de valores

<static> sg.setScaleMode(scaleMode)
Configura scaleMode. Se habilita siempre y cuando tenga configurado el stage, y hay modos de "showall", "exactfit" y "none".

    sg.setStage( "#stage" );
    sg.setScaleMode( "showall" );

    sg.setStage( "#stage" );
    sg.setScaleMode( "exactfit" );

Parameters:
{string} scaleMode

<static> sg.setStage(elementOrSelector)
Configura stage. El stage configurado tiene acceso al sg.$stage. El stage es el criterio de controlar la escala.

    sg.setStage( "#stage" );

Parameters:
{object} elementOrSelector

<static> sg.show(elementOrSelector)
jQuery.show

    sg.show( 'p' );	//$( 'p' ).show();
    sg.show( this ); //$( this ).show();

Parameters:
{object} elementOrSelector

<static> {*} sg.super(arguments)
importa la etiqueta original desde la función extendida a través de sg.extend.

    sg.extend({
    	myfunc: function( str ){
    		return '<<' + str + '>>';
    	}
    });

    sg.myfunc( 'abc' ); //return "<>"

    sg.extend({
    	myfunc: function( str ){
    		return this.super( str.toUpperCase() );
    	}
    });

    sg.myfunc( 'abc' ); //return "<>"

Parameters:
{object} arguments Optional, Default: undefined
  Parámetros de la función original.

Returns:
  {*} el valor devuelto de la función original.

See:
  sg.extend Refencia

<static> {string} sg.type()
Devuelve data type del objeto. Usar la función type de jQuery.

Parameters:
{object}

Returns:
  true o false

Documentation generated by JsDoc Toolkit 2.4.0 on Fri Sep 26 2014 19:26:13 GMT+0900 (KST)