Page 19 of 28

Re: HMGSCRIPT 2012: Programming For The Web in The Right Way

Posted: Tue Jun 26, 2012 7:21 pm
by Roberto Lopez
HMGSCRIPT R22

A lot of new things:

- Login() / Logout().
- CheckBox.
- ComboBox.
- Window function renamed to Form.
- All widgets have methods now.
- cId and cParentId parameters eliminated for easier use (only oParent needed now).
- Eliminated contributed code, since the internal library changes turned unusable.

This is the updated reference:

Code: Select all

HMGSCRIPT 2012 FUNCTION REFERENCE (R022)
----------------------------------------


FORM: 
-----

Element: DIV 

You can use all the properties, events and methods availables for it via DOM.

Syntax:

	Form( cCaption , nWidth , nHeight )

Methods:

	- release( cValue )
	- getId()

Example:

	oWin = new Form ( "Window Demo", 600 , 300 );

	oWin.release()

------------------------------------------------------------------------------------------------

BUTTON: 
-------

Element: INPUT (Type: BUTTON)

You can use all the properties, events and methods availables for it via DOM.

Syntax:

	Button( oParent , nRow , nCol , cCaption , cOnClick )


Methods:

	- setValue( cValue )
	- getValue()
	- getId()

Example:

	oBtn = new Button( oForm , 
		50 , 240 , 
		"Set Btn Value" , 
		"oBtn.setValue('New Value')" );  

------------------------------------------------------------------------------------------------

LABEL: 
------

Element: SPAN

You can use all the properties, events and methods availables for it via DOM.

Syntax:

	Label( oParent , nRow , nCol , cValue )

Methods:

	- getId()

------------------------------------------------------------------------------------------------

TEXTBOX: 
--------

Element: INPUT (Type: TEXT)

You can use all the properties, events and methods availables for it via DOM.

Syntax:

	TextBox( oParent , nRow , nCol , cValue )

Methods:

	- setValue( cValue )
	- getValue()
	- getId()

Example:

	oText = new TextBox( oForm , 130, 230, "TextBox!" );

	alert( oText.getValue() );

------------------------------------------------------------------------------------------------

CHECKBOX: 
---------

Element: INPUT (Type: CHECKBOX)

You can use all the properties, events and methods availables for it via DOM.

Syntax:

	CheckBox( oParent , nRow , nCol , bChecked )

Methods:

	- check()
	- unCheck()
	- isChecked()
	- getId()

Example:

	oCheck = new CheckBox( oForm , 140 , 280 , true );

	alert(oCheck.isChecked())
	oCheck.check()
	oCheck.unCheck()

------------------------------------------------------------------------------------------------

COMBOBOX: 
---------

Element: SELECT 

You can use all the properties, events and methods availables for them via DOM.

Syntax:

	ComboBox( oPArent , nRow , nCol , aText , aValues )

Methods:

	- getValue( nIndex )
	- setValue( nIndex , cValue )
	- setSelectedIndex ( nIndex )
	- getSelectedIndex()
	- getId()

Example:

	oConbo = new ComboBox( oForm , 140 , 270 , 
		[ 'one' , 'two' , 'three' ] , 
		[ 'value one' , 'value two' , 'value three' ] );

	alert ( oConbo.getSelectedIndex() );

------------------------------------------------------------------------------------------------

IMAGE: 
------

Element: IMAGE

You can use all the properties, events and methods availables for it via DOM.

Syntax:

	Image( oParent , nRow , nCol , cSrc )

Methods:

	- getId()

------------------------------------------------------------------------------------------------

PANEL: 
------

Element: DIV 

You can use all the properties, events and methods availables for it via DOM.

Syntax:

	Panel( oParent , nRow , nCol , nWidth , nHeight , cValue )

Methods:

	- getId()

------------------------------------------------------------------------------------------------

APPEND: 
-------

Appends a record.

Syntax:

	Append( cTable , aColumns , aValues )

------------------------------------------------------------------------------------------------

DELETE: 
-------

Delete records matching the cForExpr.

Syntax:

	Delete( cTable , cForExpr )

