Converting standard Smartframe templates to Newlook 11

1. Add a parameter called callback to the Skin_AddPlugins function.
2. Update any AddPlugin methods inside the Skin_AddPlugins function.

The final code should look like this:

function Skin_Addplugins(callback) {
   //Syntax: AddPlugin("plugin_name (matches the filename with no extension, .js assumed)");
   AddPlugin("pluginFrameSize2", callback);
}

1. Use a search tool to find any instances of Skin_AddPlugins() in UICode.js and include the contents of the function as a function callback.

2. Find the AddPlugin function and add a parameter called callback. In the same function, update the AddScriptToPage method to add a parameter called callback.

3. Find the AddScriptToPage function and add a parameter to it called callback. Then inside this function, add the following code immediately after the newElement.type="text/javascript"; line:

newElement.onload = function() {
   callback.call(null);
};

4. Find any other code that calls the AddScriptToPage function and add the parameter function() {}.

5. Find the SendFunctionKey function and update the LookUI.SendKey method to LookUI.SendKeyWait.

6. Find the SendActiveFunctionKey function and update the LookUI.SendKey method to LookUI.SendKeyWait.

7. Find the SetOneFunction function, add the class clsFunctionButton to the following fkHTML assignments (note the trailing space between clsFunctionButton and the closing "):

8. Find the InitializeContainer function and replace if (!newlook) {setTimeout("InitializeContainer();",100); return;} with the following code:

if (!newlook.hasOwnProperty("OnClosed")) {setTimeout("InitializeContainer();",100); return;}

1. Add the following clsFunctionButton style to Skin.css:

.clsFunctionButton {
   position:		relative;
   display:		block;
   overflow:		hidden;
   white-space:		nowrap;
   text-overflow:	ellipsis;
}

2. Change the PanelNavigationDiv so that the top attribute is 675px.

1. Rename SmartFrame.htm to SmartFrame.html.
2. Copy your modified Smartframe template folder to your current solution folder in C:\ProgramData\Newlook 11.1.
3. (Optional) If you would like your converted Smartframe template to be available to any new solutions, copy the same folder into C:\ProgramData\Newlook 11.1\Templates (this will add it to the list of available Smartframe templates in the New solution dialog).
4. Open Newlook Developer with your current solution. Open Settings > General and update the Smartframe URL to point to Smartframe.html in your current solution folder.
5. Test your current solution in your modified template by clicking the Smartframe toolbar button (note that you should not need to make any changes to your Smartframe files to run the current solution).
6. If you are receiving the following error when you open Smartframe from within Developer, this indicates that the runtimeOptions parameter in skinruntime.js is pointing to a solution that does not exist in your current solution folder (C:\ProgramData\Newlook 11.1). There are two ways to resolve this error: remove the runtimeOptions parameter in skinruntime.js (runtimeOptions = "";) or copy the referenced solution into your current solution folder. Note that this will not affect the solution that is opened, if you are opening Smartframe preview from within Newlook Developer, the currently loaded solution will always open.

Smartframe now reports any loading errors with an error indicator in the bottom right-hand corner of the status bar. Click the error icon to open the Developer Tools window. Open the Console tab to get further information about the generated error, including the type of error and the file and line on which the error was generated. In the following example, the two errors are being generated due to a missing a closing bracket in a function call in the UICode.js file on line 118.

Use the Console to help you isolate the source of any errors.

TIP:

You can open the Developer Tools window at any time by right-clicking the title bar of the Smartframe window.