Prettier success messages
							parent
							
								
									338e73a8b2
								
							
						
					
					
						commit
						bb116fe5b0
					
				
							
								
								
									
										50
									
								
								api.go
								
								
								
								
							
							
						
						
									
										50
									
								
								api.go
								
								
								
								
							| 
						 | 
				
			
			@ -72,7 +72,7 @@ func serveAPI(c *requestContext, w http.ResponseWriter, r *http.Request) (int, e
 | 
			
		|||
	case "resource":
 | 
			
		||||
		return resourceHandler(c, w, r)
 | 
			
		||||
	case "users":
 | 
			
		||||
		if !c.us.Admin && !(r.URL.Path == "/self" && r.Method == http.MethodPut) {
 | 
			
		||||
		if !c.us.Admin && !((r.URL.Path == "/change-password" || r.URL.Path == "/change-css") && r.Method == http.MethodPut) {
 | 
			
		||||
			return http.StatusForbidden, nil
 | 
			
		||||
		}
 | 
			
		||||
 | 
			
		||||
| 
						 | 
				
			
			@ -503,7 +503,7 @@ func usersPutHandler(c *requestContext, w http.ResponseWriter, r *http.Request)
 | 
			
		|||
	sid = strings.TrimSuffix(sid, "/")
 | 
			
		||||
 | 
			
		||||
	id, err := strconv.Atoi(sid)
 | 
			
		||||
	if err != nil && sid != "self" {
 | 
			
		||||
	if err != nil && sid != "change-password" && sid != "change-css" {
 | 
			
		||||
		return http.StatusNotFound, err
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
| 
						 | 
				
			
			@ -520,33 +520,33 @@ func usersPutHandler(c *requestContext, w http.ResponseWriter, r *http.Request)
 | 
			
		|||
		return http.StatusBadRequest, errors.New("Invalid JSON")
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
	if sid == "self" {
 | 
			
		||||
		if u.Password != "" {
 | 
			
		||||
			pw, err := hashPassword(u.Password)
 | 
			
		||||
			if err != nil {
 | 
			
		||||
				return http.StatusInternalServerError, err
 | 
			
		||||
			}
 | 
			
		||||
 | 
			
		||||
			c.us.Password = pw
 | 
			
		||||
			err = c.fm.db.UpdateField(&User{ID: c.us.ID}, "Password", pw)
 | 
			
		||||
			if err != nil {
 | 
			
		||||
				return http.StatusInternalServerError, err
 | 
			
		||||
			}
 | 
			
		||||
 | 
			
		||||
			return http.StatusOK, nil
 | 
			
		||||
	if sid == "change-password" {
 | 
			
		||||
		if u.Password == "" {
 | 
			
		||||
			return http.StatusBadRequest, errors.New("Password cannot be empty")
 | 
			
		||||
		}
 | 
			
		||||
 | 
			
		||||
		if u.CSS != "" {
 | 
			
		||||
			c.us.CSS = u.CSS
 | 
			
		||||
			err = c.fm.db.UpdateField(&User{ID: c.us.ID}, "CSS", u.CSS)
 | 
			
		||||
			if err != nil {
 | 
			
		||||
				return http.StatusInternalServerError, err
 | 
			
		||||
			}
 | 
			
		||||
 | 
			
		||||
			return http.StatusOK, nil
 | 
			
		||||
		pw, err := hashPassword(u.Password)
 | 
			
		||||
		if err != nil {
 | 
			
		||||
			return http.StatusInternalServerError, err
 | 
			
		||||
		}
 | 
			
		||||
 | 
			
		||||
		return http.StatusBadRequest, errors.New("Password or CSS is missing")
 | 
			
		||||
		c.us.Password = pw
 | 
			
		||||
		err = c.fm.db.UpdateField(&User{ID: c.us.ID}, "Password", pw)
 | 
			
		||||
		if err != nil {
 | 
			
		||||
			return http.StatusInternalServerError, err
 | 
			
		||||
		}
 | 
			
		||||
 | 
			
		||||
		return http.StatusOK, nil
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
	if sid == "change-css" {
 | 
			
		||||
		c.us.CSS = u.CSS
 | 
			
		||||
		err = c.fm.db.UpdateField(&User{ID: c.us.ID}, "CSS", u.CSS)
 | 
			
		||||
		if err != nil {
 | 
			
		||||
			return http.StatusInternalServerError, err
 | 
			
		||||
		}
 | 
			
		||||
 | 
			
		||||
		return http.StatusOK, nil
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
	// The username and the filesystem cannot be empty.
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -66,10 +66,6 @@ export default {
 | 
			
		|||
  watch: {
 | 
			
		||||
    '$route': 'fetchData',
 | 
			
		||||
    'reload': function () {
 | 
			
		||||
      this.$store.commit('setReload', false)
 | 
			
		||||
      this.$store.commit('resetSelected')
 | 
			
		||||
      this.$store.commit('multiple', false)
 | 
			
		||||
      this.$store.commit('closeHovers')
 | 
			
		||||
      this.fetchData()
 | 
			
		||||
    }
 | 
			
		||||
  },
 | 
			
		||||
| 
						 | 
				
			
			@ -82,6 +78,12 @@ export default {
 | 
			
		|||
  methods: {
 | 
			
		||||
    ...mapMutations([ 'setLoading' ]),
 | 
			
		||||
    fetchData () {
 | 
			
		||||
      // Reset view information.
 | 
			
		||||
      this.$store.commit('setReload', false)
 | 
			
		||||
      this.$store.commit('resetSelected')
 | 
			
		||||
      this.$store.commit('multiple', false)
 | 
			
		||||
      this.$store.commit('closeHovers')
 | 
			
		||||
 | 
			
		||||
      // Set loading to true and reset the error.
 | 
			
		||||
      this.setLoading(true)
 | 
			
		||||
      this.error = null
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -3,7 +3,7 @@
 | 
			
		|||
    <site-header></site-header>
 | 
			
		||||
    <sidebar></sidebar>
 | 
			
		||||
    <main>
 | 
			
		||||
      <router-view></router-view>
 | 
			
		||||
      <router-view v-on:css-updated="updateCSS"></router-view>
 | 
			
		||||
    </main>
 | 
			
		||||
    <prompts></prompts>
 | 
			
		||||
  </div>
 | 
			
		||||
| 
						 | 
				
			
			@ -23,12 +23,23 @@ export default {
 | 
			
		|||
    SiteHeader,
 | 
			
		||||
    Prompts
 | 
			
		||||
  },
 | 
			
		||||
  watch: {
 | 
			
		||||
    '$route': function () {
 | 
			
		||||
      // Reset selected items and multiple selection.
 | 
			
		||||
      this.$store.commit('resetSelected')
 | 
			
		||||
      this.$store.commit('multiple', false)
 | 
			
		||||
      this.$store.commit('closeHovers')
 | 
			
		||||
  mounted () {
 | 
			
		||||
    this.updateCSS()
 | 
			
		||||
  },
 | 
			
		||||
  methods: {
 | 
			
		||||
    updateCSS () {
 | 
			
		||||
      let css = this.$store.state.user.css
 | 
			
		||||
 | 
			
		||||
      let style = document.querySelector('style[title="user-css"]')
 | 
			
		||||
      if (style !== undefined && style !== null) {
 | 
			
		||||
        style.parentElement.removeChild(style)
 | 
			
		||||
      }
 | 
			
		||||
 | 
			
		||||
      style = document.createElement('style')
 | 
			
		||||
      style.title = 'user-css'
 | 
			
		||||
      style.type = 'text/css'
 | 
			
		||||
      style.appendChild(document.createTextNode(css))
 | 
			
		||||
      document.head.appendChild(style)
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -20,7 +20,7 @@
 | 
			
		|||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
import { mapState } from 'vuex'
 | 
			
		||||
import { mapState, mapMutations } from 'vuex'
 | 
			
		||||
import api from '@/utils/api'
 | 
			
		||||
 | 
			
		||||
export default {
 | 
			
		||||
| 
						 | 
				
			
			@ -50,6 +50,7 @@ export default {
 | 
			
		|||
    this.css = this.user.css
 | 
			
		||||
  },
 | 
			
		||||
  methods: {
 | 
			
		||||
    ...mapMutations([ 'showSuccess' ]),
 | 
			
		||||
    changePassword (event) {
 | 
			
		||||
      event.preventDefault()
 | 
			
		||||
 | 
			
		||||
| 
						 | 
				
			
			@ -58,8 +59,7 @@ export default {
 | 
			
		|||
      }
 | 
			
		||||
 | 
			
		||||
      api.updatePassword(this.password).then(() => {
 | 
			
		||||
        console.log('Success')
 | 
			
		||||
        // TODO: show success
 | 
			
		||||
        this.showSuccess('Password updated!')
 | 
			
		||||
      }).catch(e => {
 | 
			
		||||
        this.$store.commit('showError', e)
 | 
			
		||||
      })
 | 
			
		||||
| 
						 | 
				
			
			@ -68,8 +68,9 @@ export default {
 | 
			
		|||
      event.preventDefault()
 | 
			
		||||
 | 
			
		||||
      api.updateCSS(this.css).then(() => {
 | 
			
		||||
        console.log('Success')
 | 
			
		||||
        // TODO: show success
 | 
			
		||||
        this.$store.commit('setUserCSS', this.css)
 | 
			
		||||
        this.$emit('css-updated')
 | 
			
		||||
        this.showSuccess('Styles updated!')
 | 
			
		||||
      }).catch(e => {
 | 
			
		||||
        this.$store.commit('showError', e)
 | 
			
		||||
      })
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -90,7 +90,10 @@ export default {
 | 
			
		|||
  },
 | 
			
		||||
  methods: {
 | 
			
		||||
    fetchData () {
 | 
			
		||||
      if (this.$route.path === '/users/new') return
 | 
			
		||||
      if (this.$route.path === '/users/new') {
 | 
			
		||||
        this.reset()
 | 
			
		||||
        return
 | 
			
		||||
      }
 | 
			
		||||
 | 
			
		||||
      api.getUser(this.$route.params[0]).then(user => {
 | 
			
		||||
        this.id = user.ID
 | 
			
		||||
| 
						 | 
				
			
			@ -125,6 +128,19 @@ export default {
 | 
			
		|||
        this.$router.push({ path: '/users/new' })
 | 
			
		||||
      })
 | 
			
		||||
    },
 | 
			
		||||
    reset () {
 | 
			
		||||
      this.id = 0
 | 
			
		||||
      this.admin = false
 | 
			
		||||
      this.allowNew = false
 | 
			
		||||
      this.allowEdit = false
 | 
			
		||||
      this.allowCommands = false
 | 
			
		||||
      this.password = ''
 | 
			
		||||
      this.username = ''
 | 
			
		||||
      this.filesystem = ''
 | 
			
		||||
      this.rules = ''
 | 
			
		||||
      this.css = ''
 | 
			
		||||
      this.commands = ''
 | 
			
		||||
    },
 | 
			
		||||
    save (event) {
 | 
			
		||||
      event.preventDefault()
 | 
			
		||||
      let user = this.parseForm()
 | 
			
		||||
| 
						 | 
				
			
			@ -132,6 +148,7 @@ export default {
 | 
			
		|||
      if (this.$route.path === '/users/new') {
 | 
			
		||||
        api.newUser(user).then(location => {
 | 
			
		||||
          this.$router.push({ path: location })
 | 
			
		||||
          this.$store.commit('showSuccess', 'User created!')
 | 
			
		||||
        }).catch(e => {
 | 
			
		||||
          this.$store.commit('showError', e)
 | 
			
		||||
        })
 | 
			
		||||
| 
						 | 
				
			
			@ -140,7 +157,7 @@ export default {
 | 
			
		|||
      }
 | 
			
		||||
 | 
			
		||||
      api.updateUser(user).then(location => {
 | 
			
		||||
        this.$router.push({ path: location })
 | 
			
		||||
        this.$store.commit('showSuccess', 'User updated!')
 | 
			
		||||
      }).catch(e => {
 | 
			
		||||
        this.$store.commit('showError', e)
 | 
			
		||||
      })
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -9,6 +9,7 @@
 | 
			
		|||
    <info v-else-if="showInfo"></info>
 | 
			
		||||
    <move v-else-if="showMove"></move>
 | 
			
		||||
    <error v-else-if="showError"></error>
 | 
			
		||||
    <success v-else-if="showSuccess"></success>
 | 
			
		||||
 | 
			
		||||
    <div v-show="showOverlay" @click="resetPrompts" class="overlay"></div>
 | 
			
		||||
  </div>
 | 
			
		||||
| 
						 | 
				
			
			@ -22,6 +23,7 @@ import Rename from './Rename'
 | 
			
		|||
import Download from './Download'
 | 
			
		||||
import Move from './Move'
 | 
			
		||||
import Error from './Error'
 | 
			
		||||
import Success from './Success'
 | 
			
		||||
import NewFile from './NewFile'
 | 
			
		||||
import NewDir from './NewDir'
 | 
			
		||||
import { mapState } from 'vuex'
 | 
			
		||||
| 
						 | 
				
			
			@ -34,6 +36,7 @@ export default {
 | 
			
		|||
    Rename,
 | 
			
		||||
    Error,
 | 
			
		||||
    Download,
 | 
			
		||||
    Success,
 | 
			
		||||
    Move,
 | 
			
		||||
    NewFile,
 | 
			
		||||
    NewDir,
 | 
			
		||||
| 
						 | 
				
			
			@ -42,6 +45,7 @@ export default {
 | 
			
		|||
  computed: {
 | 
			
		||||
    ...mapState(['show']),
 | 
			
		||||
    showError: function () { return this.show === 'error' },
 | 
			
		||||
    showSuccess: function () { return this.show === 'success' },
 | 
			
		||||
    showInfo: function () { return this.show === 'info' },
 | 
			
		||||
    showHelp: function () { return this.show === 'help' },
 | 
			
		||||
    showDelete: function () { return this.show === 'delete' },
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -0,0 +1,20 @@
 | 
			
		|||
<template>
 | 
			
		||||
  <div class="prompt success">
 | 
			
		||||
    <i class="material-icons">done</i>
 | 
			
		||||
    <h3>{{ $store.state.showMessage }}</h3>
 | 
			
		||||
    <div>
 | 
			
		||||
      <button @click="close" autofocus>OK</button>
 | 
			
		||||
    </div>
 | 
			
		||||
  </div>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
export default {
 | 
			
		||||
  name: 'success',
 | 
			
		||||
  methods: {
 | 
			
		||||
    close () {
 | 
			
		||||
      this.$store.commit('closeHovers')
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
</script>
 | 
			
		||||
| 
						 | 
				
			
			@ -64,6 +64,7 @@
 | 
			
		|||
  background-color: #e9eaeb;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.prompt.success i,
 | 
			
		||||
.prompt.error i {
 | 
			
		||||
  color: #F44336;
 | 
			
		||||
  display: block;
 | 
			
		||||
| 
						 | 
				
			
			@ -72,6 +73,7 @@
 | 
			
		|||
  font-size: 5em;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.prompt.success h3,
 | 
			
		||||
.prompt.error h3 {
 | 
			
		||||
  text-align: center;
 | 
			
		||||
}
 | 
			
		||||
| 
						 | 
				
			
			@ -80,6 +82,14 @@
 | 
			
		|||
  background-color: #F44336
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.prompt.success i {
 | 
			
		||||
  color: #8BC34A;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.prompt.success button {
 | 
			
		||||
  background-color: #8BC34A;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
/* * * * * * * * * * * * * * * *
 | 
			
		||||
 *        PROMPT - MOVE        *
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -14,17 +14,16 @@ const mutations = {
 | 
			
		|||
  },
 | 
			
		||||
  showError: (state, value) => {
 | 
			
		||||
    state.show = 'error'
 | 
			
		||||
 | 
			
		||||
    if (typeof value !== 'object') {
 | 
			
		||||
      state.showMessage = value
 | 
			
		||||
      return
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    state.showMessage = value.message
 | 
			
		||||
    state.showMessage = value
 | 
			
		||||
  },
 | 
			
		||||
  showSuccess: (state, value) => {
 | 
			
		||||
    state.show = 'success'
 | 
			
		||||
    state.showMessage = value
 | 
			
		||||
  },
 | 
			
		||||
  setLoading: (state, value) => { state.loading = value },
 | 
			
		||||
  setReload: (state, value) => { state.reload = value },
 | 
			
		||||
  setUser: (state, value) => (state.user = value),
 | 
			
		||||
  setUserCSS: (state, value) => (state.user.css = value),
 | 
			
		||||
  setJWT: (state, value) => (state.jwt = value),
 | 
			
		||||
  multiple: (state, value) => (state.multiple = value),
 | 
			
		||||
  addSelected: (state, value) => (state.selected.push(value)),
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -277,7 +277,7 @@ function updateUser (user) {
 | 
			
		|||
function updatePassword (password) {
 | 
			
		||||
  return new Promise((resolve, reject) => {
 | 
			
		||||
    let request = new window.XMLHttpRequest()
 | 
			
		||||
    request.open('PUT', `${store.state.baseURL}/api/users/self`, true)
 | 
			
		||||
    request.open('PUT', `${store.state.baseURL}/api/users/change-password`, true)
 | 
			
		||||
    request.setRequestHeader('Authorization', `Bearer ${store.state.jwt}`)
 | 
			
		||||
 | 
			
		||||
    request.onload = () => {
 | 
			
		||||
| 
						 | 
				
			
			@ -298,7 +298,7 @@ function updatePassword (password) {
 | 
			
		|||
function updateCSS (css) {
 | 
			
		||||
  return new Promise((resolve, reject) => {
 | 
			
		||||
    let request = new window.XMLHttpRequest()
 | 
			
		||||
    request.open('PUT', `${store.state.baseURL}/api/users/self`, true)
 | 
			
		||||
    request.open('PUT', `${store.state.baseURL}/api/users/change-css`, true)
 | 
			
		||||
    request.setRequestHeader('Authorization', `Bearer ${store.state.jwt}`)
 | 
			
		||||
 | 
			
		||||
    request.onload = () => {
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Loading…
	
		Reference in New Issue