introduction - mdh  · web viewcurriculum planning is a complex process with many stakeholders,...

108
COURSE CURRICULUM PLANNING AND MANAGEMENT SYSTEM MARIN RUDIC 1

Upload: phunghanh

Post on 14-Jul-2018

214 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

COURSE CURRICULUM PLANNING AND MANAGEMENT SYSTEM

MARIN RUDIC

School of Innovation, Design and EngineeringSubject: Computer ScienceAdvanced level30 ECTS CreditsThesis advanced level, Computer Science

CDT504

Supervisor: Ivica CrnkovicExaminer: Kristina LundqvistDate: 30.05.2012

1

Page 2: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

2

Page 3: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

DEDICATE

This thesis is dedicated to my beloved Family, Teachers and Friends.

Especially for my parents and sister who woke me up all those years.

3

Page 4: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

ACKNOWLEDGMENT

I have had pleasure to work on this project. However, it would not have been so good and interesting without support and help of my supervisor Mr. Ivica Crnkovic. I would like to extend my sincere thanks to him, to IDT School at MDH and all colleagues. They were my support in completion of this Master Thesis.

4

Page 5: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

ABSTRACT

Curriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process the manual routines lead to many errors and inconsistency which requires additional efforts and causes decreased services to students and teaching staff. The goal of this project is to build an information management system to support Curriculum planning at MDH.

The project work includes collection of information about current working processes, requirements analysis and data analysis, modelling current processes in information system and development software which will implement all of those processes.

The central component of the system is a database on which are connected functions used for input or presentation of data. The main functions of the system are web-based applications providing a support for creating a new program, its maintenance, creation and maintenance of courses, allocation of teaching staff to the courses.

This thesis includes a collection of requirements, design and implementation of the system, and its testing, discussion of issue-management systems, and give some proposal how this information system can be further improved as an issue-management system.

5

Page 6: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

TABLE OF CONTENTS

1. INTRODUCTION.........................................................................8

1.1. Project motivation...........................................................................8

1.2. Current problems.............................................................................9

1.3. Thesis overview..............................................................................9

2. DEVELOPMENT PROCESS.....................................................10

2.1. Software prototyping development process......................................10

2.2. Evolutionary prototyping process....................................................11

2.3. Prototyping of COSY information system........................................11

3. REQUIREMENTS SPECIFICATION.........................................13

3.1. Schema of current actions and users................................................13

3.2. Requirements specification for COSY.............................................143.2.1. Create program..................................................................................................14

3.2.2. Create program instance.....................................................................................14

3.2.3. Approve program................................................................................................14

3.2.4. Approve program instance...................................................................................15

3.2.5. Edit program......................................................................................................15

3.2.6. Edit program instance.........................................................................................15

3.2.7. Delete program...................................................................................................15

3.2.8. Delete program instance......................................................................................16

3.2.9. Create course.....................................................................................................16

3.2.10. Create course instance........................................................................................17

3.2.11. Approve course...................................................................................................17

3.2.12. Approve course instance......................................................................................17

3.2.13. Edit course.........................................................................................................17

6

Page 7: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

3.2.14. Edit courses instance...........................................................................................17

3.2.15. Delete course......................................................................................................18

3.2.16. Delete courses instance.......................................................................................18

3.2.17. Create user.........................................................................................................18

4. FIRST PROTOTYPE ARCHITECTURE....................................19

4.1. Structure of the application.............................................................194.1.1. The Front-end application...................................................................................19

4.1.2. The Back-end application....................................................................................20

4.2. User permissions...........................................................................21

4.3. Module components......................................................................224.3.1. Filters................................................................................................................22

4.3.2. Forms................................................................................................................22

4.3.3. Database............................................................................................................22

5. FIRST PROTOTYPE IMPLEMENTATION................................24

5.1. The Back-end application implementation.......................................245.1.1. Program instance list..........................................................................................24

5.1.2. View/edit program instance..................................................................................25

5.2. The Front-end application implementation.......................................265.2.1. Program instance list..........................................................................................26

5.2.2. View program instance........................................................................................27

5.2.3. Add new / edit program instance..........................................................................28

6. ANALYSIS OF THE FIRST PROTOTYPE OF THE APPLICATION................................................................................29

6.1. Description of the first prototype.....................................................29

6.2. Strategy for next prototype.............................................................31

7. CURRENT PROTOTYPE ARCHITECTURE............................32

7.1. Application architecture.................................................................327.1.1. COSY Application architecture.............................................................................32

7

Page 8: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

7.1.2. COSY core..........................................................................................................33

7.2. Users permissions..........................................................................357.2.1. WordPress users.................................................................................................35

7.2.2. COSY core users.................................................................................................36

8. CURRENT PROTOTYPE IMPLEMENTATION........................37

8.1. COSY module implementation.......................................................378.1.1. Program instance list..........................................................................................37

8.1.2. Add new program instance...................................................................................38

8.1.3. View program instance........................................................................................43

8.1.4. Edit program instance module..............................................................................45

8.2. WordPress implementation.............................................................478.2.1. Pages structure...................................................................................................47

8.2.2. Module details....................................................................................................48

8.3. Database............................................................................................................50

8.3.1. WordPress database............................................................................................50

8.3.2. COSY core database............................................................................................51

9. ANALYSIS OF CURRENT PROTOTYPE.................................52

9.1. Description of current prototype.....................................................52

9.2. Strategy for the next prototype........................................................52

10.USED TECHNOLOGIES...........................................................54

10.1. PHP / MySQL............................................................................5410.1.1. PHP...................................................................................................................54

10.1.2. MySQL...............................................................................................................55

10.1.3. PHP and MySQL in combination..........................................................................55

10.2. WordPress.................................................................................5610.2.1. The History of WordPress....................................................................................56

10.2.2. Requirements......................................................................................................58

10.2.3. Features.............................................................................................................58

10.3. WordPress plug-ins.....................................................................60

8

Page 9: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

10.3.1. PHP Exec...........................................................................................................60

10.3.2. Private only........................................................................................................60

10.3.3. Role Scooper......................................................................................................60

10.3.4. Xili-language......................................................................................................61

10.4. HTML/CSS...............................................................................6210.4.1. Hypertext Markup Language (HTML)...................................................................62

10.4.2. Cascading Style Sheets (CSS)...............................................................................62

10.4.3. HTML and CSS in combination............................................................................63

10.5. JQuery.......................................................................................6410.5.1. JQuery Core.......................................................................................................64

10.5.2. JQuery UI..........................................................................................................64

11.GOING FORWARD...................................................................65

12.CONCLUSIONS........................................................................66

13.REFERENCES..........................................................................67

14.67

15.SUPPLEMENTS........................................................................67

9

Page 10: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

1. INTRODUCTIONThis thesis is about production of Course System (COSY) information management system to support Curriculum planning at MDH. Course System is short of Course curriculum program management system. The project COSY information system includes collection of information about current working processes, requirements analysis and data analysis, modelling current processes in information system and development software which will implement all of those processes. Current process of course curriculum program management system is based on manual exchange of document usually in a paper form or an email exchange. Overview of available information about courses and programs documents is not on satisfactory level. With COSY information system we want to improve accessibility and overview of information and documents of curriculum process.

1.1. Project motivationMotivation for this project is to improve the curriculum process which repeats itself every academic year at MDH. Every academic year MDH must publish program of the next academic year with all associated documentation which must be public for all students and staff, and delivered to parent institution. Associated documentation must include all courses and programs of that academic year.

All courses and programs must have documentation which confirms verification of university and parent institution.

If some course or a programme is just being introduced, it must first be confirmed by MDH and after it has all verification from MDH, it must be approved from the parent institution. Course or programme documentation usually exists in a paper form or as an email communication.

In the other hand, if some course or programme has already been held, it has all documentation but it is usually in a paper form or an email form, archived by some teacher or secretary. There is no some unique archive containing all those courses and programs documents.

Programs are made of some unique information and associated courses. Courses associated with a program can be held every academic year once or more times or it may not be held at all. Every academic year can be specific but a program stays the same. If we know that for a three year program there is one study programme for each year and there are many programs on a university. We only can imagine the possible mess with all those papers.

10

Page 11: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

And that is our motivation to make COSY information system to improve that process.

11

Page 12: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

1.2. Current problemsMotivation of the project is to simplify the management and planning of the courses and programs inside the university. The current system is based on communication through emails and documenting the changes in an excel sheet.

The major problems of the current system are:

there is no data management system (Data management system cares about changes in the data and privileges about changing some data)

no validation in the data other than manual people work (There is no validation of the data and it is possible to make some collisions or loose data by mistake)

Lack of visualization of the data (Visualization of the data through excel sheets are usually hard and it is impossible to make good relations between data, especially if it is in different datasheet)

presentation of the data is hard to read and analyze the system does not provide tools for better management of the courses, programs and assign

staff (There is no one place where it is possible to have overview of the data, and the system does not provide tools that can change that)

The aim of the project is to offer a web application that would solve these issues and provide other functionality that would further increase the productivity of the people involved.

That is:

Provide a simplified management of the data about courses, courses instances, programs, program instances and staff by storing it and protecting it from unwanted changes

Provide visual aid to cope with the planning and management of academic year.

