Application Builder

Labels
AJAX(112) App Studio(7) Apple(1) Application Builder(245) Application Factory(207) ASP.NET(95) ASP.NET 3.5(45) ASP.NET Code Generator(72) ASP.NET Membership(28) Azure(18) Barcode(2) Barcodes(3) BLOB(18) Business Rules(1) Business Rules/Logic(140) BYOD(13) Caching(2) Calendar(5) Charts(29) Cloud(14) Cloud On Time(2) Cloud On Time for Windows 7(2) Code Generator(54) Collaboration(11) command line(1) Conflict Detection(1) Content Management System(12) COT Tools for Excel(26) CRUD(1) Custom Actions(1) Data Aquarium Framework(122) Data Sheet(9) Data Sources(22) Database Lookups(50) Deployment(22) Designer(177) Device(1) DotNetNuke(12) EASE(20) Email(6) Features(101) Firebird(1) Form Builder(14) Globalization and Localization(6) How To(1) Hypermedia(2) Inline Editing(1) Installation(5) JavaScript(20) Kiosk(1) Low Code(3) Mac(1) Many-To-Many(4) Maps(6) Master/Detail(36) Microservices(4) Mobile(63) Mode Builder(3) Model Builder(3) MySQL(10) Native Apps(5) News(18) OAuth(9) OAuth Scopes(1) OAuth2(13) Offline(20) Offline Apps(4) Offline Sync(5) Oracle(11) PKCE(2) Postgre SQL(1) PostgreSQL(2) PWA(2) QR codes(2) Rapid Application Development(5) Reading Pane(2) Release Notes(183) Reports(48) REST(29) RESTful(29) RESTful Workshop(15) RFID tags(1) SaaS(7) Security(81) SharePoint(12) SPA(6) SQL Anywhere(3) SQL Server(26) SSO(1) Stored Procedure(4) Teamwork(15) Tips and Tricks(87) Tools for Excel(2) Touch UI(93) Transactions(5) Tutorials(183) Universal Windows Platform(3) User Interface(338) Video Tutorial(37) Web 2.0(100) Web App Generator(101) Web Application Generator(607) Web Form Builder(40) Web.Config(9) Workflow(28)
Archive
Blog
Application Builder
Sunday, October 20, 2013PrintSubscribe
Allowing Access to Data Controller Views on Public Pages

The client library of apps created with Code On Time allows only authenticated users to interact with data. If a user is not authenticated by the app then a request to retrieve data will be denied. There are scenarios when anonymous users must be allowed to interact with application data.

Let’s create a public Customer Sign Up Form in the Northwind sample to illustrate this situation.

Select the project on the start page of the app generator and activate Project Designer. Create a new page with the following properties:

Property Value
Name SignUpForm
Roles ?

Value “?” specified in Roles will allow anonymous users to access page with signing in.

Right-click Customers data controller on Controllers tab and choose Copy in the menu.

Copying data controller reference to the clipboard.

Switch back to Pages tab, right-click Sign Up Form and choose Paste in the context menu.

Pasting a data controller reference on page of an app.

A data view view1 in container c101 will be created under the page node Sign Up Form.

A data view on the page on app created with Code On Time app generator.

Configure the data view as follows.

Section Property Value
Startup Action Command Name New
Startup Action Command Argument createForm1

Click Generate on the Project Designer toolbar.

Annonymous users are not authorized to access application data by default in Code On Time apps in Mobile and Desktop client.

The exception at the top of the page indicates that the view createForm1 is private. The anonymous user is not authorized to access data.

If you click Login and sign in as user / user123%, then an empty New Customers form will be displayed.

If we want to allow anonymous users to create new customer records using createForm1, then the view must be configured for Public access. Also the standard actions of the data controller Customers need to be adjusted to work in a perpetual “new customers” loop. The user will be prompted to create a new customer after a successful entry of a new record instead of displaying a list of existing customers.

Select the view Sign Up Form / c101 / view1 (Customers) in Project Explorer.

A data controller view selected on page in Project Explorer of Code On Time app generator.

Change the Access property of the view.

Property Value
Access Public

Now configure the action state machine of the data controller.

Create a new action in action group Sign Up Form / c101 / view (Customers) / Actions / ag2 (Form) with these properties:

Property Value
Command Name New
Command Argument createForm1
When Last Command Name Insert
When HRef (Regex) SignUpForm

