Page Comparison

JSON structures used in WIP II development:

Contents:

Content types

Tooltips

HTML

Unique content types

Region: domestic vs international

%globals_asset_url:ASSETID^json_encode% and anchor links

Uploading images - allow access unrestricted

How to find the asset id of a page

JSON specifics and escaping

Quotes and “ ” characters

Newlines

JSON structures

content-plain

Default content type. Used in most standard cases. Provides a Heading and content block underneath.

{
    "contentType": "content-plain",
    "heading": "Text here",
    "content": "Text here."
}

content-plain-images-triplecrown

used specifically for content to display the triple crown association images. Normally uses a shared object, but sometimes has some variation.

Either use the block below, or link the asset 342525 in the appropriate place.

...

For information on other aspects of study areas, degrees and postgraduate:

See page

/wiki/spaces/TD/pages/88277761

Documentation to do:

Tooltips

HTML

Unique content types

Region: domestic vs international

Uploading images - allow access unrestricted

How to find the asset id of a page

Shared blocks

JSON structures

content-plain

Default content type. Used in most standard cases. Provides a Heading and content block underneath.

{
    "contentType": "content-plain",
    "heading": "Text here",
    "content": "Text here."
}

content-plain-images-triplecrown

used specifically for content to display the triple crown association images. Normally uses a shared object, but sometimes has some variation.

Either use the block below, or link the asset 342525 in the appropriate place.

{
	"heading"     : "International recognition",
	"contentType" : "content-plain-images-triplecrown",
	"content"     : "%globals_asset_url:340052^json_encode%",
		"altText"      : "EQUIS Logo",
		"linkTitle"    : "",
		"link"         : "",
		"linkUrl": ""
	}, {
		"imageAssetId" : "340057",
		"imageSrc"     : "%globals_asset_url:340057^json_encode%",
		"altText"      : "AMBA Logo",
		"linkTitle"    : "",
		"link"         : "",
		"linkUrlVictoria's MBA programme is accredited to the British-based <a href='http://www.mbaworld.com/'>Association of MBAs (AMBA)</a>, an internationally recognised global standard for all MBA programmes.\nVictoria Business School is also one of just 75 business schools worldwide that hold the 'Triple Crown' of international business education accreditations. You can be confident your degree will stand up against the best around the world.\n<a href='http://www.victoria.ac.nz/vbs/about/welcome/accreditation'>Find out more about accreditations and what they mean for you.</a>",
	"images"      : ""
	}, [{
		"imageAssetId" : "340058340052",
		"imageSrc"     : "%globals_asset_url:340058^json340052^json_encode%",
		"altText"      : "AASCBEQUIS Logo",
		"linkTitle"    : "",
		"link"         : "",
		"linkUrl": ""
	}, {
		"imageAssetId" : "340057",
		"imageSrc"     : "%globals_asset_url:340057^json_encode%",
	}]
}

content-plain-links

Similar to the content-plain object, but allows buttons for linking. We try and use this where possible instead of using inline links.

An important distinction between "links" and "externalLinks" - Graphically, "links" will be displayed with a big blue button, while "externalLinks" will display a bullet list of links with an 'external link' symbol next to it - Image Removed

{
   "contentType" : "content-plain-links",
   "heading"     : "",
   "content	"altText"      : "AMBA Logo",
		"linkTitle"    : "",
		"link"         : "",
		"linkUrl"      : ""
	}, {
		"imageAssetId" : "340058",
		"imageSrc"     : "%globals_asset_url:340058^json_encode%",
    "links		"altText"       : ["AASCB    Logo",
		"linkTitle"     {
            "linkText"  :"Text",: "",
		"link"             "linkTitle" :"Text",
            "link: "",
		"linkUrl"      :"%globals_asset_url:ASSETID^json_encode%"
        }
   ],
	"externalLinks": [{
		"linkText"   : "Text",
		"linkTitle"  : "Text",
		"link"       : "http://www.careers.govt.nz/"

	}]
}

content-facts

This is used exclusively on the degree-about pages. They supply the data for the "Level of study", "Length of full-time study", and "Useful secondary school subjects" contents.

This block does not change here. If these values are to change, they need to be done in the metadata of the degree. If this block changes from what is contained here it will most likely break things. Please don't do that... :(

{
    "contentType" : "content-facts",
    "heading"     : "",
    "content"     : {
        "levelOfStudy": { ""
	}]
}

content-plain-links

Similar to the content-plain object, but allows buttons for linking. We try and use this where possible instead of using inline links.

An important distinction between "links" and "externalLinks" - Graphically, "links" will be displayed with a big blue button, while "externalLinks" will display a bullet list of links with an 'external link' symbol next to it - Image Added