1.3. Thesis overviewThe rest of the thesis is organized as follows: Chapter 2 describes software prototype development process. Chapter 3 contains project requirements specification, to clearly understand the goals of this project. Chapter 4, 5 and 6 contain description of the first application prototype. Chapter 6 also contains description of the strategy for the current prototype which is described in chapter 7, 8 and 9. Chapter 7 descript architecture while chapter 8 descript implementation of the current prototype. Analysis of the architecture and implementation is done in chapter 9. Chapter 10 contains description of used technologies.

Chapter 11 contains the discussion strategy for next prototype based on chapter 9 and validity and suggestions for future work. Chapter 12 contains the conclusion.

12

Page 13: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

13

Page 14: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

2. DEVELOPMENT PROCESSThis chapter describes the process of production of the COSY project. When we are mentioning the COSY project, on which production continually worked a few people, we can talk about software prototyping method of development.

Software prototyping refers to the activity of creating prototypes of software applications, incomplete versions of the software program being developed. It is an activity that can occur in software development and is comparable to prototyping as known from other fields, such as mechanical engineering or manufacturing. A prototype typically simulates only a few aspects of, and may be completely different from, the final product.

2.1. Software prototyping development processUnderstanding user requirements is an integral part of the information systems design and is critical to the success of interactive systems. It is now widely understood that successful systems and products begin with an understanding of the needs and requirements of the users. COSY information system is a user oriented information system with a thorough understanding of the needs and requirements of the users.

Particular problems faced by the analyst are:

addressing complex organizational situations with many stakeholders users and designers thinking along traditional lines, reflecting the current system and

processes, rather than being innovative users not knowing in advance what do they want from the future system

Those problems are the reason to go on with the software prototyping development concept because it keeps us in a circular contact with the user, reducing the time available for the user needs analysis and representing the user requirements in an appropriate form.

14

Page 15: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

Figure 1: Software prototype model

The process of prototyping involves the following steps until the user is satisfied:

Identify basic requirements - Determine basic requirements including the input and the output information desired. Details, such as security, can typically be ignored.

Develop Initial Prototype - The initial prototype that includes only user interfaces is developed.

ReviewThe customers, in this case our supervisor, examine the prototype and provide feedback on additions or changes.

Revise and Enhance the Prototype - Using the feedback both the specifications and the prototype can be improved. Negotiation about what is within the scope of the product may be necessary. If changes are introduced then a repetition of the previous and this step may be needed.

2.2. Evolutionary prototyping processThis project is produced in Evolutionary prototyping process. The main goal in using Evolutionary Prototyping is to build a very robust prototype in a structured manner and constantly refine it. The reason for this is that the Evolutionary prototype, when built, forms the heart of the new system, and then improvements and further requirements will be built. When developing a system using Evolutionary Prototyping, the system is continually refined and rebuilt. Evolutionary prototyping acknowledges that we do not understand all the requirements and builds only those that are well understood [9]. This technique allows the developer to add features, or make changes that couldn't be conceived during the requirements and design phase.

15

Page 16: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

In Evolutionary Prototyping, developer is focused to develop parts of the system that he understands instead of working on the development of the whole system.

Prototyping has several benefits: The software designer and implementer can get valuable feedback from the users early in the project. The client and the contractor can compare if the software made matches the software specification, according to which the software program is built. It also allows the software engineer some insight into the accuracy of initial project estimates and whether the deadlines and milestones proposed can be successfully met.

16

Page 17: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

2.3. Prototyping of COSY information systemEvolutionary prototyping software development process is used by my supervisor and previous developer on this project. I started working on the project when its first application prototype was done. Description of first prototype is processed in chapters 4 First prototype architecture and 4 First prototype architecture. Analysis of that prototype is done with the supervisor’s consultation in the chapter 6 Analysis of the first prototype of the application.

That prototype of the application helps me in better understanding of the user’s needs and necessary functionalities which must be supported. Also it gives me experience with the problems related with the implementation and usage of some tools, which we can improve and correct inside the next prototype.

17

Page 18: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

3. REQUIREMENTS SPECIFICATIONThis chapter provides details about current process of the curriculum planning at MDH which yields actions and requirements of COSY system. Requirements specification in the second article is the result of the analysis of the role and activity showed in the first article.

3.1. Schema of current actions and usersNext figure Figure 2: People and activity in current process describes roles and activities during current process.

18

Page 19: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

Administrator

Lecturer

Secretary

Management Board

Education Leader

Head of Division

Course Planning Group

International CoordinatorConfigure

Import/Export Data

Define Program Proposal

Program Coordinator

Initiate New Program Creation

Define Program Curriculum

Approve Program Curriculum

Define Program Schedule

Define Program Popular Description

Define Detailed Program Description

Define Courses Involved in Program

Define Program Description for the catalogue

Enters Data in DSI

Define Course Plans

Define New Course

Cancel Courses

Define Course Instance

Define Course Plans

Manages Data of Free Places and Enrollment Statistic of Courses

Review/Accept Course Plans

3.2. Requirements specification for COSY Requirements are described with identification of the necessary data and short description on how to fill that data.

3.2.1. Create programData requirement:

Program code Title (English), Title (Swedish)

19

Figure 2: People and activity in current process

Page 20: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

Degree School Coordinator Syllabus link Language of Instructions

Duration Courses Description (English)

Description (Swedish) Comment (English) Comment

(Swedish)Description:

Input form must be in English and Swedish where the names of the form fields will be visible on current active language, and if some field is select type of input field it will be in current active language too. Courses can dynamically add or remove until form isn’t complete.

Fields: Title (English), Title (Swedish) Degree, School and Coordinator are required and form can’t be complete before that fields are filled.

3.2.2. Create program instanceData requirement:

Program Coordinator Syllabus link

Academic year Courses

Description:

Input form must be in English and Swedish where the names of the form fields will be visible on current active language, and if some field is select type of input field it will be in current active language too. Course instances can dynamically added in information system from this form with help in fill data if any previous interesting course instance exists in system. Course instance can be connected with new program instance which will be created in this form.

Fields: Program, Academic year and Coordinator are required and form can’t be complete before those fields are filled.

20

Page 21: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

3.2.3. Approve programData requirement:

StatusDescription:

Administrator and Education leader must have privileges to change program status. After program is once approved it is no longer possible to make changes on its data.

3.2.4. Approve program instanceData requirement:

StatusDescription:

Administrator and Education leader must have privilege to change program instance status. After program instance is once approved it is no longer possible to make changes on its data.

3.2.5. Edit programData requirement:

Program code, Title (English), Title (Swedish) Degree, School, Coordinator, Syllabus link,

Language of Instructions, Duration, Courses, Description (English)

Description (Swedish) Comment (English) Comment

(Swedish)Description:

Input form must be in English and Swedish where the names of the form fields will be visible on current active language, and if some field is select type of input field it will be in current active language too. Courses can dynamically add or remove until form isn’t complete.

Fields: Title (English), Title (Swedish) Degree, School and Coordinator are required and form can’t be complete before that fields are filled. Edit form is accessible only if program isn’t approved.

21

Page 22: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

3.2.6. Edit program instanceData requirement:

Program, Coordinator, Syllabus link,

Academic year, Courses,

Description:

Input form must be in English and Swedish where the names of the form fields will be visible on current active language, and if some field is select type of input field it will be in current active language too. Course instances can dynamically added in information system from this form with help in fill data if any previous interesting course instance exists in system. Course instance can be connected with new program instance which will be created in this form. Fields: Program, Academic year and Coordinator are required and form can’t be complete before those fields are filled. Edit form is accessible only if program instance isn’t approved.

3.2.7. Delete programDescription:

Deleting a program is possible form the page with full description about the program, and system must ask if the user is sure about that action.

3.2.8. Delete program instanceDescription:

Deleting a program instance is possible from the page with full description about the program instance, and system must ask if the user is sure about that action.

22

Page 23: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

3.2.9. Create courseData requirement:

Program code, Title (English), Title (Swedish) Level Marks Examination Credits Area of education Subject School Responsible Language of Instructions Syllabus link Main field of study Prerequisites

(English),Prerequisites (Swedish)

Objectives (English),Objectives (Swedish)

Learning objectives (English), Learning objectives (Swedish)

Content (English), Content (Swedish)

Teaching methods (English), Teaching methods (Swedish)

Workload (English), Workload (Swedish)

Environmental aspects (English), Environmental aspects (Swedish)

Other Regulations (English), Other Regulations (Swedish)

Literature (English),Literature (Swedish)

Comment Valid from semester Valid from

Description:

Input form must be in English and Swedish where the names of the form fields will be visible on current active language, and if some field is select type of input field it will be in current active language too. Examinations can dynamically add or remove until form isn’t complete, if some examination is selected than it is required to all fields about that examination. Credits of course are sum of all selected examination credits. Fields: Title (English), Title (Swedish), Level, Marks, Examination, Credits, Area of education, Subject, School, Responsible and Prerequisites (English), Prerequisites (Swedish) are required and form can’t be complete before that fields are filled. Valid from is date type of field.

23

Page 24: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

3.2.10. Create course instanceData requirement:

Course Estimated number of students Actual number of students Planned budget in hours Workload

Staff Location Syllabus link Academic year Periods

