Safari and Opera support - alpha preview | datagrid, gridview, jquery grid examples, javascript ui

It is possible now to download and play with an early alpha release of the coming ActiveWidgets 2.5 which includes support for Safari, Opera and Konqueror browsers -

http://www.activewidgets.com/download/activewidgets-2.5a1-trial.zip

This is the first ActiveWidgets release which will work on all major browsers. It will fully support Safari 3.0 and Opera 9.0 and most features will also work on Safari 2.0 and Konqueror 3.5. That would make the browser support list as -

* IE 5.5, 6.0, 7.0
* Firefox 1.0, 1.5, 2.0
* Safari 2.0, 3.0
* Opera 9.0
* Konqueror 3.5

The goal is fully support Safari 3.0 and Opera 9.0 while doing as much as possible on Safari 2.0 and Konqueror. Some features will not be implemented on Safari 2.0 (XML data source, input box styling) and Konqueror (XML data source).

Other new features in the current alpha build -

* support for text indices, i.e. [{price: 123.00, qty: 50; total:...},{...}]
* deferred grid initialization, does not block rest of the page
* improved grid performance
* improved navigation API - selectCell(), selectRow() etc.
* lots of small bugs fixed

Note that this is an early alpha release, so some features are not completed yet.

More details here -

http://www.activewidgets.com/general.bugs/2-5.html

one more thing ...

AW 2.5 also works in Adobe AIR, Mozilla XULrunner and Microsoft HTA.

:-)

Hi Alex,

I checked this today and it seems to have one major issue.
I know you said this is an early alpha, but I'm posting the details here in case you don't already know about the bug.

The following code used to display a grid with a bottom panel, but with the 2.5 alpha, there is just the outline of the grid in FireFox and it displays fine in IE7.

<html>

<head>

    <script src="activewidgets/runtime/lib/aw.js"></script>

    <link href="activewidgets/runtime/styles/xp/aw.css" rel="stylesheet"></link>

</head>

<body>

<script>

var obj = new AW.Grid.Extended;

obj.setCellText(function(i, j){return j + "." + i});

obj.setHeaderText("header");



obj.setColumnCount(10);

obj.setRowCount(100);



obj.setCellEditable(true);



var toolbar = new AW.HTML.DIV;

toolbar.setId("toolbar");



toolbar.setContent("input", "text");



obj.defineTemplate("bottomLine", toolbar);



obj.setLayoutTemplate(new AW.Panels.Horizontal);

obj.setPanelTemplate(function(i){

    switch(i){

        case 1: return this.getScrollTemplate();

        case 2: return this.getBottomLineTemplate();

    }

});



obj.setPanelHeight(23, 2); //bottom line



document.write(obj);

</script>

</body>

</html>

Ankur,

Unfortunately you hit the area (panels) which had changed in 2.5 and is no longer compatible.

There are two differences in the panels implementation in 2.5a1. First, it is now required to call changePanelWidth(width, panel) and changePanelHeight(height, panel) to update panel size. And second, the panel indices had changed to "top", "center", "bottom" (instead of 0,1,2) as AW now supports string indices.

Here is the corrected code -

<html>

<head>

    <script src="../../runtime/lib/aw.js"></script>

    <link href="../../runtime/styles/xp/aw.css" rel="stylesheet"></link>

</head>

<body>

<script>

var obj = new AW.Grid.Extended;

obj.setCellText(function(i, j){return j + "." + i});

obj.setHeaderText("header");



obj.setColumnCount(10);

obj.setRowCount(100);



obj.setCellEditable(true);



var toolbar = new AW.HTML.DIV;

toolbar.setId("toolbar");



toolbar.setContent("input", "text");



obj.defineTemplate("bottomLine", toolbar);



obj.setLayoutTemplate(new AW.Panels.Horizontal);

obj.setPanelTemplate(function(i){

    switch(i){

        case "center": return this.getScrollTemplate();

        case "bottom": return this.getBottomLineTemplate();

    }

});



obj.onPanelWidthChanged = function(width, panel){

    this.getLayoutTemplate().changePanelWidth(width, panel);

};



obj.onPanelHeightChanged = function(height, panel){

    this.getLayoutTemplate().changePanelHeight(height, panel);

};



obj.setPanelHeight(23, "bottom"); //bottom line



document.write(obj);

</script>

</body>

</html>

Safari and Opera support - alpha preview

Forum search