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

Moderator: Rathinagiri

User avatar
Roberto Lopez
HMG Founder
Posts: 4023
Joined: Wed Jul 30, 2008 6:43 pm

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

Post 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!
Attachments
hmgs022.zip
(1.42 MiB) Downloaded 298 times
Regards/Saludos,

Roberto


(Veritas Filia Temporis)
User avatar
luisvasquezcl
Posts: 1261
Joined: Thu Jul 31, 2008 3:23 am
Location: Chile
Contact:

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

Post 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
User avatar
Roberto Lopez
HMG Founder
Posts: 4023
Joined: Wed Jul 30, 2008 6:43 pm

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

Post 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.
Regards/Saludos,

Roberto


(Veritas Filia Temporis)
User avatar
Rathinagiri
Posts: 5481
Joined: Tue Jul 29, 2008 6:30 pm
DBs Used: MariaDB, SQLite, SQLCipher and MySQL
Location: Sivakasi, India
Contact:

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

Post by Rathinagiri »

Wow! Wonderful Roberto!
East or West HMG is the Best.
South or North HMG is worth.
...the possibilities are endless.
User avatar
Roberto Lopez
HMG Founder
Posts: 4023
Joined: Wed Jul 30, 2008 6:43 pm

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

Post 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!
Attachments
hmgs023.zip
(1.42 MiB) Downloaded 329 times
Regards/Saludos,

Roberto


(Veritas Filia Temporis)
User avatar
luisvasquezcl
Posts: 1261
Joined: Thu Jul 31, 2008 3:23 am
Location: Chile
Contact:

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

Post 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.
Attachments
test.zip
(109.12 KiB) Downloaded 282 times
User avatar
Roberto Lopez
HMG Founder
Posts: 4023
Joined: Wed Jul 30, 2008 6:43 pm

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

Post 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!
Regards/Saludos,

Roberto


(Veritas Filia Temporis)
User avatar
luisvasquezcl
Posts: 1261
Joined: Thu Jul 31, 2008 3:23 am
Location: Chile
Contact:

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

Post 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.
User avatar
luisvasquezcl
Posts: 1261
Joined: Thu Jul 31, 2008 3:23 am
Location: Chile
Contact:

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

Post 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
Post Reply