Description:

Input form must be in English and Swedish where the names of the form fields will be visible on current active language, and if some field is select type of input field it will be in current active language too. Course instance can be made of any existing course. Fields: Course, planed budget in hours, Workload, location and Academic Year are required and form can’t be complete before those fields are filled.

3.2.11. Approve courseData requirement:

StatusDescription:

Administrator and Education leader must have privilege to change course status. After course is once approved it is no longer possible to make changes on its data.

3.2.12. Approve course instanceData requirement:

StatusDescription:

Administrator and Education leader must have privilege to change course instance status. After course instance is once approved it is no longer possible to make changes on its data.

3.2.13. Edit courseData requirement:

Same data as in Create courseDescription:

24

Page 25: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

Same form description as in Add new course, but page for edit data is accessible only while course isn’t approved.

25

Page 26: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

3.2.14. Edit courses instanceData requirement:

Same data as in Create course instanceDescription:

Same form description as in Create course instance, but page for editing the data is accessible only while course isn’t approved.

3.2.15. Delete courseDescription:

Deleting a course is possible from the page with full description about course, and system must ask the user if it is sure about that action.

3.2.16. Delete courses instanceDescription:

Deleting a course instance is possible from the page with full description about course instance, and system must ask the user if it is sure about that action.

3.2.17. Create userData requirement:

Username E-mail First Name Last Name

Password Confirm password Send password User group

Description:

Administrator can add a new users, this form doesn’t have to be in English and Swedish. Fields: Username, email, password, confirm password and user group are required field and form can’t be complete before those fields are filled. Generating of the password and sending connection data to the new user by email are required functionalities.

26

Page 27: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

4. FIRST PROTOTYPE ARCHITECTUREThe prototype was created using PHP framework Symfony 1.4 with Doctrine. The MySQL database management system is used and set-up based on tutorial [17].

The symfony is running locally on WAMP server. The project itself is located at host server.

The information about database is provided in the following section. There is a MySQL Workbench 5.2 CE connected to the database to help inspecting generated database.

Files and the module structure of the project is generated using terminal with Symfony scripts.

4.1. Structure of the applicationThe main structure of the project was implied by the framework and it was kept consistent throughout the project.

This prototype of the application used a concept of dividing application in two applications:

Front-end applicationThis application will be used by all users and it has limited privileges to change data in information system

Back-end applicationThis application will be used by COSY administrator and users will have privileges to change all data in the information system.

4.1.1. The Front-end applicationThe Front-end application provides functionalities that are accessed by the common system users for all their functions.

There are four main modules in the front-end of the application, like you can see on the Figure 3: The main structure of COSY web system pages in the front-end of application

Course – manage information data about courses course instance - manage information data about course instances

27

Page 28: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

program - manage information data about programs program instance - manage information data about program instances

Each module has several sub-folders:

actions templates one created by developer – config

The config was created in order to provide information of who has a permission to access the module.

The following listing of user permissions will explain main folders inside the project.

Figure 3: The main structure of COSY web system pages in the front-end of application

4.1.2. The Back-end applicationThe Back-end application is intended to provide a possibility to manipulate data only for a few privileged users (like administrator) and an access to the components of the management system for groups, permissions, etc.

28

Page 29: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

Figure 4: The main structure of COSY web system pages in the back-end of application

29

Page 30: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

4.2. User permissionsUsers are divided in six groups and each group has different privileges like it is showed in Table 1: Permissions for user groups inside the system.

Types of users in the system:

EL - Education Administrator and Education Leader (one role for the first iteration)

DV - Division Manager PC - Program Coordinator CR - Course Responsible Person TA - Teacher & teacher assistant A – Admin

Table 1: Permissions for user groups inside the system

EL DV PC CR

TA A

Create program x xCreate program instance x x xApprove program x xApprove program instance x xEdit program x x xEdit program instance x x xDelete program x xDelete program instance x x xCreate course x x x x x xCreate course instance x x x x xApprove course x xApprove course instance x xEdit course x x xEdit courses instance x x x x x xDelete course x xDelete courses instance x x x x xCreate user xEdit user x x x x x xDelete user x

30

Page 31: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

4.3. Module componentsInside of each module of the application next components are implemented:

4.3.1. FiltersFilters are an important part of reducing the amount of results in screen. This helps the user to find particular entries easier. File filters on a single table are easy to create. The description of the filter is placed in \lib\filter\doctrine. The symfony documentation provides information required to create them. On the other hand, it was messy when it comes to filtering on tables with relations to other tables. For example, the course instance inherits the course name from a course table. In the course instance table the user would like to filter on course name and there have emerged many problems.

4.3.2. FormsForms are a big part of the application and symfony provides lots of widgets to make validation and presentation easier. As in all parts of symfony, executing forms on a single database table is rather straight forward and adding some additional functionality from other tables requires “merge” and “embedding” to be correctly saved in the database.

4.3.3. DatabaseThis project is using Doctrine - PHP Object Persistence Libraries, which is part of Symfony project. The MySQL database is called “cosy” and database ER diagram is presented on (Some of the tables like user profile and program documents have been removed from diagram in order to improve the readability).

schema.ymlThis file contains description of the database tables and relations in YAML language. Simply put, this is the database structure.

Location: config\doctrine\schema.yml

fixtures.ymlThis file contains basic information to be loaded into the database in YAML language. Some are required for the system to run (e.g. the possible user’s roles in the system) and the others are there for the test purposes (dummy records).

Location: data\fixtures\fixtures.yml

databases.yml

31

Page 32: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

This file describes the location, type and the connection details of the database to be created and loaded for the project. The file is written in YAML language

32

Page 33: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

Figure 5: ER diagram of COSY application first prototype

33

Page 34: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

5. FIRST PROTOTYPE IMPLEMENTATIONThis chapter describes the structure of the COSY information system implemented in Symfony framework as one module of a back-end and front-end application. The front-end application is visible for all users and they can use all functionalities. The back-end application is visible only for administrators which can use all functionalities of front-end and back-end application.

5.1. The Back-end application implementationThe back-end application is generated by symfony framework and it has unfinished design. On homepage Figure 6: Back-end application homepage is visible that there are more options than in front end application described in the next chapter Figure 9: COSY homepage.

Figure 6: Back-end application homepage

34

Page 35: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

5.1.1. Program instance listAfter click on Program Instances button in main menu information system taking Figure 7: Program instance module screen.

Figure 7: Program instance module

5.1.2. View/edit program instance After click on some program instances on the list of existing program instances in Figure 7: Program instance module screen page view/edit selected program instance data will be shown Figure 8: Program instance view/ edit module.

35

Page 36: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

Figure 8: Program instance view/ edit module

36

Page 37: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

5.2. The Front-end application implementationIn this chapter one module of COSY application of first prototype will be presented, the same module as will be presented for the current prototype implementation to se difference between first and current implementation. Analysis of first prototype is written in detail in the next chapter and those in this chapter will not be discussion about it.

The project design is created as suggested by framework, using decorator design pattern and a combination of HTML and CSS. The main layout is described in main.css layout for front-end. The logo was created using font “Jokerman”. Homepage with the logo is visible on Figure 9: COSY homepage.

Figure 9: COSY homepage

37

Page 38: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

5.2.1. Program instance listAfter click on Program Instances button in main menu information system taking Figure 10: Program instance module screen.

Figure 10: Program instance module

5.2.2. View program instance After click on some program instances on the list of existing program instances in Figure 10: Program instance module screen page with detail information about selected program instance will be shown Figure 11: View program instance module.

38

Page 39: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

Figure 11: View program instance module

39

Page 40: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

5.2.3. Add new / edit program instance By click on “Edit” button under main menu on the Figure 11: View program instance module screen page edit program instance module will be shown Figure 12: Edit program instance module.

Figure 12: Edit program instance module

40

Page 41: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

6. ANALYSIS OF THE FIRST PROTOTYPE OF THE APPLICATION

Evolutionary Prototyping software development is a group of software development methods based on iterative and incremental development, where requirements and solutions evolve through collaboration. It promotes adaptive planning, evolutionary development and delivery, a time-boxed iterative approach, and encourages rapid and flexible response to change. It is a conceptual framework that promotes foreseen interactions throughout the development cycle.

6.1. Description of the first prototypeSymfony is an Object-Oriented framework and it prefers to manipulate objects whenever it is possible. For example, instead of writing SQL statements to retrieve records from the database it is preferred to use objects.

The relational database information is mapped in an object model. This can be done with an ORM tool and thankfully, Symfony comes bundled with two of them: Propel and Doctrine.

The description model of the database used in the project provides adding new columns or tables in the database and relations between tables without any problems. But the problem comes in defining the display and manipulation of data.

Project was developed following the step by step directions of official tutorial of Symfony framework based on development of the “Jobeet” application.

Within the documentation there is description on how to make multi language applications using Symfony framework. At the beginning of the project the use of multiple languages was not anticipated, all description was how to make one language site. The adaptation of the web pages for multiple languages is on the end of the demo project described through translation of the names of some links and categories that are manually entered into the database via a file with initial data in the database. There is no dynamics that we need and there are no more tutorials which can help us to make everything what we need in COSY project.

