q-sort index customisation + code optimization

* now you can show or not the index during interview
* added column properties to token

app/Token.php

@@ -15,7 +15,7 @@ class Token extends Model
      * @var array
      */
     protected $fillable = [
-        'name', 'image_path', 'author',
+        'name', 'image_path', 'author','properties'
     ];
 
     /**
@@ -51,7 +51,7 @@ class Token extends Model
             // save only preset path
             $token = new self;
             $token->name = $tokenToSave['name'];
-            $token->image_path = isset($tokenToSave['file']) ? $tokenToSave['file']['dirname'] : $tokenToSave['image_path'];
+            $token->image_path = isset($tokenToSave['file']) ? $tokenToSave['file'] : $tokenToSave['image_path'];
             if ($isInterview) $token->author = 0;
             else $token->author = Auth::user()->id;
             $token->save();
@@ -76,8 +76,9 @@ class Token extends Model
     private static function SaveNewToken($tokenToSave, $study, $isInterview, &$token): void
     {
         // create new token
-        if (isset($tokenToSave['base64']) || isset($tokenToSave['file'])) {
-            $image = isset($tokenToSave['file']) && $tokenToSave['file'] != [] ? $tokenToSave['file']['base64'] : $tokenToSave['base64'];
+        $thereIsImageToUpload = isset($tokenToSave['base64']) || isset($tokenToSave['fileUpload']);
+        if ($thereIsImageToUpload) {
+            $image = isset($tokenToSave['fileUpload']) && $tokenToSave['fileUpload'] != [] ? $tokenToSave['fileUpload']['base64'] : $tokenToSave['base64'];
         } else {
             $image = config('utilities.sortingBasicIcon');
         }
@@ -89,6 +90,10 @@ class Token extends Model
         self::saveImage($image, $studyPath, $name, $base64FirstPart, $study, $tokenToSave, $token);
         if ($isInterview) $token->author = 0;
         else $token->author = Auth::user()->id;
+
+        if(!empty($tokenToSave['properties']))$token->properties = $tokenToSave['properties'];
+
+
     }
 
     /**

database/migrations/2020_12_14_164017_add_properties_to_token_table.php

+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+class AddPropertiesToTokenTable extends Migration
+{
+    /**
+     * Run the migrations.
+     *
+     * @return void
+     */
+    public function up()
+    {
+        Schema::table('tokens', function (Blueprint $table) {
+            $table->text('properties')->nullable();
+
+        });
+    }
+
+    /**
+     * Reverse the migrations.
+     *
+     * @return void
+     */
+    public function down()
+    {
+        Schema::table('tokens', function (Blueprint $table) {
+            //
+        });
+    }
+}

package-lock.json