{
   "contentType" : "content-plain-links",
   "heading"     : "",
   "content"     : "",
    "links"       : [
        {
            "linkText"  :"Text",
            "linkTitle" :"Text",
            "link"      :"%globals_asset_url:ASSETID^json_encode%"
        }
   ],
	"contentTypeexternalLinks": :[{
		"levelOfStudylinkText",   :          "heading"Text",
		"linkTitle"     : "%asset_metadata_ProgrammeId^as_asset:asset_metadata_postOrUndergradHeading^json_encode%Text",
		"link"            "content: "http://www.careers.govt.nz/"

   : "%asset_metadata_ProgrammeId^as_asset:asset_metadata_postOrUndergrad^json_encode%"
        },
        "studyLength": {
       	}]
}

content-facts

This is used exclusively on the degree-about pages. They supply the data for the "Level of study", "Length of full-time study", and "Useful secondary school subjects" contents.

This block does not change here. If these values are to change, they need to be done in the metadata of the degree. If this block changes from what is contained here it will most likely break things. Please don't do that... :(

{
    "contentType" : "studyLengthcontent-facts",
    "heading"     : "",
    "headingcontent"     : "%asset_metadata_ProgrammeId^as_asset:asset_metadata_LengthOfFulltimeStudyHeading^json_encode%{
        "levelOfStudy": {
            "contentType" : "levelOfStudy",
            "contentheading"     : "%asset_metadata_ProgrammeId^as_asset:asset_metadata_LengthOfFulltimeStudy^jsonpostOrUndergradHeading^json_encode%",
            "contentSubcontent"     : "%asset_metadata_ProgrammeId^as_asset:asset_metadata_LengthOfFulltimeStudySubHeading^jsonpostOrUndergrad^json_encode%"
        },
        "feesstudyLength": {
            "contentType" : "feesstudyLength",
            "heading"     : "%asset_metadata_ProgrammeId^as_asset:asset_metadata_CourseFeesHeadingOverride^jsonLengthOfFulltimeStudyHeading^json_encode%",
            "content"     : "%asset_metadata_ProgrammeId^as_asset:asset_metadata_EstimatedYearlyCourseFees^jsonLengthOfFulltimeStudy^json_encode%"
  ,
     },         "usefulSubjectscontentSub": {
    : "%asset_metadata_ProgrammeId^as_asset:asset_metadata_LengthOfFulltimeStudySubHeading^json_encode%"
        },
        "fees": {
            "contentType" : "usefulSubjectsfees",
            "heading"     : "%asset_metadata_ProgrammeId^as_asset:asset_metadata_UsefulSecondarySchoolSubjectsHeading^jsonCourseFeesHeadingOverride^json_encode%",
            "content"     : "%asset_metadata_ProgrammeId^as_asset:asset_metadata_UsefulSecondarySchoolSubjects^jsonEstimatedYearlyCourseFees^json_encode%"
        },
        "usefulSubjects": {
          } }

entry-requirements

Used exclusively on the degree-requirement pages. Used for displaying the entry requirements for a degree/major.

The following is the normal usage for this block, however the reqWithLink and reqOther can be empty.

reqWithLink allows the first element to be supplied with a blue button linking to another page.

The reqOther is simply an array of strings.

{
    "contentType" : "entry-requirementsusefulSubjects",
    "heading"     : "Entry requirements",     "contentheading"     : "To be accepted into this degree you need:",
%asset_metadata_ProgrammeId^as_asset:asset_metadata_UsefulSecondarySchoolSubjectsHeading^json_encode%",
   "reqWithLink" : {         "content"     : "University Entrance, or to meet the requirements of another admission type and",%asset_metadata_ProgrammeId^as_asset:asset_metadata_UsefulSecondarySchoolSubjects^json_encode%"
        "linkText"}
 : "University admission",         "linkTitle" : "University admission",
        "link"      : "%globals_asset_url:194328^json_encode%"
    }}
}

course-examples

On a study-area subject page. To display the example courses in a different spot (normally they are automatically added at the end of the subject), insert the following json object

{ "contentType": "course-examples" }

entry-requirements

Used exclusively on the degree-requirement pages. Used for displaying the entry requirements for a degree/major.

The following is the normal usage for this block, however the reqWithLink and reqOther can be empty.

reqWithLink allows the first element to be supplied with a blue button linking to another page.

The reqOther is simply an array of strings.

{
    "contentType" : "entry-requirements",
    "reqOtherheading"     : ["Entry requirements",
       "content"A Guaranteed Entry Score of 180 points from your NCEA."
    ]
}

fun-fact

Used for fun facts. Provides a Heading and content block.

