gaspersic/freeCodeCamp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

improve upvoting UX and start adding angular validation to submit-story view

Browse Source
This commit is contained in:
Michael Q Larson
2015-03-18 00:40:18 -07:00
parent e31bad4b27
commit af19ea4308
3 changed files with 23 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
public/js/main.js
View File

@@ -126,13 +126,7 @@ $(document).ready(function() {
$('#long-instructions').hide(); $('#long-instructions').hide();
}); });
$('#upvote').on('click', upvoteHandler); var upvoteHandler = function () {
var upvoteHandler = function (event) {
event.preventDefault();
var $this = $(this);
$this.addClass('disabled');
$this.text('Upvoted!');
var _id = storyId; var _id = storyId;
$('#upvote').unbind('click'); $('#upvote').unbind('click');
var alreadyUpvoted = false; var alreadyUpvoted = false;
@@ -154,10 +148,14 @@ $(document).ready(function() {
$('#upvote').bind('click', upvoteHandler); $('#upvote').bind('click', upvoteHandler);
}) })
.done(function (data, textStatus, xhr) { .done(function (data, textStatus, xhr) {
$('#storyRank').text(data.rank); $('#upvote').text('Upvoted!').addClass('disabled');
$('#storyRank').text(data.rank + " points");
}); });
} }
}; };
$('#upvote').on('click', upvoteHandler);
var storySubmitButtonHandler = function storySubmitButtonHandler() { var storySubmitButtonHandler = function storySubmitButtonHandler() {
@@ -279,6 +277,12 @@ profileValidation.controller('doneWithFirst100HoursFormController', ['$scope',
} }
]); ]);
profileValidation.controller('submitStoryController', ['$scope',
function($scope) {
}
]);
profileValidation.directive('uniqueUsername',['$http',function($http) { profileValidation.directive('uniqueUsername',['$http',function($http) {
return { return {
restrict: 'A', restrict: 'A',

4
views/stories/show.jade
View File

@@ -27,9 +27,9 @@
h4= description h4= description
.negative-5 .negative-5
a#reply-to-main-post.btn.btn-no-shadow.btn-primary.btn-xs.btn-primary-ghost Reply a#reply-to-main-post.btn.btn-no-shadow.btn-primary.btn-xs.btn-primary-ghost Reply
|  ·  |  ·  
if !hasUserVoted if !hasUserVoted
a#upvote.btn.btn-no-shadow.btn-primary.btn-xs.btn-primary-ghost a#upvote.btn.btn-no-shadow.btn-primary.btn-xs.btn-primary-ghost Upvote
|  ·  |  · 
else else
a#upvote.btn.disabled.btn-no-shadow.btn-primary.btn-xs.btn-primary-ghost Upvoted! a#upvote.btn.disabled.btn-no-shadow.btn-primary.btn-xs.btn-primary-ghost Upvoted!

13
views/stories/submit-story.jade
View File

@@ -5,7 +5,7 @@
var storyTitle = !{JSON.stringify(storyTitle)}; var storyTitle = !{JSON.stringify(storyTitle)};
var storyImage = !{JSON.stringify(storyImage)}; var storyImage = !{JSON.stringify(storyImage)};
var storyMetaDescription = !{JSON.stringify(storyMetaDescription)}; var storyMetaDescription = !{JSON.stringify(storyMetaDescription)};
form.form-horizontal.control-label-story-submission#story-submission-form form.form-horizontal.control-label-story-submission#story-submission-form(name="submitStory")
.col-xs-12 .col-xs-12
.form-group .form-group
.col-xs-12.col-md-1 .col-xs-12.col-md-1
@@ -17,11 +17,16 @@
label.control-label.control-label-story-submission(for='name') Title label.control-label.control-label-story-submission(for='name') Title
.col-xs-12.col-md-11 .col-xs-12.col-md-11
input#story-title.form-control(placeholder='Type a headline for your link here', name='Title', maxlength='90' autofocus) input#story-title.form-control(placeholder='Type a headline for your link here', name='Title', maxlength='90' autofocus)
// input#story-title.form-control(placeholder='Type a headline for your link here', name='Title', maxlength='90' ng-model='submitStory.title.Title',required='required', autocomplete="off" autofocus)
//.col-xs-12.col-md-11.col-md-offset-1(ng-cloak, ng-show="submitStory.title.$error.required")
// alert(type='danger')
// span.ion-close-circled
// | A headline is required to submit.
.form-group .form-group
.col-xs-12.col-md-1 .col-xs-12.col-md-1
label.control-label.control-label-story-submission(for='name') Description label.control-label.control-label-story-submission(for='name') Comment
.col-xs-12.col-md-11 .col-xs-12.col-md-11
input#description-box.form-control(name="comment-box", placeholder="Start off the discussion with a description of your post" maxlength='140') input#description-box.form-control(name="comment-box", placeholder="Kick off the discussion with an optional comment about this link" maxlength='140')
.form-group .form-group
.col-xs-12.col-md-offset-1 .col-xs-12.col-md-offset-1
span.pull-left#textarea_feedback span.pull-left#textarea_feedback
@@ -38,7 +43,7 @@
.row .row
.form-group .form-group
button.btn.btn-big.btn-block.btn-primary#story-submit Submit button.btn.btn-big.btn-block.btn-primary#story-submit(type='submit', ng-disabled='submitStory.$invalid') Submit
script. script.
$('#story-url').val(storyURL).attr('disabled', 'disabled'); $('#story-url').val(storyURL).attr('disabled', 'disabled');
$('#story-title').val(storyTitle); $('#story-title').val(storyTitle);