Symfony framework is based on MVC (Model View Control) model and generating View and Control parts according to database Model of application thus reduces the dynamics of manipulation with forms. Making customized forms and available data in forms thought description files is more complicated

41

Page 42: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

than simple use of PHP and HTML and some solutions are impossible to make because they are not provided by Symfony.

Symfony framework’s advantage in production of forms and their validation though object oriented modes is in serialization and readability of source code but it reduces the necessary freedom to manipulate the data in this project.

This application requires a complete operation and manipulation of multi-language data. Current solution implemented with Symfony is unusable because the used framework in the project should allow easier and faster operations.

I can’t certainly say that given the requirements it isn’t possible to implement the project using Symfony framework, but this solution is useless because it is taking too much time to discover the possible advanced options to implement specific requirements.

6.2. Strategy for next prototypeDatabase model of application implemented with Symfony generated useful relation database with main structure of tables but tables don’t contain all necessary data columns.

There are many others software solutions that we can use instead of the Symfony framework and reuse the database generated with Symfony to make changes according to the selected solution and missing data.

Solutions that impose itself instead of the Symfony framework are Drupal, WordPress and specially made CMS for this application. CMS (Content management system) is a computer system that allows publishing, editing, modifying content and its structure from a central page independent of application functionality.

The biggest difference between WordPress and Drupal is that Drupal is a Content Management System, and WordPress was initially a blog engine. This means Drupal assumes that there will be many different kinds of users with various levels of control who are administering a website, and WordPress assumes there will be only one.

WordPress has moved into CMS space, because most people who started off as simply bloggers have realized that they need more than just a blog, but they already have experience with WordPress and they are familiar with its interface. Similarly, Drupal needs additional modules to be installed and configured to get exactly the same functionality as a WordPress blog, and considerable time would be needed to do setup and configuration.

We selected WordPress because Drupal is more complicated with user level privileges, i.e. solution with multiple administrator types that we don’t need on this project. There is only one level of developer administrator which has access

42

Page 43: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

to CMS and privileges to change data and structure of application. Also we need a welcome page of the application organized like a blog page where administrator can put news related to the application, what WordPress makes more practical option. WordPress provides us with enough good tools to manage contents of a webpage.

Making own CMS is discarded because it will take more time than first two solutions and also it will be more complicated to build upon in the future for a new developer.

Drupal and WordPress support Multilanguage sites and its structure is of the critical meaning for this project.

In the next iteration idea is to improve filters on the course, course instances, programs and program instances pages to work without refreshing the page. Distribution on front-end and back-end application which exists, because it was complicated to present different user interface to different users, will be abolished and implemented as one application which enables that functionality.

7. CURRENT PROTOTYPE ARCHITECTURE

7.1. Application architectureApplication is working in a client server architecture based on the HTTP protocol. HTTP defines a request-response protocol in the client-server computing model. A web browser, for example, may be the client and an application, Apache server in this case, running on a computer hosting a web site is the server. The client submits an HTTP request message to the server. The server process request forwards it on associated PHP applications which like result make HTML and other content, or performs other functions on behalf of the client, returns a response message to the client. The response contains completion status information about the request and may also contain requested content in its message body. HTTP is designed to permit intermediate network elements to improve or enable communications between clients and servers.

43

Page 44: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

Client

Web browser

Server

Apache – Web server (servis)

PHP modul

MySQL server (servis)

request

response

SQL qureys

Database

COSY Applicaton

HTTP

44

Figure 13: Client server architecture

Page 45: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

COSY application

WordPress

COSY core

Users

Courses

Course Instances

Programs

Program Instances

Users

Admin

7.1.1. COSY Application architectureApache web server forwards HTTP request to COSY application based on the request’s message which contains some data used by COSY application. The data that are interesting for COSY application are in the URL and the post field. URL contains data for navigation on the web pages mostly used from WordPress application which is back-end part of COSY application. WordPress is used like a CMS and it takes care about navigation through modules of COSY core application and currently used language.

45

Figure 14: COSY application architecture

Page 46: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

COSY core

Courses

Course Instances

Programs

Program Instances

Users

Admin

7.1.2. COSY coreCOSY core is core of course and program management information system. It contains courses, course instances, program, program instances, users and admin modules which contain its sub modules responsible for each action of parent module.

All modules are made based on the same pattern to simply understand concept of work and file structure of each module. List module presenting table with short description of course, program or other data for which is that module responsible. View module presenting full data, edit module provides changing of data while Add new provide insert new data in information system.

Module:

List - table view of data View – full data description Edit – edit data Add new – add new data

46

Figure 15: COSY core application architecture

Page 47: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

47

Page 48: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

7.2. Users permissionsUsers permissions are changed instead of users permissions used in first prototype described in the Table 1: Permissions for user groups inside the system. In this prototype user permissions can be observed from two points. First point of observation is from WordPress which observes the users in a two groups, administrators and COSY users, with possibility that an administrator is COSY user too. Second point of observation is from COSY core, which observes users in a few groups depending on a role in the information system.

7.2.1. WordPress usersIn this chapter we will see how WordPress observes users of the information system and which privileges do they have in the WordPress application.

WordPress uses a concept of Roles, designed to give the administrator the ability to control and assign what users can and cannot do on the page or in CMS. An administrator can manage and allow access to such functions as writing and editing posts, creating Pages, defining links, creating categories, moderating comments, managing plug-ins, managing themes, and managing other users.

WordPress has five pre-defined Roles:

Administrator Editor Author Contributor Subscriber

Each Role is allowed to perform a set of tasks called Capabilities [7].

In this case WordPress is configured to have users divided in two groups:

Administrators COSY users

Administrators have full access to perform all possible Capabilities [7] in WordPress and administrator role in COSY core system too, which grants them full privileges.

COSY users don’t have access to WordPress and don’t have direct access to any Capability. They only can indirectly access to

add_users create_users promote_users list_users remove_users

48

Page 49: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

delete_usersCapabilities through COSY core are available if their role in COSY core allows that.

49

Page 50: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

7.2.2. COSY core usersIn this chapter we will describe how COSY core application observes users and which privileges they have in the core of information system. Privileges are a little changed since the first prototype, instead of privileges used in the first prototype described in Table 1: Permissions for user groups inside the system.

Types of users and capabilities of each group of users in the system are represented in Table 2: COSY users and privileges:

A - Administrator EL - Education administrator and Education Leader DV - Division manager TA - Teacher and teacher assistant

Table 2: COSY users and privileges

A EL DV TA PC CRCreate program X X Create program instance X X X Approve program X X Approve program instance X X Edit program X X X Edit program instance X X X Delete program X X Delete program instance X X X Create course X X X XCreate course instance X X XApprove course X X Approve course instance X X Edit course X X XEdit courses instance X X XDelete course X X Delete courses instance X X XCreate user X X Edit user X XDelete user X X

Separated groups:

PC - Program Coordinator CR - Course Responsible Person

In Table 2: COSY users and privileges descript privileges of a user from any group who is selected for responsible person for some course or program.

50

Page 51: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

8. CURRENT PROTOTYPE IMPLEMENTATIONIn this chapter structure of COSY information system implemented in WordPress backend application and one module of COSY core application are described. COSY core application is visible for all users but all users can’t use all functionalities, it depends on the user role and privileges like it is described in Error: Reference source not found. Also descript features in WordPress application are visible only for administrator user.

8.1. COSY module implementationIn this chapter program instances module of COSY information system is described. All COSY modules visible on Figure 15: COSY core application architecture are made on the same pattern so there is no need to describe each modules individually. After signing up in the COSY information system user is located on Figure 16: COSY homepage from where he can go to any module. Program instances module is selected because it is the most complicated module and uses parts of other modules, which will be described too. Also description is made for administrator accounts that some options will not be visible or permitted if you are signed in the system from other non-administrator account.

Figure 16: COSY homepage

51

Page 52: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

8.1.1. Program instance listAfter click on Program Instance button in main menu information system taking Figure 17: Program instance list module screen.

Figure 17: Program instance list module

Module presenting the table with the list of existing program instances in the database. Table content is sortable by all columns and searchable through text input in the top right corner of table. Content of the table is automatically filtered with the search criteria, independently of which data column satisfies it.

These features are made with the DataTables jQuery plug-in. DataTables operates on the principle of progressive enhancement, whereby an enhanced and interactive table will be presented to the end user if their browser has the required capabilities. When you initialize the jQuery.dataTable object, information about the table is read directly from the HTML page.

52

Page 53: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

8.1.2. Add new program instanceAfter clicking on “Add Program Instance” button located in the top left corner of the table with list of existing program instances visible on Figure 17: Program instance list module user is redirected on the add new program instance page visible on Figure 18: Add new program instance form.

Figure 18: Add new program instance form

Module presenting input form for adding a new program instance in the system. To create new program instance we must first select Program from which we want to make the program instance. It can be done by selecting one of existing programs or program instance.

Click on a button “Select program” will pop up dialog visible on Figure 19: Select program dialog or “Select program instance” will pop up dialog visible on Figure 20: Select program instance dialog.

Figure 19: Select program dialog

53

Page 54: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

Figure 20: Select program instance dialog

We can see similarities between the content of these two dialogs and list modules because they are in close relation with list modules. Searching and sorting of data in the dialog is possible.

