Screen{"Create Company Role Wizard - Basic Details": cssIncludes => ["css/companyStyles.css"]
	Panel{"": Columns[1,3,1,3,1,3]
		PanelRow{
			Label{"Name":},
			PanelCell{colspan => 3
				Field{"": value => "Senior Project Manager", style => "width:90%;"}
			}
		}
		PanelRow{
			LabelSelect{"Profile": options => ["Executive Management", "General Management", "Sales Personal", "General Workforce", "Call Centre sales", "Call centre Sales and support", "Developer"],
				dataNotes => "Show the Standard Profiles of the system and any custom Profiles created by the company", CssClass => "selProfile"
			}
		}
		PanelRow{
			Label{"Description":},
			PanelCell{colspan => 3
				TextArea{"": style => "width:90%;height:80px;"}
			}
		}
		PanelRow{
			PanelCell{colspan => 6}
		}
	}
	Panel{"": Columns[1,1,10]
		PanelRow{
			PanelCell{colspan => 1},
			Button{"Create": nextPage => "Create Company Role Wizard - Customise Workflow", buttonStyle => Default},			
			PanelCell{colspan => 1}
		}
	}
	
	RawHTML{"":
		scriptContent => "
$(function(){
	var select = $('.selProfile');
	var LastOption = select.find('option').last();
	LastOption.wrap('<optGroup label=\"Custom Profiles\"></optGroup>');
});
"
	}
}

