Skip to content
This repository was archived by the owner on Nov 7, 2020. It is now read-only.

Commit

Permalink
fix error messages display in create session dialog
Browse files Browse the repository at this point in the history
  • Loading branch information
@srish
srish committed May 27, 2016
1 parent ed1a48a commit b452526
Show file tree
Hide file tree
Showing 4 changed files with 109 additions and 138 deletions.
9 changes: 4 additions & 5 deletions public/css/screen.styl
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2654,9 +2654,8 @@ user-admin-border-size = 2px
}

#create-session-modal {

.session-title-validate-error {
margin-top: 10px;
.create-session-error {
margin: 25px 25px 0px 25px;
}
}

Expand Down Expand Up @@ -2736,9 +2735,9 @@ user-admin-border-size = 2px
}
}

.proposed-title-validate-error {
margin: 0px;
.propose-session-error {
margin-top: 15px;
margin-bottom: 5px;
}
}

Expand Down
116 changes: 63 additions & 53 deletions public/js/event-views.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -553,6 +553,8 @@ views.SessionListView = Backbone.Marionette.CollectionView.extend({

events: {
'click #btn-group-me': 'groupUser',
'click #btn-create-session': 'invokeCreateSessionModal',
'click #btn-propose-session': 'invokeProposeSessionModal'
},

initialize: function() {
Expand All @@ -571,6 +573,20 @@ views.SessionListView = Backbone.Marionette.CollectionView.extend({
};
},

invokeCreateSessionModal: function(jqevt) {
jqevt.preventDefault();
$("#create-session-modal").modal('show');
$(".create-session-error").addClass('hide');
$(".create-session-error").removeClass('show');
},

invokeProposeSessionModal: function(jqevt) {
jqevt.preventDefault();
$("#propose-session-modal").modal('show');
$(".propose-session-error").addClass('hide');
$(".propose-session-error").removeClass('show');
},

groupUser: function(jqevt) {
jqevt.preventDefault();
var thisEventAssign = this.getMySessionAssignment();
Expand Down Expand Up @@ -717,7 +733,6 @@ views.DialogView = Backbone.Marionette.Layout.extend({
'keyup #session_message': 'updateSessionMessage',
'click #send-email-button': 'sendFollowupEmail',
'click #submit-contact-info': 'submitContactInfo',
'click #btn-propose-session': 'proposeSessionDialog',
'click #set-iframe-code': 'setIframeCode',
'click #propose': 'proposeSession',
'input .input-topic-title': 'fillTopicPreview',
Expand All @@ -739,28 +754,21 @@ views.DialogView = Backbone.Marionette.Layout.extend({

fillTopicPreview: function(event) {
event.preventDefault();

var title = $(".input-topic-title").val();
var scope = $("#propose-session-modal");

if(title.length > 80 || title.length === 0 || title === "") {
scope.modal('show');
$(".proposed-title-validate-error", scope).addClass('show');
$(".proposed-title-validate-error", scope).removeClass('hide');

if(title.length > 80)
$(".proposed-title-validate-error", scope).text("Title should be less than 80 characters");
this.showProposeSessionError("Oops! Session title should be less than 80 characters.");
else if (title.length === 0 || title === "")
$(".proposed-title-validate-error", scope).text("Title cannot be left blank");

this.showProposeSessionError("Oops! Session title cannot be left blank.");
return;
}

this.hideProposeSessionError();
$(".title-preview").text("");
$(".title-preview").text(title);
$(".proposed-title-validate-error", scope).removeClass('show');
$(".proposed-title-validate-error", scope).addClass('hide');

},

regroupUser: function(event) {
Expand All @@ -778,18 +786,11 @@ views.DialogView = Backbone.Marionette.Layout.extend({

if(title.length > 80 || title.length === 0 || title === "") {
scope.modal('show');

$(".proposed-title-validate-error", scope).removeClass('hide');
$(".proposed-title-validate-error", scope).addClass('show');

if(title.length > 80) {
$(".proposed-title-validate-error", scope).text("Title should be less than 80 characters");
}

else if (title.length === 0 || title === "") {
$(".proposed-title-validate-error", scope).text("Title cannot be left blank");
this.showProposeSessionError("Oops! Session title should be less than 80 characters.");
} else if (title.length === 0 || title === "") {
this.showProposeSessionError("Oops! Session title cannot be left blank.");
}

return;
}

Expand All @@ -806,21 +807,14 @@ views.DialogView = Backbone.Marionette.Layout.extend({
});

scope.modal('hide');

$(".title-preview").text("Your title will appear here");
$(".input-topic-title").val("");
$(".proposed-title-validate-error", scope).addClass('hide');
$(".proposed-title-validate-error", scope).removeClass('show');
},

closeDisconnected: function() {
$("#disconnected-modal").modal('hide');
},

proposeSessionDialog: function() {
$("#propose-session-dialog").modal('show');
},

setIframeCode: function(event) {
event.preventDefault();
var iframeCode = $(".input-iframe-code").val();
Expand Down Expand Up @@ -930,7 +924,6 @@ views.DialogView = Backbone.Marionette.Layout.extend({
$('.contact-control', scope).removeClass('contact-invalid-error');

scope.modal('hide');

},

createSession: function(event) {
Expand All @@ -940,45 +933,50 @@ views.DialogView = Backbone.Marionette.Layout.extend({
var joinCap = parseInt($.trim($("[name=join_cap]", scope).val()));
var type = $("[name='session_type']:checked", scope).val();

if (isNaN(joinCap) || joinCap < 2 || joinCap > 10) {
$(".join-cap-error", scope).show();
return;
}

if(title.length > 80 || title.length === 0 || title === "") {
scope.modal('show');
$(".session-title-validate-error", scope).addClass('show');
$(".session-title-validate-error", scope).removeClass('hide');

if(title.length > 80)
$(".session-title-validate-error", scope).text("Title should be less than 80 characters");
else if (title.length === 0 || title == "")
$(".session-title-validate-error", scope).text("Title cannot be left blank");
if(title.length > 80) {
this.showCreateSessionError("Oops! Session name should be less than 80 characters.");
return;
} else if (title.length === 0 || title == "") {
this.showCreateSessionError("Oops! Session name cannot be left blank.");
return;
}
}

if (isNaN(joinCap) || joinCap < 2 || joinCap > 10) {
this.showCreateSessionError("Oops! Participant limit should be a number between 2 and 10.");
return;

}
}

var activities = [];
switch (type) {
case "simple":
activities.push({type: "about", autoHide: true});
break;
case "video":
var ytUrl = $("#session_youtube_id", scope).val();
if(!ytUrl) {
this.showCreateSessionError("Oops! URL for a 'Youtube Video' session type cannot be left blank.");
return;
}
var ytid = video.extractYoutubeId($("#session_youtube_id", scope).val());
if (!ytid) {
$(".yt-error", scope).show();
$("#session_youtube_id", scope).parent().addClass("error");
this.showCreateSessionError("Oops! that's an unrecognized Youtube URL! Please enter a valid URL.")
return;
} else {
activities.push({type: "video", video: {provider: "youtube", id: ytid}});
}
break;
case "webpage":
var url = this.$("#session_webpage").val();
if(!url) {
this.showCreateSessionError("Oops! URL for a 'Webpage' session type cannot be left blank.");
return;
}

if (!/^https:\/\//.test(url)) {
$(".url-error", scope).show();
$("#session_webpage", scope).parent().addClass("error");
this.showCreateSessionError("Oops! We only allow embedding of secure pages in the breakout rooms. Please enter an 'https' url.");
return;
} else {
activities.push({type: "webpage", url: url});
Expand All @@ -996,15 +994,10 @@ views.DialogView = Backbone.Marionette.Layout.extend({
});

$("input[type=text]", scope).val("");
$(".yt-error, .url-error, .join-cap-error", scope).hide();
$(".error", scope).removeClass(".error");
scope.modal('hide');

$(".session-title-validate-error", scope).addClass('hide');
$(".session-title-validate-error", scope).removeClass('show');
},

sendFollowupEmail: function(jqevt) {
sendFollowupEmail: function(jqevt) {
jqevt.preventDefault();

$.ajax({
Expand All @@ -1018,6 +1011,23 @@ views.DialogView = Backbone.Marionette.Layout.extend({

closeDisconnected: function() {
$("#disconnected-modal").modal('hide');
},

showCreateSessionError: function(msg) {
$(".create-session-error").addClass("show");
$(".create-session-error").removeClass("hide");
$(".create-session-error").text(msg);
},

showProposeSessionError: function(msg) {
$(".propose-session-error").addClass("show");
$(".propose-session-error").removeClass("hide");
$(".propose-session-error").text(msg);
},

hideProposeSessionError: function() {
$(".propose-session-error").addClass("hide");
$(".propose-session-error").removeClass("show");
}
});

Expand Down
15 changes: 8 additions & 7 deletions test/test.create-sessions.selenium.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -156,34 +156,35 @@ describe("CREATE SESSIONS", function() {
expect(val).to.be("");
});
browser.byCss("#create-session").click();
browser.waitForSelector(".join-cap-error");
browser.executeScript("$('.join-cap-error').hide();");
browser.waitForSelector(".create-session-error");
browser.executeScript("$('.create-session-error').hide();");

// Error for too low
browser.waitForSelector("#session_name");
browser.byCss("#session_name").sendKeys("Joining Capacity");
browser.byCss("#join_cap").clear();
browser.byCss("#join_cap").sendKeys("1");
browser.byCss("#create-session").click();
browser.waitForSelector(".join-cap-error");
browser.executeScript("$('.join-cap-error').hide();");
browser.waitForSelector(".create-session-error");
browser.executeScript("$('.create-session-error').hide();");

// Error for too high
browser.waitForSelector("#session_name");
browser.byCss("#session_name").sendKeys("Joining Capacity");
browser.byCss("#join_cap").clear();
browser.byCss("#join_cap").sendKeys("11");
browser.byCss("#create-session").click();
browser.waitForSelector(".join-cap-error");
browser.executeScript("$('.join-cap-error').hide();");
browser.waitForSelector(".create-session-error");
browser.executeScript("$('.create-session-error').hide();");

// Goldilocks

browser.waitForSelector("#session_name");
browser.byCss("#session_name").sendKeys("Joining Capacity");
browser.byCss("#join_cap").clear();
browser.executeScript("$('#join_cap').val('');");
browser.byCss("#join_cap").sendKeys("3");
browser.byCss("#create-session").click();
browser.byCss("#create-session").click();

browser.waitForSelector(".session .hangout-users");
browser.byCsss(".session .hangout-users li").then(function(els) {
Expand Down
Loading

0 comments on commit b452526

Please sign in to comment.