The action Sign Up Form / c101 / Actions / ag2 (Form) / a100 will be activated only when the page Sign Up Form is loaded in a web browser. The action will display createForm1 in New mode every time a new record is created.

Then select each of the actions ag2 (Form) / a8, ag6 (ActionBar) – New / a3, and  ag6 (ActionBar) – New / a4 shown in the picture to configure them to be inactive on the page SignUpForm.

Property Value
Whe HRef (Regex) false:SignUpForm

Data controller actions that must be deactivated when SignUpForm is displayed to the user.

Property When HRef (Regex) is a regular expression evaluated against the current URL loaded in the address bar of the browser. If there is match then the action is active and taken into consideration by the action state machine. Otherwise the action is considered to be inactive. Placing “false:” in front of the property value will make an action inactive if the regex following after “false:” is matched to address bar URL.

Browse the app without signing in and confirm that new customers can be entered on Sign Up Form by anonymous users.

Customer 'Sign Up Form' in action.

The form will remain in “New” mode after a new customer is created.

Log in to verify that the record is stored in the database.

Authenticated users can interact with a full list of customers in our sample.

Sunday, October 20, 2013PrintSubscribe
Overview of Application Lifecycle Management

It is a common practice to place the application source code under the control of an ALM (application lifecycle management) system.

Web apps with Universal Mobile/Desktop Client created with Code On Time are standard ASP.NET applications. The entire source code is included in each project. There are no black-box DLLs or hidden runtimes.

It is easy to place a web application created with Code On Time under source control of an ALM.

Application generator maintains XML log files to track revisions of the project design alongside the source code of an app. This allows working on the app in a disconnected mode. It also makes it easy to merge changes from multiple developers.

The designer log changes are incremental. If two developers have changed the application design, then the XML log files must be merged, followed by a Refresh of the application design.  

Code On Time offers a free cloud synchronization service that enables automatic exchange of designer changes between team members. The project synchronization software is also available for purchase for in-house hosting.

Microsoft Team Foundation Service (TFS) is a popular ALM system. It is easy to place a Code On Time app under source control with TFS.

Sunday, October 20, 2013PrintSubscribe
Placing a Code On Time App under Source Control

Suppose that we have an application called “Northwind” that we need to place under source control with Microsoft Team Foundation Service (TFS).

Web apps created with Code On Time are contained in a single folder and organized by project type under My Documents\Code OnTime\Projects.

Location of the Northwind project.

The folder that needs to be synchronized is located at ~\My Documents\Code OnTime\Projects\Mobile Factory\Northwind in the picture above.

TFS organizes projects and assorted files into groups called “team projects”, which are themselves organized into collections. We will need to connect the ~\My Documents\Code OnTime\Projects\Mobile Factory\Northwind folder to a specific folder inside of a team project. The picture below shows the server folder organization in Source Control Explorer of Visual Studio after the project is added to TFS.

Note that Mobile Factory and Web Site Factory apps are contained under a master folder with the same name as the application project. The master folder also stores the Visual Studio solution file for the project. This is how TFS organizes projects of these types.

Folder layout in the TFS server.

Every other project type does not have a master folder. The Visual Studio solution file is stored directly in the project folder.

The Visual Studio solution file is stored directly in the project folder.

Let’s create a project and add it to the Team Foundation Service.

You will need to open a new TFS account if you do not already have one.

Connecting a Project to Team Foundation Server

Create a new web application. When complete, open the project in Visual Studio. Open the Team Explorer toolbar, typically available in the same window as the Solution Explorer. Click on the Connect icon on the toolbar to connect to team projects.

Connecting to a team project in Visual Studio.

Select the “Connect” link to activate the Connect to Team Foundation Server window. Click on the “Servers…” button.

Adding a TFS server.

Press “Add…”, and enter the URL of your server in the textbox.

Specifying the URL of a team foundation server to add to Visual Studio.

Press OK to save the server. You may need to log in to access the server. If there are no errors, press Close to close the Servers window, select the team project in the Team Projects list, and press Connect.

Adding the Solution to Source Control

Switch back to the Solution Explorer tab. Right-click on the solution, and press Add Solution to Source Control.

Adding a solution to source control.

Select the Team Project in Add Solution to Source Control window. Create a new folder to organize your projects and specify a name for the solution folder that the web app will be saved in. Press OK to add the solution.

Specifying the location on the team foundation server that the project will be saved to.

To perform the initial check-in, right-click on the solution in the Solution Explorer and press “Check In…”.

Checking in the project.

The Team Explorer window will be activated. Enter an optional comment.