Screen{"Create Company Role Wizard - Customise Workflow": cssIncludes => ["css/companyStyles.css"]
	
	Button{"Save": nextPage => "Search Company Role"}
	
	Panel{"": Columns[1,3,1,3,1,3]
		PanelRow{
			LabelToString{"Role": value => "Senior Project Manager"},
			LabelToString{"Profile": value => "Executive Management"}
		}
		PanelRow{
			LabelToString{"Duration": value => "1.58 Hrs (95 mins)", recalc => true}
		}
		PanelRow{
			PanelCell{colspan => 6}
		}
	}
	Table{"": showTitle => false, CssClass => "workflowTable"
		Col{"": filter => false, sorting => false, width => 1}
		Col{"": filter => false, sorting => false, width => 15}
		Col{"": filter => false, sorting => false, width => 10}
		Col{"": filter => false, sorting => false, width => 5}
		Col{"": filter => false, sorting => false, width => 5}
		
		TableRow{
			Label{"": CssClass => "dragRow"}
			Label{"Skills Self Assessment":}
			Label{"Duration: 15mins":}
			Button{"Customise": iconSize => glyphiconLg, nextPage => "Create Company Role Wizard - Customise Skills Self Assessment", buttonStyle => Default,
				icons=> [
					{"glyphicon-cog":}
				]
			}
			Button{"Remove": iconSize => glyphiconLg, buttonStyle => Default, requirement => "Remove the Assessment from the workflow",
				icons=> [
					{"glyphicon-remove":}
				]
			}
		}
		TableRow{
			Label{"": CssClass => "dragRow"}
			Label{"Apollo Full":}
			Label{"Duration: 30mins":}
			Button{"Customise": iconSize => glyphiconLg, buttonStyle => Default, nextPage => "Create Company Role Wizard - Customise Apollo Tests",
				requirement => "Customisations of Full Apollo  test and the Short Apollo test are maintained separately",
				icons=> [
					{"glyphicon-cog":}
				]
			}
			Button{"Remove": iconSize => glyphiconLg, buttonStyle => Default,
				icons=> [
					{"glyphicon-remove":}
				]
			}
		}
		TableRow{
			Label{"": CssClass => "dragRow"}
			Label{"Apollo Culture":}
			Label{"Duration: 15mins":}
			Button{"Customise": iconSize => glyphiconLg, buttonStyle => Default, nextPage => "Create Company Role Wizard - Customise Apollo Tests",
				icons=> [
					{"glyphicon-cog":}
				]
			}
			Button{"Remove": iconSize => glyphiconLg, buttonStyle => Default,
				icons=> [
					{"glyphicon-remove":}
				]
			}
		}
		TableRow{
			Label{"": CssClass => "dragRow"}
			Label{"Phone Interview":}
			Label{"Duration: 20mins":}
			Button{"Customise": iconSize => glyphiconLg, buttonStyle => Default, nextPage => "Create Company Role Wizard - Customise Phone In Person Meetings",
				icons=> [
					{"glyphicon-cog":}
				]
			}
			Button{"Remove": iconSize => glyphiconLg, buttonStyle => Default,
				icons=> [
					{"glyphicon-remove":}
				]
			}
		}
		TableRow{
			Label{"": CssClass => "dragRow"}
			Label{"In Person Interview":}
			Label{"Duration: 15mins":}
			Button{"Customise": iconSize => glyphiconLg, buttonStyle => Default, nextPage => "Create Company Role Wizard - Customise Phone In Person Meetings",
				icons=> [
					{"glyphicon-cog":}
				]
			}
			Button{"Remove": iconSize => glyphiconLg, buttonStyle => Default,
				icons=> [
					{"glyphicon-remove":}
				]
			}
		}
	}
	Panel{"": Columns[1,3,1,3,1,3]
		PanelRow{
			RawHTML{"":
				scriptContent => "
								$(function(){
		 							$('.workflowTable tbody tr').each(function(index){
										var row = $(this);
										if(row.find('.dragRow').length > 0){
		 									row.children('td:first').addClass('sortHandle');
										}
		 							});
		 							$('tbody',$('.workflowTable')).sortable({
		 							     handle: 'td.sortHandle',
		 							     cursor:'move'
		 							});
		 						});

"
			}
		}
		PanelRow{
			ButtonDropdown{"Add": dataNotes => "List the Assessments which are not included in the Workflow"
				Button{"Apollo Short":}
			}
		}
		PanelRow{
			PanelCell{colspan => 6}
		}
	}
	Panel{"": Columns[1,1,8,1,1]
		PanelRow{
			PanelCell{colspan => 1},
			Button{"Next": nextPage => "Create Company Role Wizard - Customise Skills Self Assessment", buttonStyle => Default,
				requirement => "The following Pages should navigate to customise each assessment in the workflow, in the order they are defined.<br/>
								Navigating between Pages should save the details"
			},			
			PanelCell{colspan => 1},
			Button{"Finish": nextPage => "Create Company Role Wizard - Finish", buttonStyle => Default},
			PanelCell{colspan => 1}
		}
	}
	
}

