User:Pravinpatil/GSOC

Personal Info

Name:Pravin Patil
Project:Theming
Academic Background: I am a fourth year student studying at International Institute of Information and Technology, Hyderabad, India pursuing BTech in Computer Science and Engineering.
Location:My hometown is in Maharashtra and I study in Hyderabad,India.
Timezone: IST (UTC +5:30)
Working Hours: My working hours are very flexible. If situation asks for I will even work on weekends.
Github Account
CV: ResumeLink

Contact Info

Email: pravinpatil3009@gmail.com
IRC nick: pravinpatil (freenode)
WikiEducator username: Pravinpatil

Goals/Output

Goal

• Wikieducator has various courses offered by multiple organizations.
• Currently all courses have same stylesheet and javascript used. (i.e default set by mediawiki instance)
• Aim is to have flexibility to provide personalize style for each course.
• This way every individual course can have its own custom theme and javascript functionality.
• Creation of Iframe friendly skin for wikieducator site for use of embedding on various educational sites.

Output

The following would be the set of deliverable available after the project completion :

• Modification/creation of 2 or more extensions that shall provide above functionality.
• Course instructor/faculty will need to include an extension tag (only once) for eg : <course-css: stylesheet_url>
• The change of theme will be reflected across all course pages belonging to that particular course.
• Iframe friendly skin that can be used by courses which can be easily embedded into other websites.

Implementation Details

Basic WorkFlow/Steps

Currently available extensions for modifying page css and javascript insertion

1. PageCss
   • Problems : This extension does not work correctly with more recent versions of MediaWiki
2. AddScriptCss
   • Parser hook to add per-page CSS using the <css> tag
   • This extension has dependency on Stubmanager.Need to install channel PEAR,otherwise the extension won't work.
3. CSS
   • This extension provides functionality to add css via file upload. Also the css can be included within the tag itself.
   • A parser-function for adding CSS files, article or inline rules to articles.
   • This is compatible with latest versions of mediawiki. (As wikieducator will be updating to v1.23, this extension is better option)
   • We will reuse the code of this extension to style individual pages. We are using this because this extension already takes care of data URI even in IE6/7 browsers (verifyCSSLoad.js file)
   • One problem may arise while updating the extension,as some functions might be deprecated in future version of CSS extension.This has to taken into consideration. All necessary changes will be incorporated if such problem arises in future.
4. AddScript
   • This extension will be used to upload javascript files to wikipages.
   • There are some issues (solution given) Link : Issues
   • Need to take care of malicious scripts that users may try to upload. This might compromise user credentials.
   • Only specific set of user roles will be given permission to upload js files to the filesystem.
   • XSS attacks is handled by this extension.
   • Modern browsers will intelligently strip '/../' along with the parent dir when found in fetched URLs.

Wikieducator extension that aggregate course pages:

1. Collections
2. This will help us to get all pages within a course.
3. Every article is included within a book namespace for that course. All the course books in turn are present in books category on wikieducator.

Step for implementing theming across all course pages of a particular course

1. We need the instructor to add a tag. How will this be achieved ?
   • Tag syntax will be of type <course-css css:stylesheet_url js:javascript_url collection:collection_name>. This way we need stylesheet to be loaded for all pages in collection "collection_name". Problems may arise as to which path to provide in filename, either the ones that are uploaded on the wikieducator (relative path) or files from external links. There are problems of XSS attacks which might expose user credentials. These issues are addressed in mediawiki forums and can be appropriately handled.
   • Collection page has one section which can be manually edited and other section where all pages within that book are displayed. We need the user to add the tag to the manually editable space , which will be passed to the parser. All pages within that book will be retrieved and according header scripts will be added.
2. We need to implement hooks (this is if we use CSS extension)
   • ParserFirstCallInit -> This shall initiate which hook to use for rendering.Lets name it wgGetCollectionPages
     • wgGetCollectionPages -> This hook shall get all pages within the given category/collection.
     • We will first check for file extensions for .css and .js files,get file locations. These files must be in protected namespace.
   • ParserAfterTidy -> For all the pages we collected above we will add scripts (.css and .js) to their headers.
     • This hook is commonly used to re-introduce content that was earlier embedded by an extension during page rendering, either encoded or represented by a marker, by searching for it and replacing it with HTML content. Such a techniques allows MediaWiki extensions to output HTML that isn't mangled by the parse
     • $text variable for this hook contain all the html output for the page. We will be adding scripts to the head tag.
     • Things that need to be handled are path of files, whether it is present in db, or its an external link. Prevention of data injection by using data URI. (This is already handled by CSS extension)
3. If we use AddScript extension, then both css and javascript can be handled by this extension itself.
   • But this extension does not allow for css provided on the page itself(no file upload).
   • This extension can be merged with CSS extension. This way both functionality can be achieved,but this requires lot of looking into documentation and talk with creators of these extensions.
4. Last but not the least there might be some existing bugs present within these specified extensions which I will need to address so that extension does not break the site in specific cases.

Iframe friendly skin for wikieducator site

Tutorials for creation of skins for mediawiki are readily available.