{
: "To be accepted into this degree you need:",
   "contentType": "fun-factreqWithLink", : {
  "heading": "29%",     "content"   : "ProportionUniversity ofEntrance, MBAs employed at or above the board level within six to ten years of graduating. Source: The Association of MBAs 2010 Career Survey"
}

important-info

Currently only used in undergraduate degrees pages. (For example in tourism-management)

On requirements pages, the last two values are nearly always:

• The academic [Calendar] is the authoritative source of programme and course information.
• If you have questions talk to a <a href='%globals_asset_url:186845%'>Liaison Officer</a>. If you’re already a student here, contact a <a href='%globals_asset_url:59208%#student-advisers'>student adviser</a>.

 With the href for the "student adviser" replaced with the appropriate faculty for that degree. See

{or to meet the requirements of another admission type and",
        "linkText"  : "University admission",
        "linkTitle" : "University admission",
        "link"      : "%globals_asset_url:194328^json_encode%"
    },
    "reqOther"    : [
        "A Guaranteed Entry Score of 180 points from your NCEA."
    ]
}

fun-fact

Used for fun facts. Provides a Heading and content block.

{
    "contentType" : "importantfun-infofact",
    "heading"     : "Important information 29%",
    "content": "Proportion of MBAs employed :at [
            "If you are transferring from another university and applying for direct entry into the second year you'll need to supply a portfolio along with an official academic transcript. These must reach the <a href='http://www.victoria.ac.nz/fad/about/contact'> Faculty of Architecture and Design Office </a> by 10 December.",
            "<a href='Portfolio'>http://www.victoria.ac.nz/fad/pdf/portfolio-requirements-2012.pdf'>Portfolio requirements</a> (PDF 284 KB)",
            "The academic [Calendar] is the authoritative source of programme and course information.",or above the board level within six to ten years of graduating. Source: The Association of MBAs 2010 Career Survey"
}

important-info

Currently only used in undergraduate degrees pages. (For example in tourism-management)

On requirements pages, the last two values are nearly always:

• The academic [Calendar] is the authoritative source of programme and course information.
• If you have questions talk to a <a href='%globals_asset_url:186845%'>Liaison Officer</a>. If you’re already a student here, contact a <a href='%globals_asset_url:59208%#student-advisers'>student adviser</a>.

 With the href for the "student adviser" replaced with the appropriate faculty for that degree. See

{
   "contentType" : "important-info",
   "heading"     : "Important information ",
   "content"     : [
            "If you haveare questionstransferring talkfrom toanother auniversity <a href='%globals_asset_url:186845%'>Liaison Officer</a>. If you’re already a student here, contact a and applying for direct entry into the second year you'll need to supply a portfolio along with an official academic transcript. These must reach the <a href='%globals_asset_url:59208%#student-advisers'>student adviser</a>."http://www.victoria.ac.nz/fad/about/contact'> Faculty of Architecture and Design Office </a> by 10 December.",
           ]
}

intro-about

Used exclusively on the topic-about pages. Is basically the same as a content-plain container, but will also display a list of all the subjects next to it. Similar to the intro-degree container.

{
	"contentType"    : "intro-about",
	"content" "<a href='Portfolio'>http://www.victoria.ac.nz/fad/pdf/portfolio-requirements-2012.pdf'>Portfolio requirements</a> (PDF 284 KB)",
            "The academic : ""
}

intro-degree

Used at the start of each degree-about page. Is basically the same as a content-plain container, but will also display a list of all the majors next to it. Similar to the intro-about container.

{
   "contentType" : "intro-degree",
   "heading"     : "",
   "content"     : ""
}

slide-show

See the appropriate confluence page on how to properly form a slideshow. But basically, the heading and caption are displayed above the images.

For the image objects, the caption, altText, and url are all provided via the globals_asset_attribute keyword. So if they are to be changed, it must be done on the details screen of the image asset.

...

[Calendar] is the authoritative source of programme and course information.",
            "If you have questions talk to a <a href='%globals_asset_url:186845%'>Liaison Officer</a>. If you’re already a student here, contact a <a href='%globals_asset_url:59208%#student-advisers'>student adviser</a>."
        ]
}

intro-about

Used exclusively on the topic-about pages. Is basically the same as a content-plain container, but will also display a list of all the subjects next to it. Similar to the intro-degree container.

