Course sites new user profile pages

  • 209 views
Uploaded on

SpringMVC powering SaaS-based Learning Management System for a Fortune 500 company

SpringMVC powering SaaS-based Learning Management System for a Fortune 500 company

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
    Be the first to like this
No Downloads

Views

Total Views
209
On Slideshare
0
From Embeds
0
Number of Embeds
0

Actions

Shares
Downloads
0
Comments
0
Likes
0

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. CourseSites New User ProfilepagesPowered by SpringMVC 2.5
  • 2. Goals• Modernize the code-base from SpringMVC 2.0to SpringMVC 2.5  with the end goal ofSpringMVC 3.0 in the future• More engaging User experiences  driveadoption (91 countries, 6000+ institutions )
  • 3. Spring MVC 2.5key concepts• The importance of annotations– @Controller (no more inheriting fromSimpleFormController, MultiActionController on2.0 version)– @ModelAttribute– @SessionAttribute
  • 4. General Architecture (Controller)• @Controller• @RequestMapping(value="/profile.form")• @SessionAttributes("spring25UserVO")• public class ProfileForm {• ……• ……• }
  • 5. General Architecture …(1)• @RequestMapping(method =RequestMethod.GET)• public String setupForm(HttpServletRequestrequest, HttpServletResponse response,Model model) {• …….• }
  • 6. General Architecture….(2)• @RequestMapping(method =RequestMethod.POST)• public String processSubmit(HttpServletRequestrequest, @ModelAttribute("spring25UserVO")Spring25UserVO spring25UserVO,• BindingResult result, SessionStatus status, Modelmodel) {• ….• }
  • 7. Profile
  • 8. Profile page
  • 9. Modelin particular  wiring the Gender• public class Spring25UserVO {– private UserVO userVO;• …….• }
  • 10. Model…(1)• public class UserVO {– private User user;• ………..• }
  • 11. Model…(3)• public class User {• …….• /**• * Returns the gender of this <code>User</code> object.• * <p>• * Requires AttributePermission with name "user.personalinfo", actions "get".• *• * @return a gender value as defined in {@link User.Gender}• * @see User.Gender• */• public User.Gender getGender()• {• if ( _checkPerms )• {• SecurityUtil.checkPermission( _getPersonalInfo );• }• return (User.Gender) _bbAttributes.getBbEnum( UserDef.GENDER );• }• ……• }
  • 12. Profile Controller• @InitBinder• public void initDataBinder(WebDataBinderdataBinder)• {• dataBinder.registerCustomEditor(Gender.class,new GenderEditor());•dataBinder.registerCustomEditor(EducationLevel.class,new EducationEditor());• }
  • 13. Custom Editor• public class GenderEditor extends PropertyEditorSupport {– @Override– public String getAsText() {• // TODO Auto-generated method stub• Gender value = (Gender) getValue();• return value.toFieldName();– }– @Override– public void setAsText(String text) throws IllegalArgumentException {• // TODO Auto-generated method stub• //super.setAsText(text);• if (text.equalsIgnoreCase(Gender.FEMALE.toFieldName())) {– setValue(Gender.FEMALE);• }• else if (text.equalsIgnoreCase(Gender.MALE.toFieldName())) {– setValue(Gender.MALE);• }• else {– setValue(Gender.UNKNOWN);• }– }• }
  • 14. Profile View/JSP• <form:form id="profileForm"name="NewUserProfileForm"modelAttribute="spring25UserVO"method="POST">• ……• </form:form>
  • 15. Profile View/JSP• <spring:message code="bb.userProfile.gender" var="gender"></spring:message>• <bbNG:dataElement label="${gender}" isRequired="false">• <!-- the "path" element (gender) points to theuserVO.user.gender property• so as long as the userVO.user.gender reflects the value from the• DB (User.gender) such as "MALE"...this will be automatically• "selected" as well -->• <form:select path="userVO.user.gender" items="${genders}"/>• </bbNG:dataElement>
  • 16. Social PagejQuery Dialog
  • 17. Social PagejQuery dialog
  • 18. jQuery Dialog• jQuery("#dialog").dialog({• modal: true,• bgiframe: true,• width: 500,• height: 200,• autoOpen: false• });• jQuery("#confirmDeleteImage").dialog({• modal: true,• bgiframe: true,• autoOpen: false });
  • 19. jQuery Dialog …(cont)• jQuery(".myavatar").click(function (e) {• jQuery("#dialog").dialog({• buttons : {• "Update" : function() {• window.location.href = "imageUpload.form";• },• "Delete" : function() {• jQuery(this).dialog("close");• jQuery(#confirmDeleteImage).dialog(option, buttons, {• "No": function() { jQuery(this).dialog("close"); },• "Yes": function() { window.location.href = "imageDelete.form"; }• });• jQuery(#confirmDeleteImage).dialog(open);•• },• "Cancel" : function() {• jQuery(this).dialog("close");• }• }• });• jQuery("#dialog").dialog("open");• return false;• });
  • 20. Q&A• Questions?! Comments?!