Screen{"Create Company Role Wizard - Customise Skills Self Assessment":
	cssIncludes => ["css/companyStyles.css"]
	
	Button{"Save": nextPage => "Search Company Role"}
	
	Panel{"": Columns[1,3,1,3,1,3]
		PanelRow{
			LabelToString{"Role": value => "Senior Project Manager"},
			LabelToString{"Profile": value => "Executive Management"}
		}
		PanelRow{
			LabelToString{"Duration": value => "30 min", recalc => true,
				requirement => "The estimated time take to complete the assessment<br/>
								we will have predefined time span which will be spent to answer a single question in the assessment; that time is then multiplied by the no of questions in the assessment"
			}
		}
		PanelRow{
			PanelCell{colspan => 2
				Label{"Skills": style => "font-size:16px;font-weight:bold;"}
			}
		}
	}
	Table{"": showTitle => false
		Col{"Skill": filter => false, sorting => false, width => 6}
		Col{"Level": filter => false, sorting => false, width => 4}
		Col{"Importance": filter => false, sorting => false, width => 3}
		Col{"": filter => false, sorting => false, width => 2}
		
		TableRow{
			TableCell{colspan => 3, style => "vertical-align: middle;"
				Label{"Essential Skills": style => "font-weight:bold;"}
			}
			Button{"Add": iconSize => glyphiconLg, buttonStyle => Default,
				icons=> [
					{"glyphicon-plus":}
				]
			}
		}
		TableRow{
			Field{"": value => "Knowledge in Project Management Tools such as MS Project", style => "width:85%;",
				validationNotes => "Required"
			}
			ButtonGroupRadio{"msproject": value => "Proficient", validationNotes => "Required", 
				options => ["Beginner", "Proficient", "Expert"]
			}
			ButtonGroupRadio{"msprojectImp": options => ["Primary", "Secondary"],
				value => "Primary", validationNotes => "Required"
			}
			Button{"Remove": iconSize => glyphiconLg, buttonStyle => Default,
				icons=> [
					{"glyphicon-remove":}
				]
			}
		}
		TableRow{
			TableCell{colspan => 3, style => "vertical-align: middle;"
				Label{"Desired Skills": style => "font-weight:bold;"}
			}
			Button{"Add": iconSize => glyphiconLg, buttonStyle => Default,
				icons=> [
					{"glyphicon-plus":}
				]
			}
		}
		TableRow{
			Field{"": value => "Wireframing Tools", style => "width:85%;"}
			ButtonGroupRadio{"wireframe": value => "Proficient", options => ["Beginner", "Proficient", "Expert"]}
			ButtonGroupRadio{"wireframeImp": options => ["Primary", "Secondary"],
				value => "Secondary"
			}
			Button{"Remove": iconSize => glyphiconLg, buttonStyle => Default,
				icons=> [
					{"glyphicon-remove":}
				]
			}
		}
	}
	Panel{"": Columns[1,3,1,3,1,3]
		PanelRow{
			PanelCell{colspan => 6}
		}
		PanelRow{
			PanelCell{colspan => 2
				Label{"Qualifications": style => "font-size:16px;font-weight:bold;"}				
			}
		}
	}
	Table{"": showTitle => false
		Col{"Qualifications": filter => false, sorting => false, width => 10}
		Col{"Importance": filter => false, sorting => false, width => 3}
		Col{"": filter => false, sorting => false, width => 2}
		
		TableRow{
			TableCell{colspan => 2, style => "vertical-align: middle;"
				Label{"Essential Qualifications": style => "font-weight:bold;"}
			}
			Button{"Add": iconSize => glyphiconLg, buttonStyle => Default,
				icons=> [
					{"glyphicon-plus":}
				]
			}
		}
		TableRow{
			Field{"": value => "Bachelor Degree in Information Technology", style => "width:85%;",
				validationNotes => "Required"
			}
			ButtonGroupRadio{"degreeImp": options => ["Primary", "Secondary"],
				value => "Primary", validationNotes => "Required"
			}
			Button{"Remove": iconSize => glyphiconLg, buttonStyle => Default,
				icons=> [
					{"glyphicon-remove":}
				]
			}
		}
		TableRow{
			TableCell{colspan => 2, style => "vertical-align: middle;"
				Label{"Desired Qualification": style => "font-weight:bold;"}
			}
			Button{"Add": iconSize => glyphiconLg, buttonStyle => Default,
				icons=> [
					{"glyphicon-plus":}
				]
			}
		}
		TableRow{
			Field{"": value => "Microsoft Certification: Managing Projects with Microsoft Project", style => "width:85%;"}
			ButtonGroupRadio{"mscImp": options => ["Primary", "Secondary"],
				value => "Primary"
			}
			Button{"Remove": iconSize => glyphiconLg, buttonStyle => Default,
				icons=> [
					{"glyphicon-remove":}
				]
			}
		}
	}
	Panel{"": Columns[1,3,1,3,1,3]
		PanelRow{
			PanelCell{colspan => 6}
			
		}
		PanelRow{
			PanelCell{colspan => 6
				Button{"Customise the email sent to candidates once they complete the assessment": buttonStyle => Link, style => "float:left;",
					nextPage => "Create Company Role Wizard - Customise Candidate Competition Email"
				}
			}
		}
		PanelRow{
			PanelCell{colspan => 5}
		}
	}
	
	
	Panel{"": Columns[1,1,10]
		PanelRow{
			Button{"Back": buttonStyle => Default, nextPage => "Create Company Role Wizard - Customise Workflow"},			
			Button{"Next": buttonStyle => Default, nextPage => "Create Company Role Wizard - Customise Apollo Tests"},			
			PanelCell{colspan => 1}
		}
	}
}

