finishing post submit form refactoring

client/views/comments/comment_form.html

@@ -6,7 +6,7 @@
           <textarea id="comment" rows="3" autofocus="autofocus"></textarea>
         </div>
         <div class="comment-submit">
-          <input type="submit" class="button" value="{{_ "add_comment"}}" title="(⌘+enter)" />
+          <input type="submit" class="btn btn-primary" value="{{_ "add_comment"}}" title="(⌘+enter)" />
         </div>
       </form>
     </div>

client/views/forms/urlCustomType.html

@@ -1,3 +1,3 @@
-<template name="afBootstrapDatepicker">
+<template name="afBootstrapUrl">
   <input type="text" value="" {{atts}}/>
 </template>

client/views/forms/urlCustomType.js

@@ -0,0 +1,18 @@
+AutoForm.addInputType("bootstrap-url", {
+  template: "afBootstrapUrl",
+  valueOut: function () {
+    var url = this.val();
+    if(!!url)
+      return (url.substring(0, 7) == "http://" || url.substring(0, 8) == "https://") ? url : "http://"+url;
+  }
+});
+
+Template.afBootstrapUrl.helpers({
+  atts: function addFormControlAtts() {
+    var atts = _.clone(this.atts);
+    // Add bootstrap class
+    atts = AutoForm.Utility.addClass(atts, "form-control");
+    return atts;
+  }
+});
+

client/views/posts/post_submit.html

@@ -1,7 +1,7 @@
 <template name="post_submit">
 
   <div class="grid grid-module">
-    {{> quickForm collection="Posts" id="insertPostForm" type="insert" template="telescope" label-class="control-label" input-col-class="controls"}}
+    {{> quickForm collection="Posts" id="insertPostForm" template="telescope" label-class="control-label" input-col-class="controls"}}
   </div>
 
   <!-- <div class="grid submit">

client/views/posts/post_submit.js

