C5-public : browse Category landing page : handle ajax request to display programs according to the category

[HimashaFernando]

Business benefit: This use case defines the common landing page for the public user, who browsers 'Corporate training'. The elements needs to be arrange within the UI in a proper way by considering user friendliness.

Estimation: UI - 48sp Dev - 48sp Testing - 48sp

[Miyuru-Genesiis]

201611251218 - MM

In the process of fixing issues pointed out in QA cycle 2, modified JQuery code to make of messages that are shown to the user be more dynamic. The can be constructed with different background colors, that can indicate the status/severity of the message/error.

• c5-corporate-training-landing-page-MP - Modified code related to error-message displaying to make it more loosely-coupled with the rest of the code. Now allows dynamic backgrounds according to severity of the message to be diplayed d9bc256
• c5-corporate-training-landing-page-MP - Removed the message container div that was put to hold messages, so there will be minimal conflicts when integrating with c7 c3b7956

[Miyuru-Genesiis]

201611251935 - MM

This commit fixes the issue raised by point 4 of QA Cycle 2 comments

• c5-corporate-training-landing-page-MP Fixed issue of a paginator button being created at the end of the paginator when the fraction part of numOfResults/numOfResultsPerPage is > 0.5 3828e03

[Miyuru-Genesiis]

201611251942 - MM

This commit addresses point 7 of QA Cycle 2 comments by having a message display what part of the result set is currently displayed, out of how many total items.

• c5-corporate-training-landing-page-MP Re-factored code vis-a-vis enableDisablePrevNextButtons() function and added other functions changeDisplayedResultsStatInfo() and adjustPaginatorOnChangeOfDisplayedResults() to display a message as to what part of the result set is currently displayed, upon clicking of a paginator button 23800c2
• c5-corporate-training-landing-page-MP - Added a div element with class 'programme-results-stat-info-div' just above the pagination container to act as the container of a message that displays what part of the result set is currently being displayed a9c4e7c

[Miyuru-Genesiis]

201611271030 - MM

Carried out essential modifications to suit recent changes in requirements, design decisions and systemwide-conventions. Also made other enhancements.

• c5-corporate-training-landing-page-MP Modified code aimed at several fixes and optimisations: to suit omission of logoImagePath column, to make code that accesses specific indexes of the result-set more maintainable and to send default-course-provider details to front-end so the default-provider image may be shown when accountType of a provider is one-off dff7bcf
• c5-corporate-training-landing-page-MP Modified code to retrieve AccountType of courseProvider and use AccountType enum to set the proper constant name to result list 3066aa7
• c5-corporate-training-landing-page-MP Modified code so course provider images are considered to be in a directory named as provider's code in its record in DB table. Also changed code to consider image names have the format {courseProviderCode}_small.jpg, and to load default course provider image when courseProvider is one-off cca506a
• c5-corporate-training-landing-page-MP - Modified code in to remove header and footer code from this file and instead used to include them 2a2707a
• c5-corporate-training-landing-page-MP Added AccountType enum file in issue and added getAccountTypeByTypeValue(int) method to retrieve enum constant by passing its value for 'typeValue' 3728881
• c5-corporate-training-landing-page-MP Added ApplicationStatus enum in the issue from C7-public:browse-higher-education-landing-page 3dc902d

[Miyuru-Genesiis]

201611272320 - MM

• c5-corporate-training-landing-page-MP Modified code to use ApplicationStatus enum to set arguments to status related parameters, and to consider DISPLAYSTARTDATE in query ed47da1
• c5-corporate-training-landing-page-MP Made value1, value2, value3 final 6b01e3d
• c5-corporate-training-landing-page-MP Modified code in changeDisplayedResultsStatInfo() to make the message about the currently displayed result set suit special scenarios such as last page displaying only 1 programme and total result set containing only 1 item 0d4828f
• c5-corporate-training-landing-page-MP Removed unused java.sql.Date object 294d1e1

[Miyuru-Genesiis]

201611272323 - MM - updated 201611281030

Implemented all recommendations made in QA Cycle 2.

Changes made: rtc 201611251218 - MM d9bc256, c3b7956

rtc 201611251935 - MM 3828e03

rtc 201611251942 - MM 23800c2, a9c4e7c

rtc 201611271030 - MM dff7bcf, 3066aa7, cca506a, 2a2707a, 3728881, 3dc902d