After a user selects one of the programs or program instances, data in the form will be changed like it is shown on Figure 21: Add new program instance form after select program or program instance. If a program is selected, than input form will show selected program data and list of all courses related to that program. In other case when a program instance is selected there will be program data of the program contained in that program instance. On the courses list there will be only courses from which selected program instance contains course instance.

Figure 21: Add new program instance form after select program or program instance

It is always possible to add some course on the list again by clicking on the button “Add course” and selecting it in the dialog in Figure 22: Add course in table dialog.

54

Page 55: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

Figure 22: Add course in table dialog

Course is on the list in the dialog if it is contained in selected program list of courses.

55

Page 56: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

Program instance represents program of one specific academic year with specific course instances for that year. A program instance doesn’t have to contain all courses of some program and nor does it have to contain same courses each year. Courses have some specific data each academic year and there can be more same courses in the same academic year with different specific data those COSY system have course instances. Program instance will be related to course instances added in list of courses in Add new program instance form. Relation between program instance and course instance can be associated by clicking on “New instance” on course, if we want associate program instance with instance of course which still doesn’t exist, or “Select Instance” if that course instance already exist in information system.

Figure 23: Create course instance dialog

If the user clicks on “New instance” it will pop up dialog shown in “Figure 23: Create course instance dialog” which contains form to input data for new course instance. That form will have default values from existing course instance in association with selected program instance in dialog on Figure 20: Select program instance dialog if the user has previously made that action or it will be empty if the user selects a program in dialog Figure 19: Select program dialog.

56

Page 57: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

Figure 24: Select course instance to gat data

Independent is a user select program or program instance in dialog Figure 23: Create course instance dialog is possible to click on button “Existing course instance” and get data from selected course instance in dialog on Figure 24: Select course instance to gat data to form in Figure 23: Create course instance dialog.

Figure 25: Select user dialog

In the form on Figure 23: Create course instance dialog it is possible to associate users in information system with a course instance. By click on “Add Staff” button dialog Figure 25: Select user dialog with all users will pop up. After user is selected it is possible to input role of that user on that course instance and planed working hours or remove the user from that course instance.

57

Page 58: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

Figure 26: Add new program instance form after association with some course instance

After the form Figure 23: Create course instance dialog is submitted or an existing course instance is selected in the dialog on Figure 27: Select course instance dialog, course instances which will be associated with the new program instance, after saving the form, are visible on the list as shown in Figure 26: Add new program instance form after association with some course instance.

Figure 27: Select course instance dialog

After the form is successfully filled out and saved, the new program instance is visible to other parts of the information system.

58

Page 59: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

59

Page 60: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

8.1.3. View program instanceView program instance module in Figure 28: View program instance module presents all data about selected program instance shown in Figure 17: Program instance list module.

Figure 28: View program instance module

Visible data belong to selected program instance, by clicking on “View Program” or one of “View” buttons in the list of course instances, new tab will be opened with detail data about program Figure 29: View program module or course instance Figure 30: View course instance module.

60

Page 61: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

Figure 29: View program module

Figure 30: View course instance module

On the bottom are documents and links tables which content can be added in “Edit program instance” module descript in next chapter.

61

Page 62: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

8.1.4. Edit program instance moduleEdit program instance module in Figure 31: Edit program instance module is opened after click on “Edit” button in View program instance module Figure 28:View program instance module. Edit program instance module has same functionality like Add new program module Figure 18: Add new program instance form with additional modules to add documents and add links visible on the bottom of Figure 31: Edit program instance module.

Figure 31: Edit program instance module

Click on “Upload document” button pop up dialog on Figure 32: Upload document dialog where is possible to add new document associated with current program instance, and which will be visible in documents table in Figure 31: Edit program instance module and Figure 28: View program instancemodule.

Figure 32: Upload document dialog

62

Page 63: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

Figure 33: Add link dialog

Click on “Add Link” button pops up the dialog on Figure 33: Add link dialog where it is possible to add a new link associated with the current program instance, and which will be visible in documents table showed in Figure 31: Editprogram instance module and Figure 28: View program instance module

8.2. WordPress implementationIn this chapter we will see how program instance modules are implemented in WordPress. All modules are implemented on the same pattern and it isn’t necessary to describe all modules. The page structure is accessible by click on Pages on left menu of WordPress Figure 34: WordPress homepage.

Figure 34: WordPress homepage

63

Page 64: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

8.2.1. Pages structureAfter selecting pages on left menu of WordPress homepage, page structure will be shown like on Figure 35: Page structure.

Figure 35: Page structure

In the page structure all modules of COSY information system are visible, with corresponding sub modules. Program instance module which is described in the previous chapter can be found on a list like it is shown on Figure 36: Program instance module in WordPress.

Figure 36: Program instance module in WordPress

64

Page 65: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

8.2.2. Module detailsAfter selecting one of the modules on the list, detailed data about that module will be shown like on Figure 37: Add new program instance module in WordPress.

Figure 37: Add new program instance module in WordPress

On this page it is visible which source code is responsible for the content and functionality of the selected module.

<phpcode><?phpinclude('cosy/includes/programInstanceAddNewEn.php');?></phpcode>

Execute PHP code in the content of posts and pages inside WordPress if feature of PHP Exec WordPress plug-in.

65

Page 66: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

8.2.3. DatabaseIn this chapter database of COSY information system is described in two parts. Database of WordPress back-end application will be described in the first part and in the second part database of COSY core application. COSY core and WordPress backend application have only one common table wp_users, because information system needs possibility to get different content to different role of users like it is descript in chapter 7.2 Users permissions.

8.2.4. WordPress databaseThe diagram Figure 38: WordPress database diagram provides a visual overview of the WordPress database and the relations between the tables created during the WordPress standard installation.

66

Page 67: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

Figure 38: WordPress database diagram

The table overviews and additional details about tables and columns can be found on WordPress official site [8] followed by specific information of what is in each table.

8.2.5. COSY core databaseCOSY core database is built on the database descript in chapter 4.3.3 Database of the first prototype’s ER diagram Figure 5: ER diagram of COSY application first prototype which stayed unchanged. Only users are referenced on WordPress-s table, but that doesn’t change ER diagram, also the fields added in the tables are not visible on ER diagram Figure 39: COSY core part of database.

67

Page 68: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

Figure 39: COSY core part of database

68

Page 69: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

9. ANALYSIS OF CURRENT PROTOTYPEEvolutionary Prototyping software development model initially chosen for this project was continued, because there is still no clear goal how this application should look like in the end, and it resulted in the development of the current prototype. This prototype is a result of a few prototype iterations which for result had a prototype with low level of functionality.

9.1. Description of current prototypeCurrent prototype of the application is symbiosis of WordPress as a back-end application in function of content management system and custom made COSY core application which functions is to implement all functionalities of the COSY information system.

Symbiosis of WordPress and custom made core application take as full dynamics in customizing content and functionality of each module without care about web page structure for which is responsible WordPress.

For each module on each language of COSY core application different source code can be included that is responsible for the module’s functionality in that language, but WordPress takes care about navigation between modules and languages.

The relational database used was generated by previous prototype of application and it is directly edited and maintained with MySQL Workbench 5.2 CE application and there aren’t new YAML or similar files to describe the database in the system. That files are unnecessary because WordPress and COSY core application don’t need rebuild of the database on every change in the system.

Project was developed following the tutorials on official WordPress page [10] and tutorials book WordPress and Ajax .

Defining the display and manipulation of the data doesn’t present a problem for this prototype because every module has direct access through MySQL queries to the database and can take all the necessary data.

Complete operation and manipulation of multi-language data inside forms and all other parts of the application are possible. Current solution implemented in this way use jQuery to validate and send the data to the information system.

69

Page 70: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

9.2. Strategy for the next prototypeDatabase model of application contains all the necessary data columns but if it there would be a need for new columns in the future, it is always possible to add new columns in the tables.

This prototype doesn’t implement full functionalities specified in the Requirement specification in the chapter 3, but with experience gained on working with these technologies we can say that it is possible to implement all that requirements.

In the future work it is good suggestion to use established practice with modules built on the same pattern.

70

Page 71: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

10. USED TECHNOLOGIES

10.1. PHP / MySQLSo, what's the common web development practice followed today? PHP and MySQL Development is the best practice without engaging in huge expenditure. As Linux built global trust in open source systems, PHP and MySQL web development took over the open source market. In this chapter, we will begin with the basic explanation of PHP and MySQL, why they are together, and many advantages that this technology brings forward.

10.1.1. PHP PHP stands for PHP: Hypertext Preprocessor PHP is a server-side scripting language, like ASP PHP scripts are executed on the server PHP supports many databases (MySQL, Informix, Oracle, Sybase, Solid, PostgreSQL,

Generic ODBC, etc.) PHP is an open source software PHP is free to download and use PHP files can contain text, HTML tags and scripts PHP files are returned to the browser as plain HTML PHP files have a file extension of ".php", ".php3", or ".phtml"

