User:Jeph paul/AddmeDoc

Addme is a gadget that is under development.

It lets the user:

Endorse, endorse a grant and add a comment.
Join, join a grant in a role specified by the grant creator.

Overview[edit]

Functionality[edit]

Endorse[edit]

A user can endorse a grant and add a comment. The "endorse" button is present in the infobox, on clicking it a popup opens and the comment can be entered. The comment is saved in a section defined in AddmeConfig on clicking the save/endorse button in the popup. The pages refreshes and the comment is scrolled into view. The strings in the gadget can be configured at AddmeInterfaceMessages.

Join[edit]

A grant creator can add open roles in the infobox. Others can then join the grant in one of those roles. On clicking the "join" button in the infobox a popup opens. The popup has a dropdown where a role can be selected. There is a also a textbox where a comment has to be entered. On clicking the join button in the popup the user is added to the selected role in the infobox & the comment shows up in the section defined in AddmeConfig. The roles need to be added in the roles section in AddmeConfig to appear in the dropdown. The strings in the gadget can be configured at AddmeInterfaceMessages

Configuration[edit]

There are two configuration files, AddmeInterfaceMessages, which has the interface messages and AddmeConfig which has the config for the tool.

In the example below if we changed the string that says 'Endorse this idea' with 'Support this idea' the gadget's title in the endorse version would reflect the change.

var endorseInterfaceMessages = {
	"IEG":{
			"title":"Endorse this idea",
			"description":"Why do you support this idea?",
			"placeholder":"Click here to add your comment",
			"button-submit":"Endorse",
			"button-cancel":"Cancel",
			"feedback":"Thank you for adding your endorsement!",
			"message-1":"Your signature will be automatically added to your comment.",
			"error":"There was an error, please try again",
	}
};

Custom interface messages for other grant types can be be enabled by copying the above dictionary in full and editing the values to be changed. The key has to be the name of the set of pages in the namespace Grants: Eg: https://meta.wikimedia.org/wiki/Grants:IdeaLab/Build/Tools, here it would be just 'Idealab' or in the case of meta.wikimedia.org/wiki/Grants:IEG, it would be 'IEG'

Lets say the dict looks like

var endorseInterfaceMessages = {
	"IEG":{
			"title":"Endorse this project", 
			"message-description":"Why do you support this project?", 
			"placeholder-comment":"Click here to add your comment", 
			"button-submit":"Endorse", "button-cancel":"Cancel", 
			"message-feedback":"Thank you for adding your endorsement!", 
			"section-header":"Endorsements", 
			"message-signature":"Your signature will be automatically added to your comment.", 
			"error-save":"There was an error, please try again", 
			"error-login":"You are not logged in"
	}
};

So on adding Idealab it would look like

var endorseInterfaceMessages = {
	"IEG":{
			"title":"Endorse this project", 
			"message-description":"Why do you support this project?", 
			"placeholder-comment":"Click here to add your comment", 
			"button-submit":"Endorse", "button-cancel":"Cancel", 
			"message-feedback":"Thank you for adding your endorsement!", 
			"section-header":"Endorsements", 
			"message-signature":"Your signature will be automatically added to your comment.", 
			"error-save":"There was an error, please try again", 
			"error-login":"You are not logged in"
	},
	"IdeaLab":{
			"title":"Endorse this idea", 
			"message-description":"Why do you support this idea?", 
			"placeholder-comment":"Click here to add your comment", 
			"button-submit":"Endorse", "button-cancel":"Cancel", 
			"message-feedback":"Thank you for endorsing!", 
			"section-header":"Endorsements", 
			"message-signature":"Your signature will be automatically added to your comment.", 
			"error-save":"Opps ther was an error", 
			"error-login":"You are not logged in"
	}
};

Similarily the interface messages for the join gadget are stored in var joinInterfaceMessages in the same file. To add new roles to the dropdown the roles have to be added to the infobox and to the joinInterfaceMessages as well. Eg, lets say it looks like this

 
var joinInterfaceMessages = { 
	"default":{ 
		"title":" Join this project", 
		"placeholder-role":" Please select a role", 
		"placeholder-comment":" Click here to add your comment about how you'd like to participate", 
		"button-join":" Join", 
		"button-cancel":" Cancel", 
		"error-save":" There was an error, please try again", 
		"error-login":"You are not logged in", 
		"message-signature":" Your signature will be automatically added to your comment.", 
		"message-feedback":" Thank you for joining this project!", 
		"message-description":"How would you like to help this project?", 
		"roles":{ 
			"researcher":" Researcher", 
			"developer":" Developer", 
			"volunteer":" Volunteer", 
			"designer":" Designer", 
			"advisor":" Advisor", 
			"project_manager":" Project Manager", 
			"community_organizer":" Community Organizer", 
			}, 
		}, 
};

To add a new role called statistician we would add a new entry under "roles" with statistician as the key and Statistician as the value. The key has to match the open entry in the infobox.

 
var joinInterfaceMessages = { 
	"default":{ 
		"title":" Join this project", 
		"placeholder-role":" Please select a role", 
		"placeholder-comment":" Click here to add your comment about how you'd like to participate", 
		"button-join":" Join", 
		"button-cancel":" Cancel", 
		"error-save":" There was an error, please try again", 
		"error-login":"You are not logged in", 
		"message-signature":" Your signature will be automatically added to your comment.", 
		"message-feedback":" Thank you for joining this project!", 
		"message-description":"How would you like to help this project?", 
		"roles":{ 
			"researcher":" Researcher", 
			"developer":" Developer", 
			"volunteer":" Volunteer", 
			"designer":" Designer", 
			"advisor":" Advisor", 
			"project_manager":" Project Manager", 
			"community_organizer":" Community Organizer", 
			"statistician":"Statistician"
			}, 
		}, 
};

Addme & Probox[edit]

The gadget is triggered when the buttons 'Join' or 'Endorse' in Probox (the grants infobox) is clicked. The gadget looks for button classes 'wp-join-button','wp-endorse-button' to show the join & endorse screen respectively. These button classes are baked into Probox's code.

Files[edit]

AddmeInterfaceMessages - The gadget's interface strings/messages
AddmeConfig - The gadget's config values
Addme.js - The gadget code
Addme.css - The styling/css of the gadget

Background[edit]

This tool was built as part of Idealabs April July 2014 sprint