1. Creation of skin.php : Define layout of pages
2. main.css : stlyesheet for Iframe friendly skin
3. browser fixes file if required
4. defining Commonly added terms
   • The XHTML code which opens (and eventually closes) the HTML output that will be sent to the client's browser.
   • The head element, which imports style-sheets, scripts, defines the page's meta data, and specifies the title to be displayed in the browser's title bar for the specific page being viewed.
   • The body opening tag. This tag opens the body element of the page and specifies what happens when the page loads or is double clicked if such handlers exist.
   • The site's name block.
   • The site's logo image.
   • The site's tag-line
   • Site Notice block.
   • User message notification block (if there is a need for it)
   • The user's toolbar.
   • Intrapage navigation block.
   • Search.
   • Toolbox.
   • Language links.
   • Page name.
   • Page subtitle.
   • Undelete notice.
   • Page contents.
   • Category links.
   • Page toolbar.
   • Footer.
   • Closing trail.

Changes in the system javascript so as to retain some features for embedding purposes. This needs to be discussed more.

Benefits to WikiEducator

Currently all courses have same theme which is default set by wikieducator mediawiki instance. My project will provide enhanced user experience.
For example this site shows a wiki page of a game.

• Only trusted users will be able to change the theme of the course.
• Rather than adding extension tag on every page, instructor only has to add tag once.
• Theming will provide more functionality like jquery experience.
• Users will be able to upload their stylesheet and javascript depending upon their requirements.
• jQuery UI is a curated set of user interface interactions, effects, widgets, and themes built on top of the jQuery JavaScript Library
• Iframe friendly bare skin will provide for embedding wikieducator content on other education sites.

Long Term Goals and Personal Development

A successful GSOC project not only serves the student but also the community. Next year more students join in based upon the organizations performance which depends upon the student they select for their projects.My long term goal is to become an active member of the wikieducator community. I am currently a student and still in my learning phase and its important for me to get familiar with team work and ethics.Open source gives contributors great powers with which comes great responsibilities. I am a hardworking guy and very professional indeed. I believe that working hard always pays off, and I always strive for it. Other than this, I am a very cool guy who wants to be a good programmer, and someday be a part of open source community started by me and of course be the CEO. But to achieve great things one needs to do great things, and that's what I am hoping to do.

Why I'm the best person for this project?

I have worked with open source community last year with Sigmah organization and know about the work ethics and responsibilities. Its very important to keep up the enthusiasm and hard work till the very end. Communication with mentors is very important so that they know about the status of our projects. I have been working for a college project which involved working with php and mysql for more than 2 years Site and its important to maintain documentation and status tracker for the work been done. I will be maintaining blogs for work done for every week so that its easy for mentors to keep track.

I am a fast learner and quickly get familiarized with documentation. Also I ask many questions which sometimes might be annoying but its a good way to do productive work.

.

Tentative TimeLine

Week	Work
Week 1	Decide on final design of the extension that needs to be created.
Week 2	Start of coding for the hook related with collection of wiki pages under a particular collection.
Week 3,4	Start combining the functionality provided by CSS and AddScript extension.Detailed discussion on how file uploads must be handled.
Week 5	Testing of extension thus created. Getting feedback from mentors and other members of the community.
Week 6	Structuring of code. Documentation of extension created/modified so far and its README. Live demo of extension on Gtalk,Skype.Feedback of mentors for the extension.
Midterm Evaluation
Week 7	Designing of styles for iframe friendly skin for wikieducator. Detailed discussion on feature requests.
Week 8-9	Creation of appropriate php files (skin.php) for new skin
Week 10	Addition of css stylesheet to the skin.
Week 11	Addition of javascript file to the skin. Implementation of interactive design.
Week 12	Testing of the new skin thus created. Taking feedback from mentors on the same.
Days Left	Live Demo(Gtalk,Skype) of features created for wikieducator project. Creation of documentation of usage of skin and extension created so far.Further testing of extensions created so far and feedback from members of the community and bug tracking.If time permits I hope to start working on the Polling and Voting widget of wikieducator.
Final Evaluation

Experience of MediaWiki

I have been working with mediawiki for past 2 months for my college project.Unfortunately I cannot share the codebase due to some legal terms.I am familiar with its codebase and its documentation. So for you to judge my mediawiki skills I have created 3 extensions that can be readily used. Link to MyExtensions

Other Open Source projects I've worked on

I started working with Sigmah community last year when selected for GSOC'13. I created 3 modules for them which facilitated Sigmah Private Support feature on their Drupal website and successfully completed it within time frame. I have been working with Drupal CMS for past 3 years and very much familiar with its architecture. Drupal is built using php,mysql,css and javascript by which I can say that I am well versed with the above languages and their usage. Link to GSOC'13 Project
Link to Sigmah commits

Other works

1. Government of India Project : Socionity FormMaker (Code link Github )
2. Pugmarks : Built a geographical location based application which accumulates meta data about a place by means of crowd sourcing.
3. Teaching Assistant for System Structural Analysis and Design course Monsoon:2013

Post GSOC Plans

GSOC does not end in summer rather its a start of a new journey with the organization. With the 3 month period of communication, I will be acquainted with people of the wikieducator community, their issues,discussions.Any open source project needs to build up a large community of developers and users so as to establish itself in the market. This way the community grows. Once you become a member of open source community its my responsibility to keep working for them even without incentive.I hope to be an integral part of your community and keep working with members. I hope to become a mentor for your organization next year.

Other Commitments between 19th May - 18th August

I do not have any commitments for this summer neither I have undertaken any college project to work for this summer. I am willing to work on this project for the entire duration, giving 6-8 hours a week. I will be staying in college campus which shall facilitate my working for 40 hour a week. Moreover I have already started reading the documentation for implementing the theming project which will give me a considerable head start if I am selected.