Code On Time: tips and tricks

Blog

tips and tricks

Wednesday, January 12, 2011Print Subscribe

Code On Time applications rely exclusively on Cascading Style Sheets (CSS) to provide all presentation elements of generated web applications with colors, fonts, backgrounds, borders, paddings, margins, and other embellishments.

Here is a typical screen that you will find in an application generated with the default theme.

If you load your application in Internet Explorer browser, press F12 to bring up the Developer Toolbar and select Disable | CSS option on the toolbar then the page will looks similar to the following screen shot.

As you can see the page is “black on white” with a few blue links and lacks any style. This allows for total customization of the user interface. You may choose to follow the route of complete user interface customization from scratch or add incremental enhancements to the existing themes provided by Code On Time.

Here is how you can proceed with minor enhancements.

Activate Developer Toolbar window and select Disable|CSS one more time to enable the stylesheets in the browser window.

Click on the “arrow” icon of the Developer Toolbar and inspect any column in a data row of the grid view. If the selection rectangle does not show up when you move the mouse pointer over the page then click the “arrow” again to turn the selection mode off and hit “refresh” icon. Try selecting the UI element on the page again. This is needed if you have activated the toolbar and then interacted with the page in the browser. The toolbar will not be aware of the changes produced by AJAX scripts.

The screen shot shows a thin blue box around the cell in the first row of the Products grid in Category Name column. The Developer Toolbar on top of the browser shows the HTML corresponding to the selection. Three CSS classes Cell, CategoryID, and StringType and assigned to the table cell.

We will change the presentation of CategoryID field column to occupy 200 pixels horizontally.

Open you project in Visual Studio or Visual Web Developer. Select the folder ~/App_Themes/MyCompany and add the new CSS stylesheet item to your project. “MyCompany” is the default namespace of Code On Time projects. If you have changed the namespace of your project then choose the corresponding folder in the Solution Explorer.

Enter the following CSS rule into the stylesheet.

.Cell.CategoryID
{
    width: 200px;
}

Run the project and refresh the contents of the browser window. The third column Category Name of the grid view is now substantially wider.

Use similar techniques to alter other elements of the user interface in your Code On Time applications.

Notice that sometimes your own CSS rules will come into conflict with the rules of core theme. Use the word “!important” right after the value of the CSS property as shown in the following example.

.Cell.CategoryID
{
    width: 200px !important;
}

Labels: Application Factory, Tips and Tricks, User Interface, Web 2.0

Thursday, December 30, 2010Print Subscribe

Installation Issues

Code On Time generator is a Windows application that hosts an Internet Explorer web browser within the boundaries of the main window. The code generator navigates to the HTML files stored locally on the hard drive of your computer. HTML files provide interactive user interface of the code generator based on JavaScript. No information is transmitted over the web to our server when you generate your applications. The input and output files of the code generator are stored entirely on your computer.

In a few instances there were reports of the code generator displaying a blank page with Code On Time logo at the top when the generator starts. No other user interface elements were present. Re-installation of the code generator would not help.

The issue has to do with the security settings of Internet Explorer.

Background

Internet Explorer allows controlling if execution of the JavaScript embedded into HTML pages is allowed.

The computer has five security zones, namely:

(0) Local Machine zone,
(1) Internet,
(2) Local intranet,
(3) Trusted sites, and
(4) Restricted sites.

However the Internet Explorer user interface allows users to configure only 4 of the 5 security zones using the Internet Explorer interface.

The Local Machine zone (0), is an implicit zone that exists on the local computer, security settings for this zone cannot be configured using the Internet Options Control Panel.

Any configuration done from the Internet Explorer interface have absolutely no effect on enabling scripts to run within Windows Applications on the local computer (a matter which also affects Code On Time code generator).

Steps to Reproduce

If you save the emphasized text below to the file named "Steps to reproduce.reg" and double-click the file to add the file entries to the registry then the script execution in the Local Machine Zone will become disabled. DO NOT DO THAT !!! Winking smile

REGEDIT4

[HKEY_LOCAL_MACHINE\Software\Microsoft\Windows\CurrentVersion\Internet Settings\Zones\0]

"1200"=dword:00000000
"1201"=dword:00000001
"1400"=dword:00000000
"1406"=dword:00000000
"1C00"=hex:00,00,02,00

[HKEY_LOCAL_MACHINE\Software\Policies\Microsoft\Windows\CurrentVersion\Internet Settings]

"Security_HKLM_only"=dword:00000001

Steps to Rectify

If you save the emphasized text presented below to the file "Script Permissions Fix.reg" and double-click the file to add the file entries to the registry then the script execution in the Local Machine Zone will be allowed. Code On Time generator will start functioning correctly.

REGEDIT4
[HKEY_LOCAL_MACHINE\Software\Microsoft\Windows\CurrentVersion\Internet Settings\Zones\0]
"1400"=dword:00000003
[HKEY_LOCAL_MACHINE\Software\Policies\Microsoft\Windows\CurrentVersion\Internet Settings]
"Security_HKLM_only"=dword:00000001

References

http://support.microsoft.com/kb/833633

This information has been provided courtesy of Gabriel Inya-Agha of Quickening Group.

Labels: Code Generator, Installation, Tips and Tricks

Thursday, November 18, 2010Print Subscribe

Detecting Attempts to Access a Protected Page

Q. I built an application using web site factory. The application has a
dedicated login page. If I login as "admin" and navigate to the
membership page, then log out and log back in as "user" (which does
not have rights to the membership page), I get stuck. I think because
"user" does not have rights to visit the last page I visited before I
logged out, I can not get past the login page without logging back in
as admin, navigating off of membership page, then logging back out.

This is the standard ASP.NET behavior. You are signed in as a "user" but the redirect URL still tries to access the membership page, which "user" is not accessible to "user" account.

There are two options to fix that:

1) Offer a static link to the home page of your application in ~/App_Code/Controls/Login.acxs. User can click on the link to access the home page and break the login auto-redirects.

2) Add the following line of code into ~/App_Code/Controls/Login.ascx.cs:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class Controls_Welcome : System.Web.UI.UserControl
{
    
    protected void Page_Load(object sender, EventArgs e)
    {
        if (Page.User.Identity.IsAuthenticated && 
                !String.IsNullOrEmpty(Request.Params["ReturnUrl"]))
            Response.Redirect("~/Pages/Home.aspx");
    }
}

The code will detect the RedirectUrl parameter in the page URL and redirect the user to home automatically.

Labels: Security, Tips and Tricks