rtc 201611272320 - MM ed47da1, 6b01e3d, 0d4828f, 294d1e1

Moving to Code Review

[pabodhaW]

201611281536 PN Code review comments

rtc 201611272323 - MM, 201611242050 - HF mentioned QA issues are fixed

Code is good to go for the next stage. Therefore moving this issue into RFQA by assigning @HimashaFernando

[HimashaFernando]

201611291430 HF - QA cycle 3 summary

Point 1 Filter panel view is jumbled when having more filters and having lengthy values as filter names. @Miyuru-Genesiis - I had a small discussion with @tharakaGen and he mentioned that it would be better to have this panel as a menu bar instead of having check boxes. But, then user can not select more than one filter. KTD

Point 2 The program location cell is not adjusted according to the cell size, when program has multiple locations to display. @tharakaGen @Miyuru-Genesiis - better to add the solution to all cells as we discussed.

Special notes course provider logo display in category landing page - This function is implemented to get the image name always as _small.jpg. It is coded in 'categoryLandingPage.js' file. According to this implementation, course provider logo upload should always validated to only .jpg extension and the uploaded image should be always renamed as '_small.jpg'. Would this be fine? FYA @tharinduw

Assigning back to @Miyuru-Genesiis

[tharinduw]

@Miyuru-Genesiis @tharakaGen @HimashaFernando

Point 1 - @HimashaFernando point is noted. user should be able to select multiple filters

point 2 - @tharakaGen to fix.

s/p notes - @Miyuru-Genesiis @HimashaFernando format of small logo '_small.jpg' is ok.

Hope this is validated during institute creation.

[Miyuru-Genesiis]

201611302225 - MM

• c5-corporate-training-landing-page-MP Modified code to handle an issue related to filtering area getting distorted upon having filtering items that have names that are longer than around 25 chars ce86051

This commit fixes the issue referred to by Point 1 in QA cycle 3 summary (rtc 201611291430 HF). @HimashaFernando, as discussed and demonstrated since that comment, even when there were no check-boxes as filtering items, (there were links in their place when I started working on the UI) this problem would still be there when the space occupied by the length of the text on each of those items exceeded a certain amount of pixels. Therefore, again - as explained to you in person - I am afraid I do not see the point of removing the check-boxes to address the issue, because, for one, it would not solve it, and two, as confirmed by @tharinduw, the user must have the ability to select multiple such elements - as you have also opined. _However, this by no means is to say that the filtering elements must be shown as check-boxes (because then they would look less appealing to the user). There may be check-boxes underneath, but they must be styled in a way that they render as button-like elements on the page. @tharakaGen has also confirmed styling them that way is in fact possible. But this is to make them appealing, not to solve the issue under consideration (which is too-lengthy text on those items distorting their proper arrangement - be they check-boxes or else)_

Therefore, the solution devised in this commit was to limit the name of all of the filtering items to 20 characters (this number could be adjusted up a little) and to compensate for that by showing a tool-tip that pops up when the mouse hovers over each of these elements, with the full, un-truncated name. After this solution, the layout was observed to be preserved even when names on filtering elements from the DB were too lengthy.

In the meantime, @tharakaGen, please see if you can find a way to style the check-boxes to have the appearance of a button.

[Miyuru-Genesiis]

201611302347 - MM

Since commits after the change of framework classes were made to the branch c5-corporate-training-landing-page-MP, the branch that was in use before that change, c5-corporate-training-landing-page, is to be removed - as instructed by @tharinduw - after this issue is integrated to Sprint 1 branch.

[Miyuru-Genesiis]

201612010802 - MM

Since the only point from QA cycle 3 summary that can be tackled from the back-end work (Point 1) has been handled, issue is moved to Code Review. Please refer to the comment by TW as well. The only change since QA cycle 3 is referenced by commit ce86051 (rtc 201611302225 - MM).

[pabodhaW]

201612010915 PN Code review comments

rtc 201612010802 - MM, 201611302347 - MM, 201611302225 - MM mentioned QA issues are fixed.

Improvements. if (levelOrMajorCollection !== undefined && levelOrMajorCollection !== null && levelOrMajorCollection.length > 0)

Above line can be replaces using if (levelOrMajorCollection)

(This is not a mandatory fix. If you think it is better to change the code, do it when integrating the issue. @Miyuru-Genesiis )

Code is good to go for the next stage. Therefore moving this issue into RFQA by assigning @HimashaFernando