130 lines
4.8 KiB
TypeScript
130 lines
4.8 KiB
TypeScript
// (C) Copyright 2015 Martin Dougiamas
|
|
//
|
|
// Licensed under the Apache License, Version 2.0 (the "License");
|
|
// you may not use this file except in compliance with the License.
|
|
// You may obtain a copy of the License at
|
|
//
|
|
// http://www.apache.org/licenses/LICENSE-2.0
|
|
//
|
|
// Unless required by applicable law or agreed to in writing, software
|
|
// distributed under the License is distributed on an "AS IS" BASIS,
|
|
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
// See the License for the specific language governing permissions and
|
|
// limitations under the License.
|
|
|
|
import { Component, OnInit, ElementRef } from '@angular/core';
|
|
import { FormBuilder, FormControl } from '@angular/forms';
|
|
import { CoreDomUtilsProvider } from '@providers/utils/dom';
|
|
import { CoreTextUtilsProvider } from '@providers/utils/text';
|
|
import { AddonModAssignProvider } from '../../../providers/assign';
|
|
import { AddonModAssignOfflineProvider } from '../../../providers/assign-offline';
|
|
import { AddonModAssignSubmissionPluginComponent } from '../../../classes/submission-plugin-component';
|
|
|
|
/**
|
|
* Component to render an onlinetext submission plugin.
|
|
*/
|
|
@Component({
|
|
selector: 'addon-mod-assign-submission-online-text',
|
|
templateUrl: 'onlinetext.html'
|
|
})
|
|
export class AddonModAssignSubmissionOnlineTextComponent extends AddonModAssignSubmissionPluginComponent implements OnInit {
|
|
|
|
control: FormControl;
|
|
words: number;
|
|
component = AddonModAssignProvider.COMPONENT;
|
|
text: string;
|
|
loaded: boolean;
|
|
|
|
protected wordCountTimeout: any;
|
|
protected element: HTMLElement;
|
|
|
|
constructor(protected fb: FormBuilder, protected domUtils: CoreDomUtilsProvider, protected textUtils: CoreTextUtilsProvider,
|
|
protected assignProvider: AddonModAssignProvider, protected assignOfflineProvider: AddonModAssignOfflineProvider,
|
|
element: ElementRef) {
|
|
|
|
super();
|
|
this.element = element.nativeElement;
|
|
}
|
|
|
|
/**
|
|
* Component being initialized.
|
|
*/
|
|
ngOnInit(): void {
|
|
let promise,
|
|
rteEnabled;
|
|
|
|
// Check if rich text editor is enabled.
|
|
if (this.edit) {
|
|
promise = this.domUtils.isRichTextEditorEnabled();
|
|
} else {
|
|
// We aren't editing, so no rich text editor.
|
|
promise = Promise.resolve(false);
|
|
}
|
|
|
|
promise.then((enabled) => {
|
|
rteEnabled = enabled;
|
|
|
|
// Get the text. Check if we have anything offline.
|
|
return this.assignOfflineProvider.getSubmission(this.assign.id).catch(() => {
|
|
// No offline data found.
|
|
}).then((offlineData) => {
|
|
if (offlineData && offlineData.pluginData && offlineData.pluginData.onlinetext_editor) {
|
|
return offlineData.pluginData.onlinetext_editor.text;
|
|
}
|
|
|
|
// No offline data found, return online text.
|
|
return this.assignProvider.getSubmissionPluginText(this.plugin, this.edit && !rteEnabled);
|
|
});
|
|
}).then((text) => {
|
|
// We receive them as strings, convert to int.
|
|
this.configs.wordlimit = parseInt(this.configs.wordlimit, 10);
|
|
this.configs.wordlimitenabled = parseInt(this.configs.wordlimitenabled, 10);
|
|
|
|
// Set the text.
|
|
this.text = text;
|
|
|
|
if (!this.edit) {
|
|
// Not editing, see full text when clicked.
|
|
this.element.addEventListener('click', (e) => {
|
|
e.preventDefault();
|
|
e.stopPropagation();
|
|
|
|
if (text) {
|
|
// Open a new state with the interpolated contents.
|
|
this.textUtils.expandText(this.plugin.name, text, this.component, this.assign.cmid);
|
|
}
|
|
});
|
|
} else {
|
|
// Create and add the control.
|
|
this.control = this.fb.control(text);
|
|
}
|
|
|
|
// Calculate initial words.
|
|
if (this.configs.wordlimitenabled) {
|
|
this.words = this.textUtils.countWords(text);
|
|
}
|
|
}).finally(() => {
|
|
this.loaded = true;
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Text changed.
|
|
*
|
|
* @param {string} text The new text.
|
|
*/
|
|
onChange(text: string): void {
|
|
// Count words if needed.
|
|
if (this.configs.wordlimitenabled) {
|
|
// Cancel previous wait.
|
|
clearTimeout(this.wordCountTimeout);
|
|
|
|
// Wait before calculating, if the user keeps inputing we won't calculate.
|
|
// This is to prevent slowing down devices, this calculation can be slow if the text is long.
|
|
this.wordCountTimeout = setTimeout(() => {
|
|
this.words = this.textUtils.countWords(text);
|
|
}, 1500);
|
|
}
|
|
}
|
|
}
|