{
	"headingcontentType"     : "Designing ideas",
	"contentType" : "slide-showintro-about",
	"caption"     : "",
	"images"content"        : [
		{ 			"heading"      "
}

intro-degree

Used at the start of each degree-about page. Is basically the same as a content-plain container, but will also display a list of all the majors next to it. Similar to the intro-about container.

{
   "contentType" : "intro-degree",
 			"caption"   "heading"      : "%globals_asset_attribute_caption:340296^json_encode%",
  			 "altTextcontent"     :  : "%globals_asset_attribute_alt:340296^json_encode%",
			"buttonText"
}

intro-major

Used at the start of each major on the degree>requirements page. Is basically the same as a content-plain container, but historically used to have other formatting as well. May be deprecated in future releases, but for now is still used at the start of each major. Similar to the intro-about container.

{
	"contentType"    : "", 			"buttonLink"    : "", 			"buttonTitle"   : "intro-major",
			"imageUrlheading"      : "%globals_asset_url:340296^json_encode%", 			"imageAssetId"  : "340296" 	    }, 	 :  "",
{
			"headingcontent"         : "", 			"caption"       : "%globals_asset_attribute_caption:340276^json_encode%",
			"altText"       : "%globals_asset_attribute_alt:340276^json_encode%",
			"buttonText"    : "",
			"buttonLink"    : "",
			"buttonTitle""
}

intro-subject

Used at the start of each subject on the topic-study options page. Is basically the same as a content-plain container, but historically used to have other formatting as well. May be deprecated in future releases, but for now is still used at the start of each subject. Similar to the intro-about container.

{
	"contentType" : "intro-subject",
	"heading"     : "",
	"content"     : "",
			"imageUrl"      : "%globals_asset_url:340276^json_encode%",
			"imageAssetId"  : "340276"
	    }
    ]
}

video

Embeds a video. Currently only supports youtube videos. Make sure that the videoLink value is only the 'key' part of the video url. For example, https://www.youtube.com/watch?v=NYP5hSRiqBw becomes NYP5hSRiqBw.

The heading2 value was originally provided to supply sub-headings but is not currently used anywhere.

The content value provides a caption to go underneath the video.

videoImage is the image that will be used as the snapshot/preview that will display when the page first loads. Simply replace the ASSETID value in the code with the asset id of the image once it has been loaded into squiz.

{
}

intro

Used at the start of each degree>requirements and topic>people & stories page. Is basically the same as a content-plain container, but historically used to have other formatting as well. Will hopefully soon be replaced by a content-plain block as it is confusing for it to be allocated to those specific areas. Similar to the intro-about container.

{
	"contentType" : "intro",
	"heading"     : "",
	"content"     : ""
}

postgrad-apply

Used for the application/starting content block on postgraduate apply pages.

E.g. http://stage.victoria.ac.nz/explore/postgraduate-programmes/master-of-commerce-by-thesis/apply-contact?mode=admin&subject=accounting

{
    "contentType" : "videopostgrad-apply",
    "videoTypecontent": "youtube",     : {
        "heading1startStudying" : "Developing managers and leaders",{
            "heading2type"     : "studyLengthTrimester",
     "content"       "heading"  : "Start Studying",
    "videoLink": "NYP5hSRiqBw",        "videoImageappendix" : "%globals_asset_url:ASSETID^json_encode%"
}

wellington-promo

Also known as the 'Why Wellington" block. Used to provide a short promotion on why Wellington is such a great place to study. Normally the only thing changing is the content in "content" and sometimes the "heading". If the heading is not supplied, it should be left as "Why Wellington".

Note, for postgrad wellington-promo's, the asset id for the imageId and links might be changing. If so, please get Andrew Bredenkamp to update this part of the documentation.

{
	"heading"     : "Why Wellington",
	"contentType" : "wellington-promo",
	"content"     : "",If you’ve missed the apply deadline, don’t worry—it’s still possible to make a late application. Contact the Programme Director to discuss your options.",
            "content"  : [
                {
                    "imageLinkstartDate"      : "%globals_asset_url:327370^json_encode%_attribute_start_date_short:355524%",
    "imageId"               : "327370startTrimester", 	"links":"%globals_asset_metadata_trimesterNumber:355524%",
       : [            	{ 			"linkTextapplyBy"  :"Why Wellington", 			"linkTitle" :"Why Wellington", 			"link"      :"%globals_asset_url:248382^json_encode%_attribute_start_date_short:365079%"
    	}            },
                {
                ]
}

...

    "startDate"      :"%globals_asset_attribute_start_date_short:355515%",
                    "startTrimester" :"%globals_asset_metadata_trimesterNumber:355515%",
                    "applyBy"        :"%globals_asset_attribute_start_date_short:365077%"
                },
                {
                    "startDate"      :"%globals_asset_attribute_start_date_short:355523%",
                    "startTrimester" :"%globals_asset_metadata_trimesterNumber:355523%",
                    "applyBy"        :"%globals_asset_attribute_start_date_short:365078%"
                }
            ]
        },
        "fees" : {
            "contentType" : "fees",
            "heading"     : "",
            "content"     : ""
        }
    }
}

The startDate and startTrimester asset numbers are either:

Trimester 1: 355515

Trimester 2: 355523

Trimester 3: 355524

The applyBy asset numbers are either:

Trimester 1: 365077

Trimester 2: 365078

Trimester 3: 365079

