User:Another Article/protostudy.js

$(document).ready(function{ mw.loader.using( ['oojs-ui', 'mediawiki.util'] ).done( function  { $( "#pt-notifications-message" ).after(         $( "" ).append( $( "" ) .text( "0 Q's" ) .css( {             "background-color": "lightgray",              "color": "white",              "border-radius": "2px",              "padding": "0.25em 0.45em 0.2em",              "cursor": "pointer",              "font-weight": "bold",              "transition": "background-color 0.5s"            } ) .attr("id", "survey_question_count") )         .attr( "id", "pt-notifications-survey" )        ); var already_open = false;

function update_after_submit(remaining_count) {     if (remaining_count === 0) {       $('#survey_question_count').text("Thx!"); $('#pt-notifications-survey').unbind("click"); $('#survey_question_count').css('background-color', 'lightgray'); }     else {       $('#survey_question_count').text(remaining_count + " Q's"); }   }

// Subclass ProcessDialog. function ProcessDialog( config ) { ProcessDialog.super.call( this, config ); }   OO.inheritClass( ProcessDialog, OO.ui.ProcessDialog );

ProcessDialog.static.title = 'Edit Questions'; ProcessDialog.static.actions = [ { modes: ['beginning', 'middle', 'end', 'single'], action: 'submit', label: 'Submit', flags: [ 'primary', 'constructive' ] }, { modes: ['beginning', 'middle', 'end', 'single'], label: 'Cancel', flags: 'safe' }, { modes: ['middle', 'end'], action: 'prev', label: 'Previous' }, { modes: ['beginning', 'middle'], action: 'next', label: 'Next' }, ];

ProcessDialog.prototype._get_diff_url = function(rev_id){ return "https://en.wikipedia.org/w/index.php?diff=prev&oldid=" + rev_id; };

ProcessDialog.prototype._get_prompt = function(data_entry){ var d = new Date(data_entry['timestamp']); var time_stamp_string = d.toLocaleDateString + " " + d.toLocaleTimeString; return new OO.ui.LabelWidget( {         label: new OO.ui.HtmlSnippet( ' '         )        } );

};

ProcessDialog.prototype._get_panel = function (data_entry){ var prompt = this._get_prompt(data_entry)

// Time allocated for edit var time_spent = new OO.ui.NumberInputWidget( {       min: 0,      } ); time_spent.$element.width("33%")

// Units being used var option1 = new OO.ui.ButtonOptionWidget( {         data: 1,          label: 'Seconds',      } ); var option2 = new OO.ui.ButtonOptionWidget( {         data: 60,          label: 'Minutes',      } ); var option3 = new OO.ui.ButtonOptionWidget( {         data: 60*60,          label: 'Hours',      } ); var time_units = new OO.ui.ButtonSelectWidget( {         items: [ option1, option2, option3 ],          tabindex: 2      } ); time_units.selectItem(option2);

var work_type = new OO.ui.TextInputWidget( {       rows: 3,        multiline: true,      } );

var work_steps = new OO.ui.TextInputWidget( {       rows: 3,        multiline: true,      } );

var dont_ask = new OO.ui.CheckboxInputWidget({       selected: false      }) // Putting all of the elements together var fieldset = new OO.ui.FieldsetLayout( {     } ); fieldset.addItems( [         new OO.ui.FieldLayout( prompt, { label: 'All questions are with respect to the following edit.', align: 'top' } ),         new OO.ui.FieldLayout( work_steps, { label: 'Describe all activities ( both on-wiki and off-wiki) that contributed to this edit. These can range from editing the wiki-text to getting a book from the library.', align: 'top', help: 'This can include a description of how you found this article,\ the background research you had to do, any people you had to\ talk to, or anything else that you think led to this edit.' } ),         new OO.ui.FieldLayout( work_type, { label: 'Describe the type of activity you were doing, e.g. copy-editing, revising section, adding illustrations.', align: 'top', help: 'Some examples would include: copy editing, creating new content,\ fact checking, wikifying, cleanup, adding illustrations, coordinating, etc.', } ),         new OO.ui.FieldLayout( time_spent, { label: 'How much time did you spend working on this edit?', align: 'top', help: 'Estimate the amount of time that went into this edit\ as you did everything you described in the first question.' } ),         new OO.ui.FieldLayout( time_units, { align:'right' }),         new OO.ui.FieldLayout( dont_ask, { label: 'I don\'t feel like answering this one', align:'inline' }),     ] );

survey_questions = []; survey_questions['revid'] = data_entry['revid']; survey_questions['time_spent'] = time_spent; survey_questions['time_units'] = time_units; survey_questions['work_type'] = work_type; survey_questions['work_steps'] = work_steps; survey_questions['dont_ask'] = dont_ask;

panel = new OO.ui.PanelLayout({       expanded: false,        framed: false,        padded: true,        $content: $(fieldset.$element),        data: survey_questions      });

//panel.$element.append(fieldset.$element); return panel }

ProcessDialog.prototype._send_data_from_stack_layout = function(stackLayout) {     var count = 0; var panels = stackLayout.getItems; for(var i=panels.length - 1; i >= 0 ; i--) {       var datum = this._get_data_from_panel(panels[i]); if (undefined !== datum) {         $.post( "https://www-users.cs.umn.edu/~schiroo/put_my_response.php", datum); count++; this.data.splice(i,1); }     }      return count; }

ProcessDialog.prototype._get_data_from_panel = function(panel) {     survey_items = panel.data; revid = survey_items['revid']; time_spent = survey_items['time_spent'].input.value; time_units = survey_items['time_units'].getSelectedItem.data; work_type = survey_items['work_type'].value; work_steps = survey_items['work_steps'].value; dont_ask = survey_items['dont_ask'].isSelected; if ("" !== time_spent || dont_ask) {       return { revid: revid, time: time_spent * time_units, type: work_type, steps: work_steps, dont_ask: dont_ask, };     }      else {       return undefined; }   };

ProcessDialog.prototype.initialize = function { ProcessDialog.super.prototype.initialize.apply( this, arguments );

this.current_element = 0;

this.stackLayout= new OO.ui.StackLayout for(var i=0; i < this.data.length; i++) {       panel = this._get_panel(this.data[i]) this.stackLayout.addItems([panel]); }     this.$body.append( this.stackLayout.$element ); };

// Set up the initial mode of the window ('edit', in this example.) ProcessDialog.prototype.getSetupProcess = function ( data ) { return ProcessDialog.super.prototype.getSetupProcess.call( this, data ) .next( function {        if (this.data.length > 1)        {          this.actions.setMode( 'beginning' );        }        else        {          this.actions.setMode( 'single' )        }      }, this ); };

// Use the getActionProcess method to set the modes and displayed item. ProcessDialog.prototype.getActionProcess = function ( action ) {

if ((action === 'prev') && (this.current_element > 0)) {       this.current_element--; this.stackLayout.setItem(this.stackLayout.items[this.current_element]); }     else if ((action === 'next') && (this.current_element < this.stackLayout.getItems.length-1)) {       this.current_element++; this.stackLayout.setItem(this.stackLayout.items[this.current_element]); }     else if (action === 'submit') {       this._send_data_from_stack_layout(this.stackLayout); update_after_submit(this.data.length); this.close //$.post( "https://www-users.cs.umn.edu/~schiroo/put_my_response.php", data); }

if (this.current_element === 0) {       this.actions.setMode('beginning'); }     else if (this.current_element == this.stackLayout.getItems.length-1) {       this.actions.setMode('end'); }     else {       this.actions.setMode('middle'); }     return ProcessDialog.super.prototype.getActionProcess.call( this, action ); };

// Get dialog height. ProcessDialog.prototype.getBodyHeight = function { var height = 0; var index; for (index = 0; this.stackLayout.items.length > index; index++){ var temp = this.stackLayout.items[index].$element.outerHeight(true); if (temp > height) {         height = temp; }     }      return height + 20; };

ProcessDialog.prototype.teardown = function(data){ already_open = false; return ProcessDialog.super.prototype.teardown.call( this, data ) };

function show_survey(event) {     if (!already_open) {       already_open = true; // Create and append the window manager. var windowManager = new OO.ui.WindowManager; $( 'body' ).append( windowManager.$element );

// Create a new dialog window. var processDialog = new ProcessDialog( {         size: 'large',          data: event.data.data,        } );

// Add windows to window manager using the addWindows method. windowManager.addWindows( [ processDialog ] );

// Open the window. windowManager.openWindow( processDialog ); }   }

var username = mw.config.get( 'wgUserName' ).replace(" ", "_"); $.getJSON('https://www-users.cs.umn.edu/~schiroo/get_my_prompts.php?username=' + username, function(question_data) {     if (question_data.length > 0)      {        $('#survey_question_count').text(question_data.length  + " Q's");        $('#pt-notifications-survey').click({data: question_data}, show_survey);        $('#survey_question_count').css('background-color', 'green');      }    }) }) })