*********** * General * *********** Purpose: The internship subsite is designed to display information pertaining to the RIGA internship program, as well as producing an online application form for prospective interns. Subsite Structure: The main pages of the site each have a picture rotator and a testimonials rotator, along with the main content. There is also a page with an application form on it, which brings users to a confirmation page when filled out. There is a results page that is restricted to internal users such as the internship program staff, who are able to view applications from this page. ************* * Page Info * ************* Main Pages: Home, Benefits, and Eligibility pages all have a similar structure with a title header, an image rotator, main content in a content editor web part, and a testimonial rotator on the right side. There will be separate sections on the rotators. All these pages have a link to internship.css in the top of the main content CEWP. The Eligibility and Programs page has a script which uses jquery to read from the program info table and displays it in a nice format. More on the program in a later section. Contact Page: Needs some renovation. Currently contains header and testimonials, but no image rotator. Has contact pictures (stored in Site Assets under "Contact Photos") and contact info for members of the Internship Program. I was thinking about making the contact info into a list, but didn't think of it in time to implement it. Contact info is currently hardcoded into the page formatted in an html table. Also has a link to internship.css and has some other custom css for contact photo formatting. Application Page: The page where prospective interns apply. The form has been modified in Sharepoint Designer to change the text on some of the fields. Has a CEWP which runs the FormUtility script which handles some conditional formatting and input masking. More on this in the FormUtility section. Editing the Application List will not affect the form on this page because it has been custom edited in Sharepoint Designer, so making any further changes to the form requires going into Sharepoint Designer to add them. After the form is submitted, it goes to the Application List, where an event receiver designed in Visual Studio 2010 moves the application over to the display list and deletes the original copy in the application list. Confirmation Page: Submitting an application brings the applicant to a page confirming that their application has been submitted. This is accomplished through an addition to the URL in the link to the page, specifically the ?Source= element of the URL. The page has a tag embedded in the main body that redirects people to the home page after a set amount of time. Results Page: Contains a view of the private list for internal viewing of applicant data. Fields on the top of the list were removed to make it fit on one page, but still allow for sorting by necessary columns. This change was made in Sharepoint Designer and the only way I found to add columns back is to redo the list view from scratch in Designer. There is also some css linked on the page to prevent the columns from getting too long and ensure that words wrap properly. ****************** * jQuery plugins * ****************** jquery-3.2.1.min: As of 7/27/2017, this is the most recent version of the jquery library, which is a particular library of javascript that uses css selectors to find certain html elements to manipulate. e.g. $("#example") selects the element with id="example", while $("input[title='Question']") returns all elements with their title element set to "Question".This is the basis of several scripts used on the subsite. jquery.mask: This plugin developed by Igor Escobar allows dynamic masking of sharepoint input fields. This is currently used to ensure phone number formatting is consistent when people submit the form, as well as dynamically restricting zip codes to only including digits. Documentation for the original plugin available at https://igorescobar.github.io/jQuery-Mask-Plugin/ including a link to source code. jquery.SPServices-2014.02.min: The Sharepoint Services plugin provides a way to query sharepoint lists in a way that allows us to display them in a more visually appealing format. In our Testimonials and Programs scripts, we use a CAML query native to SPServices to return rows of lists that we use to display program info as well as rotating through testimonials. For more information, check out https://spservices.codeplex.com/ jquery.jshowoff: This plugin is used to cycle through several different elements, showing one at a time. This is used for the testimonials to show one at a time and provide users with the functionality to scroll through them. I made one change to the source code by manually adding the roundedCorners class to one of the divs on line 71 of the source code. This was necessary to get the showoff controls inside of the roundedCorners css and not look weird outside of it. jshowoff documentation at http://ekallevig.com/jshowoff/ ******************* * jQuery programs * ******************* *Note* All of these programs are labeled html so that they can provide any vital html elements that are required to make the script work. However, the main bulk of all of them are javascript/jQuery scripting. Programs.html: Uses SPServices to read the items from the "Program Info" List. It then takes each program and formats the info into an html unordered list, and displays all of these lists in a row on the bottom of the Eligibility.aspx page. Uses jquery and SPServices plugins, CSS in internship.css, more info can be found in the program itself. Testimonials.html: Uses SPServices to read the items from the "Testimonials" List. It then formats the data and uses the jshowoff plugin to show them one at a time with controls that allow users to scroll through them. There is a content editor linking to this script on all 4 of the main pages of the website. Uses jquery, SPServices, and jshowoff, CSS in internship.css, and comments in the program itself for more info. The following post was used for reference in developing this script: http://www.nothingbutsharepoint.com/2011/07/11/creating-your-own-content-slider-for-sharepoint-aspx/ FormUtility.html: Provides conditional formatting and general utility to the application form. Causes additional fields to appear for law students, and adds dynamic masking to fields to help ensure proper formatting and sanitizing input. Specifically, masks phone numbers to the form "(###)-###-####" and zip codes to "#####". Also hides the "where did you intern prior" question and "If other reason, explain" fields unless appropriate answers were given to the corresponding questions. Renaming these fields in sharepoint designer will require going into the code and renaming the appropriate $("input[title='TitleNameHere]") or $("h3:contains('Question Text Here')") blocks of code. ********* * Lists * ********* Internship Application Display List (Secure): This list is the private list that the internship office uses to view the data on the Results.aspx page. Receives data from Application List via SWS_MoveListItem. Field names MUST NOT be changed unless SWS_MoveListItem is directly changed, as field names and list names are hardcoded. Program Info : Contains info for the different programs to be displayed on the main page. Currently contains fields for start and end dates, application deadline, and last day to interview. Additionally has columns for customized text to appear on the page in place of missing dates. Programs.html reads from this list and presents the information on Eligibility.aspx State of Rhode Island General Assembly Internship Program Application: Hopefully renamed before I leave and after Naresh is done doing his work. The list attached to the application form which anonymous users have permissions to add and view. Includes a custom even handler which moves data from this list over to the Dispaly List when an application is filled out. Note that updates to the list itself are not reflected on the application form because of customization done in Sharepoint Designer. Fieldnames MUST NOT be changed unless SWS_MoveListItem is directly changed, as field names and list names are hardcoded. Testimonials: List of Testimonials from previous interns. Contains testimonial body, placement, school, and program date. Body, placement, and school are displayed on the pages, wihle program date can be used as metadata (lets intern office sort and use data in analysis if they desire.) *************** * Permissions * *************** Anonymous users: While the site is live, users have access to all of the webpages except for Results.aspx, which is restricted to internal use for viewing the application results. Anonymous users have add and view permissions to the Application List, no permissions to the Display List, and View permissions to all other lists. Anonymous users specifically have permission to submit their applications to the Application List, but the applications are soon moved to the other list. Internal users: Approved internal users have permissions to view all the lists and have control over adding and editing data in any list, while only people with owner-level permissions have the authority to delete applications (not sure if they have delete permissions in other lists.) ***************** * Miscellaneous * ***************** Picture Rotator: The main pages each have a Picture Library Slideshow Web Part, which pulls images from the "Rotating Library" picture library and displays them in a random rotating order. Most of the settings can be found in the "edit web part" menu, but there is some css added to internship.css which centers the picture since we could not find an easy way to center it via sharepoint. There is also commented-out code to make the image take up the entire width of the zone if desired. Internship.css: This file contains most of the css for the site. Most pages on the site have a link to this file to take care of the majority of css formatting in the form of a tag at the top of the main content editor of the page. Contacts.aspx had some weird formatting stuff with the pictures so there is some custom CSS on that page, as well as custom CSS on the Results.aspx page to attempt to control the max-width of the boxes. SWS_MoveListItem: Written in Visual Studio 2010 by Stonewall Solutions in order to transfer application data from the Application list to the display list. This is necessary because anonymous users must have view permissions on the application list in order to submit their applicaiton, but they should not have permission to view the entire list. So this script automatically moves applications from the Application List to the Display List any time the form is submitted. It functions by moving data one field at a time. Field names are hardcoded, so this file must be edited directly in Visual Studio 2010 if field names in either list are changed, and likewise with the list names.