@@ -15074,9 +15074,9 @@
             }
         },
         "tailwindcss": {
-            "version": "1.9.2",
-            "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-1.9.2.tgz",
-            "integrity": "sha512-D3uKSZZkh4GaKiZWmPEfNrqEmEuYdwaqXOQ7trYSQQFI5laSD9+b2FUUj5g39nk5R1omKp5tBW9wZsfJq+KIVA==",
+            "version": "1.9.6",
+            "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-1.9.6.tgz",
+            "integrity": "sha512-nY8WYM/RLPqGsPEGEV2z63riyQPcHYZUJpAwdyBzVpxQHOHqHE+F/fvbCeXhdF1+TA5l72vSkZrtYCB9hRcwkQ==",
             "requires": {
                 "@fullhuman/postcss-purgecss": "^2.1.2",
                 "autoprefixer": "^9.4.5",

package.json

@@ -47,7 +47,7 @@
         "moment": "^2.29.1",
         "node-sass": "^4.14.1",
         "npm": "^6.14.8",
-        "tailwindcss": "^1.9.2",
+        "tailwindcss": "^1.9.6",
         "vue-material-design-icons": "^4.9.0",
         "vue-select": "^3.10.8",
         "vue-template-compiler": "^2.6.12",

resources/views/errors/503.blade.php

@@ -2,4 +2,4 @@
 
 @section('title', __('Service Unavailable'))
 @section('code', '503')
-@section('message', __($exception->getMessage() ?: 'The app is being updated, come back soon!'))
+@section('message', 'The app is being updated, come back soon!'))

resources/views/interview/testingqsort.blade.php

@@ -2,10 +2,126 @@
 
 @section('content')
 
-    <div class="q-sort w-full">
-            @for($i = 0; $i < 1000; $i++)
-                <div class="border border-solid ">{{$i}}</div>
-            @endfor
-        </div>
+    <?php
+    // in case of equal names, insert something at the beginning
+    // then strip it before printing it.
+    $arrayWithValues = array(
+        "worse" => ["", "bbb", "bbb", "bbb", "bbb"],
+        "&noprint" => ["", "bbb", "bbb", "bbb", "bbb", "bbb"],
+        "&&noprint" => ["", "bbb", "bbb", "bbb", "bbb", "bbb", "bbb"],
+        "&&&noprint" => ["", "bbb", "ccc", "bbb", "bbb", "bbb", "bbb", "bbb"],
+        "&&&&noprint" => ["", "bbb", "ccc", "ddd", "eee", "bbb", "bbb", "bbb", "bbb"],
+        "&&&&&noprint" => ["", "bbb", "ccc", "bbb", "bbb", "bbb", "bbb", "bbb", "bbb", "bbb"],
+        "&&&&&&noprint" => ["", "bbb", "ccc", "bbb", "bbb", "bbb", "bbb", "bbb", "bbb"],
+        "&&&&&&&noprint" => ["", "bbb", "ccc", "bbb", "bbb", "bbb", "bbb", "bbb"],
+        "&&&&&&&&noprint" => ["", "bbb", "ccc", "bbb", "bbb", "bbb", "bbb"],
+        "&&&&&&&&&noprint" => ["", "bbb", "ccc", "bbb", "bbb", "bbb"],
+        "better" => ["aaa", "bbb", "ccc", "bbb", "bbb"]
+    );
+
+    /*
+     * qsort||&noprint| | | | | ||
+     *
+     */
+    $test = "&noprint|---blank---|---blank---|---blank---|---blank---|---blank---||&&noprint|---blank---|---blank---|---blank---|---blank---|---blank---|---blank---||";
+
+    // calculate array with more values
+    $arrayWithValuesLengths = array();
+    foreach ($arrayWithValues as &$a)
+    {
+        array_push($arrayWithValuesLengths, count($a));
+    }
+    $maxNumberOfItems = max($arrayWithValuesLengths);
+    $basicWidth = 24;
+    $containerWidth = 24 * count($arrayWithValues) * 2 * 2;
+    $eachContainerHeight = 24 * $maxNumberOfItems * 2;
+
+    // fill each array to fill until it's as big as the biggest
+    foreach ($arrayWithValues as $key => $array)
+    {
+        while (count($array) < $maxNumberOfItems)
+        {
+            array_unshift($array, "---blank---");
+        }
+        $arrayWithValues[$key] = $array;
+    }
+
+    ?>
+
+
+
+    <div
+        class="grid grid-cols-{{count($arrayWithValues)}} gap-0 text-center absolute mx-auto w-auto"
+        id="qsort"
+        style="left: 50%;transform: translateX(-50%);top:15%;"
+    >
+
+        @foreach($arrayWithValues as $key => $array)
+            <div class="grid grid-cols-1 gap-0 align-middle" style="height: {{$eachContainerHeight}}px">
+                <div class="qsortlg:w-24 qsortmd:w-16 qsortsm:w-12 grid grid-rows-{{$maxNumberOfItems+1}} grid-flow-col gap-0 ">
+                    @foreach($array as $value)
+                        @if($value == "---blank---")
+                            <div class="bg-pink-400 opacity-0 qsortlg:w-24 qsortmd:w-16 qsortsm:w-12  qsortlg:h-24 qsortmd:h-16 qsortsm:h-12"></div>
+
+                        @else
+                            <div class="bg-gray-900 text-white border border-solid border-white qsortlg:w-24 qsortmd:w-16 qsortsm:w-12 qsortlg:h-24 qsortmd:h-16 qsortsm:h-12 select-none inline-block align-middle justify-center">{{$value}}</div>
+                        @endif
+
+                    @endforeach
+
+                    <div class="bg-white text-black qsortlg:w-24 qsortmd:w-16 qsortsm:w-12 qsortlg:h-24 qsortmd:h-16 qsortsm:h-12 select-none inline-block align-middle justify-center">
+                        @if(strpos($key, '&noprint') === false)
+                            {{$key}}
+                        @endif
+                    </div>
+                </div>
+            </div>
+
+        @endforeach
+        {{-- insert last row of labels? --}}
+
     </div>
+
+
+@endsection
+
+@section('pagespecificstyles')
+
+    <script>
+
+            (function() {
+                setTimeout(function() {
+                    let windowSize = window.innerWidth;
+                    let widthMultiplier = 24;
+                    let top = 6;
+                    let mediaQuerySM = windowSize > 639 && windowSize <768;
+                    let mediaQueryMD = windowSize >= 768 && windowSize < 1366;
+                    let mediaQueryLG = windowSize >= 1366;
+
+                    if(mediaQuerySM) {
+                        widthMultiplier = 12;
+                        top *= 3;
+                        console.log("SM")
+
+                    }
+                    else if(mediaQueryMD) {
+                        console.log("MD")
+                        widthMultiplier = 16;
+                        top *= 2;
+                    }
+                    else if(mediaQueryLG) {
+                        console.log("LG?")
+                        widthMultiplier = 24;
+                    }
+
+                    let arrayCount = <?php echo count($arrayWithValues) ?>;
+                    let containerWidth = widthMultiplier * arrayCount * 2 * 2;
+                    let element = document.getElementById('qsort');
+                    element.style.width = containerWidth.toString() + 'px';
+                    element.style.top = top.toString() + '%';
+                }, 75);
+            })();
+
+
+    </script>
 @endsection

routes/web.php

@@ -43,7 +43,7 @@ Route::group(['middleware' => ['interview']], static function () {
 
 Route::lingua('translations');
 
-//Route::get('/qsort','HomeController@qsort');
+Route::get('/qsort','HomeController@qsort');
 
 
 
@@ -63,7 +63,7 @@ Route::group(['prefix' => 'admin', 'middleware' => ['haspowers','auth', 'verifie
 
 Route::group(['middleware' => ['auth', 'verified']], static function () {
     Route::get('/', 'HomeController@index')->name('home');
-    
+
     Route::get('/asuser/{user}', 'HomeController@asuser');
     Route::get('switch/{locale}', 'HomeController@changeLanguage');