Content deleted Content added
m selectedResponse |
start work on preview option, add toggle to show/hide, when shown just says what text would be previewed |
||
Line 151:
// pasing around the `require` function everywhere
const wvui = mw.loader.require( 'wvui' );
// Extra component to render wikitext preview
const previewRenderer = EFFPRH.getPreviewComponent();
const handlerApp = {
components: {
WvuiButton: wvui.WvuiButton,
WvuiDropdown: wvui.WvuiDropdown,
WvuiInput: wvui.WvuiInput,
WvuiToggleButton: wvui.WvuiToggleButton,
previewRenderer: previewRenderer
},
data: function () {
Line 167 ⟶ 171:
// Debug information of the state
showDebug: EFFPRH.config.debug,
// Preview
showPreview: false,
// Overall state
Line 177 ⟶ 184:
canSubmit: function () {
return !this.haveSubmitted && this.selectedResponse !== 'none';
},
previewToggleLabel: function () {
return ( this.showPreview ? 'Hide preview' : 'Show preview' );
},
responseWikiText: function () {
Line 192 ⟶ 202:
onCommentChange: function ( newComment ) {
this.commentValue = newComment;
},
onTogglePreview: function ( newPreviewState ) {
this.showPreview = newPreviewState;
},
reloadPage: function () {
Line 248 ⟶ 261:
<wvui-button type="primary" action="progressive" :disabled="!canSubmit" v-on:click="submitHandler">Submit</wvui-button>
<wvui-button type="primary" action="destructive" :disabled="haveSubmitted" v-on:click="cancelHandler">Cancel</wvui-button>
<wvui-toggle-button :is-active="showPreview" :disabled="!canSubmit" v-on:click="onTogglePreview">{{ previewToggleLabel }}</wvui-toggle-button>
<!-- v-if so that we don't call the api to parse and render a preview when its not needed -->
<preview-renderer v-if="showPreview" :wikitext="responseWikitext"></preview-renderer>
</div>`
};
vueAppInstance = Vue.createMwApp( handlerApp );
vueAppInstance.mount( '#' + targetDivId );
};
/**
* Extra component: preview of wikitext being added.
*/
EFFPRH.getPreviewComponent = function () {
return {
props: {
wikitext: { type: String, default: '' }
},
template: `
<div>
Loading preview of {{ wikitext }}
</div>`
};
};
| |||