PHP is a general-purpose server-side scripting language originally designed for Web development to produce dynamic Web pages. It is one of the first developed server-side scripting languages to be embedded into an HTML source document, rather than calling an external file to process data. Ultimately, the code is interpreted by a Web server with a PHP processor module which generates the resulting Web page. It also has evolved to include a command-line interface capability and can be used in standalone graphical applications. PHP can be deployed on most Web servers and also as a standalone shell on almost every operating system and platform free of charge. PHP can be deployed on most Web servers, many operating systems and platforms, and can be used with many relational database management systems (RDBMS). It is available free of charge, and the PHP Group provides the complete source code for users to build, customize and extend for their own use.

PHP acts primarily as a filter, taking input from a file or stream containing text and/or PHP instructions and outputting another stream of data; most commonly the output will be HTML. Since PHP 4, the PHP parser compiles input to

71

Page 72: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

produce byte code for processing by the Zend Engine, giving improved performance over its interpreter predecessor.

Originally designed to create dynamic Web pages, PHP now focuses mainly on server-side scripting, and it is similar to other server-side scripting languages that provide dynamic content from a Web server to a client, such as Microsoft's ASP.NET, Sun Microsystems' JavaServer Pages, and mod_perl.

PHP has also attracted the development of many frameworks that provide building blocks and a design structure to promote rapid application development (RAD). Some of these include CakePHP, Symfony, CodeIgniter, Yii Framework, and Zend Framework, offering features similar to other web application frameworks.

The LAMP architecture has become popular in the Web industry as a way of deploying Web applications. PHP is commonly used as the P in this bundle alongside Linux, Apache and MySQL, although the P may also refer to Python or Perl or some mix of the three. Similar packages are also available for Windows and OS X, then called WAMP and MAMP, with the first letter standing for the respective operating system.

Web content management systems written in PHP include MediaWiki, Joomla, eZ Publish, SilverStripe, WordPress, Drupal and Moodle. All Web sites created using these tools are written in PHP, including the user-facing portion of Wikipedia, Facebook and Digg.

PHP is free software released under the PHP License, which insists that:

“Products derived from this software may not be called "PHP", nor may "PHP" appear in their name, without prior written permission from [email protected]. You may indicate that your software works in conjunction with PHP by saying "Foo for PHP" instead of calling it "PHP Foo" or "phpfoo".”

This restriction on use of the name PHP makes it incompatible with the GNU General Public License (GPL)

10.1.2. MySQL MySQL is a database server MySQL is ideal for both small and large applications MySQL supports standard SQL MySQL compiles on a number of platforms MySQL is free to download and use

MySQL is the world's most used relational database management system (RDBMS) that runs as a server providing multi-user access to a number of databases. It is named after co-founder Michael Widenius' daughter, My. The SQL phrase stands for Structured Query Language.

72

Page 73: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

The MySQL development project has made its source code available under the terms of the GNU General Public License, as well as under a variety of proprietary agreements. MySQL was owned and sponsored by a single for-profit firm, the Swedish company MySQL AB, now owned by Oracle Corporation.

Free-software-open source projects that require a full-featured database management system often use MySQL. For commercial use, several paid editions are available, and offer additional functionality. Applications which use MySQL databases include: TYPO3, Joomla, WordPress, phpBB, Drupal and other software built on the LAMP software stack. MySQL is also used in many high-profile, large-scale World Wide Web products, including Wikipedia, Google (though not for searches), Facebook, and Twitter.

Both the MySQL server software itself and the client libraries use dual-licensing distribution. They are offered under GPL, beginning from 28 June 2000 (which Oracle has extended with a FLOSS License Exception) or to use a proprietary license.

First of all support can be obtained from the official manual, which is available at http://dev.mysql.com/doc/refman/5.5/en/index.html. Free support additionally is available in different IRC channels and forums.

Apart from that Oracle offers paid support via their MySQL Enterprise products. They differ in the scope of services and in price.

10.1.3. PHP and MySQL in combination PHP combined with MySQL are cross-platform (you can develop in Windows and serve on a

Unix platform)The simple reason would be to say that both of them are open source technologies. They both are available under GPL (General Public License). Therefore, they tremendously reduce the cost of web application development. However, when building web solutions, they are many products we see such as hardware for the web server, an operating system, web server software, a database management system and the programming language. Some of these choices are dependent on one another; which means, not all operating systems will run on all hardware, not all scripting languages can connect to all databases, and so on. PHP is a powerful language with versatile features, and MySQL development accepts PHP connection easily, making the PHP and MySQL web development combination unique and capable of creating versatile MySQL web development.

There are strengths to MySQL development. While it is freely available under the GPL, MySQL is a high performing database that incurs lower cost under a commercial license. It is a modern database that frees us from the trouble to adapt. It is easy to use under Unix and Windows systems. We can obtain and modify the source code used for the MySQL development giving user full

73

Page 74: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

authority to the code. PHP and MySQL development is a proficient way of web application development.

10.2. WordPressWordPress started in 2003 with a single bit of code to enhance the typography of everyday writing and with fewer users than you can count on your fingers and toes. Since then it has grown to be the largest self-hosted blogging tool in the world, used on millions of sites and seen by tens of millions of people every day.

WordPress is an Open Source project with community of people hundreds all over the world working on it. It also means that it is free to use for any web site without paying anyone a license fee and a number of other important freedoms.

WordPress.org is site you can download and install a software script called WordPress. To do this you need a web host who meets the minimum requirements and a little time. WordPress is completely customizable and can be used for almost anything. There is also a service called WordPress.com which lets you get started with a new and free WordPress-based blog in seconds, but varies in several ways and is less flexible than the WordPress you download and install yourself.

WordPress started as just a blogging system, but has evolved to be used as full content management system (CMS) and so much more through the thousands of plug-ins, widgets, and themes.

It is possible to connect with the community on many ways. In addition to online resources like the forums and mailing lists is possible to attend or volunteer at a WordCamp, which are free or low-cost events that happen all around the world to gather and educate WordPress users, organized by WordPress users.

The license under which the WordPress software is released is the GPLv2 (or later) from the Free Software Foundation. A copy of the license is included with every copy of WordPress.

Part of this license outlines requirements for derivative works, such as plug-ins or themes. Derivatives of WordPress code inherit the GPL license.

10.2.1. The History of WordPressWordPress is a blog template system that was launched in 2001. Since then it has become the largest self-hosted blogging tool in the world. Millions of people on a vast number of websites use it every day. WordPress was designed due to the desire and need for a well-designed and structured publishing system using PHP and MySQL. It was created out of necessity as users demanded a high performance system. With thorough research on the aspects needed and

74

Page 75: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

demanded by writers, WordPress evolved into a project, which has a large following and user satisfaction. The creation of WordPress has taken the world by storm.

The creators of WordPress are Matt Mullenweg and Mike Little. They determined the name of their software from a suggestion by Christine Selleck who was a friend of Matt. Realizing the name fit the application, the decision was made to use it. In 2004, the licensing terms moved WordPress into a new market, maximizing the growth of usage. Using different techniques, it includes codes (PHP and HTML) and themes that allow the users to switch between needed applications.

Included in the application are integrated link management features, search engine friendly options, multiple author capabilities, and support for posts and articles. Automatic features provide formatting and personalized styles of text within articles. This option allows users to convert regular quotes into smart quotes, while also supporting techniques that allow the users to link information to websites. All of these functions have been updated through time. In 2005, a release of version 1.5 introduced themes, which were downloaded over 900,000 times. This added to already current user base. With the demands for further implementations of techniques, hosted services produced a release of version 2.0.

With each new version, downloads for the application grew. In 2006 there were 1,545,703 downloads followed by 3,816,965 downloads in 2007. Downloads for the unique plug-in in 2006 were 191,567. In 2007, the 1,384 plug-in had downloads of 2,845,884. With every new feature, WordPress continued to meet the needs of users and created a better environment for users. Starting after Version 1.0, most of the releases have been coded after well-known jazz musicians. Listed are the different versions along with the brief descriptions of each version.

WordPress 1.2, code-named Mingus, had support for Plugins. This version was released on May 22, 2004. WordPress 1.5, code-named Strayhorn, included management of static pages. This version was released on February 17, 2005. WordPress 2.0, code-named Duke, included better administrative tools. This version was released on December 31, 2005.

WordPress 2.1, code-named Ella, corrected security issues, redesigned the interface, and enhanced editing tools. This version was released on January 22, 2007. WordPress 2.2, code- named Getz, featured widget support for templates. This version was released on May 16, 2007.

WordPress 2.3, code named Dexter featured native tagging support for new taxonomy system categories. This version was released on September 24, 2007. WordPress 2.5, code-named Brecker featured major changes to the application of the administrative interface and redesigned to match the new styles. This version was released on March 29, 2008. WordPress 2.6, code- named Tyner, added features for better tracking of changes of posts and pages designed. This

75

Page 76: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

version was released on July 15, 2008. WordPress 2.7, code-named Coltrane, featured another administrative interface change, which was completely redesigned and upgraded to include automatic installation of plugins within the administrative interface. This version was released on December 11, 2008.

10.2.2. RequirementsTo run WordPress your host just needs a couple of things:

PHP version 5.2.4 or greater MySQL version 5.0 or greater

The requirements have changed as of WordPress 3.2.

They recommend Apache or Nginx as the most robust and feature full server for running WordPress, but any server that supports PHP and MySQL will do.

