AssetsTK lets you package files with an MDriven Designer model and deploy them to the Turnkey application that runs the model; use it when you need application assets such as CSS, JavaScript, images, fonts, page overrides, or assemblies.

How AssetsTK works

An AssetsTK directory is a folder beside your model file. When you upload the model to MDrivenServer, the folder is included with the model. Turnkey extracts it and expands its supported contents into the application site.

This also works with local Turnkey prototyping: when the model changes, the local Turnkey application mirrors the AssetsTK content. This gives you a short edit-save-refresh cycle while you develop UI assets locally, before uploading the model and assets to a server.

Create the AssetsTK folder

Your model file must have the .ecomdl or .modlr extension. Create the AssetsTK folder in the same directory as that file.

1. Find the model file.
2. Remove its extension from the filename.
3. Append _AssetsTK.
4. Create a folder with that exact name beside the model file.
5. Add files under the appropriate subfolders in the AssetsTK folder.
6. Save and upload the model, or save the model and refresh the local Turnkey application when prototyping.

For example, if the model file is:

products.azurewebsites.net__MDrivenServerA0.modlr

create this sibling directory:

products.azurewebsites.net__MDrivenServerA0_AssetsTK

Do not include .modlr or .ecomdl in the AssetsTK folder name.

Add common application assets

Preserve the intended target directory structure beneath the AssetsTK folder. For example, place an image under Content when it must be available in the application's Content directory.

Goal	Example path beneath the model directory	Result
Add an image to the application Content directory	MyModel_AssetsTK/Content/logo.png	The image is expanded as Content content in the Turnkey application.
Change the browser tab icon	MyModel_AssetsTK/favicon.ico or MyModel_AssetsTK/favicon.png	Replaces the browser tab logo. See HowTos:Add logotype and favicon.
Add a TrueType font	MyModel_AssetsTK/Fonts/MyFont.ttf	Makes the font available for use through StylesInModel. See Documentation:Fonts.
Add application-wide CSS	MyModel_AssetsTK/Content/tkusercss.css	Adds your user CSS without placing it in a ViewModel-specific file. See Documentation:Theme and style.
Add a ViewModel-specific stylesheet	MyModel_AssetsTK/View_Assets/Order/Order.css	Turnkey detects and injects the stylesheet when the Order ViewModel is shown.
Add ViewModel-specific JavaScript	MyModel_AssetsTK/View_Assets/Order/Order.js	Turnkey detects and injects the script when the Order ViewModel is shown.
Replace the Index ViewModel page body	MyModel_AssetsTK/Views/EXT_OverridePages/index.cshtml	The HTML in index.cshtml replaces the Index ViewModel content while the Turnkey application frame, including the main and left menus, remains.

Example: keep CSS with one ViewModel

If the Order ViewModel needs a style that no other ViewModel uses, create:

MyModel_AssetsTK/
  View_Assets/
    Order/
      Order.css

Put the Order-only CSS in Order.css. Turnkey injects it when it displays Order. Use Content/tkusercss.css instead for CSS that applies across the application.

Create asset files from Turnkey Live View

Turnkey Live View includes an AssetsTK Synk section that can create the AssetsTK folder and common starter files for the currently running model.

1. Start the Turnkey application.
2. Open Turnkey Live View in MDriven Designer.
3. Expand AssetsTK Synk. If no AssetsTK directory exists, this creates it.
4. Select Refresh file tree to display the current contents.
5. Use an Ensure action to create the starter file or directory you need:
   • Ensure Content/tkuserCss.css for user CSS.
   • Ensure Content/theme-user.css for default Turnkey theme-property edits.
   • Ensure EXTScripts/appwideangularscriptincludes.html for scripts loaded during page rendering.
   • Ensure ViewAssets/<NameOfViewModel> (css.js) for a ViewModel's CSS and JavaScript files.
   • Ensure Views/EXTOverridePages/<NameOfViewModel>.tagexpander.cshtml for a ViewModel page override.
   • Ensure EXTComponents/TemplateComponent (css,html,js) for the starter structure of an Angular component.
6. Edit the generated files in the AssetsTK directory, then save the model and refresh the running application to test the change.

Use the generated structure when available. It avoids typing folder and file names manually and is particularly useful when creating ViewModel assets or overrides.

Update and remove deployed assets

AssetsTK expansion is designed to change only the files supplied in the current asset package. This reduces unnecessary file changes and can help avoid application restarts during normal updates.

Remove one previously copied file

To request deletion of an expanded file, add .DELETE to that file's AssetsTK name. The replication logic deletes the corresponding file without the added extension.

For example, to delete a previously copied Content/obsolete-logo.png, include this file in the AssetsTK directory:

MyModel_AssetsTK/Content/obsolete-logo.png.DELETE

Reset asset locations

For a broad reset, put an empty file named CleanAll.txt at the root of the AssetsTK directory:

MyModel_AssetsTK/CleanAll.txt

CleanAll.txt cleans known asset locations and names back to their default state. Use it when you need to start over after extensive asset changes. It may cause more file changes than a targeted update, so prefer normal updates or a specific .DELETE file when that is sufficient.

Troubleshoot expansion problems

If an asset does not appear after upload or local refresh, check the following.

Check	What to do
AssetsTK directory name	Confirm that it is beside the model file and is exactly the model filename without .modlr or .ecomdl, followed by _AssetsTK.
Asset path	Confirm that the file is beneath the AssetsTK root in the target structure you intend to expand. For example, use Content/logo.png, not an unrelated folder name.
File permissions	On a server where expansion fails, ensure that the IIS account IIS_IUSRS has sufficient rights in App_Data and access to create the required files.
Expansion log	Look for ExtractForExpansionInSite.log in App_Data. The log reports file-creation failures, including access-denied paths.

An error such as the following indicates a permissions problem rather than a problem with the asset filename:

Problem expanding AssetsTK: Access to the path '...\Content\Something.png' is denied.

Grant the IIS user the required access, then upload or refresh again.

Typical uses

Use AssetsTK to keep non-model files under the same deployment workflow as the model:

• Add CSS and theme customizations; see Documentation:Theme and style.
• Add fonts for StylesInModel; see Documentation:Fonts.
• Package the JavaScript and CSS required by the Turnkey treeview example.
• Develop page overrides, Angular directives, controls, and other assets with the local workflow described in Documentation:Faster prototyping with Turnkey.
• Add analytics files as described in HowTos:Google Analytics in Turnkey app.
• Download and merge available component models through AssetsTK Synk, including the Documentation:SysTurnkeyTrace pattern.

See also

• Documentation:Theme and style
• Documentation:TK Live View
• Documentation:Faster prototyping with Turnkey
• Documentation:Fonts
• HowTos:Add logotype and favicon