Правка в логике клика по выбранной картинке

src/config/autoload/fotos.global.php

@@ -2,7 +2,8 @@
 
 return [
     'foto_conf' => [
-	'formats' => ['jpg', 'jpeg', 'webp'],
+        'formats' => ['jpg', 'jpeg', 'webp'],
+        'pairs_count' => 5,
         'colors_active' => [
             1 => '#2CA02C',
             2 => '#D62728',

src/public/css/styles-main.css

@@ -70,7 +70,8 @@
             border-width: 4px;
         }
         
-        .b-foto_inner.paired {
+        .b-folder-content.has-selected .b-foto_inner.paired {
+            cursor: default;
             opacity: 0.5;
         }
         

src/public/js/script-main.js

@@ -5,6 +5,7 @@ $(document).ready(function(){
         $loading = $('.b-loading'),
         colorsActive = $foldersContentWrap.data('colors'),
         freeNumbers = [1,2,3,4,5],
+        pairsCount = $foldersContentWrap.data('pairs_count'),
         currentNumToSelect = {},
         hasSelectedFoto = {};
     
@@ -45,6 +46,20 @@ $(document).ready(function(){
         hasSelectedFoto[folderName] = false; // Выбрали одну картинку (есть подсвеченное фото)
     }
     
+    function getCurrenNumToSelect($folderWrap)
+    {
+        for (let n = 1; n <= pairsCount; n++) {
+            if ($('.b-foto_inner[data-num="' + n + '"]', $folderWrap).length == 0) return n;
+        }
+        /*    
+        freeNumbers.some(function(el) {
+            numValue = el;
+            return ($('.b-foto_inner[data-num="' + el + '"]', $folderWrap).length == 0);
+        });
+        return numValue;
+        */
+    }
+    
     // Клик на папку для загрузки фотографий:
     $('.b-list_folders-item').on('click', function(){
         
@@ -104,17 +119,6 @@ $(document).ready(function(){
             $currentFolderWrap = $this.parents('.b-folder-content'),
             folderName = $currentFolderWrap.data('folder');
         
-        console.log('AAA folderName ', folderName);
-        
-        /*
-        freeNumbers.some(function(el) {
-            currentNumToSelect = el;
-            return ($('.b-foto_inner[data-num="' + el + '"]', $currentFolderWrap).length == 0);
-        });
-        */
-        
-        console.log('AAA currentNumToSelect ', currentNumToSelect);
-        
         if (!$this.hasClass('selected'))
         {
             // Клик по фото без рамки
@@ -124,6 +128,7 @@ $(document).ready(function(){
                 console.log('AAA 1-е фото в пару');
                 num = currentNumToSelect[folderName];
                 hasSelectedFoto[folderName] = true;
+                $currentFolderWrap.addClass('has-selected');
             } else {
                 // выбор второго фото для пары (пара сформирована):
                 console.log('AAA 2-е фото в пару');
@@ -132,11 +137,15 @@ $(document).ready(function(){
                 $this.addClass('paired');
                 $('.b-foto_inner[data-num="' + num + '"]', $currentFolderWrap).addClass('paired');
                 
+                /*
                 freeNumbers.some(function(el) {
                     currentNumToSelect[folderName] = el;
                     return ($('.b-foto_inner[data-num="' + el + '"]', $currentFolderWrap).length == 0);
                 });
+                */
+                currentNumToSelect[folderName] = getCurrenNumToSelect($currentFolderWrap);
                 hasSelectedFoto[folderName] = false;
+                $currentFolderWrap.removeClass('has-selected');
             }
             
             
@@ -149,30 +158,32 @@ $(document).ready(function(){
         else
         {
             // Клик по фото с рамкой
-            console.log('AAA убираем пару');
+            console.log('AAA Клик по фото с рамкой');
             
             var
                 pairedNum = $this.attr('data-num'),
                 $pairedFotos = $('.b-foto_inner[data-num="' + pairedNum + '"]', $currentFolderWrap),
                 isFromPair = $this.hasClass('paired');
             
+            if (hasSelectedFoto[folderName] && isFromPair) {
+                return false;
+            }
+            
             $('.b-foto_number', $pairedFotos).text('');
             $pairedFotos.attr('data-num', '')
                         .removeClass('paired')
                         .removeClass('selected')
                         .css('border-color', '#8D9094');
             
-            
-            // Клик по фото из пары при выделеной одной фото из другой пары:
-            if (!hasSelectedFoto[folderName] || !isFromPair) {
-                hasSelectedFoto[folderName] = false;
-            
-                freeNumbers.some(function(el) {
-                    currentNumToSelect[folderName] = el;
-                    return ($('.b-foto_inner[data-num="' + el + '"]', $currentFolderWrap).length == 0);
-                });
-            }
-            
+            hasSelectedFoto[folderName] = false;
+            $currentFolderWrap.removeClass('has-selected');
+            /*
+            freeNumbers.some(function(el) {
+                currentNumToSelect[folderName] = el;
+                return ($('.b-foto_inner[data-num="' + el + '"]', $currentFolderWrap).length == 0);
+            });
+            */
+            currentNumToSelect[folderName] = getCurrenNumToSelect($currentFolderWrap);
         }
         
         

src/src/App/Action/Admin/Index.php

@@ -68,6 +68,7 @@ class Index extends Common
         $data = [
             'lang' => $request->getAttribute('layoutInfo')->getLang(),
             'colors_active' => $this->container->get('config')['foto_conf']['colors_active'],
+            'pairs_count' => $this->container->get('config')['foto_conf']['pairs_count'],
             'folders' => $folders,
             'dir' => $dir,
         ];

src/templates/app/main.phtml

@@ -63,7 +63,7 @@ $dir = $this->dir;
             <a class="btn btn-primary save-folders" href="#">Сохранить</a>
             
         </div>
-        <div class="b-preview col" data-colors=<?= ($colors_active ? json_encode($colors_active) : '')?>>
+        <div class="b-preview col" data-colors=<?= ($colors_active ? json_encode($colors_active) : '')?> data-pairs_count=<?= ($pairs_count ? json_encode($pairs_count) : '')?>>
             
             <div class="b-loading"></div>