Merge pull request #10 from brockpetrie/develop

Allow target date pattern in input, no longer strip argument quotes

package.json

@@ -1,6 +1,6 @@
 {
   "name": "vue-moment",
-  "version": "1.0.8",
+  "version": "2.0.0",
   "description": "Handy Moment.js filters for your Vue.js project",
   "main": "vue-moment.js",
   "scripts": {
@@ -16,6 +16,7 @@
     "date",
     "time",
     "filter",
+    "moment",
     "moment.js"
   ],
   "author": "brockpetrie",
@@ -26,5 +27,8 @@
   "homepage": "https://github.com/brockpetrie/vue-moment#readme",
   "dependencies": {
     "moment": "^2.11.1"
+  },
+  "peerDependencies": {
+    "vue": "^1.x.x"
   }
 }

readme.md

@@ -18,8 +18,19 @@ Simply set `moment` as the filtering function and you're good to go. At least on
 
 ```html
 <span>{{ someDate | moment "dddd, MMMM Do YYYY" }}</span>
+<!-- or create a new date from 'now' -->
+<span>{{ new Date() | moment "dddd, MMMM Do YYYY" }}</span>
 ```
 
+## Passing Your Date
+
+Moment.js expects your input to be either: a valid ISO 8601 formatted string (see <http://momentjs.com/docs/#/parsing/string/>), a valid `Date` object, or a date string with an accompanying format pattern (i.e. when you know the format of the date input). For the latter, `vue-moment` allows you to pass your date and format pattern(s) as an array, like such:
+
+```html
+<span>{{ [ someDate, "MM.DD.YY" ] | moment "dddd, MMMM Do YYYY" }}</span>
+<!-- or when you want to parse against more than one pattern -->
+<span>{{ [ someDate, ["MM.DD.YY", "MM-DD-YY", "MM-DD-YYYY"] ] | moment "dddd, MMMM Do YYYY" }}</span>
+```
 
 ## Filtering Methods
 
@@ -62,11 +73,11 @@ Display a moment in relative time, either from now or from a specified date.
 **With suffix hidden** (e.g. '4 days ago' -> '4 days')
 
 ```html
-<span>{{ someDate | moment "from" "now" "true" }}</span>
+<span>{{ someDate | moment "from" "now" true }}</span>
 <!-- or -->
-<span>{{ someDate | moment "from" "true" }}</span>
+<span>{{ someDate | moment "from" true }}</span>
 <!-- or with a reference time -->
-<span>{{ someDate | moment "from" "Jan. 11th, 2000" "true" }}</span>
+<span>{{ someDate | moment "from" "Jan. 11th, 2000" true }}</span>
 ```
 
 For more information about `moment#fromNow` and `moment#from`, check out <http://momentjs.com/docs/#/displaying/fromnow/> and <http://momentjs.com/docs/#/displaying/from/>.

vue-moment.js

@@ -20,14 +20,28 @@ module.exports = {
 
 		Vue.filter('moment', function() {
 			var args = Array.prototype.slice.call(arguments),
-				value = args.shift(),
-				date = moment(value);
+				input = args.shift(),
+				date;
+
+			if (Array.isArray(input) && typeof input[0] === 'string') {
+				// If input is array, assume we're being passed a format pattern to parse against.
+				// Format pattern will accept an array of potential formats to parse against.
+				// Date string should be at [0], format pattern(s) should be at [1]
+				date = moment(string = input[0], formats = input[1], true);
+			} else {
+				// Otherwise, throw the input at moment and see what happens...
+				date = moment(input);
+			}
 
-			if (!date.isValid()) return '';
+			if (!date.isValid()) {
+				// Log a warning if moment couldn't reconcile the input. Better than throwing an error?
+				console.warn('Could not build a valid `moment` object from input.');
+				return input;
+			}
 
 			function parse() {
-				var args = Array.prototype.slice.call(arguments).map(function(str) { return str.replace(/^("|')|("|')$/g, ''); }),
-					method = args.shift();
+				var args = Array.prototype.slice.call(arguments);
+				method = args.shift();
 
 				switch (method) {
 					case 'add':
@@ -76,7 +90,7 @@ module.exports = {
 						}
 
 						var removeSuffix = false;
-						if (args[0] == 'true') {
+						if (args[0] === true) {
 							args.shift();
 							var removeSuffix = true;
 						}