===Profile Information
**Name:** Sayak Das
**IRC nickname: **Sayak17
**Github:** https://github.com/sayak2k1maruti
**Portfolio:** https://sayak01.epizy.com/resume/
**Website:** https://sayak01.epizy.com/
**Resume:** [[ https://drive.google.com/file/d/1SYxiy2AuXmxCb1xhqF48gA479H0ICog6/view?usp=sharing | resume.pdf ]]
**Location:** Kolkata, India (UTC +5:30)
**Typical working hours:** Between 12 pm to 12 am UTC +5:30
===Synopsis
- This project is about creating an interactive guided adventure tour on MediaWiki to give users brief insight on “How to create user script on Wikimedia projects”. **User scripts** are programs written in JavaScript for use on Wikimedia projects by users that enable the Wikimedia user account to do many things that they otherwise couldn't. Like changing DOM, appending HTML snippets in DOM, and changing Interface according to browser events, etc.
- This user-friendly adventure will be designed like [[ https://en.wikipedia.org/wiki/Wikipedia:The_Wikipedia_Adventure | "The Wikipedia Adventure" ]] which will have 3-4 missions for users.
- Mission 1: Basic Intro
- Mission 2: Using MediaWiki’s JS module
- Mission 3: Using MediaWiki API
- Mission 4: Using OOUI (Optional)
- The main goal of this project is to make an interactive user guide on user script primarily focuses on newbie developers and existing Wikimedia community members who have a little bit of knowledge about JavaScript.And it will be more helpful for newcomers over MediaWIki's documentation on a user script. Users can learn to use MediaWiki's JS module and MediaWiki's API in a very fun and interactive way.
{F34375209}
The above picture shows a simple example about user-Script
```
document.getElementById("content").style.backgroundColor = "#7E829E";
document.getElementById("content").style.color = "white";
document.getElementById("bodyContent").style.fontSize = "125%";
document.getElementById("bodyContent").style.fontFamily = "monospace";
```
This simple script can change the background color, font color, and font family of any content.
(NOTE)**Possible Mentors**
- [[ https://phabricator.wikimedia.org/p/Jayprakash12345/ | Jayprakash12345 ]]
- [[ https://phabricator.wikimedia.org/p/KCVelaga/ | KCVelaga ]]
- [[ https://phabricator.wikimedia.org/p/APerson/ | APerson ]]
===Idea Implementation
- The project will be an adventure tour containing 4 interdependent missions explaining the use and purpose of user scripts.
- Each mission's design and implementation will be similar to the missions of [[ https://en.wikipedia.org/wiki/Wikipedia:The_Wikipedia_Adventure | The_Wikipedia_Adventure ]] to maintain consistency across the media wiki ecosystem.
- The 4 missions all together will be sufficient and useful for users to deploy their own user scripts.
- Below contains some screenshots describing how it will look like:
{F34375299}
{F34375309}
{F34375314}
(NOTE)** The points listed under each mission correspond to the unique steps of the tour.**
- **Mission 1:**
# Introduction to User script in general.
# Navigate to the [[ https://www.mediawiki.org/wiki/Special:MyPage/common.js | Special:MyPage/common.js ]] file and describe its **use (JS Code written here is applied to all pages).**
# Instruct the user to edit the file by showing where to edit a file.
# Provide users with basic user script examples within the tour step, which users can copy & paste.
# A pop-up will instruct users on how to preview changes.
# Then another pop-up shows users the button to finally publish.
# A pop-up will Congratulate the user on successfully deploying the first user script.
# Describe the [[ https://www.mediawiki.org/wiki/Special:MyPage/vector.js | Special:MyPage/vector.js ]] file and its **use(JS Code written here is applied to a particular skin)**.
# Optional step to learn more about skins in MediaWiki or end tour.
# If the user chooses to learn more about skins, then navigate to the [[ https://www.mediawiki.org/wiki/Special:Preferences#mw-prefsection-rendering | Appearances page ]] to another tab where the user can preview different skins available.
- **Mission 2:**
# Navigate to [[ https://www.mediawiki.org/wiki/ResourceLoader/Core_modules | ResourceLoader/Core_modules ]] and give a brief description about JS modules and core modules supported by wikimedia.
# Navigate to [[ https://www.mediawiki.org/wiki/Manual:Interface/JavaScript#mw.config | Manual:Interface/JavaScript#mw.config ]] and brief users about the different configuration values can be accessed with mw.config.
Follow the steps similar to step2 - step7 of mission 1. The user script examples in step 4 should involve the use of **“mw” global object**.
- **Mission 3:**
# Brief user about what APIs are.
# Navigate to [[ https://www.mediawiki.org/wiki/API:Main_page | API: Main_page ]] and brief the user about the endpoint for Wikimedia API's and parameters. Provide link for [[ https://www.mediawiki.org/wiki/Special:ApiSandbox | ApiSandbox page ]].
# Once the user comes on [[ https://www.mediawiki.org/wiki/Special:ApiSandbox | ApiSandbox page ]], brief the user on how one can test Wikimedia's Api’’s through **ApiSandbox**.
Further, we will guide the user to create his/her first API request on Wikimedia.
We will give the user a set of options to choose from on which request he wants to make(Eg. 1: No. of page views; 2: Get edit history of a page; etc.)
Once the user has completed his first API request with **ApiSandbox**, we can follow the steps similar to step2 - step7 of mission 1. The user script examples in step 4 should involve the use of **Mediawiki API**.
- **Mission 4:**
#This is an optional mission. Users will only navigate to his mission if they select "Learn More" after 3rd mission.
# Brief user about OOUI in general and provide navigation link to [[ https://www.mediawiki.org/wiki/OOUI/Using_OOUI_in_MediaWiki#JavaScript | OOUI/Using_OOUI_in_MediaWiki#JavaScript ]].
# Explain user about the different dependencies that use OOUI and how to load these dependencies. Provide a [[ https://doc.wikimedia.org/oojs-ui/master/demos/?page=widgets&theme=wikimediaui&direction=ltr&platform=desktop | link to ooui demos ]].
# Brief users that this is the place where they can refer for different ooui features.
Further, follow the steps similar to step2 - step7 of mission 1. The user script examples in step 4 should involve the use of **widgets or other ooui features**.
===Deliverables
- Attractive theme for the adventure.
- Design the introductory template and elements(illustrations, buttons, etc) to be used within the missions according to the theme.
- Coding the user scripts examples and tours for each mission based on ideas discussed in implementation.
-- Mission 1: Basic Intro to deploying user scripts
-- Mission 2: Writing user scripts using MediaWiki's JS module
-- Mission 3: Writing user scripts using MediaWiki API
-- Mission 4: Writing user scripts using OOUI (Optional)
- Simultaneous bug fixing after completion of each mission.
- Regular unit testing of JavaScript code using QUnit.
- Connect all missions together and complete the flow of the adventure.
- Code cleaning.
- Documenting the story behind the adventure.
===Timeline
**Community bonding period :**
| Period | Task
| ----- | -----
| May 17, 2021 - May 24, 2021 | Study more about JS Modules, APIs, OOUI which would help me come up with better user script examples during the coding period.
| May 25, 2021 - June 2, 2021 | Come up with a theme for the adventure tour. Design basic elements to be used within the missions, and the introductory template from where all missions can be accessed.
| June 3, 2021 - June 7, 2021 | Environment setup for QUnit. Discuss milestones with mentors.
**Coding period:**
| Period | Task
| ----- | -----
| June 8, 2021 - June 13, 2021 | Coding the introductory template.
|June 14, 2021 - June 16, 2021 | Writing the user scripts for the first mission(3 basic js/jquery code examples with good documentation and comments to describe actions performed by script).
| June 17, 2021 - June 22, 2021 | Implementing the tour for the first mission with steps defined above. Resolving bugs of Mission 1 and perform unit tests.
| June 23, 2021 - June 25, 2021 | Writing the user scripts examples that involve the use of js modules and “mw” global object(2 or 3 examples).
| June 26, 2021 - July 1, 2021 | Implementing the tour for the second mission. Resolving bugs of Mission 2 and perform unit tests.
| July 2, 2021 - July 5, 2021 | Writing the user scripts examples that involve the use of Mediawiki’s API.
| July 6, 2021 - July 11, 2021 | Implementing the tour for the third mission. Resolving bugs of Mission 3 and perform unit tests.
| July 12, 2021 - July 15, 2021 | Phase Evaluation Submit a report of the tasks completed.
| July 16, 2021 - July 19, 2021 | Writing the user scripts examples that involve the use of OOUI library.
| July 20, 2021 - July 26, 2021 | Implementing the tour for the fourth mission. Resolving bugs of Mission 4 and perform unit tests.
| July 27 , 2021- July 31, 2021 | Complete the flow of the adventure by linking the missions and making them accessible from the template.
| August 1, 2021 - August 8, 2021 | Bug fixes, code cleanup for submission.
| August 9, 2021 - August 16, 2021 | Documenting the story behind the adventure. (Introduction to adventure, why do MediaWiki users need this adventure, goals of the adventure).
| August 17, 2021 - August 23, 2021 | Final week: Submit my work product and final mentor evaluation
===Participation
I will be available anytime through Email(sayakdas2k1@gmail.com), Zulip, or if required, a well-planned video session and will contribute via Github to this project and use Phabricator for managing the bugs and tasks.
===About Me
Tell us about a few:
- **Education:**
| **Degree/Examination** | **Board/University**| **Year of Passing **| **Status** |
|B.Tech|National Institute of Technology Durgapur| 2023(Expected)| Running|
|Class XII| WestBengal Council of Higher Secondary Education| 2019 | Completed |
|Class X | WestBengal Board of Secondary Education| 2017 | Completed |
- **How did you hear about this program?**
Our college has an active community of open-source developers. So, I heard about this program from a lot of seniors in my college.
- **Will you have any other time commitments, such as school work, another job, planned vacation, etc, during the duration of the program?**
Our college's end semester examination for the 4th sem will end on 2nd May 2021. So during my summer break, I can easily give 6+ hours per day to the project as I have no other commitments. I will be able to do about 3 hours per day when my college resumes (not able to say the date due to the current pandemic). I will try to complete a major part of the project before my classes begin and so I can easily able to finish the remaining work and deadlines.
- **We advise all candidates eligible for Google Summer of Code and Outreachy to apply for both programs. Are you planning to apply to both programs and, if so, with what organization(s)**?
I am only applying for Google Summer of Code with the Wikimedia organization
- **What does making this project happen to mean to you?**
- Everybody knows Wikipedia is the world's biggest digital encyclopedia, and when I came to know that the project is open source, I was highly motivated to contribute to it. As I have prior knowledge of javascript, JQuery and PHP I think I can do some great contributions to this project. I am grateful for this opportunity and assure you of my commitment and determination towards this project.
- In the past, I developed an interactive resume of mine which has a little avatar and users have to move that to see different stages of my resume. That self-project boost my JS skills and I used the JQuery library to build that project. So I think I can contribute to this project. Here is the link to that project : [[ https://sayak01.epizy.com/resume/ | https://sayak01.epizy.com/resume ]].
===Past Experience
- Contributed to OpenEvent frontEnd Repository of [[ https://fossasia.org/ | FOSSASIA ]] organisation : [[ https://github.com/fossasia/open-event-frontend/pull/5891 | https://github.com/fossasia/open-event-frontend/pull/5891 ]]
- My portfolio: https://sayak01.epizy.com
- Made a Real-time multi-user chat application using PHP and AJAX call JS.
{F34375556}
- Made a simple 2 player tic-tac-toe game using PHP and JS and AJAX API
{F34375571} {F34375578} {F34375585}
**You must have written a feature or bugfix for a Wikimedia project during the application phase (see the section about microtasks in the application process steps), please link to it here. We give strong preference to candidates who have done so.**
I have successfully completed the microtasks assigned in order to understand the project.
# **Microtask 1: **
- Basic tour on how to deploy user scripts on wikimedia.
- Link to code: [[ https://www.mediawiki.org/wiki/User:Sayak17/tour.js | Microtask 1 ]]
===Any Other Info
I had made an interactive resume of mine. It is a simple Mario-like game. Users have to move a little avatar on the screen to view different parts of a resume.Here is the link : [[ https://sayak01.epizy.com/resume/ | https://sayak01.epizy.com/resume/ ]]
{F34376035}
{F34376033}
{F34376040}
{F34376039}
{F34376037}
{F34376036}
== Resources ==
[0] https://en.wikipedia.org/wiki/Wikipedia:The_Wikipedia_Adventure
[1] https://www.mediawiki.org/wiki/User_script
[2] https://commons.wikimedia.org/wiki/File:Userscript_and_Gadgets_workshop_toolkit.pdf
[3]https://phabricator.wikimedia.org/T274635
[4]https://phabricator.wikimedia.org/T279883
[5]https://www.mediawiki.org/wiki/Extension:GuidedTour/Write_an_on-wiki_tour