Customization & Optimization

Customization

to change the sidebar location from "right > left" or vise versa

add __stack-files-reverse class to the manager wrapping div

to change the breadcrumb bar location from "top > bottom" or vise versa

add __stack-reverse class to the manager wrapping div

Optimization

if you don't care about the animation for ( loading files / ajax call failed / no files found / no search items found )

• also if save-data mode is on we wont load it which saves you about 200kb or something

you can simply comment out this line

to keep the package as small as possible, the upload panel bg "patterns" folder now have only one image

other images are moved to patterns branch.

you can also download & add as many more as you want to your setup inside "resources/assets/vendor/MediaManager/dist/patterns" and the manager will pick them up.

when changing the storage disk

make sure to clear both local storage in the browser storage to avoid errors of previously visited folders which won't be available. "long pressing the manager refresh button does that for you"

when using the manager with a cloud storage

first we dont use the laravel default methods to collect the data and here is why instead the manager does its best to minimize the request time as much as possible,
however sometimes the request could take long which might lead to a timeout because of nginx/apache execution time "defaults to 30 seconds max", so to avoid that make sure to change the timeout value to something like 300 or more if your connection is slow.

text selection

hammerjs disable it by default but if you still need it, then find the part you need to change with <v-touch> tag & update it to

<v-touch :options="{cssProps: {userSelectString: true }} 

hammerjs event bubbling

the event propagation in hammerjs is a f*cken mess, so to get around the interference of the manager gestures and the outside world

• first create a helper method
  • btw you can instead turn the below into a global mixin

data() {
    return {
        stopHammerPropagateFired: false
    }
},
methods: {
    checkForHammerEvent() {
        return new Promise((resolve, reject) => {
            // check for event
            EventHub.listen('stopHammerPropagate', () => {
                this.stopHammerPropagateFired = true
                return resolve()
            })

            // fall back
            setTimeout(() => {
                if (!this.stopHammerPropagateFired) {
                    return reject()
                }
            }, 50)
        })
    }
}

• next inside the method you've bound to hammerjs or vue-touch add

return this.checkForHammerEvent().catch(() => {
   // do your thing
})

uploading large files gives error

dropzone by default allow files up to 256MB but also php have restrictions for uploaded file size which is 128MB so make sure to change it google