------------------------------------------------------------------------------------------------

MODIFY: 
-------

Modifies records matching the cForExpr.

Syntax:

	Modify( cTable , aColumns , aValues , cForExpr )

------------------------------------------------------------------------------------------------

LOGIN:
------

Syntax:

	Login( cUser , cPassword )

------------------------------------------------------------------------------------------------

LOGOUT:
-------

Syntax:

	Logout()

------------------------------------------------------------------------------------------------

BROWSE:
-------

Elements: DIV/TABLE

Creates an HTML table inside a scrollable DIV, loaded with the specified dbf query.

Syntax:

	Browse( oParent , nRow, nCol, nWidth, nHeight, cDbfFile, aColumns, 
	aHeaders , cForExpr , cOrder  )

Methods:

	- refresh()
	- getSelectedRows()
	- getRowCount()
	- select()
	- unSelect()
	- getCell(nRow,nCount)
	- getSelectedRowCount()
	- getId()

	
Example:

	oBrowse = new Browse( oParent ,	050 , 050 , 550 , 300 , 
		'test' , [ 'code' , 'first' , 'last' , 'birth' , 'married' ] , 
		[ 'Code' , 'First' , 'last' , 'Birth' , 'Married' ] , 
		'code < 100' , 
		'code' );

	oBrowse.refresh()

------------------------------------------------------------------------------------------------
Enjoy!

Re: HMGSCRIPT 2012: Programming For The Web in The Right Way

Posted: Wed Jun 27, 2012 3:01 am
by luisvasquezcl
Excelente trabajo Roberto, muchas gracias.
Aprovecho para informarte que ya mi tabla esta leyendo datos desde una dbf con ajax, pero estoy trabajando en el grabado de datos que estoy teniendo problemas.
saludos cordiales,
Luis Vasquez

Re: HMGSCRIPT 2012: Programming For The Web in The Right Way

Posted: Wed Jun 27, 2012 4:03 am
by Roberto Lopez
luisvasquezcl wrote:Excelente trabajo Roberto, muchas gracias.
Aprovecho para informarte que ya mi tabla esta leyendo datos desde una dbf con ajax, pero estoy trabajando en el grabado de datos que estoy teniendo problemas.
saludos cordiales,
Luis Vasquez
Gracias.

Creo que ya no va a haber cambios mayores en el diseño de la librería, por lo cual ya es seguro desarrollar sobre ella.

Re: HMGSCRIPT 2012: Programming For The Web in The Right Way

Posted: Wed Jun 27, 2012 4:05 am
by Rathinagiri
Wow! Wonderful Roberto!

Re: HMGSCRIPT 2012: Programming For The Web in The Right Way

Posted: Wed Jun 27, 2012 5:22 am
by mol
Lookks very impressing!
THX Roberto!

Re: HMGSCRIPT 2012: Programming For The Web in The Right Way

Posted: Wed Jun 27, 2012 1:33 pm
by Roberto Lopez
HMGSCRIPT R23

New in this release:

- nInnerWidth parameter for browse.

- New Query function.

- New EditBox class.

- Improved security.

This is the full reference:
HMGSCRIPT 2012 FUNCTION REFERENCE (R023)

FORM:

Element: DIV

You can use all the properties, events and methods availables for it via DOM.

Syntax:

Form( cCaption , nWidth , nHeight )

Methods:

- release( cValue )
- getId()

Example:

oWin = new Form ( "Window Demo", 600 , 300 );

oWin.release()

------------------------------------------------------------------------------------------------

BUTTON:

Element: INPUT (Type: BUTTON)

You can use all the properties, events and methods availables for it via DOM.

Syntax:

Button( oParent , nRow , nCol , cCaption , cOnClick )


Methods:

- setValue( cValue )
- getValue()
- getId()

Example:

oBtn = new Button( oForm ,
50 , 240 ,
"Set Btn Value" ,
"oBtn.setValue('New Value')" );

------------------------------------------------------------------------------------------------

LABEL:

Element: SPAN

You can use all the properties, events and methods availables for it via DOM.

Syntax:

Label( oParent , nRow , nCol , cValue )