Using the globals_asset keywords ensures that these values will return the correct results. At some point these lists will be automatically sorted by the angular app so that the closest date appears first, but for now they should be manually specified. (e.g. after the applyBy date for the second trimester has finished, make sure that the third trimester is the first one in the list).

For graduate qualifications, you need to specifically include a reference to the internationalApiCode in the content block. For example Graduate Diploma in Science, ID# 373377.

It looks like this:

{
    "contentType" : "postgrad-apply",
    "heading"     : "International fees",
    "region"      : "international",
    "content"     : {
        "startStudying" : {
            "type"    : "studyLengthTrimester",
            "heading" : "Start Studying",
            "content" : [
                {
                    "startDate"      :"%globals_asset_attribute_start_date_short:355524%",
                    "startTrimester" :"%globals_asset_metadata_trimesterNumber:355524%",
                    "applyBy"        :"%globals_asset_attribute_start_date_short:365079%"
                },
                {
                    "startDate"      :"%globals_asset_attribute_start_date_short:355515%",
                    "startTrimester" :"%globals_asset_metadata_trimesterNumber:355515%",
                    "applyBy"        :"%globals_asset_attribute_start_date_short:365077%"
                },
                {
                    "startDate"      :"%globals_asset_attribute_start_date_short:355523%",
                    "startTrimester" :"%globals_asset_metadata_trimesterNumber:355523%",
                    "applyBy"        :"%globals_asset_attribute_start_date_short:365078%"
                }
            ]
        },
        "fees" : {
            "contentType" : "fees",
            "heading"     : "",
            "content"     : ""
        },
        "internationalApiCode" : "%globals_asset_metadata_ProgrammeId^as_asset:asset_metadata_internationalApiCode^json_encode%"
    }
}

related-degrees

Used exclusively on subject pages. Is how the subject links to the degree pages.

For "undergrad" contents:

The asset_assetid, asset_metadata_ProgrammeCode, asset_metadata_LengthOfFulltimeStudy, asset_metadata_WebPath, and asset_name should all use the same asset id value. This is the degree that the subject is linking to, and should always be the asset number of a degree page.

The leadsIntoLink, leadsIntoText, leadsIntoExtraPreText, leadsIntoExtraLink, leadsIntoExtraLinkText are all to do with postgraduate degrees the subject links to.

• If they are all blank, no leads into will be shown.
• If the leadsIntoLink and leadsIntoText are present, then there will be a "Leads to a" piece of content with leadsIntoText as the text, and leadsIntoLink as the url.
• If the leadsIntoExtraPreText, leadsIntoExtraLink and leadsIntoExtraLinkText are present, then there will also be a second link provided in the "Leads to a" element.

This is a bit confusing, so see Architecture>Interior Architecture for a good example of how it is used. (Asset id 309042)

The content element is used to provide extra information about the related degree where necessary. This is just a plain text field. See Economics and Finance>Actuarial Science for a good example of this (asset number 309568).

For "postgrad" contents:

These are used solely for postgrad links. The assetid in asset_assetid and asset_metadata_WebPath should both be the same. Everything else gets edited in the json object.

A good example of this is Biomedical Sciences>Clinical Immunology (asset id 309688).

{
    "contentType": "related-degrees",
    "content": {
        "undergrad": [{
			"asset_assetid"                        : "%globals_asset_assetid:339832^json_encode%",
			"asset_metadata_ProgrammeCode"         : "%globals_asset_metadata_ProgrammeCode:339832^json_encode%",
			"asset_metadata_LengthOfFulltimeStudy" : "%globals_asset_metadata_LengthOfFulltimeStudy:339832^json_encode%",
			"asset_metadata_WebPath"               : "%globals_asset_metadata_WebPath:339832^json_encode%",
			"asset_name"                           : "%globals_asset_name:339832^json_encode%",
            "content"                              : "",
			"leadsIntoLink"                        : "%globals_asset_url:62170^json_encode%",
			"leadsIntoText"                        : "Master of Architecture (Professional)",
            "leadsIntoExtraPreText"                : "and other",
            "leadsIntoExtraLink"                   : "%globals_asset_url:62166^json_encode%",
            "leadsIntoExtraLinkText"               : "postgraduate programmes"
        }],
        "postgrad": [{
			"asset_assetid"                        : "%globals_asset_assetid:296680^json_encode%",
			"asset_metadata_ProgrammeCode"         : "MClinIm",
			"asset_metadata_LengthOfFulltimeStudy" : "1-2 years (180 points)",
			"asset_metadata_WebPath"               : "%globals_asset_url:296680^json_encode%",
			"asset_name"                           : "Master of Clinical Immunology"
        }]
    }
}

related-nonmajor-courses

Used exclusively on subject pages for non-major subjects. (e.g. Linguistics>Text Technologies). Allows the subject to link to the victoria search page with the appropriate subject selected.