10.2.3. Features

Full standards complianceWe have gone to great lengths to make sure every bit of WordPress generated code is in full compliance with the standards of the W3C. This is important not only for interoperability with today’s browser but also for forward compatibility with the tools of the next generation. Your web site is a beautiful thing, and you should demand nothing less.

No rebuildingChanges you make to your templates or entries are reflected immediately on your site, with no need for regenerating static pages.

WordPress PagesPages allow you to manage non-blog content easily, so for example you could have a static "About" page that you manage through WordPress. For an idea of how powerful this is, the entire WordPress.org site could be run off WordPress alone.

WordPress LinksLinks allow you to create, maintain, and update any number of blog rolls through your administration interface. This is much faster than calling an external blog roll manager.

WordPress ThemesWordPress comes with a full theme system which makes designing everything from the simplest blog to the most complicated webzine a piece of cake, and you can even have multiple themes with totally different looks that you switch with a single click. Have a new design every day.

Cross-blog communication tools

76

Page 77: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

WordPress fully supports both the Trackback and Pingback standards, and we are committed to supporting future standards as they develop.

CommentsVisitors to your site can leave comments on individual entries and through Trackback or Pingback can comment on their own site. You can enable or disable comments on a per-post basis.

Spam protection Out of the box WordPress comes with very robust tools such as an integrated blacklist and open proxy checker to manage and eliminate comment spam on your blog, and there is also a rich array of plug-ins that can take this functionality a step further.

Full user registrationWordPress has a built-in user registration system that (if you choose) can allow people to register and maintain profiles and leave authenticated comments on your blog. You can optionally close comments for non-registered users. There are also plug-in that hide posts from lower level users.

Password Protected Posts You can give passwords to individual posts to hide them from the public. You can also have private posts which are viewable only by their author.

Easy installation and upgrades Installing WordPress and upgrading from previous versions and other software is a piece of cake. Try it and you'll wonder why all web software isn't this easy.

Easy Importing We currently have importers for Movable Type, Textpattern, Greymatter, Blogger, and b2. Work on importers for Nucleus and pMachine are under way.

XML-RPC interface WordPress currently supports an extended version of the Blogger API, MetaWeblog API, and finally the MovableType API. You can even use clients designed for other platforms like Zempt.

Workflow You can have types of users that can only post drafts not publish to the front page.

Typographical niceties WordPress uses the engine to intelligently convert plain ASCII into typographically correct XHTML entities. This includes quotes, apostrophes, ellipses, em and en dashes, multiplication symbols, and ampersands.

Intelligent text formatting If you've dealt with systems that convert new lines to line breaks before you know why they have a bad name: if you have any sort of HTML they butcher it

77

Page 78: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

by putting tags after every new line indiscriminately, breaking your formatting and validation. Our function for this intelligently avoids places where you already have breaks and block-level HTML tags, so you can leave it on without worrying about it breaking your code.

Multiple authors WordPress’ highly advanced user system allows up to 10 levels of users, with different levels having different (and configurable) privileges with regard to publishing, editing, options, and other users.

Bookmarklets Cross-browser bookmark let’s make it easy to publish to your blog or add links to your blog roll with a minimum of effort.

Ping away WordPress supports pinging Ping-O-Matic, which means maximum exposure for your blog to search engines.

78

Page 79: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

10.3. WordPress plug-insPlug-in can extend WordPress to do almost anything you can imagine. Combination of plug-ins shortly descript in this chapter make it powerful tool to build backend of information system, with support to all necessary requirements of all parts of system.

10.3.1. PHP ExecThis plug-in lets you execute dynamic PHP code written inside post’s or page content inside html editor on WordPress pages. It masks PHP code before balance Tags, and unmask them afterwards, so it should be safe to use PHP code that has literal HTML tags in it, for example code which prints out HTML.

Example:

<phpcode><?phpecho "Current date and time: ";echo date("l dS of F Y h:i:s A");?></phpcode>

10.3.2. Private onlyThis plug-in will redirect all users who aren't logged in to the login form where they must take theirs username and password to access to site. Depends on which group of users they belongs they will have access on that parts and functionality of site. It is regulated by another plug-in and COSY functionality.

Features of this plug-in are:

Redirect all non-logged in users to login form Custom Logo on Login Page Sub plug-in name “Disable Feed” that allows you to choose disable or enable feed. Single public page Localization of login page

10.3.3. Role ScooperRole Scooper is a comprehensive access control solution, giving you CMS-like control of reading and editing permissions. Assign restrictions and roles to specific pages, posts or categories.

WordPress core role definitions remain unchanged, and continue to function as default permissions. User access is altered only as administrators expand it by

79

Page 80: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

assigning content-specific roles, or reduce it by setting content-specific restrictions.

Users of any level can be elevated to read or edit content of your choice. Restricted content can be withheld from users lacking a content-specific role, regardless of their WP role. Deactivation or removal of Role Scooper will return each user to their standard WordPress access (but all RS settings remain harmlessly in the database in case you change your mind).

Scoped role restrictions and assignments are reflected in every aspect of the WordPress interface, from front end content and navigation to administrative post and comment totals. Although Role Scooper provides extreme flexibility and powerful bulk administration forms, basic usage is just a set of user checkboxes in the Post/Page Edit Form.

Feature list:

WP roles work as is or can be limited by content-specific Restrictions RS roles grant additional Read or Edit access for specific Pages, Posts or

Categories Define User Groups and give them one or more RS roles Can elevate Subscribers to edit desired content (ensures safe failure

mode) Control which categories users can post to Control which pages users can associate sub-pages to Specify element(s) in Edit Form to withhold from non-Editors Grant Read or Edit access for a limited time duration Limit the post/page publish dates which a role assignment applies to Customizable Hidden Content Teaser (or hide posts/pages completely) RSS Feed Filter with HTTP authentication option File Attachment filter blocks direct URL requests if user can't read

corresponding post/page Inheritance of Restrictions and Roles to sub-categories / sub-pages Default Restrictions and Roles for new content Un-editable posts are excluded from the Edit Posts/Pages list Optimized to limit additional database queries XML-RPC support

10.3.4. Xili-languageThis plug-in provides support to WordPress to make a bilingual (or multilingual) websites in theme according to the language of current posts or page theme's behavior can be fully personalized through settings, hooks and API

Xili-language plug-in provides an automatic selection of language in theme according to the language of displayed post, series of posts, page or articles.

80

Page 81: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

A new interface with a list of titles (and links) to help you write articles and their translations.

Xili-language select on the fly the multilingual .mo files present in the theme's folder.

Xili-language uses custom taxonomy to specify language of post, page and custom post.

Xili-language plug-in works on WordPress installation in mono (standalone) or multisite (network) mode.

Xili-language plug-in does not create additional tables in the database. Xili-language simply makes proper use of the taxonomy tables and post-meta table offered by WordPress to define language and link items between them. Because xili-language plug-in does not modify deeply the post edit UI, it is possible to use iPhone / iPod Touch WordPress app to prepare and draft the post.

Xili-language plug-in does not replace the author or the editor. No automatic translation. Content strategist is the master of the languages, the contents and the navigation inside the website. With xili-dictionary, webmaster can translate the themes items. For design, the creator is free to choose text or graphic. Xili-language does not provide flags!

This plug-in is originally built for webmaster and developer, the plug-in trilogy progress since 4 years to be more and more plug and play for everyone.

Xili-language is also dedicated for themes creator or webmaster with knowledge in CMS and WP and having (or not) tools to create .mo language files. Through API (hook), the plug-in add automatic tools (or links or filters) for sidebar or top menus. Categories or Archives lists are translated also.

Prerequisite

A project of a website with articles in different languages.

A localizable theme: Every theme with localization (or translation-ready like twentyten) can be easily used (and improved) for real time multilingual sites.

A tool to translate .po files of the theme and built .mo files (poEdit or better xili-dictionary).

twentyten and twentyeleven themes, since WordPress 3.0, the default themes are optimized for multilingual site.

License

This plug-in is under GPL license which doesn't say that everything must be zero-cost, just that when you receive the software (plug-in or theme) that it not restrict your freedoms in how you use it. Free open source plug-in doesn’t mean free services and support.

81

Page 82: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

10.4. HTML/CSS

10.4.1. Hypertext Markup Language (HTML) HTML is the main markup language for web pages. HTML elements are the basic building-blocks of web pages.

HTML is written in the form of HTML elements consisting of tags enclosed in angle brackets (like <html>), within the web page content. HTML tags most commonly come in pairs like <h1> and </h1>, although some tags, known as empty elements, are unpaired, for example <img>. The first tag in a pair is the start tag, the second tag is the end tag (they are also called opening tags and closing tags). In between these tags web designers can add text, tags, comments and other types of text-based content.

The purpose of a web browser is to read HTML documents and compose them into visible or audible web pages. The browser does not display the HTML tags, but uses the tags to interpret the content of the page.

HTML elements form the building blocks of all websites. HTML allows images and objects to be embedded and can be used to create interactive forms. It provides a means to create structured documents by denoting structural semantics for text such as headings, paragraphs, lists, links, quotes and other items. It can embed scripts in languages such as JavaScript which affect the behavior of HTML webpage.