Methods:

- getId()

------------------------------------------------------------------------------------------------

TEXTBOX:

Element: INPUT (Type: TEXT)

You can use all the properties, events and methods availables for it via DOM.

Syntax:

TextBox( oParent , nRow , nCol , cValue )

Methods:

- setValue( cValue )
- getValue()
- getId()

Example:

oText = new TextBox( oForm , 130, 230, "TextBox!" );

alert( oText.getValue() );

------------------------------------------------------------------------------------------------

EDITBOX:

Element: INPUT (Type: TEXTAREA)

You can use all the properties, events and methods availables for it via DOM.

Syntax:

EditBox( oParent , nRow , nCol , cValue )

Methods:

- setValue( cValue )
- getValue()
- getId()

Example:

oEdit = new EditBox( oForm , 130, 230, "TextBox!" );

alert( oEdit.getValue() );

------------------------------------------------------------------------------------------------

CHECKBOX:

Element: INPUT (Type: CHECKBOX)

You can use all the properties, events and methods availables for it via DOM.

Syntax:

CheckBox( oParent , nRow , nCol , bChecked )

Methods:

- check()
- unCheck()
- isChecked()
- getId()

Example:

oCheck = new CheckBox( oForm , 140 , 280 , true );

alert(oCheck.isChecked())
oCheck.check()
oCheck.unCheck()

------------------------------------------------------------------------------------------------

COMBOBOX:

Element: SELECT

You can use all the properties, events and methods availables for them via DOM.

Syntax:

ComboBox( oPArent , nRow , nCol , aText , aValues )

Methods:

- getValue( nIndex )
- setValue( nIndex , cValue )
- setSelectedIndex ( nIndex )
- getSelectedIndex()
- getId()

Example:

oConbo = new ComboBox( oForm , 140 , 270 ,
[ 'one' , 'two' , 'three' ] ,
[ 'value one' , 'value two' , 'value three' ] );

alert ( oConbo.getSelectedIndex() );

------------------------------------------------------------------------------------------------

IMAGE:

Element: IMAGE

You can use all the properties, events and methods availables for it via DOM.

Syntax:

Image( oParent , nRow , nCol , cSrc )

Methods:

- getId()

------------------------------------------------------------------------------------------------

PANEL:

Element: DIV

You can use all the properties, events and methods availables for it via DOM.

Syntax:

Panel( oParent , nRow , nCol , nWidth , nHeight , cValue )

Methods:

- getId()

------------------------------------------------------------------------------------------------

APPEND:

Appends a record.

Syntax:

Append( cTable , aColumns , aValues )

------------------------------------------------------------------------------------------------

DELETE:

Delete records matching the cForExpr.

Syntax:

Delete( cTable , cForExpr )

------------------------------------------------------------------------------------------------

MODIFY:

Modifies records matching the cForExpr.

Syntax:

Modify( cTable , aColumns , aValues , cForExpr )

------------------------------------------------------------------------------------------------

LOGIN:

Syntax:

Login( cUser , cPassword )

------------------------------------------------------------------------------------------------

LOGOUT:

Syntax:

Logout()

------------------------------------------------------------------------------------------------

BROWSE:

Elements: DIV/TABLE

Creates an HTML table inside a scrollable DIV, loaded with the specified dbf query.

Syntax:

Browse( oParent , nRow, nCol, nWidth, nHeight, cDbfFile, aColumns,
aHeaders , cForExpr , cOrder , nInnerWidth )

Methods:

- refresh()
- getSelectedRows()
- getRowCount()
- select()
- unSelect()
- getCell(nRow,nCount)
- getSelectedRowCount()
- getId()


Example:

oBrowse = new Browse( oParent , 050 , 050 , 550 , 300 ,
'test' , [ 'code' , 'first' , 'last' , 'birth' , 'married' ] ,
[ 'Code' , 'First' , 'last' , 'Birth' , 'Married' ] ,
'code < 100' ,
'code' , 700 );

oBrowse.refresh()

------------------------------------------------------------------------------------------------

QUERY:

Returns a recordset from a server table as an array.

