Adding a new section to the HiFi Template

1 Star2 Stars3 Stars4 Stars5 Stars (3 votes, average: 3.33 out of 5)
Loading ... Loading ...

The HiFi project template is one of the more popular free sample templates that is distributed with SWiSH Max3. Although feedback has been positive, we have received a number of requests to increase the number of sections. The discussion below shows how to edit the supplied template to add an additional section. You could repeat this process a number of times to add even more sections.


Load the Project

From the main menu go: File | New Project…
and select Sites | HiFi
For the destination project name enter something like “HiFiMoreSections” and press OK

This will copy the template files to a working area in the nominated folder under the destination project name and open the project files, main.swi, section1.swi … section5.swi

hifiproject

Edit main.swi

In the Wizard panel, select main then press the manual edit button. manualedit

Max3 should now have a layout similar to the one shown below. (Note that the exact placement of panels may be different depending on your preferences. Panels that are not visible can be enabled using the Window menu item. )

manualedithifi

Add a New Menu Item

newmenuExpand MAIN.MENU then select MENU_5.

Copy / Paste In Place, then rename the new object MENU_6 and move it to the bottom of the MENU items.

Alter the _y position from 89.45 to 109.45

The menu should now look like the image below:

newmenu2

Add a new Content Movie Clip

Expand MAIN.CONTENT.CONTENT
Copy MAIN.CONTENT.CONTENT.CONTENT_5 and paste in place back into MAIN.CONTENT.CONTENT then rename the copied item MAIN.CONTENT.CONTENT.CONTENT_6 and move to the bottom of MAIN.CONTENT.CONTENT.

The tree should now look like the image below:

content

Alter Script for MENU_6

In the Outline panel, select MAIN.MENU.MENU_6 then select the Script panel.

Change

onSelfEvent (load) {
 var id: Number = 5;
}

to

onSelfEvent (load)  {
 var id: Number = 6;
}

Alter Script for siteSpecs

In the Outline panel, select MAIN.siteSpecs and in the Script panel alter

onSelfEvent (load) {
    _parent.n_sections = 5;
    _parent.current_id = 1;

to

onSelfEvent (load) {
    _parent.n_sections = _parent.parameters.SectionsCount;
    _parent.current_id = 1;

In the working folder (the same folder that contains main.swi) copy section2.swi to section6.swi. This creates an initial template file for use by the wizard.

Template / Wizard Changes

To make the new section easily accessable the following wizard changes are needed. To enable wizard authoring, from the main menu go:
Preferences / Editing and check the
Enable Authoring Options for Components and Wizards check box.

Right click on the tab for main and then select Movie | Author Wizard

authorwizard

this will open the Author Wizard panel.

authorwizard2

Personally I find it convenient to dock this panel with the Layout and Script panels.

Parameter Changes

It is necessary to modify and add parameters to support the new section.

In the Parameters section of the Author Wizard:

  • Alter parameter SectionsCount so that ControlParameters is 1;2;3;4;5;6 instead of 1;2;3;4;5
  • Add a parameter after Section5Type called Section6Type then duplicate the other settings used for Section5Type changing 5 to 6 where appropriate.
  • Add a parameter, Menu6Text, so that it appears under Menu5Text. Again, duplicate the settings for Menu5Text changing 5 to 6 where appropriate. Pay specific attention to the Assoc Parameter field which must be MAIN.MENU.MENU_6.TEXT_FIELD.TEXT_FIELD.text
  • Modify the parameter MenuProperties by appending ;MAIN.MENU.MENU_6.TEXT_FIELD.TEXT_FIELD to the existing contents of the Assoc Parameter field.

Press the Apply button to save the changes.

Alter the Value of the parameter Item 6 in the Menu group to “Stuff” using the Wizard panel. Changing this value should cause the menu caption of the new section to change in the layout panel.

Apply before script

This script is executed when a parameter is altered. Alter the script at about line 16 as follows:

if ("SectionsCount" == parameterChanged) {
    // enable or disable menu items depending on number of sections
    var i;
    var blEnabled;
    for (i=1;i< =5;i++) {

to

if ("SectionsCount" == parameterChanged) {
    // enable or disable menu items depending on number of sections
    var i;
    var blEnabled;
    for (i=1;i< =6;i++) {

Press the apply button and resave main.

Well that’s about all that is required. Initially set Count to 6 in the Sections group then choose a different section type for section 6, then choose a different one again to be sure that the template gets copied over.  Now press preview or publish. You should now see a new section under the heading “Stuff” (Note: you can easily alter the heading name using the Menu group of the Wizard panel).

Resave as a Template with a New Name

If you want to save this template so that it can be used as the basis of future templates, do the following:

Modify the .swp file

Locate the file HiFi.swp. This should reside in the folder “HiFiMoreSections”.

Rename the file “HiFi More Sections.swp” then edit it using a text editor such as notepad and alter it so that it shows the information below:

open=working\main.swi
project=HiFi6
preview=HiFi More Sections.jpg
descriptiontext=An example web site for your business or portfolio with 6 sections.
thumbborder=0

Save the file.

Now rename the .jpg file from “HiFi.jpg” to “HiFi More Sections.jpg”. The jpg name must match the .swp file name.

Copy the New Template back to the Templates folder.

The site templates are normally located under:
c:\Program Files\SWiSH Max3\ProjectTemplates\Sites
This area may be different if you have installed Max3 to a different drive or folder.

Simply copy the entire folder, “HiFiMoreSections” into the Sites area. The full path to the modified .swp file should now be:

c:\Program Files\SWiSH Max3\ProjectTemplates\Sites\HiFiMoreSections\HiFiMoreSections.swp

When you now open a new project, you should see the following:
newproject

The modified main.swi file is here.

Note: Other sample templates supplied with Max3 have been authored using different script. Consquently the modifications described here may not work with any site template other than HiFi.

One Response to “Adding a new section to the HiFi Template”

  1. Everett W.G.Umphrey says:

    Thank-you for the file provided by you for HiFi wedsite after you made an extra section. In SwishMax3 that same wedsite does not have any script for this area in outline as seen below. I’m currently using Vista.

    In the Outline panel, select MAIN.MENU.MENU_6 then select the Script panel.

    Change

    onSelfEvent (load) {
    var id: Number = 5;
    }to

    onSelfEvent (load) {
    var id: Number = 6;
    }

    So once I checked out your copy , it was easy to finally add more sections.
    I was trying to follow your example, and after about two weeks I noticed a file provided lol.

    Thank-you
    Everett W.G. Umphrey