Screen{"Create Company Role Wizard - Customise Candidate Competition Email": 
	cssIncludes => ["css/companyStyles.css"]
	
	Panel{"": Columns[1,4,1,4,1]
		PanelRow{
			LabelToString{"Role": value => "Senior Project Manager"},
			LabelToString{"Profile": value => "Executive Management"}
		}
		PanelRow{
			LabelToString{"Assessment": value => "Skills Self Assessment"}
		}
	}
	Panel{"": Columns[10,2]
		PanelRow{
			Panel{"": Columns[2,10]
				PanelRow{
					Label{"Email Body":}
				}
				PanelRow{
					PanelCell{colspan => 2
						RichTextArea{"": CssClass => "emailTemplateEditor",
							style => "width:90%;",
							value => "Dear {CandidateFirstName},<br/>
<br/>
You have completed Skills Self Assessment for the role of Project Manager.<br/>
You can proceed to the next assessment by clicking the link below;<br/>
<br/>
Thanks you for Participation 
"
						}						
					}
				}
			},
			Panel{"": Columns[12]
				PanelRow{
					Label{"Symbols": style => "font-weight:bold;"}
				}
				PanelRow{
					Link{"{CandidateFirstName}": requirement => "Clicking on the symbol should add the symbol to the position in the detail area"}
				}
				PanelRow{
					Link{"{CandidateSurName}":}
				}
			}
		}
	}
	Panel{"": Columns[1,1,10]
		PanelRow{
			PanelCell{colspan => 3}
		}
		PanelRow{
			Button{"Back": buttonStyle => Default, nextPage => "Create Company Role Wizard - Customise Skills Self Assessment"},			
			Button{"Done": buttonStyle => Default, nextPage => "Create Company Role Wizard - Customise Skills Self Assessment"},			
			PanelCell{colspan => 1}
		}
	}
}

