:: rbuttonJS [script]
/* This is modifed radiobutton macro, for automatic checked state setup*/
/* Usage (be sure to use quotes around parameters): 

	<<rbutton "$variable" "value">>	
Or:
	<<rbutton "$variable" "value" "HTML_element_ID" "Text to replace with, inside html element with ID from previous parameter. <br> HTML tags allowed.">> 

Group of radiobutton will be created based on variable name. Checked state will be setted up if variable contain value matched with second parameter. Full form of macro call can be used to display extended description of selected value.
*/

Macro.add('rbutton', {
	handler() {
	    if (this.args.length < 2) {
		const errors = [];
		if (this.args.length < 1) { errors.push('variable name'); }
		if (this.args.length < 2) { errors.push('checked value'); }
		return this.error(`no ${errors.join(' or ')} specified`);
	    }

	    // Ensure that the variable name argument is a string.
	    if (typeof this.args[0] !== 'string') {
		return this.error('variable name argument is not a string');
	    }

	    const varName = this.args[0].trim();

	    // Try to ensure that we receive the variable's name (incl. sigil), not its value.
	    if (varName[0] !== '$' && varName[0] !== '_') {
		return this.error(`variable name "${this.args[0]}" is missing its sigil ($ or _)`);
	    }

	    const initValue	 = Wikifier.getValue(this.args[0]);
	    const varId      = Util.slugify(varName);
	    const checkValue = this.args[1];
	    const el         = document.createElement('input');

	    var replaceID = "";
	    var replaceText = "";
	    if (typeof this.args[2] === 'string') {
			replaceID = this.args[2];
	    }
	    if (typeof this.args[3] === 'string') {
			replaceText = this.args[3];
	    }

		
	    
	    /*
		Setup and initialize the group counter.
	    */
	    if (!TempState.hasOwnProperty(this.name)) {
		TempState[this.name] = {};
	    }

	    if (!TempState[this.name].hasOwnProperty(varId)) {
		TempState[this.name][varId] = 0;
	    }

	    /*
		Setup and append the input element to the output buffer.
	    */
	    jQuery(el)
		.attr({
		    id       : `${this.name}-${varId}-${TempState[this.name][varId]++}`,
		    name     : `${this.name}-${varId}`,
		    type     : 'radio',
		    tabindex : 0 // for accessiblity
		})
		.addClass(`macro-${this.name}`)
		.on('change', function () {
		    if (this.checked) {
			Wikifier.setValue(varName, checkValue);

			if (replaceID.length > 0 && replaceText.length > 0){

				var replaceEl = document.getElementById(replaceID);
				//alert (replaceEl);
				if (replaceEl != null) {
					replaceEl.innerHTML = replaceText;
					}

				}
		    }
		})
		.ready (function () {
			//alert ("DOM finished");
			if (el.checked && replaceID.length > 0 && replaceText.length > 0){

				var replaceEl = document.getElementById(replaceID);
				//alert (replaceEl);
				if (replaceEl != null) {
					replaceEl.innerHTML = replaceText;
				}

			}
		})
		.appendTo(this.output);

	    /*
		Set the story variable to the checked value and the input element to checked, if requested.
	    */
	    if (initValue == checkValue) {
		el.checked = true;
		Wikifier.setValue(varName, checkValue);
	    }
	}
    });
