added a "preview" mode for CreateAnnotation and Markers that blocks inputs so sending annotations is impossible
--- a/src/widgets/CreateAnnotation.css Thu Sep 24 15:51:32 2015 +0200
+++ b/src/widgets/CreateAnnotation.css Fri Sep 25 10:44:54 2015 +0200
@@ -44,7 +44,8 @@
}
.Ldt-CreateAnnotation-Submit,
-.Ldt-CreateAnnotation-Cancel{
+.Ldt-CreateAnnotation-Cancel,
+.Ldt-CreateAnnotation-PreviewSubmit{
position: absolute;
bottom: 7px;
right: 7px;
--- a/src/widgets/CreateAnnotation.js Thu Sep 24 15:51:32 2015 +0200
+++ b/src/widgets/CreateAnnotation.js Fri Sep 25 10:44:54 2015 +0200
@@ -55,6 +55,7 @@
pause_when_displaying: false,
custom_send_button: false,
custom_cancel_button: false,
+ preview_mode: false,
};
IriSP.Widgets.CreateAnnotation.prototype.messages = {
@@ -63,6 +64,7 @@
to_time: "to",
at_time: "at",
submit: "Submit",
+ preview_submit: "You cannot submit annotations in preview mode",
cancel: "Cancel",
add_keywords_: "Add keywords:",
add_polemic_keywords_: "Add polemic attributes :",
@@ -85,6 +87,7 @@
to_time: "à",
at_time: "à",
submit: "Envoyer",
+ preview_submit: "Vous ne pouvez pas envoyer d'annotation en mode aperçu",
cancel: "Annuler",
add_keywords_: "Ajouter des mots-clés\u00a0:",
add_polemic_keywords_: "Ajouter des attributs polémiques\u00a0:",
@@ -116,7 +119,8 @@
+ '{{#show_creator_field}}{{l10n.your_name_}} <input class="Ldt-CreateAnnotation-Creator empty" value="{{creator_name}}" {{#creator_field_readonly}}readonly{{/creator_field_readonly}}/>{{/show_creator_field}}</h3>'
+ '<textarea class="Ldt-CreateAnnotation-Description empty" placeholder="{{l10n.type_description}}"></textarea>'
+ '<div class="Ldt-CreateAnnotation-Avatar"><img src="{{creator_avatar}}" title="{{creator_name}}"></img></div>'
- + '<input type="submit" class="Ldt-CreateAnnotation-Submit" value="{{#custom_send_button}}{{custom_send_button}}{{/custom_send_button}}{{^custom_send_button}}{{l10n.submit}}{{/custom_send_button}}" />'
+ + '{{#preview_mode}}<input type="button" class="Ldt-CreateAnnotation-PreviewSubmit" title="{{l10n.preview_submit}}" value="{{#custom_send_button}}{{custom_send_button}}{{/custom_send_button}}{{^custom_send_button}}{{l10n.submit}}{{/custom_send_button}}" />{{/preview_mode}}'
+ + '{{^preview_mode}}<input type="submit" class="Ldt-CreateAnnotation-Submit" value="{{#custom_send_button}}{{custom_send_button}}{{/custom_send_button}}{{^custom_send_button}}{{l10n.submit}}{{/custom_send_button}}" />{{/preview_mode}}'
+ '<input type="button" class="Ldt-CreateAnnotation-Cancel" value="{{#custom_cancel_button}}{{custom_cancel_button}}{{/custom_cancel_button}}{{^custom_cancel_button}}{{l10n.cancel}}{{/custom_cancel_button}}" />'
+ '{{#show_mic_record}}<div class="Ldt-CreateAnnotation-RecBlock"><div class="Ldt-CreateAnnotation-RecLabel">Add voice annotation</div>'
+ ' <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="220" height="160">'
--- a/src/widgets/Markers.css Thu Sep 24 15:51:32 2015 +0200
+++ b/src/widgets/Markers.css Fri Sep 25 10:44:54 2015 +0200
@@ -66,6 +66,11 @@
text-indent: 2px;
}
+.Ldt-Markers-RoundButton.Ldt-Markers-PreviewDelete{
+ line-height: 23px;
+ text-indent: 2px;
+}
+
.Ldt-Markers-Info{
height: 125px;
width: 90%;
@@ -146,7 +151,7 @@
vertical-align: top;
}
-.Ldt-Markers-MarkerSend, .Ldt-Markers-MarkerCancel{
+.Ldt-Markers-MarkerSend, .Ldt-Markers-MarkerPreviewSend, .Ldt-Markers-MarkerCancel{
display: inline-block;
background-color: #d93c71;
color: #ffffff;
@@ -169,7 +174,7 @@
vertical-align: top;
}
-.Ldt-Markers-RoundButton:hover, .Ldt-Markers-MarkerSend:hover, .Ldt-Markers-MarkerCancel:hover{
+.Ldt-Markers-RoundButton:hover, .Ldt-Markers-MarkerSend:hover, .Ldt-Markers-MarkerPreviewSend:hover, .Ldt-Markers-MarkerCancel:hover{
background-color: #e15581;
border-color: #222222 #e87d9f #f0adc3 #68273c;
}
--- a/src/widgets/Markers.js Thu Sep 24 15:51:32 2015 +0200
+++ b/src/widgets/Markers.js Fri Sep 25 10:44:54 2015 +0200
@@ -31,6 +31,7 @@
close_after_send: false,
custom_send_button: false,
custom_cancel_button: false,
+ preview_mode: false,
};
IriSP.Widgets.Markers.prototype.template =
@@ -40,9 +41,10 @@
+ '</div>'
+ '<div class="Ldt-Markers-Inputs">'
+ '<div class="Ldt-Markers-Screen Ldt-Markers-ScreenMain">'
- + '<div class="Ldt-Markers-RoundButton Ldt-Markers-CannotCreate" title="{{l10n.cannot_create}}">+</div>'
+ + '<div class="Ldt-Markers-RoundButton Ldt-Markers-CannotCreate" title="{{#preview_mode}}{{l10n.preview_mode_submit}}{{/preview_mode}}{{^preview_mode}}{{l10n.cannot_create}}{{/preview_mode}}">+</div>'
+ '<div class="Ldt-Markers-RoundButton Ldt-Markers-Create">+</div>'
- + '<div class="Ldt-Markers-RoundButton Ldt-Markers-Delete">✖</div>'
+ + '{{^preview_mode}}<div class="Ldt-Markers-RoundButton Ldt-Markers-Delete">✖</div>{{/preview_mode}}'
+ + '{{#preview_mode}}<div class="Ldt-Markers-RoundButton Ldt-Markers-PreviewDelete" title="{{l10n.preview_mode_delete}}">✖</div>{{/preview_mode}}'
+ '<div class="Ldt-Markers-Info"></div>'
+ '</div>'
+ '<div class="Ldt-Markers-Screen Ldt-Markers-ScreenSending">'
@@ -86,7 +88,8 @@
'{{#edit}}<div class="Ldt-Markers-MarkerEdit">' +
'<textarea class="Ldt-Markers-MarkerTextArea" cols="60" rows="4">{{marker_info}}</textarea>' +
'<div class="Ldt-Markers-Buttons">' +
- '<div class="Ldt-Markers-MarkerSend">{{send}}</div>' +
+ '{{^preview_mode}}<div class="Ldt-Markers-MarkerSend">{{send}}</div>{{/preview_mode}}' +
+ '{{#preview_mode}}<div class="Ldt-Markers-MarkerPreviewSend" title="{{preview_mode_text}}">{{send}}</div>{{/preview_mode}}' +
'<div class="Ldt-Markers-MarkerCancel">{{cancel}}</div>' +
'</div>' +
'</div>{{/edit}}'
@@ -96,6 +99,8 @@
send : "Send",
submit_delete: "Delete",
cancel : "Cancel",
+ preview_mode_submit: "You cannot submit a marker in preview mode.",
+ preview_mode_delete: "You cannot delete a marker in preview mode",
wait_while_processing: "Please wait while your annotation is being processed...",
delete_text: "The selected marker will be deleted. Continue?",
error_while_contacting: "An error happened while contacting the server. Your annotation has not been saved.",
@@ -108,6 +113,8 @@
send : "Envoyer",
submit_delete: "Supprimer",
cancel : "Annuler",
+ preview_mode_submit: "Vous ne pouvez pas créer ou éditer de marqueur en mode aperçu",
+ preview_mode_delete: "Vous ne pouvez pas supprimer de marqueur en mode aperçu",
wait_while_processing: "Veuillez patienter pendant le traitement de votre annotation...",
delete_text: "Le marqueur sélectionné sera supprimé. Continuer?",
error_while_contacting: "Une erreur s'est produite en contactant le serveur. Votre annotation n'a pas été enregistrée.",
@@ -165,17 +172,17 @@
IriSP.Widgets.Markers.prototype.updateCreateButtonState = function(_time){
_this = this
- var can_create = this.markers.every(function(_marker){
+ var can_create = this.preview_mode? false : this.markers.every(function(_marker){
return ((_time < (_marker.begin-_this.markers_gap))||(_time > (_marker.begin+_this.markers_gap)))
});
if (can_create){
- if ((this.$.find(".Ldt-Markers-Create").is(":hidden"))&&(this.$.find(".Ldt-Markers-Delete").is(":hidden"))){
+ if ((this.$.find(".Ldt-Markers-Create").is(":hidden"))&&(this.$.find(".Ldt-Markers-Delete").is(":hidden")||this.$.find(".Ldt-Markers-PreviewDelete").is(":hidden"))){
this.$.find(".Ldt-Markers-RoundButton").hide();
this.$.find(".Ldt-Markers-Create").show();
}
}
else {
- if ((this.$.find(".Ldt-Markers-CannotCreate").is(":hidden"))&&(this.$.find(".Ldt-Markers-Delete").is(":hidden"))){
+ if ((this.$.find(".Ldt-Markers-CannotCreate").is(":hidden"))&&(this.$.find(".Ldt-Markers-Delete").is(":hidden")||this.$.find(".Ldt-Markers-PreviewDelete").is(":hidden"))){
this.$.find(".Ldt-Markers-RoundButton").hide();
this.$.find(".Ldt-Markers-CannotCreate").show();
}
@@ -207,6 +214,8 @@
if (this.selectedMarker){
_divHtml = Mustache.to_html(this.infoTemplate, {
edit: true,
+ preview_mode: this.preview_mode,
+ preview_mode_text: this.l10n.preview_mode_submit,
marker_info: this.selectedMarker.description,
send: this.custom_send_button? this.custom_send_button : this.l10n.send,
cancel: this.custom_cancel_button? this.custom_cancel_button :this.l10n.cancel
@@ -216,6 +225,8 @@
_divHtml = Mustache.to_html(this.infoTemplate, {
edit: true,
marker_info: "",
+ preview_mode: this.preview_mode,
+ preview_mode_text: this.l10n.preview_mode_submit,
send: this.custom_send_button? this.custom_send_button : this.l10n.send,
cancel: this.custom_cancel_button? this.custom_cancel_button :this.l10n.cancel
})
@@ -225,7 +236,12 @@
this.$.find(".Ldt-Markers-MarkerCancel").click(this.functionWrapper("cancelEdit"));
this.$.find(".Ldt-Markers-MarkerTextArea").bind("change keyup input paste", this.functionWrapper("onDescriptionChange"));
this.$.find(".Ldt-Markers-RoundButton").hide();
- this.$.find(".Ldt-Markers-Delete").show();
+ if (this.preview_mode){
+ this.$.find(".Ldt-Markers-PreviewDelete").show();
+ }
+ else {
+ this.$.find(".Ldt-Markers-Delete").show();
+ }
this.editing = true;
}
@@ -237,7 +253,9 @@
marker_info: this.selectedMarker.description,
})
this.$.find(".Ldt-Markers-Info").html(_divHtml);
- this.$.find(".Ldt-Markers-MarkerDescription").click(this.functionWrapper("startEdit"));
+ if (!this.preview_mode){
+ this.$.find(".Ldt-Markers-MarkerDescription").click(this.functionWrapper("startEdit"));
+ }
}
else {
// Clic sur "cancel" pendant la création d'un marqueur = retour à l'état initial
@@ -287,7 +305,12 @@
this.cancelEdit();
if (this.selectedMarker){
this.$.find(".Ldt-Markers-RoundButton").hide();
- this.$.find(".Ldt-Markers-Delete").show();
+ if (this.preview_mode){
+ this.$.find(".Ldt-Markers-PreviewDelete").show();
+ }
+ else {
+ this.$.find(".Ldt-Markers-Delete").show();
+ }
}
else {
this.$.find(".Ldt-Markers-RoundButton").hide();
@@ -386,9 +409,16 @@
})
_this.$.find(".Ldt-Markers-Info").html(_divHtml);
- _this.$.find(".Ldt-Markers-MarkerDescription").click(_this.functionWrapper("startEdit"));
+ if (!_this.preview_mode){
+ _this.$.find(".Ldt-Markers-MarkerDescription").click(_this.functionWrapper("startEdit"));
+ }
_this.$.find(".Ldt-Markers-RoundButton").hide();
- _this.$.find(".Ldt-Markers-Delete").show();
+ if (_this.preview_mode){
+ _this.$.find(".Ldt-Markers-PreviewDelete").show();
+ }
+ else {
+ _this.$.find(".Ldt-Markers-Delete").show();
+ }
}
else {