Screen{"Create Company Role Wizard - Customise Apollo Tests":
	cssIncludes => ["css/nouislider.css", "css/jquery-ui-slider-pips.css", "css/companyStyles.css"], 
	scriptIncludes => ["scripts/nouislider.js", "scripts/jquery-ui-slider-pips.js", "scripts/wNumb.js", "scripts/customiseApolloTestsPage.js"]
	
	Button{"Save": nextPage => "Search Company Role"}
	
	Panel{"": Columns[1,3,1,3,1,3]
		PanelRow{
			LabelToString{"Role": value => "Senior Project Manager"},
			LabelToString{"Profile": value => "Executive Management"}
		}
		PanelRow{
			LabelToString{"Duration": value => "5 min", recalc => true,
				requirement => "The estimated time take to complete the assessment<br/>
								we will have predefined time span which will be spent to answer a single question in the assessment; that time is then multiplied by the no of questions in the assessment"
			}
		}
		PanelRow{
			PanelCell{colspan => 6}
		}
	}
	Table{"": showTitle => false, CssClass => "custom-personality-scale-table"
		Col{"Personality Scales": filter => false, sorting => false, width => 6}
		Col{"Importance": filter => false, sorting => false, width => 8}
		Col{"Score": filter => false, sorting => false, width => 16}
		
		TableRow{
			TableCell{colspan => 3
				Label{"Career Drives": style => "font-weight:bold;font-size:14px;display:inline-block;"}
				GlyphsIcon{"": iconSize => glyphiconLg, 
					icons=> [
						{"glyphicon-chevron-right": style => "float:right;padding-top: 4px;"}
					]
				}
			}
		}
		TableRow{
			TableCell{colspan => 3
				Label{"Coping": style => "font-weight:bold;font-size:14px;display:inline-block;", 
					requirement => "Collapsable Panes<br/>
									Only one Panel can be expanded at a time"
				}
				GlyphsIcon{"": iconSize => glyphiconLg, 
					icons=> [
						{"glyphicon-chevron-down": style => "float:right;padding-top: 4px;"}
					]
				}
			}
		}
		TableRow{
			Label{"Responsibility":}
			ButtonGroupRadio{"responsibility": options => ["Primary", "Secondary", "Not Used"],
				value => "Primary"
			}
			RawHTML{"": style => "height:70px;",
				htmlContent => "<div class='slider-range slider-range-3point'></div>"
			}
		}
		TableRow{
			Label{"Security":}
			ButtonGroupRadio{"security": options => ["Primary", "Secondary", "Not Used"],
				value => "Not Used"
			}
			TableCell{colspan => 1}
//						RawHTML{"": style => "height:40px;",
//							htmlContent => "<div class='slider-range slider-range-1point' data-slider-value='85' data-slider-firstpip='Insecure' data-slider-lastpip='Secure'></div>"
//						}
		}
		TableRow{
			TableCell{colspan => 3
				Label{"People Orientation": style => "font-weight:bold;font-size:14px;display:inline-block;"}
				GlyphsIcon{"": iconSize => glyphiconLg, 
					icons=> [
						{"glyphicon-chevron-down": style => "float:right;padding-top: 4px;"}
					]
				}
			}
		}
		TableRow{
			Label{"Agreeable":}
			ButtonGroupRadio{"agreeable": options => ["Primary", "Secondary", "Not Used"],
				value => "Secondary"
			}
			RawHTML{"": style => "height: 70px;",
				htmlContent => "<div class='slider-range slider-range-2point'></div>"
			}
		}
		TableRow{
			TableCell{colspan => 3
				Label{"Workplace Management": style => "font-weight:bold;font-size:14px;display:inline-block;"}
				GlyphsIcon{"": iconSize => glyphiconLg, 
					icons=> [
						{"glyphicon-chevron-down": style => "float:right;padding-top: 4px;"}
					]
				}
			}
		}
		TableRow{
			Label{"Self Organised":}
			ButtonGroupRadio{"selfOrganised": options => ["Primary", "Secondary", "Not Used"],
				value => "Primary"
			}
			RawHTML{"": style => "height: 50px;",
				htmlContent => "<div class='slider-range slider-range-1point' data-slider-value='60' data-slider-firstpip='Disorganised' data-slider-lastpip='Highly Organised'></div>"
			}
		}
	}
	Panel{"": Columns[1,3,1,3,1,3]
		PanelRow{
			PanelCell{colspan => 3}
		}
		PanelRow{
			PanelCell{colspan => 6
				Button{"Customise the email sent to candidates once they complete the assessment": buttonStyle => Link, style => "float:left;",
					nextPage => "Create Company Role Wizard - Customise Candidate Competition Email"
				}
			}
		}
		PanelRow{
			PanelCell{colspan => 6}
		}
	}
	
	
	Panel{"": Columns[1,1,10]
		PanelRow{
			Button{"Back": buttonStyle => Default, nextPage => "Create Company Role Wizard - Customise Skills Self Assessment"},			
			Button{"Next": buttonStyle => Default, nextPage => "Create Company Role Wizard - Customise Phone In Person Meetings"},			
			PanelCell{colspan => 1}
		}
	}
}

