User:Ankit18gupta/MyScript.js

$(document).ready(function {  // It is important to make sure that OOUI is loaded before we can make use of it.  mw.loader.using("oojs-ui").done(function  { var EditWizard = function (config) { config = config || {};

EditWizard.parent.call(this, config);

// These are the layout OOUI elements for the form (this.fieldset = new OO.ui.FieldsetLayout({ classes: ["heading"], label: "EDIT WIZARD", })),       (this.dropdownheading = new OO.ui.LabelWidget({ label: "TYPE OF SOURCE", })),       (this.typehelp = new OO.ui.PopupButtonWidget( { icon: 'info', framed: false, label: 'More information', invisibleLabel: true, popup: { head: true, icon: 'infoFilled', label: 'More information', $content: $( ' This is the type of source.\u200e ' ), padded: true, align: 'center' }       })),        (this.dropdown = new OO.ui.DropdownWidget({ label: "Select one", classes: ["box"], $overlay: true, menu: { items: [ new OO.ui.MenuOptionWidget({               data: "a",                label: "URL",              }), new OO.ui.MenuOptionWidget({               data: "b",                label: "ISBN",              }), ],         },        })),        (this.linkheading = new OO.ui.LabelWidget({ label: "LINK TO THE URL/ISBN", })),       (this.linkhelp = new OO.ui.PopupButtonWidget( { icon: 'info', framed: false, label: 'More information', invisibleLabel: true, popup: { head: true, icon: 'infoFilled', label: 'More information', $content: $( ' This is the link of the source from where you want to quote the change.\u200e ' ), padded: true, align: 'center' }       })),        (this.linkinput = new OO.ui.TextInputWidget({ placeholder: "Enter the URL/ISBN", classes: ["box"], help: "Lorem ipsum dolor sit amet, consecte", })),       (this.linkstatus = new OO.ui.MessageWidget({ inline: true, showClose: true, label: "Type the quote above", })),       (this.tagsheading = new OO.ui.LabelWidget({ label: "ADD RELEVANT TAGS", })),       (this.tagshelp = new OO.ui.PopupButtonWidget( { icon: 'info', framed: false, label: 'More information', invisibleLabel: true, popup: { head: true, icon: 'infoFilled', label: 'More information', $content: $( ' Add relevant tags related to your edit.\u200e ' ), padded: true, align: 'center' }       })),        (this.tags1 = new OO.ui.MenuTagMultiselectWidget({ classes: ["box"], options: [ {             data: "foo", label: "Grammer", icon: "tag", },           {              data: "bar", label: "Text Update", icon: "tag", },         ],        })),        (this.quoteheading = new OO.ui.LabelWidget({ label: "ENTER THE QUOTE", })),       (this.quotehelp = new OO.ui.PopupButtonWidget( { icon: 'info', framed: false, label: 'More information', invisibleLabel: true, popup: { head: true, icon: 'infoFilled', label: 'More information', $content: $( ' Type the quote text from the above mentioned source you want to edit.\u200e ' ), padded: true, align: 'center' }       })),        (this.quoteinput = new OO.ui.MultilineTextInputWidget({ autosize: true, classes: ["box"], rows: 3, placeholder: "Enter the Quote from the source", })),       (this.status = new OO.ui.MessageWidget({ inline: true, showClose: true, label: "Type the quote above" })),       (this.button = new OO.ui.ButtonWidget({ label: "VERIFY", flags: ["primary", "progressive"], }));

// this.input.connect( this, { enter: 'onBtnClick' } ); this.button.connect(this, { click: "onBtnClick" });

//This is to append the elements in the popup widget and also provide respective CSS this.$element .append(         this.fieldset.$element.css( { font: '25px Lucida Sans', 'text-align': 'center', 'margin':'10px', width: '85%', } ),         this.dropdownheading.$element.css({ display: 'inline', font: '16px Lucida Sans', 'margin':'5px', width: '96%', }),         this.typehelp.$element.css({ font: '13px cursive', 'font-style': 'italic', }),         this.dropdown.$element.css({ font: '13px sans-serif', 'margin':'5px', width: '96%', }),         this.linkheading.$element.css({ display: 'inline', font: '16px Lucida Sans', 'margin':'5px', 'margin-top': '6px', width: '96%', }),         this.linkhelp.$element.css({ font: '13px cursive', 'font-style': 'italic', }),         this.linkinput.$element.css({ font: '13px sans-serif', 'margin':'5px', width: '96%', height: '30%', }),         this.linkstatus.$element.css({ font: "13px sans-serif", margin: "5px", width: "70%", "font-style": "italic", }),         this.linkstatus.$element.hide,          this.tagsheading.$element.css({ font: '16px Lucida Sans', 'margin':'5px', }),         this.tagshelp.$element.css({ font: '13px cursive', 'font-style': 'italic', }),         this.tags1.$element.css({ font: '13px sans-serif', 'margin':'5px', width: '96%', }),         this.quoteheading.$element.css({ display: 'inline', font: '16px Lucida Sans', 'margin':'5px', }),         this.quotehelp.$element.css({ font: '13px cursive', 'font-style': 'italic', }),         this.quoteinput.$element.css({ font: '13px sans-serif', 'margin':'5px', width: '96%', }),         this.status.$element.css({ font: '13px sans-serif', 'margin':'5px', width: '96%', 'font-style': 'italic', }),         this.status.$element.hide,          this.button.$element.css({ font: '13px sans-serif', 'text-align': 'center', 'margin-top': '20px', 'margin-bottom': '20px', 'margin-left': '40%', })       )        .addClass("editwizard"); };

OO.inheritClass(EditWizard, OO.ui.Widget);

// Defines the behaviour of the widget on pressing enter or clicking the submit // Button

EditWizard.prototype.onBtnClick = function { var t;     const linkValue = this.linkinput.getValue; const quoteValue = this.quoteinput.getValue; console.log(typeof linkValue); //Checks if quote text is from the same provided link $.ajax({       url: linkValue,        async: false,        success: function (result) {          t = result.includes(quoteValue);        },      });

if (t) { this.status.$element.show; this.status.setType("success"); this.status.setLabel("Verified!"); }     else { this.status.$element.show; this.status.setType("error"); this.status.setLabel("The quote does not match"); }

if (quoteValue === "") { this.status.setType("warning"); this.status.setLabel("The input cannot be left empty"); }

//for link status if (linkValue === "") { this.linkstatus.$element.show; this.linkstatus.setType("warning"); this.linkstatus.setLabel("The input cannot be left empty"); }

const url = new URL(linkValue) const acceptedOrigins = ['.gov']; const nonacceptedOrigins = ['twitter.com', 'facebook.com'];

if (acceptedOrigins.some(origin => url.origin.includes(origin))) { this.linkstatus.$element.show; this.linkstatus.setType("success"); this.linkstatus.setLabel("Verified!"); }     else if(nonacceptedOrigins.some(origin => url.origin.endsWith(origin)) || linkValue.includes('www.google.com/search?')){ this.linkstatus.$element.show; this.linkstatus.setType("warning"); this.linkstatus.setLabel("The link might not be a valid source"); }     // else{ //  this.linkstatus.$element.show; //  this.linkstatus.setType("warning"); //  this.linkstatus.setLabel("The link might not be a valid source"); // }

};

// Creates a new custom widget object const editwizard = new EditWizard; // A popup button widget is instantiated which wraps inside it the custom widget // That we created above. const popUp = new OO.ui.PopupButtonWidget({     label: "EDIT WIZARD",      popup: false,      align: 'force-right',      popup: {        $content: editwizard.$element,        padded: true,        width: 600,        height: 540,        position: "after",        head: true,        autoClose: false,        hideCloseButton: false,      },    });

// Appends the popup button widget to the left section of the wiki page $("#p-navigation").append(popUp.$element); }); });