Initial Spark Install

spark/resources/assets/js/settings/profile/update-contact-information.js

@@ -0,0 +1,37 @@
+module.exports = {
+    props: ['user'],
+
+    /**
+     * The component's data.
+     */
+    data() {
+        return {
+            form: $.extend(true, new SparkForm({
+                name: '',
+                email: ''
+            }), Spark.forms.updateContactInformation)
+        };
+    },
+
+
+    /**
+     * Bootstrap the component.
+     */
+    mounted() {
+        this.form.name = this.user.name;
+        this.form.email = this.user.email;
+    },
+
+
+    methods: {
+        /**
+         * Update the user's contact information.
+         */
+        update() {
+            Spark.put('/settings/contact', this.form)
+                .then(() => {
+                    Bus.$emit('updateUser');
+                });
+        }
+    }
+};

spark/resources/assets/js/settings/profile/update-profile-photo.js

@@ -0,0 +1,67 @@
+module.exports = {
+    props: ['user'],
+
+    /**
+     * The component's data.
+     */
+    data() {
+        return {
+            form: new SparkForm({})
+        };
+    },
+
+
+    methods: {
+        /**
+         * Update the user's profile photo.
+         */
+        update(e) {
+            e.preventDefault();
+
+            if ( ! this.$refs.photo.files.length) {
+                return;
+            }
+
+            var self = this;
+
+            this.form.startProcessing();
+
+            // We need to gather a fresh FormData instance with the profile photo appended to
+            // the data so we can POST it up to the server. This will allow us to do async
+            // uploads of the profile photos. We will update the user after this action.
+            axios.post('/settings/photo', this.gatherFormData())
+                .then(
+                    () => {
+                        Bus.$emit('updateUser');
+
+                        self.form.finishProcessing();
+                    },
+                    (error) => {
+                        self.form.setErrors(error.response.data.errors);
+                    }
+                );
+        },
+
+
+        /**
+         * Gather the form data for the photo upload.
+         */
+        gatherFormData() {
+            const data = new FormData();
+
+            data.append('photo', this.$refs.photo.files[0]);
+
+            return data;
+        }
+    },
+
+
+    computed: {
+        /**
+         * Calculate the style attribute for the photo preview.
+         */
+        previewStyle() {
+            return `background-image: url(${this.user.photo_url})`;
+        }
+    }
+};