Screen{"Create Company Role Wizard - Customise Phone In Person Meetings":
	cssIncludes => ["css/jquery-ui-slider-pips.css", "css/companyStyles.css"], 
	scriptIncludes => ["scripts/jquery-ui-slider-pips.js", "scripts/jquery-ui.multidatespicker.js", "scripts/customisePhoneInPersonMeetings.js"]
	//customisePhoneInPersonMeetings.js
	Button{"Save": nextPage => "Search Company Role"}
	
	Panel{"": Columns[1,3,1,3,1,3]
		PanelRow{
			LabelToString{"Role": value => "Senior Project Manager"},
			LabelToString{"Profile": value => "Executive Management"}
		}
		PanelRow{
			LabelField{"Duration": value => "30", style => "width: 20%;", suffix => " min"}
		}
		PanelRow{
			PanelCell{colspan => 2
				Label{"Questions": style => "font-size:16px;font-weight:bold;"}
			}
		}
	}
	Table{"": showTitle => false, CssClass => "customise-questions-table"
		Col{"Question": filter => false, sorting => false, width => 6}
		Col{"Importance": filter => false, sorting => false, width => 4}
		Col{"Score": filter => false, sorting => false, width => 6}
		Col{"": filter => false, sorting => false, width => 2}
		
		TableRow{
			TextArea{"": value => "What software have you used to manage projects in the past?", style => "width:85%;height:60px;",
				validationNotes => "Required"
			}
			ButtonGroupRadio{"imp": options => ["Primary", "Secondary"],
				value => "Secondary", validationNotes => "Required"
			}
			RawHTML{"": style => "height: 50px;",
				htmlContent => "<div class='slider-range slider-range-1point' data-slider-value='6'></div>"
			}
			Button{"Remove": iconSize => glyphiconLg, buttonStyle => Default,
				icons=> [
					{"glyphicon-remove":}
				]
			}
		}
		TableRow{
			TextArea{"": value => "Tell me about a time when you had two key stakeholders with opposing views. How did you manage that?", style => "width:95%;height:60px;"}
			ButtonGroupRadio{"imp": options => ["Primary", "Secondary"],
				value => "Primary"
			}
			RawHTML{"": style => "height: 50px;",
				htmlContent => "<div class='slider-range slider-range-1point' data-slider-value='7'></div>"
			}
			Button{"Remove": iconSize => glyphiconLg, buttonStyle => Default,
				icons=> [
					{"glyphicon-remove":}
				]
			}
		}
		TableRow{
			TextArea{"": value => "Are you responsible for delivery and financials or just the administration of the project? Tell me about your recent project’s goals and results.", style => "width:95%;height:60px;"}
			ButtonGroupRadio{"imp": options => ["Primary", "Secondary"],
				value => "Secondary"
			}
			RawHTML{"": style => "height: 50px;",
				htmlContent => "<div class='slider-range slider-range-1point' data-slider-value='5'></div>"
			}
			Button{"Remove": iconSize => glyphiconLg, buttonStyle => Default,
				icons=> [
					{"glyphicon-remove":}
				]
			}
		}
	}
	Panel{"": Columns[1,3,1,3,1,3]
		PanelRow{
			PanelCell{colspan => 6}
		}
		PanelRow{
			PanelCell{colspan => 1},
			Button{"Add": iconSize => glyphiconLg, buttonStyle => Default, style => "float:left;",
				icons=> [
					{"glyphicon-plus":}
				]
			}
		}
		PanelRow{
			PanelCell{colspan => 6}
		}
		PanelRow{
			PanelCell{colspan => 2
				Label{"Availability": style => "font-size:16px;font-weight:bold;"}
			}
		}
		PanelRow{
			PanelCell{colspan => 3
				RawHTML{"datePicker":,
					requirement => "This calendar is used to pick a date range by marking the start and the end of the session.",
					developerNotes => "Should be similar to http://preview.codecanyon.net/item/jalendar-2-calendar-pack-event-range-and-more/full_screen_preview/12662442?ref=jqueryrain<br/>
										or http://tamble.github.io/jquery-ui-daterangepicker/"
				}				
			},
			PanelCell{colspan => 2
				Table{"": CssClass => "table-noheader", showTitle => false
					Col{"": filter => false, sorting => false, width => 5}
					Col{"": filter => false, sorting => false, width => 4}
					Col{"": filter => false, sorting => false, width => 4}
					Col{"": filter => false, sorting => false, width => 5}
					
					TableRow{
						Checkbox{"": suffix => " Monday", checked => true}
						TimePicker{"": value => "09:00"}
						TimePicker{"": value => "11:00"}
						Button{"Copy Times": requirement => "Copy the times to the dates which are selected"}
					}
					TableRow{
						Checkbox{"": suffix => " Tuesday", checked => true}
						TimePicker{"": value => "09:00"}
						TimePicker{"": value => "11:00"}
						TableCell{colspan => 1}
					}
					TableRow{
						Checkbox{"": suffix => " Wednesday", checked => true}
						TimePicker{"": value => "09:00"}
						TimePicker{"": value => "11:00"}
						TableCell{colspan => 1}
					}
					TableRow{
						Checkbox{"": suffix => " Thursday"}
						TableCell{colspan => 1}
						TableCell{colspan => 1}
						TableCell{colspan => 1}
					}
					TableRow{
						Checkbox{"": suffix => " Friday"}
						TableCell{colspan => 1}
						TableCell{colspan => 1}
						TableCell{colspan => 1}
					}
					TableRow{
						Checkbox{"": suffix => " Saturday"}
						TableCell{colspan => 1}
						TableCell{colspan => 1}
						TableCell{colspan => 1}
					}
					TableRow{
						Checkbox{"": suffix => " Sunday"}
						TableCell{colspan => 1}
						TableCell{colspan => 1}
						TableCell{colspan => 1}
					}
				}
			}
		}
		PanelRow{
			PanelCell{colspan => 6
				Button{"Customise the email sent to candidates once they complete the assessment": buttonStyle => Link, style => "float:left;",
					nextPage => "Create Company Role Wizard - Customise Candidate Competition Email"
				}
			}
		}
		PanelRow{
			PanelCell{colspan => 6}
		}
	}
	
	Panel{"": Columns[1,1,10]
		PanelRow{
			Button{"Back": buttonStyle => Default, nextPage => "Create Company Role Wizard - Customise Apollo Tests"},			
			Button{"Next": buttonStyle => Default, nextPage => "Create Company Role Wizard - Finish"},			
			PanelCell{colspan => 1}
		}
	}
}

