Designer

Labels
AJAX(112) App Studio(9) 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(178) 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(184) 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(3) 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
Designer
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.

Thursday, May 2, 2013PrintSubscribe
Code On Time Tools for Excel, Upload/Download Adapters

Code On Time release 7.0.8.0 introduces support for Tools for Excel.  This new alternative development environment is an add-in for Microsoft Excel 2010 - 2013. It provides a bird-eye view of project configuration element properties with the ability to make rapid and massive changes. Download Tools for Excel at http://codeontime.com/releases/tools-for-excel and use them alongside the Project Designer built in the application generator.

Application framework in the core of web apps created with Code On Time now supports virtual binary fields that can be stored in the File System, Windows Azure Storage, or Amazon S3. Store your binary content in the external storage systems without writing a single line of code with the  help of upload/download adapters. Adapters are implemented without dependencies on the external libraries. All communications with external storage systems are performed through the corresponding REST APIs.

The following features and enhancements were introduced in the new release:

  • Code On Time Tools for Excel
  • File Upload/Download Adapters
  • jQuery 1.9.1 and jQuery UI 1.10.2 are now integrated in the client library.
  • Metadata Builder has been enhanced to support cross-synonym references for Oracle databases.
  • Auto-refresh of data views will automatically sync a view to show the last selected data row. Auto-refresh will not be performed on form views.
  • Implementation of ActionResult.ShowModal will correctly display modal views of the current controller.

The next release with the new preview of the second generation data sheet view will go out soon. We expect to introduce Mobile Client Library and upload/download adapter for Google Drive in May of 2013.

Thursday, January 17, 2013PrintSubscribe
Conditional Data Editing

The When Client Script property allows controlling the display of an action based on a JavaScript expression. When the expression evaluates to true, the action is displayed. When it evaluates to false, the action is hidden. This property can be used to prevent users from editing a record based on certain conditions.

The property may be manually set in the Project Designer for every action that needs to be hidden. However, this may result in a large number of changes to be made. If the requirements of the web application were to change, all actions would need to be modified.

A simpler method would be to use virtualization node set plugins. The data controllers will be virtualized to conditionally add a When Client Script parameter for a subset of actions. When project requirements change, the virtualization code can be modified once.

For example, suppose that the web application described in the When Client Script tutorial has been created. The three Edit actions in the Orders controller are not displayed when the Status field of the order is set to “Committed”.

Edit actions removed from the Orders controller.

However, orders may still be deleted and order details can be modified. Let’s implement virtualization node set plugins to ensure that the user cannot make any changes to committed orders.

First, make sure to clear any When Client Script values that have been set previously.

Including Status Field in Order Details Controller

In order to prevent order details from being edited, the Status field must be included in the Order Details controller using denormalization.

Start the web application generator. Click on the project name, select Settings, and activate Business Logic Layer. Select Denormalization Map from the list, and make the highlighted addition:

dbo.Order Details => dbo.Orders
OrderDate
RequiredDate
ShippedDate
ShipVia
Freight
ShipName
ShipAddress
ShipCity
ShipRegion
ShipPostalCode
ShipCountry
Status

dbo.Orders => dbo.Employees
FirstName

Press Finish to navigate to the Summary page. Click on Refresh, and check the box next to OrderDetails controller. Press Refresh and confirm.

Refreshing the OrderDetails controller.

On the Summary page, press Design to activate the Project Designer. In the Project Explorer, switch to the Controllers tab. Double-click on OrderDetails / Fields node.

'OrderStatus' field of OrderDetails controller.

Mark the field as hidden.

Property New Value
The field is hidden from users. true

Press OK to save. Drop OrderStatus (String(50), read-only) field node onto OrderDetails / Views / grid1 node.

Dropping field 'OrdersStatus' onto 'grid1' view.     'OrderStatus' data field instantiated.

Adding Business Rule

Right-click on Orders controller node and press Edit Handler in Visual Studio.

Using the context menu option 'Edit Handler in Visual Studio'.

The handler file will open in Visual Studio. Append the SharedBusinessRules class with the two highlighted methods:

C#:

using System;
using System.Data;
using System.Collections.Generic;
using System.Linq;
using MyCompany.Data;

namespace MyCompany.Rules
{
    public partial class SharedBusinessRules : MyCompany.Data.BusinessRules
    {

        public SharedBusinessRules()
        {
        }

        protected override void EnumerateDynamicAccessControlRules(string controllerName)
        {
            if (Context.Request.UrlReferrer != null)
            {
                if (Context.Request.UrlReferrer.ToString().ToLower().Contains("orderform.aspx"))
                    RegisterAccessControlRule("OrderID",
                        "select OrderID from Orders where Status = 'Draft'",
                        AccessPermission.Allow);
                else
                    RegisterAccessControlRule("OrderID",
                        "select OrderID from Orders where Status = 'Committed'",
                        AccessPermission.Allow);
            }
        }

        public override bool SupportsVirtualization(string controllerName)
        {
            if (controllerName == "Orders" || controllerName == "OrderDetails")
                return true;
            else
                return false;
        }
protected override void VirtualizeController(string controllerName) { if (controllerName == "Orders") NodeSet().SelectActions("Edit", "Delete") .WhenClientScript("[Status] != 'Committed'"); else if (controllerName == "OrderDetails") NodeSet().SelectActions("Edit", "Delete", "New", "Duplicate") .WhenClientScript("[OrderStatus] != 'Committed'"); } } }

Visual Basic:

Imports MyCompany.Data
Imports System
Imports System.Collections.Generic
Imports System.Data
Imports System.Linq

Namespace MyCompany.Rules

    Partial Public Class SharedBusinessRules
        Inherits MyCompany.Data.BusinessRules

        Public Sub New()
            MyBase.New()
        End Sub

        Protected Overrides Sub EnumerateDynamicAccessControlRules(controllerName As String)
            If Context.Request.UrlReferrer <> Nothing Then
                If Context.Request.UrlReferrer.ToString().ToLower().Contains("orderform.aspx") Then
                    RegisterAccessControlRule("OrderID",
                                            "select OrderID from Orders where Status = 'Draft'",
                                            AccessPermission.Allow)
                Else
                    RegisterAccessControlRule("OrderID",
                                            "select OrderID from Orders where Status = 'Committed'",
                                            AccessPermission.Allow)
                End If
            End If
        End Sub

        Public Overrides Function SupportsVirtualization(controllerName As String) As Boolean
            If controllerName = "Orders" Or controllerName = "OrderDetails" Then
                Return True
            Else
                Return False
            End If
        End Function
Protected Overrides Sub VirtualizeController(controllerName As String) If controllerName = "Orders" Then NodeSet().SelectActions("Edit", "Delete").WhenClientScript( "[Status] != 'Committed'") ElseIf controllerName = "OrderDetails" Then NodeSet().SelectActions("Edit", "Delete", "New", "Duplicate").WhenClientScript( "[OrderStatus] != 'Committed'") End If End Sub End Class End Namespace

The business rule will virtualize the Orders and OrderDetails controllers. For Orders, all Edit and Delete actions will be selected. For OrderDetails, all Edit, Delete, New, and Duplicate actions will be selected. Then, a When Client Script parameter will be assigned to hide the actions when the Status field is equal to “Committed”.

Viewing the Results

Save the file, and run the web application in your browser. Navigate to the Orders page. The Edit and Delete actions are no longer available in the user interface.

All Edit and Delete actions on Orders controller are unavailable.

Select an order to view the order details. All Edit, Delete, New, and Duplicate actions will not be available.

image