{
    "contentType": "related-nonmajor-courses",
    "content": {
        "undergrad": [{
            "subjectCode":"127",
            "content":"Learn more about the undergraduate courses available in Science in Society"
        }],
        "postgrad": [{
            "subjectCode":"139",
            "content":"Learn more about the postgraduate courses available in Science in Society"
        }]
    }
}

slide-show

(architecture has a good example of a slideshow)

See the appropriate confluence page on how to properly form a slideshow. But basically, the heading and caption are displayed above the images.

For the image objects, the caption, altText, and url are all provided via the globals_asset_attribute keyword. So if they are to be changed, it must be done on the details screen of the image asset.

Only the 'heading' is specified here, because the heading on the image asset might be different to what we want to display on the image itself, and in many cases is explicitly left out.

{
	"heading"     : "Designing ideas",
	"contentType" : "slide-show",
	"caption"     : "",
	"images"      : [
		{
			"heading"       : "",
			"caption"       : "%globals_asset_attribute_caption:340296^json_encode%",
			"altText"       : "%globals_asset_attribute_alt:340296^json_encode%",
			"buttonText"    : "",
			"buttonLink"    : "",
			"buttonTitle"   : "",
			"imageUrl"      : "%globals_asset_url:340296^json_encode%",
			"imageAssetId"  : "340296"
	    },
	    {
			"heading"       : "",
			"caption"       : "%globals_asset_attribute_caption:340276^json_encode%",
			"altText"       : "%globals_asset_attribute_alt:340276^json_encode%",
			"buttonText"    : "",
			"buttonLink"    : "",
			"buttonTitle"   : "",
			"imageUrl"      : "%globals_asset_url:340276^json_encode%",
			"imageAssetId"  : "340276"
	    }
    ]
}

video

Embeds a video. Currently only supports youtube videos. Make sure that the videoLink value is only the 'key' part of the video url. For example, https://www.youtube.com/watch?v=NYP5hSRiqBw becomes NYP5hSRiqBw.

The heading2 value was originally provided to supply sub-headings but is not currently used anywhere.

The content value provides a caption to go underneath the video.

videoImage is the image that will be used as the snapshot/preview that will display when the page first loads. Simply replace the ASSETID value in the code with the asset id of the image once it has been loaded into squiz.

{
    "contentType": "video",
    "videoType": "youtube",
    "heading1": "Developing managers and leaders",
    "heading2": "",
    "content": "",
    "videoLink": "NYP5hSRiqBw",
    "videoImage": "%globals_asset_url:ASSETID^json_encode%"
}

wellington-promo

Also known as the 'Why Wellington" block. Used to provide a short promotion on why Wellington is such a great place to study. Normally the only thing changing is the content in "content" and sometimes the "heading". If the heading is not supplied, it should be left as "Why Wellington".

Note, for postgrad wellington-promo's, the asset id for the imageId and links might be changing. If so, please get Andrew Bredenkamp to update this part of the documentation.

{
	"heading"     : "Why Wellington",
	"contentType" : "wellington-promo",
	"content"     : "",
    "imageLink"   : "%globals_asset_url:327370^json_encode%",
    "imageId"     : "327370",
	"links"       : [
    	{
			"linkText"  :"Why Wellington",
			"linkTitle" :"Why Wellington",
			"link"      :"%globals_asset_url:248382^json_encode%"
    	}
    ]
}

Missing content blocks

Please list below any content types that are not covered above, and get Andrew Bredenkamp to write up appropriate documentation on them.

Linking between tabs

If you want to link to a section in a different tab within the same area (e.g. accounting>about linking to accounting>qualifications), you can't just use a regular <a href="../about">. Instead use the following code for the right page type:

Postgraduate programmes (postgraduate-programmes) - tabs = #about #study #requirements #people #apply

<a ui-sref='postgrads#people'>link text</a>

Postgraduate subjects (postgraduate-subjects) - tabs #about #qualifications #people

<a ui-sref='postgrad-areas#people'>link text</a>

Graduate qualifications (graduate-quals) - tabs = #about #study #requirements #people #apply

<a ui-sref='graduate-quals#people'>link text</a>

Undergrad study areas (study-areas) - tabs = #about #study #people

<a ui-sref='study-areas#people'>link text</a>

Undergrad degrees (degrees) - tabs = #about #requirements

<a ui-sref='degrees#requirements'>link text</a>

International and Domestic content

Most of the international content is handled by the app. Including fees, requirements etc.

However there are some blocks which are set to be visible only for international or domestic students. This is set with the "region" value set to either "domestic" or "international".

E.g. asset id 341060