Web browsers can also refer to Cascading Style Sheets (CSS) to define the appearance and layout of text and other material. The W3C, maintainer of both the HTML and the CSS standards, encourages the use of CSS over explicitly presentational HTML markup.

10.4.2. Cascading Style Sheets (CSS)CSS is a style sheet language used for describing the presentation semantics (the look and formatting) of a document written in a markup language. It’s most common application is to style web pages written in HTML and XHTML, but the language can also be applied to any kind of XML document, including plain XML, SVG and XUL.

CSS is designed primarily to enable the separation of document content (written in HTML or a similar markup language) from document presentation, including elements such as the layout, colors, and fonts. This separation can improve content accessibility, provide more flexibility and control in the specification of presentation characteristics, enable multiple pages to share formatting, and reduce complexity and repetition in the structural content (such

82

Page 83: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

as by allowing for table less web design). CSS can also allow the same markup page to be presented in different styles for different rendering methods, such as on-screen, in print, by voice (when read out by a speech-based browser or screen reader) and on Braille-based, tactile devices. It can also be used to allow the web page to display differently depending on the screen size or device on which it is being viewed. While the author of a document typically links that document to a CSS style sheet, readers can use a different style sheet, perhaps one on their own computer, to override the one the author has specified.

CSS specifies a priority scheme to determine which style rules apply if more than one rule matches against a particular element. In this so-called cascade, priorities or weights are calculated and assigned to rules, so that the results are predictable.

The CSS specifications are maintained by the World Wide Web Consortium (W3C). Internet media type (MIME type) text/css is registered for use with CSS by RFC 2318 (March 1998).

10.4.3. HTML and CSS in combinationUsing HTML and CSS in combination take to as next advantages:

Separation of content from presentationCSS facilitates publication of content in multiple presentation formats based on nominal parameters. Nominal parameters include explicit user preferences, different web browsers, the type of device being used to view the content (a desktop computer or mobile Internet device), the geographic location of the user and many other variables.

Site-wide consistencyWith CSS inheritance and "cascading" a global style sheet can be used to affect and style elements site-wide. If the situation arises that the styling of the elements should need to be changed or adjusted, these changes can be made by editing rules in the global style sheet. Before CSS, this sort of maintenance was more difficult, expensive and time-consuming.

BandwidthA style sheet, internal or external, will specify the style once for a range of HTML elements selected by class, type or relationship to others. This is much more efficient than repeating style information in line for each occurrence of the element. An external style sheet is usually stored in the browser cache, and can therefore be used on multiple pages without being reloaded, further reducing data transfer over a network.

Page reformattingWith a simple change of one line, a different style sheet can be used for the same page. This has advantages for accessibility, as well as providing the ability

83

Page 84: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

to tailor a page or site to different target devices. Furthermore, devices not able to understand the styling still display the content.

AccessibilityWithout CSS, web designers must typically lay out their pages with techniques that hinder accessibility for vision-impaired users, like HTML tables.

84

Page 85: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

10.5. JQueryJQuery is free, open source software, dual-licensed under the MIT License or the GNU General Public License, Version 2. JQuery's syntax is designed to make it easier to navigate a document, select DOM elements, create animations, handle events, and develop Ajax applications. JQuery also provides capabilities for developers to create plug-ins on top of the JavaScript library. This enables developers to create abstractions for low-level interaction and animation, advanced effects and high-level, theme-able widgets. The modular approach to the jQuery library allows the creation of powerful dynamic web pages and web applications. The jQuery Project manages all of the jQuery projects, including jQuery Core, jQuery UI, jQuery Mobile, Sizzle and QUnit but in this project are used only jQuery Core and jQuery UI.

10.5.1. JQuery CoreJQuery is a fast and concise JavaScript Library that simplifies HTML document traversing, event handling, animating, and Ajax interactions for rapid web development. JQuery is designed to change the way that you write JavaScript.

Ajax is a group of interrelated web development techniques used on the client-side to create asynchronous web applications. With Ajax, web applications can send data to, and retrieve data from, a server asynchronously (in the background) without interfering with the display and behavior of the existing page.

Ajax is not a single technology, but a group of technologies. HTML and CSS can be used in combination to mark up and style information. The DOM is accessed with JavaScript to dynamically display, and to allow the user to interact with the information presented. JavaScript provide a method for exchanging data asynchronously between browser and server to avoid full page reloads.

JQuery support AJAX trough few methods .post(), .get() and .ajax() mostly used method is post().

10.5.2. JQuery UIjQuery UI provides abstractions for low-level interaction and animation, advanced effects and high-level, theme able widgets, built on top of the jQuery JavaScript Library, that you can use to build highly interactive web applications. It support next features used on site:

InteractionsDrag gable - Make elements drag gable

85

Page 86: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

Droppable - Control where dragged elements may be dropped

Resizable - Make elements resizable

Selectable - Advanced selection features for lists of elements

Sort able - Make a list of elements easily sort able

WidgetsAll of jQuery UI's widgets are fully theme able using a consolidated, coordinated theme mechanism demonstrated by their Theme Roller.

Accordion - Accordion containers

Auto complete - Auto-complete boxes based on what the user types

Button - Enhanced button appearance, turn radio buttons and checkboxes into pushbuttons

Date picker - Advanced date-picker

Dialog - Show dialog boxes on top of other content, easily and robustly

Progress bar - Progress bars, both animated and not

Slider - Fully customizable sliders with various features [6]:

Tabs - Tabbed user interface handling, with both inline and demand-loaded content

EffectsColor Animation - Animate the transition from one color to another

Toggle Class, Add Class, Remove Class, Switch Class - Animate the transition from one set of styles to another

Effect - A variety of effects (appear, slide-down, explode, fade-in, etc.)

Toggle - Toggle an effect on and off

Hide, Show - Using the effects above

UtilitiesPosition - Set an element's position relative to another element's position (alignment)

86

Page 87: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

11. GOING FORWARD

The project presented in this thesis can be extended in several ways. Export of data in “doc”, “xls” and “pdf” format still isn’t possible. It is possible to make module for scheduler courses or course instances which can have advanced options in example course instances in one program instance can’t be in same time.

Kao sto je to opisano u poglavlju u analiza trenutnog prototipa svi daljnji moduli bi trebali biti po do sada koristenom pattern.

87

Page 88: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

12. CONCLUSIONSDespite the existence of various technologies, many real systems use just one small part of the available opportunities. As a reason for that we can indicate the sluggishness of the system which means that the system does not utilize all its possibilities or full capabilities. The Academic institutions should be the leaders in innovation as well as in practical application of the innovations. They should encourage more projects such as this, where students can learn more about technologies and their application in solving practical problems. As one of those projects, this thesis explains the problems of the current curriculum courses and programs planning at MDH. According to requirements specifications and based on diagnosed problems of the system, we have created the COSY management system which resolves those problems.

During work on this project, a software prototype model was used because it was not possible to define all the targets and development directions. Additionally, some other models would be inoperable in this specific case.

The work results are observed in two checkpoints which we usually call the milestone prototypes. First prototype did not prove to be satisfying as far as performance is concerned in various ways. The second prototype implemented the functions to enter, view, edit and delete data on English language. It also included the structure for translation to the Swedish language for future prototypes. The second prototype was made using the open source technologies, which was described in the previous chapters.

When comparing the first and the second prototype, I have reached the conclusion that a positive shift in improvement of the user interface and dynamics of the data entries exists with the second prototype. Further modules would not require any changes with the currently implemented modules. The technologies used in the second prototype have a wider use and it should not be a problem to find tutorials or examples to implement something new or to understand the current modules.

I hope someone will continue to work on this project in the future. Besides the benefit of improving the MDH's information system, it would also be a great way for students to gain relevant experience in solving practical problems.

88

Page 89: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

REFERENCES

[1] http://www.w3.org [2] http://www.w3.org/Protocols/ [3] http://en.wikipedia.org/wiki/PHP [4] http://www.mysql.com [5] http://en.wikipedia.org/wiki/MySQL [6] http://wordpress.org/ [7] WordPress roles and Capabilities, http://codex.wordpress.org/Roles_and_Capabilities,

29.05.2012[8] WordPress database description, http://codex.wordpress.org/Database_Description,

29.05.2012[9] How Simulation Software Can Streamline Application Development,

http://www.cio.com/article/print/28501, 29.05.2012[10] WordPress Lessons, http://codex.wordpress.org/WordPress_Lessons, 29.05.2012[11] WordPress plug-in Xili-language official site,

http://wordpress.org/extend/plugins/xili-language/, 29.5.2012[12] http://en.wikipedia.org/wiki/Cascading_Style_Sheets [13] http://en.wikipedia.org/wiki/HTML [14] http://en.wikipedia.org/wiki/Ajax [15] http://jquery.org/ [16] http://www.w3.org/Protocols/ [17] Symphony Tutorial, http :// www . symfony - project . org / jobeet /1_4/ Doctrine / en /01 ,

29.05.2012[18] WordPress and Ajax, R. Huereca, http://wpajax.com/

13.

14. SUPPLEMENTS

14.1.1.

89

Page 90: Introduction - MDH  · Web viewCurriculum planning is a complex process with many stakeholders, many parallel activities and many constraints. Due to the complexity of the process

90