Now listing existing bundles

app/Http/Controllers/UploadController.php

@@ -166,7 +166,7 @@ class UploadController extends Controller
 		$metadata = Upload::getMetadata($bundleId);
 
 		// Forcing file to expire
-		$metadata['expires_at'] = time() - 1000;
+		$metadata['expires_at'] = time() - (3600 * 24 * 30);
 
 		// Rewriting the metadata file
 		try {

lang/en/app.php

@@ -8,7 +8,7 @@ return [
 	'warning-bundle-expired'	=> 'Bundle has expired',
 	'download-all'	=> 'Download all',
 	'for'	=> 'for',
-	'files'	=> 'file|files',
+	'files'	=> 'file(s)',
 	'no-file-in-this-bundle' => 'No file into this bundle',
 	'maximum-filesize'	=> 'Max filesize :',
 	'preview-link'	=> 'Preview link',
@@ -70,6 +70,12 @@ return [
 	'files-remaining-files' => 'Number of remaining files allowed',
 	'delete-bundle'	=> 'Delete bundle',
 	'confirm-delete-bundle' => 'Do you really want to delete this bundle?',
-	'bundle-expired'	=> 'This bundle has expired'
+	'bundle-expired'	=> 'This bundle has expired',
+	'active'	=> 'Active',
+	'expired'	=> 'Expired',
+	'existing-bundles' => 'Your existing bundles',
+	'or-create'	=> 'New bundle',
+	'no-existing-bundle' => 'No existing bundle'
+
 
 ];

lang/fr/app.php

@@ -8,7 +8,7 @@ return [
 	'warning-bundle-expired'	=> 'L\'archive a expiré',
 	'download-all'	=> 'Tout télécharger',
 	'for'	=> 'pour',
-	'files'	=> 'fichier|fichiers',
+	'files'	=> 'fichier(s)',
 	'no-file-in-this-bundle' => 'Aucun fichier dans cette archive',
 	'maximum-filesize'	=> 'Taille maximum :',
 	'preview-link'	=> 'Lien de visualisation',
@@ -70,6 +70,12 @@ return [
 	'files-remaining-files' => 'Nombre de fichiers restants autorisés',
 	'delete-bundle'	=> 'Supprimer l\'archive',
 	'confirm-delete-bundle' => 'Voulez-vous supprimer cette archive ?',
-	'bundle-expired'	=> 'Cette archive a expiré'
+	'bundle-expired'	=> 'Cette archive a expiré',
+	'active'	=> 'Actifs',
+	'expired'	=> 'Expirés',
+	'existing-bundles' => 'Vos archives existantes',
+	'or-create'	=> 'Nouvelle archive',
+	'no-existing-bundle' => 'Aucune archive existante'
+
 
 ];

resources/views/homepage.blade.php

@@ -6,16 +6,39 @@
 	document.addEventListener('alpine:init', () => {
 		Alpine.data('bundle', () => ({
 			bundles: null,
+			currentBundle: null,
 
 			init: function() {
+				// Getting bundles stored locally
 				bundles = localStorage.getItem('bundles');
+				// And JSON decoding it
+				this.bundles = JSON.parse(bundles)
 
-				if (bundles == null || bundles == '') {
+				if (this.bundles != null && Object.keys(this.bundles).length > 0) {
-					console.log('creating bundles')
+					this.bundles.active = []
-					this.bundles = []
+					this.bundles.expired = []
+
+					this.bundles.forEach( (bundle) => {
+						if (bundle.title == null || bundle.title == '') {
+							bundle.title = 'untitled'
+						}
+
+						bundle.title += ' - '+Object.keys(bundle.files).length+' {{ __('app.files') }} - {{ __('app.created-at') }} '+moment.unix(bundle.created_at).fromNow()
+
+						if (bundle.expires_at != null && moment.unix(bundle.expires_at).isBefore(moment())) {
+							this.bundles.expired.push(bundle)
+						}
+						else {
+							this.bundles.active.push(bundle)
+						}
+					})
+
+					console.log(this.bundles)
 				}
-				else {
+
-					this.bundles = JSON.parse(bundles)
+				// If bundle is empty, initializing it
+				if (this.bundles == null || this.bundles == '') {
+					this.bundles = []
 				}
 			},
 
@@ -23,9 +46,10 @@
 				// Generating a new bundle key pair
 				const pair = {
 					bundle_id: this.generateStr(30),
-					owner_token: this.generateStr(15)
+					owner_token: this.generateStr(15),
+					created_at: moment().unix()
 				}
-				this.bundles.push(pair)
+				this.bundles.unshift(pair)
 
 				// Storing them locally
 				localStorage.setItem('bundles', JSON.stringify(this.bundles))
@@ -56,7 +80,21 @@
 				}
 
 				return result;
-			}
+			},
+
+			redirectToBundle: function() {
+				if (this.currentBundle != null) {
+					window.location.href = '/upload/'+this.currentBundle
+				}
+			},
+
+			isBundleExpired: function() {
+				if (this.metadata.expires_at == null || this.metadata.expires_at == '') {
+					return false;
+				}
+
+				return moment.unix(this.metadata.expires_at).isBefore(moment())
+			},
 		}))
 	})
 </script>
@@ -67,15 +105,48 @@
 		<div class="relative bg-white border border-primary rounded-lg overflow-hidden">
 			<div class="bg-gradient-to-r from-primary-light to-primary px-2 py-4 text-center">
 				<h1 class="relative font-title font-medium font-body text-4xl text-center text-white uppercase flex items-center">
-
 					<div class="grow text-center">{{ config('app.name') }}</div>
 				</h1>
 			</div>
 
-			<div class="my-10 text-center text-base font-title uppercase text-primary">
+			<div class="p-5">
-				<a x-on:click="newBundle()" class="cursor-pointer border px-5 py-3 border-primary rounded hover:bg-primary hover:text-white text-primary">
+				<h2 class="font-title text-2xl mb-5 text-primary font-medium uppercase">@lang('app.existing-bundles')</h2>
-					@lang('app.create-new-upload')
+
-				</a>
+				<span x-show="bundles == null || Object.keys(bundles).length == 0">@lang('app.no-existing-bundle')</span>
+				<select
+					class="w-full py-4 text-slate-700 bg-transparent h-8 p-0 py-1 border-b border-primary-superlight focus:ring-0 invalid:border-b-red-500 invalid:bg-red-50"
+					name="expiry"
+					id="upload-expiry"
+					x-model="currentBundle"
+					x-on:change="redirectToBundle()"
+					x-show="bundles != null && Object.keys(bundles).length > 0"
+				>
+					<option>-</option>
+
+					<template x-if="Object.keys(bundles.active).length > 0">
+						<optgroup label="{{ __('app.active') }}">
+							<template x-for="bundle in bundles.active">
+								<option :value="bundle.bundle_id" x-text="bundle.title"></option>
+							</template>
+						</optgroup>
+					</template>
+
+					<template x-if="Object.keys(bundles.expired).length > 0">
+						<optgroup label="{{ __('app.expired') }}">
+							<template x-for="bundle in bundles.expired">
+								<option :value="bundle.bundle_id" x-text="bundle.title"></option>
+							</template>
+						</optgroup>
+					</template>
+				</select>
+
+				<h2 class="mt-10 font-title text-2xl mb-5 text-primary font-medium uppercase">@lang('app.or-create')</h2>
+
+				<div class="my-8 text-center text-base font-title uppercase text-primary">
+					<a x-on:click="newBundle()" class="cursor-pointer border px-5 py-3 border-primary rounded hover:bg-primary hover:text-white text-primary">
+						@lang('app.create-new-upload')
+					</a>
+				</div>
 			</div>
 		</div>
 	</div>

resources/views/upload.blade.php

@@ -10,12 +10,14 @@
 	document.addEventListener('alpine:init', () => {
 		Alpine.data('upload', () => ({
 			bundle: null,
+			bundleIndex: null,
 			bundles: null,
 			dropzone: null,
 			uploadedFiles: [],
 			metadata: [],
 			completed: false,
 			step: 0,
+			maxFiles: maxFiles,
 			modal: {
 				show: false,
 				text: 'test'
@@ -54,33 +56,38 @@
 						this.step = 1
 					}
 				}
-
 			},
 
 			getBundle: function() {
 				// Getting all bundles store in local storage
 				bundles = localStorage.getItem('bundles')
+
 				// If not bundle found, back to homepage
 				if (bundles == null || bundles == '') {
 					window.location.href = '/'
 					return false
 				}
+
 				this.bundles = JSON.parse(bundles)
 
 				// Looking for the current bundle
-				this.bundles.forEach(element => {
+				if (this.bundles != null && Object.keys(this.bundles).length > 0) {
-					if (element.bundle_id == this.metadata.bundle_id) {
+					this.bundles.forEach( (element, index) => {
-						this.bundle = element
+						if (element.bundle_id == this.metadata.bundle_id) {
-					}
+							//this.bundle = Object.assign(element)
-				})
+							//this.bundleIndex = index
+							this.bundle = index
+						}
+					})
+				}
 
 				// If current bundle not found, aborting
-				if (this.bundle == null || this.bundle == '') {
+				if (this.bundle == null) {
 					window.location.href = '/'
 					return false
 				}
 
-				if (this.bundle.owner_token != this.metadata.owner_token) {
+				if (this.bundles[this.bundle].owner_token != this.metadata.owner_token) {
 					window.location.href = '/'
 					return false
 				}
@@ -124,11 +131,11 @@
 						description: this.metadata.description,
 						max_downloads: this.metadata.max_downloads,
 						password: this.metadata.password,
-						auth: this.bundle.owner_token
+						auth: this.bundles[this.bundle].owner_token
 					}
 				})
 				.then( (response) => {
-					this.metadata = response.data
+					this.syncData(response.data)
 					window.history.pushState(null, null, baseUrl+'/upload/'+this.metadata.bundle_id);
 					this.step = 2
 
@@ -149,13 +156,13 @@
 						url: '/upload/'+this.metadata.bundle_id+'/complete',
 						method: 'POST',
 						data: {
-							auth: this.bundle.owner_token
+							auth: this.bundles[this.bundle].owner_token
 						}
 
 					})
 					.then( (response) => {
 						this.step = 3
-						this.metadata = response.data
+						this.syncData(response.data)
 					})
 					.catch( (error) => {
 						// TODO: do something here
@@ -171,13 +178,13 @@
 
 			startDropzone: function() {
 				if (! this.dropzone) {
-					maxFiles = maxFiles - this.countFilesOnServer() >= 0 ? maxFiles - this.countFilesOnServer() : 0
+					this.maxFiles = this.maxFiles - this.countFilesOnServer() >= 0 ? this.maxFiles - this.countFilesOnServer() : 0
 
 					this.dropzone = new Dropzone('#upload-frm', {
 						url: '/upload/'+this.metadata.bundle_id+'/file',
 						method: 'POST',
 						headers: {
-							'X-Upload-Auth': this.bundle.owner_token
+							'X-Upload-Auth': this.bundles[this.bundle].owner_token
 						},
 						createImageThumbnails: false,
 						disablePreviews: true,
@@ -190,12 +197,10 @@
 						dictFileTooBig: '@lang('app.file-too-big')',
 						dictDefaultMessage: '@lang('app.dropzone-text')',
 						dictResponseError: '@lang('app.server-answered')',
-						// init: function()  {
-						// 	this.options.maxFiles = this.options.maxFiles - currentFilesCount
-						// }
 					})
 
 					this.dropzone.on("addedfile", (file) => {
+						console.log('added file')
 						this.metadata.files.push({
 							uuid: file.upload.uuid,
 							original: file.name,
@@ -226,6 +231,7 @@
 						this.metadata.files[fileIndex].progress = 0
 
 						if (file.status == 'success') {
+							this.maxFiles--
 							this.metadata.files[fileIndex].status = true
 						}
 					})
@@ -260,11 +266,11 @@
 							method: 'DELETE',
 							data: {
 								file: lfile.uuid,
-								auth: this.bundle.owner_token
+								auth: this.bundles[this.bundle].owner_token
 							}
 						})
 						.then( (response) => {
-							this.metadata = response.data
+							this.syncData(response.data)
 						})
 						.catch( (error) => {
 							// TODO: do something here
@@ -282,6 +288,14 @@
 				}
 			},
 
+			syncData: function(metadata) {
+				if (Object.keys(metadata).length > 0) {
+					this.metadata = metadata
+					this.bundles[this.bundle] = metadata
+					localStorage.setItem('bundles', JSON.stringify(this.bundles))
+				}
+			},
+
 			humanSize: function(val) {
 				if (val >= 100000000) {
 					return (val / 1000000000).toFixed(1) + ' Go'
@@ -345,12 +359,12 @@
 						url: '/upload/'+this.metadata.bundle_id+'/delete',
 						method: 'DELETE',
 						data: {
-							auth: this.bundle.owner_token
+							auth: this.bundles[this.bundle].owner_token
 						}
 					})
 					.then( (response) => {
 						if (! response.data.success) {
-							this.metadata = response.data
+							this.syncData(response.data)
 						}
 					})
 				})