@@ -1,43 +1,64 @@
 AutoForm.debug()
 AutoForm.hooks({
   insertPostForm: {
-    before: {
-      insert: function(doc, template) {
-        console.log(doc)
-      },
-      update: function(docId, modifier, template) {},
-      "methodName": function(doc, template) {}
-    },
-    after: {
-      insert: function(error, result, template) {
-        console.log(error)
-        console.log(result)
-      },
-      update: function(error, result, template) {},
-      "methodName": function(error, result, template) {}
-    },
-    // Called when form does not have a `type` attribute
     onSubmit: function(insertDoc, updateDoc, currentDoc) {
-      console.log(insertDoc)
-      console.log(updateDoc)
-      console.log(currentDoc)
-    },
 
-    // Called when any operation succeeds, where operation will be
+      var properties = insertDoc;
-    // "insert", "update", "submit", or the method name.
+      var submit = this;
-    onSuccess: function(operation, result, template) {
-      console.log(operation)
-      console.log(result)
-    }, 
 
-    // Called when any operation fails, where operation will be
+      // ------------------------------ Checks ------------------------------ //
-    // "validation", "insert", "update", "submit", or the method name.
+
-    onError: function(operation, error, template) {
+      if (!Meteor.user()) {
-      console.log(operation)
+        throwError(i18n.t('you_must_be_logged_in'));
-      console.log(error)
+        return false;
+      }
+
+      // ------------------------------ Callbacks ------------------------------ //
+
+      // run all post submit client callbacks on properties object successively
+      properties = postSubmitClientCallbacks.reduce(function(result, currentFunction) {
+          return currentFunction(result);
+      }, properties);
+
+      // console.log(properties)
+
+      // ------------------------------ Insert ------------------------------ //
+      if (properties) {
+        Meteor.call('post', properties, function(error, post) {
+          if(error){
+            submit.done(error);
+          }else{
+            // note: find a way to do this in onSuccess instead?
+            trackEvent("new post", {'postId': post._id});
+            if(post.status === STATUS_PENDING)
+              throwError('Thanks, your post is awaiting approval.');
+            Router.go('/posts/'+post._id);
+            submit.done();
+          }
+        });
+      }
+
+      return false
+    },
+
+    onSuccess: function(operation, result, template) {
+      // not used right now because I can't find a way to pass the "post" object to this callback
+      // console.log(post)
+      // trackEvent("new post", {'postId': post._id});
+      // if(post.status === STATUS_PENDING)
+      //   throwError('Thanks, your post is awaiting approval.');
+      // Router.go('/posts/'+post._id);
+    }, 
+
+    onError: function(operation, error, template) {
+      throwError(error.reason.split('|')[0]); // workaround because error.details returns undefined
+      clearSeenErrors();
+      // $(e.target).removeClass('disabled');
+      if (error.error == 603) {
+        var dupePostId = error.reason.split('|')[1];
+        Router.go('/posts/'+dupePostId);
+      }
     }
-    // formToDoc: function(doc, ss, formId) {},
-    // docToForm: function(doc, ss, formId) {},
 
     // Called at the beginning and end of submission, respectively.
     // This is the place to disable/enable buttons or the form,
@@ -91,7 +112,7 @@ AutoForm.hooks({
 
 // };
 
-// Template[getTemplate('post_submit')].events({
+Template[getTemplate('post_submit')].events({
   // 'change input[name=status]': function (e, i) {
   //   Session.set('currentPostStatus', e.currentTarget.value);
   // },
@@ -202,4 +223,4 @@ AutoForm.hooks({
   //   }
   // }
 
-// });
+});

collections/posts.js

@@ -27,6 +27,7 @@ postSchemaObject = {
   },    
   title: {
     type: String,
+    optional: false,
     label: "Title",
     editable: true,
     autoform: {
@@ -39,7 +40,8 @@ postSchemaObject = {
     optional: true,
     editable: true,
     autoform: {
-      editable: true
+      editable: true,
+      type: "bootstrap-url"
     }
   },
   body: {
@@ -164,6 +166,13 @@ postSchemaObject = {
       omit: true
     }
   },
+  author: {
+    type: String,
+    optional: true,
+    autoform: {
+      omit: true
+    }
+  },
   userId: {
     type: String, // XXX
     optional: true,
@@ -286,7 +295,8 @@ Meteor.methods({
 
       if(typeof postWithSameLink !== 'undefined'){
         Meteor.call('upvotePost', postWithSameLink);
-        throw new Meteor.Error(603, i18n.t('this_link_has_already_been_posted'), postWithSameLink._id);
+        // note: error.details returns undefined on the client, so add post ID to reason        
+        throw new Meteor.Error('603', i18n.t('this_link_has_already_been_posted') + '|' + postWithSameLink._id, postWithSameLink._id);
       }
     }
 

packages/telescope-datetimepicker/autoform-bs-datetimepicker.html

@@ -0,0 +1,3 @@
+<template name="afBootstrapDateTimePicker">
+  <input type="text" value="" {{atts}}/>
+</template>

packages/telescope-datetimepicker/autoform-bs-datetimepicker.js

@@ -1,5 +1,5 @@
 AutoForm.addInputType("bootstrap-datetimepicker", {
-  template: "afBootstrapDatepicker",
+  template: "afBootstrapDateTimePicker",
   valueOut: function () {
     // var val = this.datepicker('getUTCDate');
     if (!!this.data("DateTimePicker").getDate()) {
@@ -36,7 +36,7 @@ AutoForm.addInputType("bootstrap-datetimepicker", {
   }
 });
 
-Template.afBootstrapDatepicker.helpers({
+Template.afBootstrapDateTimePicker.helpers({
     atts: function addFormControlAtts() {
       var atts = _.clone(this.atts);
       // Add bootstrap class
@@ -45,7 +45,7 @@ Template.afBootstrapDatepicker.helpers({
     }
   });
 
-Template.afBootstrapDatepicker.rendered = function () {
+Template.afBootstrapDateTimePicker.rendered = function () {
   var $input = this.$('input');
   var data = this.data;
 
@@ -84,9 +84,9 @@ Template.afBootstrapDatepicker.rendered = function () {
 
 };
 
-Template.afBootstrapDatepicker.destroyed = function () {
+Template.afBootstrapDateTimePicker.destroyed = function () {
   // this.$('input').datepicker('remove');
-  this.data('DateTimePicker').destroy();
+  this.$('input').data('DateTimePicker').destroy();
 };
 
 function utcToLocal(utcDate) {

packages/telescope-datetimepicker/package.js

@@ -16,8 +16,8 @@ Package.onUse(function(api) {
 
   api.addFiles([
     'datetimepicker.scss',
-    'autoform-bs-datepicker.html',
+    'autoform-bs-datetimepicker.html',
-    'autoform-bs-datepicker.js',
+    'autoform-bs-datetimepicker.js',
     'bootstrap-collapse-transitions.js',
     'fonts/glyphicons-halflings-regular.eot',
     'fonts/glyphicons-halflings-regular.svg',