{
    "contentType" : "content-plain-links",
    "heading"     : "Scholarships",
    "region"      : "domestic",
    "content"     : "Scholarships are awarded to hundreds of first-year students each year. They help with tuition fees and accommodation costs at Victoria's halls of residence. There are two types of scholarships for school leavers—Victoria Excellence Scholarships and Victoria Achiever Scholarships.\nYou can also apply for a TeachNZ Scholarship. These scholarships are awarded based on specific areas where teachers are needed.",
    "links"       : [{
        "linkText"  : "Search scholarships",
        "linkTitle" : "Search scholarships",
        "link"      : "http://www.victoria.ac.nz/study/student-finance/scholarships"
    }]

}

By default content will appear to anyone who visits the page. If the region is domestic, it will only show to non-international students. If the region is international, it will only show to international students.

This can be applied to any content block.

Tooltips

There are three kinds of tooltips. 

1. Standard tooltips that appear in text which has a dotted line under it, where the tooltip will appear when the user hovers over the word.
2. Heading tooltips - e.g. on the Study Areas About tab, on the question mark icon by the heading Subjects "Possible area(s) of study within a degree"
3. Other tooltips that have ended up being handled by the Angular App.

For standard tooltips, these are managed in each qualification areas sharedAssets folder.

E.g. sharedAssets (Id: #313981) > toolTips (Id: #329802) for study areas.

They are formatted just like any other json object:

"word for tooltip to appear" : "Tooltip text that will appear on hover",

Make sure the last item before the final } doesn't have a , after it so it retains valid json syntax.

it doesn't matter what capitalisation you use for the tooltip word, and it can include spaces and other characters (except " marks). Once the new word is in place, the next time you load the page the tooltips should be appear wherever that word appears.

Note, this is a fairly intensive process on angular end, so it is better if we try to keep this list of tooltips to a minimum wherever possible.

Also, the tooltips generally are broken into 4 parts.

1. The opening bracket (can be ignored)
2. A container that is exclusive to study areas
3. A container that is shared across study areas, undergrad degrees, grad-quals and postgrad programmes
4. Closing Bracket (can be ignored)

This allows specific tooltips only to appear in their designated area without adding extra values and processing to other areas. In future it might be worthwhile to regularly do an audit on the tooltips to ensure there are not any extra tooltips that are no longer needed, or if there are tooltips that are only required on postgrad that don't need to be shared.

Squiz keywords. When and how to use them:

%globals_asset_url:ASSETID^json_encode%

The %globals_asset_BLAH:0000% keyword is used to get information about a different asset and place it where the keyword is. For example %globals_asset_url:10% will be replaced by the full url for that asset, while %globals_asset_name:10% will be replaced with the name of asset 10.

The ^json_encode that is in each of them ensures that the content that returns is escaped properly for a json object. For example, if for some reason there was a " in the content, it would break the json object it is inserted into. ^json_encode will instead replace it with \".

please ensure ^json_encode is used on every keyword that is used. Not doing so may end up causing very hard to find issues further down the line.

./?a=ASSETID

This is a sort of short hand way of doing %globals_asset_url:10% that only works in href values. (ie <a href='./?a=10'>link text</a>). However, it does not play nicely with the json objects so we don't use it. It is mentioned here solely in case it is encountered in other areas of the site.

%globals_asset_attribute_BLAH:ASSETID^json_encode%

This is used in the slideshow and on images to get specific attributes. These are normally attributes on the assets details page.

%globals_asset_attribute_caption:340296^json_encode% returns the caption of the image

%globals_asset_attribute_alt:340296^json_encode% returns the alt-text of the image. 

%globals_asset_metadata_BLAH:ASSETID^json_encode%

This is used to get metadata values of the specified asset. These are edited via the metadata page of that asset.

%globals_asset_file_size_readable:ASSETID^json_encode% and %globals_asset_type_icon:ASSETID^json_encode%

Used for pdfs and documents, returns the human readable filesize and icon for the file.