Syntax:

Query ( cDbf, aColumns, cForExpr, cOrder )

Example:

aRecordSet = Query ( 'test' ,
[ 'code' , 'first' , 'last' , 'birth' , 'married' ] ,
'code<=10' , '' );

------------------------------------------------------------------------------------------------
I'll stop development again, to continue learning about JavaScript, to be sure that the next design decisions be correct.

I'm happy because with the current release, is already possible to us, to write applications for the web, with the same logic and easiness as HMG desktop applications.

We have an extra bonus: We can share the same dbf files between LAN (file server) based desktop applications and the web (a dream made true).

For new developments requiring use shared MySql data in standard hosting services, we simply need to create PHP equivalents for the current Harbour server functions (a really easy task).

Please, remember that you can create your own server modules in that case that you need it. It is really easy too. Please take a look at the sources.

Enjoy!

Re: HMGSCRIPT 2012: Programming For The Web in The Right Way

Posted: Wed Jun 27, 2012 2:13 pm
by luisvasquezcl
Hola,
Aqui va mi granito de arena.
Clase tabla conectada a Dbf via Ajax.
demos:
1. Maestro - detalle conectado a dbf
2. ABM de tabla.
3. Demo con array.

saludos cordiales,
Luis Vasquez.

Re: HMGSCRIPT 2012: Programming For The Web in The Right Way

Posted: Wed Jun 27, 2012 3:11 pm
by Roberto Lopez
luisvasquezcl wrote:Hola,
Aqui va mi granito de arena.
Clase tabla conectada a Dbf via Ajax.
demos:
1. Maestro - detalle conectado a dbf
2. ABM de tabla.
3. Demo con array.

saludos cordiales,
Luis Vasquez.
Gracias Luis!

Re: HMGSCRIPT 2012: Programming For The Web in The Right Way

Posted: Wed Jun 27, 2012 5:05 pm
by luisvasquezcl
Roberto,
una observacion a la libreria.
leyendo sobre javascript indican que es mejor definir las funciones (metodos ) fuera de la declaracion de la clase para mejorar el uso de memoria.
por ejemplo
La clase form tiene el metodo this.release, es mejor declararlo de la siguiente forma :

form.prototype.release = function() {
... lo que tiene que hacer.
}

Además, el div Form deberia ser contenido por el div Cover pero por lo que veo lo asigna al objeto body.
No es un problema pero no tendria sentido crear el div Cover si no se utiliza.
la solucion:

1. Crear el cover.

var cover = document.createElement( "div" ) ;
cover.className = "cover" ;
cover.style.width = document.body.clientWidth ;
cover.style.height = document.body.clientHeight ;
cover.id = 'cover_' + cId ;

document.body.appendChild( cover ) ;


2. crear el window.
var window = document.createElement( "div" ) ;
window.className = "window" ;
window.innerHTML = "<h1>" + cCaption + "</h1>" ;
window.style.top = ( document.body.clientHeight / 2 ) - ( nHeight / 2 ) ;
window.style.left = ( document.body.clientWidth / 2 ) - ( nWidth / 2 ) ;
window.style.width = nWidth ;
window.style.height = nHeight ;
window.id = cId ;

3. agregar el cover
cover.appendChild( window );


saludos cordiales,
Luis Vasquez.

Re: HMGSCRIPT 2012: Programming For The Web in The Right Way

Posted: Wed Jun 27, 2012 5:28 pm
by luisvasquezcl
Estimado,
Error en la linea 233 demo.js
Esta linea da error en Firefox pero funciona bien en chrome.

function test_8()
{
oWin = new Form( "CheckBox Demo", 600 , 300 );

oCheck = new CheckBox( oWin , 140 , 280 , true );

233 -> Button( oWin , 240 , 080 , "isChecked" , "alert(oCheck.isChecked())" );
Button( oWin , 240 , 190 , "check" , "oCheck.check()" );
Button( oWin , 240 , 310 , "unCheck" , "oCheck.unCheck()" );
Button( oWin , 240 , 430 , "Close" , "oWin.release()" );

}
saludos cordiales,
Luis Vasquez