Entering an optional revision comment.

Visual Studio will decide on its own which files will be under source control. There are several files that need to be excluded or included under source control. This will depend on the project type.

Application generator maintains several XML files that describe the application design. Some of the files are not necessary for the application to run and do not need to be placed under source control.

Excluding Files in Mobile Factory or Web Site Factory

Visual Studio will decide to include all project files in a Mobile Factory or Web Site Factory project.

Click on “Go to All Changes”, hold Ctrl, and select the following files in the list:

Application.Baseline.xml
Application.Cache.xml
Application.Log.xml (if present)
Controllers.Baseline.xml
Controllers.Cache.xml
Controllers.Log.xml (if present)
DataAquarium.Metadata.xml

Right-click, and press Exclude.

Excluding the project files from source control.

Excluding Files in Web App Factory, Azure Factory, DNN Factory, and SharePoint Factory

Web App Factory, Azure Factory, DNN Factory, and SharePoint Factory require the inclusion of essential project files.

Under the Excluded Changes section, click on “Detected:…”.

Clicking on "Detected..." to include several files that are excluded by default.

Select only the following items: “ClientLibrary.*.txt”, “DataAquarium.Project.xml”, and “DataAquarium.Version.xml”.

Including the correct files so that the app generator can still handle the project.

Press Promote to add the files to the pending changes.

Committing the Revision

Press the Back icon on the Team Explorer toolbar, and then press Check In.

Checking in the project.

The project code is now under control of Team Foundation Server.

Activating Project Synchronization

Start the web app generator. Click on the project, and select Sync.

Selecting Sync option in the Project Actions page.

Enter your user name and password in the relevant fields. If you have not yet created an account, enter your purchase email and activation code.

Entering username and password in order to configure synchronization.

Press Save, and the web application generator will proceed to upload your project.

Note that your account must be marked as an Account Owner or Project Manager in Code On Time Account Manager in order to add a new project.

Now, the other team members can get the latest version of the project from Team Foundation Service and establish synchronization of Project Designer change logs.

Adding New Project Members

In order for other team members to work on the same project, they must be added to the Team Project in TFS and the synchronization service account.

First, navigate to https://manage.codeontime.com and proceed to log in.

d

Navigate to the Users page. On the action bar, select New User.

Adding a new user to the account.

Enter the user details. Make sure to mark the user as enabled. Also select the checkbox next to the project name.

Specifying details for the new user account.

Press OK to save the new user account. Select Activation Code | Email action on the action bar to send the personal activation code to the user.

Emailing the personal activation code to the new user.

Note that personal activation code is different from the Code On Time product activation code. The personal activation code will allow developers to activate the app generator and synchronize Project Designer changes.

Next, navigate to URL of your team foundation service. In the top-right corner of the page, click on the Gear icon.

Selecting the Gear icon in TFS website to access settings.

Navigate to the Team of the project, and click on “View the team administration page”.

Accessing the team administration page.

In the list of Team members, press Add… | New User.

Adding a user to the project.

Type in the Windows Live ID of the new user, and press Save Changes.

Adding a user to the project.

The user will now have access to the project stored in Team Foundation Service.

Getting Code on the Project Member Computer

The team member must start Visual Studio and log into the TFS server using the their own credentials. The following steps will need to be performed.

In the menu, press File | Source Control | Advanced | Workspaces….

Managing workspaces from Visual Studio.

Press Add… in the bottom left corner.

If the project type is Mobile Factory or Web Site Factory, two mappings are needed. The first mapping will correctly place the solution file in the ~\Code OnTime\Solutions folder. The second mapping will place the code under the ~\Code OnTime\Projects folder.

Adding two working folders. One is for solution and the other is for the project.

If the project type is Web App Factory, Azure Factory, DotNetNuke Factory, or SharePoint Factory, only one folder needs to be mapped to ~\CodeOnTime\Projects\PROJECT_TYPE\PROJECT_NAME.

Source control mapping for Web App and Azure Factory projects.

Press OK to save the mappings.

When Visual Studio prompts to download the source code files, confirm and wait for the download to finish.

Visual Studio downloading the source code.

Once the download is complete, switch back to the app generator and refresh the start page by pressing F5. Click on the newly added project and press Sync. Add your credentials and press Save.

Saving synchronization settings for the project.

The generator will proceed to download the latest version of the web application revisions and refresh the project.

Press Design to activate the Project Designer or Generate to view the application in a browser.