Anchor links (e.g. #advisers)

You can not link directly to an anchor link with a %globals_asset_url:ASSETID^json_encode% keyword, however there's nothing stopping you from adding text after it to apply an anchor link to it.

For example <a href='%globals_asset_url:54655^json_encode%#advisers'>link text</a> will link to http://www.victoria.ac.nz/vbs/about/staff#advisers.

New lines in text

If you are getting corrupt json values, there is a good chance it is because there is a newline in it somewhere. These are not allowed as they break json objects. When importing content, make sure that all newlines are replaced with:

\n

So this:

Any building you enter has a complex history—from concept, to design, to construction.

Study a Bachelor of Building Science and gain a solid understanding of what it takes to develop a building that's efficient and sustainable and safe. Learn how to organise teams, plan the construction process and manage contractors and constructions sites.

Get the basics alongside Architecture students in the first year, then specialise in Sustainable Engineering Systems or Project Management.

At the end of your Bachelor’s degree you can stay on and study for a Master of Building Science. You’ll graduate skilled and work ready.

Will become this:

{
	"contentType"    : "content-plain",
	"heading"        : "",
    "content"        : "Any building you enter has a complex history—from concept, to design, to construction.\nStudy Building Science and gain a solid understanding of what it takes to develop a building that's efficient and sustainable and safe. Learn how to organise teams, plan the construction process and manage contractors and construction sites.\nGet the basics alongside Architecture students in the first year, then specialise in Sustainable Engineering Systems, Project Management or both.\nAt the end of your Bachelor’s degree you can stay on and study for a Master of Building Science. You’ll graduate skilled and work ready. "
}

This is then turned into <p> tags via the angular app where necessary, but this should not cause an issue.

JSON specifics in formatting and common pitfalls

Firstly, make sure you have read the above content about New Lines in Text, this has been the number one cause for issues so far.

Online json validator

If you have recently made a change to a block and the page is no longer rendering, copy and paste that block into the online json checker here and see if it can detect the issue for you.

Most common issues

The " character must be escaped, like so \". The " character is what json uses to know where contents start and end, so if it appears within a piece of content somewhere, it will think that it has ended early and will break itself.

This is particularly prevalent with quotes, as they often start/end with " characters. HOWEVER, there is another character we use for quotes, which is the “ and ” character - which 'don't' need escaping. So, if you have “ in your text and it is still working, that is why.

One other caveat with this, often where html text appears within content it will be used like so:

<a href="http://www.victoria.ac.nz">link</a>

The " in that will break json. You can either escape them, or replace them with the ' character like so:

<a href='http://www.victoria.ac.nz'>link</a>

And it will work fine.

Arrays

The way json normally works, is that each value will have a name, a colon, and then a value associated with it, followed by a comma.

For example:

{
	"contentType"  : "content-plain",
	"heading"      : "Learn from the best",
	"content"      : "Learn from internationally acclaimed researchers and thinkers.\nTheir experience and collaboration with industry professionals mean you'll get best learning opportunities."
}

important Notice a comma after every value except the last one. The comma basically says 'there is another value after this one'. Some validators will allow a comma after the last value, but there are some places inside squiz where it will make the json object not valid and break things)

Arrays work similarly, however they have no name associated with them. So, in the above case, if the content were an array instead of a value, it would look like this:

{
	"contentType"  : "content-plain",
	"heading"      : "Learn from the best",
	"content"      : [
         "Learn from internationally acclaimed researchers and thinkers.\nTheir experience and collaboration with industry professionals mean you'll get best learning opportunities."
    ]
}

This allows us to have multiple values all referenced by the same name. Which looks like this:

{
	"contentType"  : "content-plain",
	"heading"      : "Learn from the best",
	"content"      : [
         "Learn from internationally acclaimed researchers and thinkers.\nTheir experience and collaboration with industry professionals mean you'll get best learning opportunities.",
         "Learn from internationally acclaimed researchers and thinkers.\nTheir experience and collaboration with industry professionals mean you'll get best learning opportunities.",
         "Learn from internationally acclaimed researchers and thinkers.\nTheir experience and collaboration with industry professionals mean you'll get best learning opportunities.",
         "Learn from internationally acclaimed researchers and thinkers.\nTheir experience and collaboration with industry professionals mean you'll get best learning opportunities."
    ]
}

Notice how inside the array, there is no comma after the last element in the list. As mentioned before, this lets the json object know that this is the last object in that array, and not to expect anything else.

The commas are a particularly nasty issue, because nearly every json parser will allow there to be a comma after the last element without issue. The json interpreter within squiz though does not, and so some values that the angular app needs might be missing - such as the contentType and the region. Use the online validator here if you are unsure whether your commas are correct or not.

Debugging json objects

If you try to load a page and you get the following error:

Sorry, something went wrong
JSON.parse

or looking at the topic api response:

{"error": "JSON.parse",
"name": "SyntaxError",
...
}

or looking at the programme api response:

{
   "sharedAssets": {
...
   },
   "errors": [
      {
      "message": "JSON.parse",
      "raw":
...
      }
   ]
}

Then there is an error with the json object somewhere.

Normally the easiest place to look is in the content of the last asset you were editing. Take that element out completely, try reloading the page and see if that helps. If it does, fix the element you removed and replace it.

Otherwise, it can be hard to discover. The "raw" value of the error will give you the raw contents of the asset, however it can be difficult turning that back into its original structure due to all the escaping involved.

There is currently another api endpoint for topics that will just return the unmodified, unchecked json object generated by squiz. It can be called like so:

http://cms.victoria.ac.nz/api/topicjsondebugger?q=TOPICNAME

If you copy and paste the contents of that page into a json validator, it can help to diagnose where the issue is for that topic.

If there's an issue with a programme, get Andrew Bredenkamp to build a programmejsondebugger api endpoint and then look at that when it's done.