Screen{"Create Company Role Wizard - Finish":
	cssIncludes => ["css/companyStyles.css"]
	
	Panel{"": Columns[2,4,2,4]
		PanelRow{
			PanelCell{colspan => 4
				Label{"Summary": style => "font-size:16px;font-weight:bold;"}				
			}
		}
		PanelRow{
			LabelToString{"Role": value => "Senior Project Manager"},
			LabelToString{"Profile": value => "Executive Management"}
		}
		PanelRow{
			LabelToString{"Duration": value => "1.58 Hrs (90 mins)"}
		}
	}
	Table{"": showTitle => false, CssClass => "table table-condensed table-noheader"
		Col{"": filter => false, sorting => false, width => 1}
		Col{"": filter => false, sorting => false, width => 30}
		Col{"": filter => false, sorting => false, width => 10}
		Col{"": filter => false, sorting => false, width => 1}
		
		TableRow{
			TableCell{colspan => 2
				Label{"Skills Self Assessment":}
			}
			Label{"Duration: 15 mins":}
			GlyphsIcon{"": iconSize => glyphiconLg, 
				requirement => "Expand / collapse the panel below<br/>
								Only one panel can be expanded at a time",
				icons=> [
					{"glyphicon-chevron-down": style => "padding-top: 4px;"}
				]
			}
		}
		TableRow{
			TableCell{colspan => 1}
			TableCell{colspan => 3
				Panel{"": Columns[2,3,1,2,3,1]
					PanelRow{
						Label{"Essential Skills": style => "font-weight:bold;"},
						Label{"Knowledge in Project Management Tools such as MS Project":},
						Label{"Expert": requirement => "Show the Essential Skills recorded and their Level"},
						Label{"Desired Skills": style => "font-weight:bold;"},
						Label{"Wireframing Tools":},
						Label{"Proficient": requirement => "Show the Desired Skills recorded and their Level"}
					}
					PanelRow{
						Label{"Essential Qualifications": style => "font-weight:bold;"},
						PanelCell{colspan => 2
							Label{"Bachelor Degree in Information Technology": requirement => "Show the Essential Qualifications recorded"}							
						},
						Label{"Desired Qualifications": style => "font-weight:bold;"},
						PanelCell{colspan => 2
							Label{"Microsoft Certification: Managing Projects with Microsoft Project": requirement => "Show the Essential Qualifications recorded"}
						}
					}
				}
			}
		}
		TableRow{
			TableCell{colspan => 2
				Label{"Apollo Full":}
			}
			Label{"Duration: 30 mins":}
			GlyphsIcon{"": iconSize => glyphiconLg, 
				icons=> [
					{"glyphicon-chevron-down": style => "padding-top: 4px;"}
				]
			}
		}
		TableRow{
			TableCell{colspan => 1}
			TableCell{colspan => 3
				Panel{"": Columns[2,3,1,2,3,1]
					PanelRow{
						Label{"Career Drives": style => "font-weight:bold;"},
						Label{"Archivement":},
						Label{"Primary":},
						Label{"Coping": style => "font-weight:bold;"},
						Label{"Responsibility":},
						Label{"Primary":}
					}
					PanelRow{
						PanelCell{colspan => 1},
						Label{"Remuneration":},
						Label{"Secondary":},
						PanelCell{colspan => 1},
						Label{"Security":},
						Label{"Secondary":}
					}
					PanelRow{
						Label{"People Orientation": style => "font-weight:bold;"},
						Label{"Agreeable":},
						Label{"Secondary":},
						Label{"Workplace Management": style => "font-weight:bold;"},
						Label{"Self Organised":},
						Label{"Primary":}
					}
				}
			}
		}
		TableRow{
			TableCell{colspan => 2
				Label{"Apollo Culture":}
			}
			Label{"Duration: 15 mins":}
			GlyphsIcon{"": iconSize => glyphiconLg, 
				icons=> [
					{"glyphicon-chevron-right": style => "padding-top: 4px;"}
				]
			}
		}
		TableRow{
			TableCell{colspan => 2
				Label{"Phone Interview":}
			}
			Label{"Duration: 20 mins":}
			GlyphsIcon{"": iconSize => glyphiconLg, 
				icons=> [
					{"glyphicon-chevron-right": style => "padding-top: 4px;"}
				]
			}
		}
		TableRow{
			TableCell{colspan => 2
				Label{"In Person Interview":}
			}
			Label{"Duration: 15 mins":}
			GlyphsIcon{"": iconSize => glyphiconLg, 
				icons=> [
					{"glyphicon-chevron-right": style => "padding-top: 4px;"}
				]
			}
		}
	}
	Panel{"": Columns[1,1,8,1,1]
		PanelRow{
			Button{"Back": buttonStyle => Default, nextPage => "Create Company Role Wizard - Customise Phone In Person Meetings"},			
			PanelCell{colspan => 1},
			PanelCell{colspan => 1},
			Button{"Create Role": buttonStyle => Default, nextPage => "Edit Company Role"},			
			PanelCell{colspan => 1}
		}
	}
}