Merge branch 'release/1.5.0'

CHANGELOG.md

@@ -1,3 +1,12 @@
+1.5.0 / 2023-01-28
+------------------
+
+- Настройки веб-интерфейса и опции командной строки "--lib-dir", "--inpx" вынесены в конфиг (#6)
+- Уменьшена длина имени файла при скачивании (#7)
+- OPDS: добавлен раздел "Жанры", в поиск добавлен раздел "Поиск книг в жанре" (#9)
+- Исправление проблем скроллинга панели инструментов (#12)
+- Улучшено отображение веб-интерфейса на мобильных устройствах
+
 1.4.1 / 2022-12-21
 ------------------
 

README.md

@@ -80,6 +80,14 @@ Options:
 При первом запуске в рабочей директории будет создан конфигурационный файл `config.json`:
 ```js
 {
+    // директория библиотеки (с zip-архивами), аналог параметра командной строки --lib-dir
+    // пустая строка: использовать значение по умолчанию - директорию файла приложения
+    "libDir": "",
+
+    // путь к файлу .inpx, аналог параметра командной строки --inpx
+    // пустая строка: использовать значение по умолчанию - inpx-файл, что найдется в директории библиотеки
+    "inpx": "",
+
     // пароль для ограничения доступа к веб-интерфейсу сервера
     // пустое значение - доступ без ограничений
     "accessPassword": "",
@@ -164,6 +172,23 @@ Options:
         "user": "",
         "password": "",
         "root": "/opds"
+    },
+
+    // настройки по умолчанию для веб-интерфейса
+    // устанавливаются при первой загрузке страницы в браузере
+    // дальнейшие изменения настроек с помощью веб-интерфейса уже сохраняются в самом браузере
+    "uiDefaults": {
+        "limit": 20, // результатов на странице
+        "downloadAsZip": false, // скачивать книги в виде zip-архива
+        "showCounts": true, // показывать количество
+        "showRates": true, // показывать оценки
+        "showInfo": true, // показывать кнопку (инфо)
+        "showGenres": true, // показывать жанры
+        "showDates": false, // показывать даты поступления
+        "showDeleted": false, // показывать удаленные
+        "abCacheEnabled": true, // кешировать запросы
+        "langDefault": "", // язык по умолчанию (например "ru,en")
+        "showJson": false // показывать JSON (в расширенном поиске)
     }
 }
 ```

client/components/Search/BookInfoDialog/BookInfoDialog.vue

@@ -18,7 +18,7 @@
 
             <div class="row q-mt-sm no-wrap">
                 <div class="poster-size">
-                    <div class="poster-size column justify-center items-center" :class="{poster: coverSrc}" @click.stop.prevent="posterClick">
+                    <div class="column justify-center items-center" :class="{'poster': coverSrc, 'no-poster': !coverSrc}" @click.stop.prevent="posterClick">
                         <img v-if="coverSrc" :src="coverSrc" class="fit row justify-center items-center" style="object-fit: contain" @error="coverSrc = ''" />
                         <div v-if="!coverSrc" class="fit row justify-center items-center text-grey-5" style="border: 1px solid #ccc; font-size: 300%">
                             <i>{{ book.ext }}</i>
@@ -317,7 +317,7 @@ export default vueComponent(BookInfoDialog);
     min-width: 100px;
 }
 
-.poster {
+.poster, .no-poster {
     width: 100%;
     height: 100%;
 }

client/components/Search/Search.vue

@@ -1,271 +1,284 @@
 <template>
     <div class="root column fit" style="position: relative">
         <div ref="scroller" class="col fit column no-wrap" style="overflow: auto; position: relative" @scroll="onScroll">
-            <div ref="toolPanel" class="tool-panel q-pb-xs column bg-cyan-2" style="position: sticky; top: 0; z-index: 10;">
-                <div class="header q-mx-md q-mb-xs q-mt-sm row items-center">
-                    <a :href="newSearchLink" style="height: 33px; width: 34px">
-                        <img src="./assets/logo.png" />
-                        <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%" max-width="400px">
-                            Новый поиск
-                        </q-tooltip>
-                    </a>
-
-                    <q-btn-toggle
-                        v-model="selectedList"
-                        class="q-ml-sm"
-                        toggle-color="primary"
-                        :options="listOptions"
-                        push
-                        no-caps
-                        rounded
-                    />
-
-                    <div class="row items-center q-ml-sm" style="font-size: 150%;">
-                        <div class="q-mr-xs">
-                            Коллекция
-                        </div>
-                        <div class="clickable" @click.stop.prevent="showCollectionInfo">
-                            {{ collection }}
-                        </div>
-                    </div>
-
-                    <div class="col"></div>
-
-                    <DivBtn class="q-ml-md text-white bg-secondary" :size="30" :icon-size="24" icon="la la-question" round @click.stop.prevent="showSearchHelp">
-                        <template #tooltip>
-                            <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%" max-width="400px">
-                                Памятка
-                            </q-tooltip>
-                        </template>
-                    </DivBtn>
-
-                    <DivBtn class="q-ml-sm text-white bg-secondary" :size="30" :icon-size="24" :imt="1" icon="la la-cog" round @click.stop.prevent="settingsDialogVisible = true">
-                        <template #tooltip>
-                            <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%" max-width="400px">
-                                Настройки
-                            </q-tooltip>
-                        </template>
-                    </DivBtn>
-
-                    <DivBtn v-if="!config.freeAccess" class="q-ml-sm text-white bg-secondary" :size="30" :icon-size="24" :imt="1" icon="la la-sign-out-alt" round @click.stop.prevent="logout">
-                        <template #tooltip>
-                            <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%" max-width="400px">
-                                Выход
-                            </q-tooltip>
-                        </template>
-                    </DivBtn>
-                </div>
-                <div v-show="!isExtendedSearch" class="row q-mx-md q-mb-xs items-center">
-                    <DivBtn
-                        class="text-grey-5 bg-yellow-1 q-mt-xs" :size="30" :icon-size="24" round
-                        :icon="(extendedParams ? 'la la-angle-double-up' : 'la la-angle-double-down')"
-                        @click.stop.prevent="extendedParams = !extendedParams"
-                    >
-                        <template #tooltip>
-                            <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%" max-width="400px">
-                                {{ `${(extendedParams ? 'Скрыть' : 'Показать')} дополнительные критерии поиска` }}
-                            </q-tooltip>
-                        </template>
-                    </DivBtn>
-                    <div class="q-mx-xs" />
-                    <q-input
-                        ref="authorInput" v-model="search.author" :maxlength="5000" :debounce="inputDebounce"
-                        class="q-mt-xs" :bg-color="inputBgColor('author')" style="width: 200px;" label="Автор" stack-label outlined dense clearable
-                    >
-                        <q-tooltip v-if="search.author" :delay="500" anchor="bottom middle" content-style="font-size: 80%" max-width="400px">
-                            {{ search.author }}
-                        </q-tooltip>
-                    </q-input>
-                    <div class="q-mx-xs" />
-                    <q-input
-                        v-model="search.series" :maxlength="inputMaxLength" :debounce="inputDebounce"
-                        class="q-mt-xs" :bg-color="inputBgColor('series')" style="width: 200px;" label="Серия" stack-label outlined dense clearable
-                    >
-                        <q-tooltip v-if="search.series" :delay="500" anchor="bottom middle" content-style="font-size: 80%" max-width="400px">
-                            {{ search.series }}
-                        </q-tooltip>
-                    </q-input>
-                    <div class="q-mx-xs" />
-                    <q-input
-                        v-model="search.title" :maxlength="inputMaxLength" :debounce="inputDebounce"
-                        class="q-mt-xs" :bg-color="inputBgColor('title')" style="width: 200px;" label="Название" stack-label outlined dense clearable
-                    >
-                        <q-tooltip v-if="search.title" :delay="500" anchor="bottom middle" content-style="font-size: 80%" max-width="400px">
-                            {{ search.title }}
-                        </q-tooltip>
-                    </q-input>
-                    <div class="q-mx-xs" />
-                    <q-input
-                        v-model="search.lang" :maxlength="inputMaxLength" :debounce="inputDebounce"
-                        class="q-mt-xs" :bg-color="inputBgColor()" input-style="cursor: pointer" style="width: 90px;" label="Язык" stack-label outlined dense clearable readonly
-                        @click.stop.prevent="selectLang"
-                    >
-                        <template v-if="search.lang" #append>
-                            <q-icon name="la la-times-circle" class="q-field__focusable-action" @click.stop.prevent="search.lang = ''" />
-                        </template>
-
-                        <q-tooltip v-if="search.lang && showTooltips" :delay="500" anchor="bottom middle" content-style="font-size: 80%" max-width="400px">
-                            {{ search.lang }}
-                        </q-tooltip>
-                    </q-input>
-                    <div class="q-mx-xs" />
-                    <DivBtn
-                        class="text-grey-8 bg-yellow-1 q-mt-xs" :size="30" :icon-size="24" round
-                        icon="la la-level-up-alt"
-                        @click.stop.prevent="cloneSearch"
-                    >
-                        <template #tooltip>
-                            <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%" max-width="400px">
-                                Клонировать поиск
-                            </q-tooltip>
-                        </template>
-                    </DivBtn>
-                </div>
-                <div v-show="!isExtendedSearch && extendedParams" class="row q-mx-md q-mb-xs items-center">
-                    <div style="width: 30px" />
-                    <div class="q-mx-xs" />
-                    <q-input
-                        v-model="genreNames" :maxlength="inputMaxLength" :debounce="inputDebounce"
-                        class="q-mt-xs" :bg-color="inputBgColor()" input-style="cursor: pointer" style="width: 200px;" label="Жанр" stack-label outlined dense clearable readonly
-                        @click.stop.prevent="selectGenre"
-                    >
-                        <template v-if="genreNames" #append>
-                            <q-icon name="la la-times-circle" class="q-field__focusable-action" @click.stop.prevent="search.genre = ''" />
-                        </template>
-
-                        <q-tooltip v-if="genreNames && showTooltips" :delay="500" anchor="bottom middle" content-style="font-size: 80%" max-width="400px">
-                            {{ genreNames }}
-                        </q-tooltip>
-                    </q-input>
-
-                    <div class="q-mx-xs" />
-                    <q-select 
-                        v-model="searchDate"
-                        class="q-mt-xs"
-                        :options="searchDateOptions"
-                        dropdown-icon="la la-angle-down la-sm"
-                        :bg-color="inputBgColor()"
-                        style="width: 200px;"
-                        label="Дата поступления" stack-label
-                        outlined dense emit-value map-options clearable
-                    >
-                        <template #selected-item="scope">
-                            <div v-if="scope.opt.value == 'manual'">
-                                <div v-html="formatSearchDate" />
+            <!-- Tool Panel begin -->
+            <div ref="toolPanel" class="tool-panel column bg-cyan-2" style="position: sticky; top: 0; z-index: 10;">
+                <!-- 1 -->
+                <div class="row">
+                    <!-- 1-1 -->
+                    <div class="column col">
+                        <div class="header q-mb-xs q-ml-sm q-mt-sm row items-center">
+                            <div class="row no-wrap items-center">
+                                <a :href="newSearchLink" style="height: 33px; width: 34px">
+                                    <img src="./assets/logo.png" />
+                                    <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%" max-width="400px">
+                                        Новый поиск
+                                    </q-tooltip>
+                                </a>
+
+                                <q-btn-toggle
+                                    v-model="selectedList"
+                                    class="q-ml-sm"
+                                    toggle-color="primary"
+                                    :options="listOptions"
+                                    push
+                                    no-caps
+                                    rounded
+                                />
                             </div>
-                            <div v-else>
-                                {{ scope.opt.label }}
-                            </div>
-                        </template>
 
-                        <template #option="scope">
-                            <q-item v-bind="scope.itemProps" @click.stop.prevent="dateSelectItemClick(scope.opt.value)">
-                                <q-item-section>
-                                    <q-item-label>
+                            <div class="row items-center q-ml-sm" style="font-size: 150%;">
+                                <div class="q-mr-xs">
+                                    Коллекция
+                                </div>
+                                <div class="clickable" @click.stop.prevent="showCollectionInfo">
+                                    {{ collection }}
+                                </div>
+
+                                <DivBtn class="q-ml-sm text-grey-5 bg-yellow-1" :size="28" :icon-size="24" icon="la la-question" round @click.stop.prevent="showSearchHelp">
+                                    <template #tooltip>
+                                        <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%" max-width="400px">
+                                            Памятка
+                                        </q-tooltip>
+                                    </template>
+                                </DivBtn>
+                            </div>
+                        </div>
+                        <div v-show="!isExtendedSearch" class="row q-mx-sm q-mb-xs items-center" style="max-width: 1024px">
+                            <q-input
+                                ref="authorInput" v-model="search.author" :maxlength="5000" :debounce="inputDebounce"
+                                class="q-mt-xs col-3" :bg-color="inputBgColor('author')" style="min-width: 140px" label="Автор" stack-label outlined dense clearable
+                            >
+                                <q-tooltip v-if="search.author" :delay="500" anchor="bottom middle" content-style="font-size: 80%" max-width="400px">
+                                    {{ search.author }}
+                                </q-tooltip>
+                            </q-input>
+                            <div class="q-mx-xs" />
+                            <q-input
+                                v-model="search.series" :maxlength="inputMaxLength" :debounce="inputDebounce"
+                                class="q-mt-xs col-3" :bg-color="inputBgColor('series')" style="min-width: 140px" label="Серия" stack-label outlined dense clearable
+                            >
+                                <q-tooltip v-if="search.series" :delay="500" anchor="bottom middle" content-style="font-size: 80%" max-width="400px">
+                                    {{ search.series }}
+                                </q-tooltip>
+                            </q-input>
+                            <div class="q-mx-xs" />
+                            <q-input
+                                v-model="search.title" :maxlength="inputMaxLength" :debounce="inputDebounce"
+                                class="q-mt-xs col-3" :bg-color="inputBgColor('title')" style="min-width: 140px;" label="Название" stack-label outlined dense clearable
+                            >
+                                <q-tooltip v-if="search.title" :delay="500" anchor="bottom middle" content-style="font-size: 80%" max-width="400px">
+                                    {{ search.title }}
+                                </q-tooltip>
+                            </q-input>
+                            <div class="q-mx-xs" />
+                            <q-input
+                                v-model="search.lang" :maxlength="inputMaxLength" :debounce="inputDebounce"
+                                class="q-mt-xs col-1" :bg-color="inputBgColor()" input-style="cursor: pointer" style="min-width: 90px;" label="Язык" stack-label outlined dense clearable readonly
+                                @click.stop.prevent="selectLang"
+                            >
+                                <template v-if="search.lang" #append>
+                                    <q-icon name="la la-times-circle" class="q-field__focusable-action" @click.stop.prevent="search.lang = ''" />
+                                </template>
+
+                                <q-tooltip v-if="search.lang && showTooltips" :delay="500" anchor="bottom middle" content-style="font-size: 80%" max-width="400px">
+                                    {{ search.lang }}
+                                </q-tooltip>
+                            </q-input>
+                            <div class="q-mx-xs" />
+                            <DivBtn
+                                class="text-grey-8 bg-yellow-1 q-mt-xs" :size="30" :icon-size="24" round
+                                icon="la la-level-up-alt"
+                                @click.stop.prevent="cloneSearch"
+                            >
+                                <template #tooltip>
+                                    <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%" max-width="400px">
+                                        Клонировать поиск
+                                    </q-tooltip>
+                                </template>
+                            </DivBtn>
+                        </div>
+                        <div v-show="!isExtendedSearch && extendedParams" class="row q-mx-sm q-mb-xs items-center" style="max-width: 1024px">
+                            <q-input
+                                v-model="genreNames" :maxlength="inputMaxLength" :debounce="inputDebounce"
+                                class="q-mt-xs col-3" :bg-color="inputBgColor()" input-style="cursor: pointer" style="min-width: 140px;" label="Жанр" stack-label outlined dense clearable readonly
+                                @click.stop.prevent="selectGenre"
+                            >
+                                <template v-if="genreNames" #append>
+                                    <q-icon name="la la-times-circle" class="q-field__focusable-action" @click.stop.prevent="search.genre = ''" />
+                                </template>
+
+                                <q-tooltip v-if="genreNames && showTooltips" :delay="500" anchor="bottom middle" content-style="font-size: 80%" max-width="400px">
+                                    {{ genreNames }}
+                                </q-tooltip>
+                            </q-input>
+
+                            <div class="q-mx-xs" />
+                            <q-select 
+                                v-model="searchDate"
+                                class="q-mt-xs col-3"
+                                :options="searchDateOptions"
+                                dropdown-icon="la la-angle-down la-sm"
+                                :bg-color="inputBgColor()"
+                                style="min-width: 140px;"
+                                label="Дата поступления" stack-label
+                                outlined dense emit-value map-options clearable
+                            >
+                                <template #selected-item="scope">
+                                    <div v-if="scope.opt.value == 'manual'">
+                                        <div v-html="formatSearchDate" />
+                                    </div>
+                                    <div v-else>
                                         {{ scope.opt.label }}
-                                    </q-item-label>
-                                </q-item-section>
-                            </q-item>
-                        </template>
-                    </q-select>
-
-                    <div class="q-mx-xs" />
-                    <q-input
-                        v-model="librateNames" :maxlength="inputMaxLength" :debounce="inputDebounce"
-                        class="q-mt-xs" :bg-color="inputBgColor()" input-style="cursor: pointer" style="width: 90px;" label="Оценка" stack-label outlined dense clearable readonly
-                        @click.stop.prevent="selectLibRate"
-                    >
-                        <template v-if="librateNames" #append>
-                            <q-icon name="la la-times-circle" class="q-field__focusable-action" @click.stop.prevent="search.librate = ''" />
-                        </template>
-
-                        <q-tooltip v-if="librateNames && showTooltips" :delay="500" anchor="bottom middle" content-style="font-size: 80%" max-width="400px">
-                            {{ librateNames }}
-                        </q-tooltip>
-                    </q-input>
-                </div>
-                <div v-show="!isExtendedSearch && !extendedParams && extendedParamsMessage" class="row q-mx-md items-center clickable" @click.stop.prevent="extendedParams = true">
-                    +{{ extendedParamsMessage }}
-                </div>
-
-                <div v-show="isExtendedSearch" class="row q-mx-md q-mb-xs items-center">
-                    <q-input
-                        v-model="extSearchNames"
-                        class="col q-mt-xs" :bg-color="inputBgColor('extended')" input-style="cursor: pointer"
-                        style="min-width: 200px; max-width: 638px;" label="Расширенный поиск" stack-label outlined dense clearable readonly
-                        @click.stop.prevent="selectExtSearch"
-                    >
-                        <template v-if="extSearchNames" #append>
-                            <q-icon name="la la-times-circle" class="q-field__focusable-action" @click.stop.prevent="clearExtSearch" />
-                        </template>
-
-                        <q-tooltip v-if="extSearchNames && showTooltips" :delay="500" anchor="bottom middle" content-style="font-size: 80%" max-width="400px">
-                            {{ extSearchNames }}
-                        </q-tooltip>
-                    </q-input>
-
-                    <div class="q-mx-xs" />
-                    <DivBtn
-                        class="text-grey-8 bg-yellow-1 q-mt-xs" :size="30" round
-                        :disabled="!extSearch.author"
-                        @me-click="extToList('author')"
-                    >
-                        <div style="font-size: 130%">
-                            <b>А</b>
+                                    </div>
+                                </template>
+
+                                <template #option="scope">
+                                    <q-item v-bind="scope.itemProps" @click.stop.prevent="dateSelectItemClick(scope.opt.value)">
+                                        <q-item-section>
+                                            <q-item-label>
+                                                {{ scope.opt.label }}
+                                            </q-item-label>
+                                        </q-item-section>
+                                    </q-item>
+                                </template>
+                            </q-select>
+
+                            <div class="q-mx-xs" />
+                            <q-input
+                                v-model="librateNames" :maxlength="inputMaxLength" :debounce="inputDebounce"
+                                class="q-mt-xs col-1" :bg-color="inputBgColor()" input-style="cursor: pointer" style="min-width: 90px;" label="Оценка" stack-label outlined dense clearable readonly
+                                @click.stop.prevent="selectLibRate"
+                            >
+                                <template v-if="librateNames" #append>
+                                    <q-icon name="la la-times-circle" class="q-field__focusable-action" @click.stop.prevent="search.librate = ''" />
+                                </template>
+
+                                <q-tooltip v-if="librateNames && showTooltips" :delay="500" anchor="bottom middle" content-style="font-size: 80%" max-width="400px">
+                                    {{ librateNames }}
+                                </q-tooltip>
+                            </q-input>
                         </div>
-                        <template #tooltip>
-                            <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%" max-width="400px">
-                                В раздел "Авторы" с переносом значения author={{ extSearch.author }}
-                            </q-tooltip>
-                        </template>
-                    </DivBtn>
-
-                    <div class="q-mx-xs" />
-                    <DivBtn
-                        class="text-grey-8 bg-yellow-1 q-mt-xs" :size="30" round
-                        :disabled="!extSearch.series"
-                        @me-click="extToList('series')"
-                    >
-                        <div style="font-size: 130%">
-                            <b>С</b>
+                        <div v-show="!isExtendedSearch && !extendedParams && extendedParamsMessage" class="row q-mx-sm items-center clickable" @click.stop.prevent="extendedParams = true">
+                            +{{ extendedParamsMessage }}
                         </div>
-                        <template #tooltip>
-                            <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%" max-width="400px">
-                                В раздел "Серии" с переносом значения series={{ extSearch.series }}
-                            </q-tooltip>
-                        </template>
-                    </DivBtn>
 
-                    <div class="q-mx-xs" />
-                    <DivBtn
-                        class="text-grey-8 bg-yellow-1 q-mt-xs" :size="30" round
-                        :disabled="!extSearch.title"
-                        @me-click="extToList('title')"
-                    >
-                        <div style="font-size: 130%">
-                            <b>К</b>
+                        <div v-show="isExtendedSearch" class="row q-mx-md q-mb-xs items-center">
+                            <q-input
+                                v-model="extSearchNames"
+                                class="col q-mt-xs" :bg-color="inputBgColor('extended')" input-style="cursor: pointer"
+                                style="min-width: 140px; max-width: 638px;" label="Расширенный поиск" stack-label outlined dense clearable readonly
+                                @click.stop.prevent="selectExtSearch"
+                            >
+                                <template v-if="extSearchNames" #append>
+                                    <q-icon name="la la-times-circle" class="q-field__focusable-action" @click.stop.prevent="clearExtSearch" />
+                                </template>
+
+                                <q-tooltip v-if="extSearchNames && showTooltips" :delay="500" anchor="bottom middle" content-style="font-size: 80%" max-width="400px">
+                                    {{ extSearchNames }}
+                                </q-tooltip>
+                            </q-input>
+
+                            <div class="q-mx-xs" />
+                            <DivBtn
+                                class="text-grey-8 bg-yellow-1 q-mt-xs" :size="30" round
+                                :disabled="!extSearch.author"
+                                @me-click="extToList('author')"
+                            >
+                                <div style="font-size: 130%">
+                                    <b>А</b>
+                                </div>
+                                <template #tooltip>
+                                    <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%" max-width="400px">
+                                        В раздел "Авторы" с переносом значения author={{ extSearch.author }}
+                                    </q-tooltip>
+                                </template>
+                            </DivBtn>
+
+                            <div class="q-mx-xs" />
+                            <DivBtn
+                                class="text-grey-8 bg-yellow-1 q-mt-xs" :size="30" round
+                                :disabled="!extSearch.series"
+                                @me-click="extToList('series')"
+                            >
+                                <div style="font-size: 130%">
+                                    <b>С</b>
+                                </div>
+                                <template #tooltip>
+                                    <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%" max-width="400px">
+                                        В раздел "Серии" с переносом значения series={{ extSearch.series }}
+                                    </q-tooltip>
+                                </template>
+                            </DivBtn>
+
+                            <div class="q-mx-xs" />
+                            <DivBtn
+                                class="text-grey-8 bg-yellow-1 q-mt-xs" :size="30" round
+                                :disabled="!extSearch.title"
+                                @me-click="extToList('title')"
+                            >
+                                <div style="font-size: 130%">
+                                    <b>К</b>
+                                </div>
+                                <template #tooltip>
+                                    <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%" max-width="400px">
+                                        В раздел "Книги" с переносом значения title={{ extSearch.title }}
+                                    </q-tooltip>
+                                </template>
+                            </DivBtn>
+
+                            <div class="q-mx-xs" />
+                            <DivBtn
+                                class="text-grey-8 bg-yellow-1 q-mt-xs" :size="30" :icon-size="24" round
+                                icon="la la-level-up-alt"
+                                @click.stop.prevent="cloneSearch"
+                            >
+                                <template #tooltip>
+                                    <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%" max-width="400px">
+                                        Клонировать поиск
+                                    </q-tooltip>
+                                </template>
+                            </DivBtn>
                         </div>
-                        <template #tooltip>
-                            <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%" max-width="400px">
-                                В раздел "Книги" с переносом значения title={{ extSearch.title }}
-                            </q-tooltip>
-                        </template>
-                    </DivBtn>
-
-                    <div class="q-mx-xs" />
+                    </div><!-- 1-1 -->
+                    <!-- 1-2 -->
+                    <div class="column q-mx-sm">
+                        <div style="height: 3px" />
+                        <DivBtn class="q-mt-sm text-white bg-secondary" :size="28" :icon-size="24" :imt="1" icon="la la-cog" round @click.stop.prevent="settingsDialogVisible = true">
+                            <template #tooltip>
+                                <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%" max-width="400px">
+                                    Настройки
+                                </q-tooltip>
+                            </template>
+                        </DivBtn>
+
+                        <DivBtn v-if="!config.freeAccess" class="q-mt-sm text-white bg-secondary" :size="28" :icon-size="24" :imt="1" icon="la la-sign-out-alt" round @click.stop.prevent="logout">
+                            <template #tooltip>
+                                <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%" max-width="400px">
+                                    Выход
+                                </q-tooltip>
+                            </template>
+                        </DivBtn>
+                    </div><!-- 1-2 -->
+                </div><!-- 1 -->
+                <!-- 2 -->
+                <div class="column">
                     <DivBtn
-                        class="text-grey-8 bg-yellow-1 q-mt-xs" :size="30" :icon-size="24" round
-                        icon="la la-level-up-alt"
-                        @click.stop.prevent="cloneSearch"
+                        v-show="!isExtendedSearch && (extendedParams || !extendedParamsMessage)"
+                        class="text-grey-6" :size="16" :icon-size="14"
+                        :icon="(extendedParams ? 'la la-angle-double-up' : 'la la-angle-double-down')"
+                        no-shadow
+                        @click.stop.prevent="extendedParams = !extendedParams"
                     >
                         <template #tooltip>
                             <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%" max-width="400px">
-                                Клонировать поиск
+                                {{ `${(extendedParams ? 'Скрыть' : 'Показать')} дополнительные критерии поиска` }}
                             </q-tooltip>
                         </template>
                     </DivBtn>
-                </div>
+                </div><!-- 2 -->
             </div>
+            <!-- Tool Panel end -->
 
             <div class="row items-center q-ml-lg q-mt-sm">
                 <div style="width: 400px;">
@@ -544,6 +557,13 @@ class Search {
         (async() => {
             await this.api.updateConfig();
 
+            //устанавливаем uiDefaults от сервера, если это необходимо
+            if (!this.settings.defaultsSet) {
+                const uiDefaults = _.cloneDeep(this.config.uiDefaults);
+                uiDefaults.defaultsSet = true;
+                this.commit('setSettings', uiDefaults);
+            }
+
             this.generateDefaults(this.extSearch, this.recStruct.map(f => f.field));
             this.extSearch.setDefaults(this.extSearch);
             this.search.lang = this.langDefault;
@@ -908,7 +928,7 @@ class Search {
     
     onScroll() {
         const curScrollTop = this.$refs.scroller.scrollTop;
-		const toolpanelviewportoffset= this.$refs.toolPanel.getBoundingClientRect().top;
+        const toolPanelOffset = this.$refs.toolPanel.getBoundingClientRect().top;
 
         if (this.ignoreScrolling) {
             this.lastScrollTop = curScrollTop;
@@ -917,45 +937,44 @@ class Search {
             return;
         }
 
-
-		if (this.lastScrollTop==curScrollTop) return; //если событие вызвано более 1 раза на 1 скролл
+        if (this.lastScrollTop === curScrollTop)
+            return; //если событие вызвано более 1 раза на 1 скролл
 
         if (!this.lastScrollTop)
             this.lastScrollTop = 0;
 
-		if (curScrollTop - this.lastScrollTop > 0) { //страницу крутят вверх
-		    if (this.$refs.toolPanel.style.position=="sticky") //Если блок приклеен к окну
-			this.$refs.toolPanel.style.top=`${curScrollTop}px`;//Приклеиваем его к позиции в родителе
-		    this.$refs.toolPanel.style.position="relative";
-		    if (toolpanelviewportoffset<-this.$refs.toolPanel.offsetHeight) //Но не даём блоку оказаться дальше своей высоты за экраном
-			this.$refs.toolPanel.style.top = `${curScrollTop-this.$refs.toolPanel.offsetHeight}px`;
-    		} else {
-        	if (toolpanelviewportoffset>=0)
-			{
-				this.$refs.toolPanel.style.top="0px";
-				this.$refs.toolPanel.style.position="sticky";
-			
-			}
-		}
-        this.lastScrollTop = curScrollTop;
+        if (curScrollTop - this.lastScrollTop > 0) { //страницу крутят вверх
+            if (this.$refs.toolPanel.style.position == 'sticky') //если блок приклеен к окну
+                this.$refs.toolPanel.style.top = `${this.lastScrollTop}px`;//приклеиваем его к позиции в родителе
 
+            this.$refs.toolPanel.style.position = 'relative';
+            (async() => {//"отложенная" коректировка, из-за артефактов в firefox
+                if (toolPanelOffset < -this.$refs.toolPanel.offsetHeight) { //не даём блоку оказаться дальше своей высоты за экраном
+                    await utils.sleep(10);
+                    this.$refs.toolPanel.style.top = `${curScrollTop - this.$refs.toolPanel.offsetHeight}px`;
+                }
+            })();
+
+        } else if (toolPanelOffset >= 0) {
+            this.$refs.toolPanel.style.top = '0px';
+            this.$refs.toolPanel.style.position = 'sticky';
+        }
 
+        this.lastScrollTop = curScrollTop;
     }
 
     async ignoreScroll(ms = 300) {
         this.ignoreScrolling = true;
         await utils.sleep(ms);
         await this.$nextTick();
-        await this.$nextTick();
-        await this.$nextTick();
         this.ignoreScrolling = false;
     }
 
     scrollToTop() {
         this.$refs.scroller.scrollTop = 0;
         this.lastScrollTop = 0;
-	this.$refs.toolPanel.style.top="0px";
-	this.$refs.toolPanel.style.position="sticky";
+        this.$refs.toolPanel.style.top = '0px';
+        this.$refs.toolPanel.style.position = 'sticky';
     }
 
     updatePageCount() {

client/components/Search/SelectExtSearchDialog/SelectExtSearchDialog.vue

@@ -6,7 +6,7 @@
                     Расширенный поиск
                 </div>
 
-                <DivBtn class="q-ml-md text-white bg-secondary" :size="30" :icon-size="24" icon="la la-question" round @click.stop.prevent="showSearchHelp">
+                <DivBtn class="q-ml-sm text-grey-5 bg-yellow-1" :size="28" :icon-size="24" icon="la la-question" round @click.stop.prevent="showSearchHelp">
                     <template #tooltip>
                         <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%" max-width="400px">
                             Памятка

client/components/share/DivBtn.vue

@@ -32,6 +32,7 @@ class DivBtn {
         round: Boolean,
         imt:  { type: Number, default: 0 },// icon margin top
         disabled: Boolean,
+        noShadow: Boolean,
     };
 
     pressed = false;
@@ -56,6 +57,9 @@ class DivBtn {
             style.borderRadius = `${this.size}px`;
         else
             style.borderRadius = `${this.size/10}px`;
+
+        if (!this.noShadow)
+            style.boxShadow = '0.5px 1px 3px #333333';
     }
 
     async clickEffect(event) {
@@ -77,7 +81,6 @@ export default vueComponent(DivBtn);
 <style scoped>
 .button {
     position: relative;
-    box-shadow: 0.5px 1px 3px #333333;
 }
 
 .button:hover {

client/store/root.js

@@ -4,9 +4,13 @@ const state = {
     settings: {
         accessToken: '',
         extendedParams: false,
-        limit: 20,
         expandedAuthor: [],
         expandedSeries: [],
+
+        defaultsSet: false,
+        
+        //uiDefaults
+        limit: 20,
         downloadAsZip: false,
         showCounts: true,
         showRates: true,

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "inpx-web",
-  "version": "1.4.1",
+  "version": "1.5.0",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "inpx-web",
-      "version": "1.4.1",
+      "version": "1.5.0",
       "hasInstallScript": true,
       "license": "CC0-1.0",
       "dependencies": {
@@ -19,7 +19,7 @@
         "fs-extra": "^10.1.0",
         "he": "^1.2.0",
         "iconv-lite": "^0.6.3",
-        "jembadb": "^5.1.5",
+        "jembadb": "^5.1.7",
         "localforage": "^1.10.0",
         "lodash": "^4.17.21",
         "minimist": "^1.2.7",
@@ -5071,9 +5071,9 @@
       }
     },
     "node_modules/jembadb": {
-      "version": "5.1.5",
-      "resolved": "https://registry.npmjs.org/jembadb/-/jembadb-5.1.5.tgz",
-      "integrity": "sha512-Vb+TkTg3JVXLPTG5BiqboZjJ2wvZRONnLd2+qU4gTuaqt2JSniigbniKSl3kACAEFfuRXEjfs9dLlKWjBX2Aiw==",
+      "version": "5.1.7",
+      "resolved": "https://registry.npmjs.org/jembadb/-/jembadb-5.1.7.tgz",
+      "integrity": "sha512-TNZjiKQ7Zfh89Q1x25PKKtsbkxiC5uOnx953dxJEP6RqfcdR6uVpr4cf+kmyq6IQ1GhwhXTELnoTIdvLWrpEvw==",
       "engines": {
         "node": ">=16.16.0"
       }
@@ -12617,9 +12617,9 @@
       "dev": true
     },
     "jembadb": {
-      "version": "5.1.5",
-      "resolved": "https://registry.npmjs.org/jembadb/-/jembadb-5.1.5.tgz",
-      "integrity": "sha512-Vb+TkTg3JVXLPTG5BiqboZjJ2wvZRONnLd2+qU4gTuaqt2JSniigbniKSl3kACAEFfuRXEjfs9dLlKWjBX2Aiw=="
+      "version": "5.1.7",
+      "resolved": "https://registry.npmjs.org/jembadb/-/jembadb-5.1.7.tgz",
+      "integrity": "sha512-TNZjiKQ7Zfh89Q1x25PKKtsbkxiC5uOnx953dxJEP6RqfcdR6uVpr4cf+kmyq6IQ1GhwhXTELnoTIdvLWrpEvw=="
     },
     "jest-util": {
       "version": "29.3.1",

package.json

@@ -1,6 +1,6 @@
 {
   "name": "inpx-web",
-  "version": "1.4.1",
+  "version": "1.5.0",
   "author": "Book Pauk <bookpauk@gmail.com>",
   "license": "CC0-1.0",
   "repository": "bookpauk/inpx-web",
@@ -61,7 +61,7 @@
     "fs-extra": "^10.1.0",
     "he": "^1.2.0",
     "iconv-lite": "^0.6.3",
-    "jembadb": "^5.1.5",
+    "jembadb": "^5.1.7",
     "localforage": "^1.10.0",
     "lodash": "^4.17.21",
     "minimist": "^1.2.7",

server/config/base.js

@@ -9,6 +9,8 @@ module.exports = {
     name: pckg.name,
 
     execDir,
+    libDir: '',
+    inpx: '',
 
     accessPassword: '',
     accessTimeout: 0,
@@ -31,7 +33,7 @@ module.exports = {
     lowMemoryMode: false,
     fullOptimization: false,
 
-    webConfigParams: ['name', 'version', 'branch', 'bookReadLink', 'dbVersion', 'extendedSearch'],
+    webConfigParams: ['name', 'version', 'branch', 'bookReadLink', 'dbVersion', 'extendedSearch', 'uiDefaults'],
 
     allowRemoteLib: false,
     remoteLib: false,
@@ -55,5 +57,18 @@ module.exports = {
         password: '',
         root: '/opds',
     },
+    uiDefaults: {
+        limit: 20,
+        downloadAsZip: false,
+        showCounts: true,
+        showRates: true,
+        showInfo: true,
+        showGenres: true,
+        showDates: false,
+        showDeleted: false,
+        abCacheEnabled: true,
+        langDefault: '',
+        showJson: false,
+    },
 };
 

server/config/index.js

@@ -5,6 +5,8 @@ const fs = require('fs-extra');
 const branchFilename = __dirname + '/application_env';
 
 const propsToSave = [
+    'libDir',
+    'inpx',
     'accessPassword',
     'accessTimeout',
     'extendedSearch',
@@ -23,6 +25,7 @@ const propsToSave = [
     'remoteLib',
     'server',
     'opds',
+    'uiDefaults',
 ];
 
 let instance = null;

server/core/WebWorker.js

@@ -433,20 +433,28 @@ class WebWorker {
             const db = this.db;
             let link = '';
 
-            //найдем bookPath и downFileName
+            //найдем downFileName и bookPath
             let rows = await db.select({table: 'book', where: `@@hash('_uid', ${db.esc(bookUid)})`});
             if (!rows.length)
                 throw new Error('404 Файл не найден');
 
             const book = rows[0];
             let downFileName = book.file;
-            const author = book.author.split(',');
-            const at = [author[0], book.title];
-            downFileName = utils.makeValidFileNameOrEmpty(at.filter(r => r).join(' - '))
+            const authors = book.author.split(',');
+            let author = authors[0];
+            author = author.split(' ').filter(r => r.trim());
+            for (let i = 1; i < author.length; i++)
+                author[i] = `${(i === 1 ? ' ' : '')}${author[i][0]}.`;
+            if (authors.length > 1)
+                author.push(' и др.');
+
+            const at = [author.join(''), (book.title ? `_${book.title}` : '')];
+            downFileName = utils.makeValidFileNameOrEmpty(at.filter(r => r).join(''))
                 || utils.makeValidFileNameOrEmpty(at[0])
                 || utils.makeValidFileNameOrEmpty(at[1])
                 || downFileName;
-            downFileName = downFileName.substring(0, 100);
+            if (downFileName.length > 50)
+                downFileName = `${downFileName.substring(0, 50)}_`;
 
             const ext = `.${book.ext}`;
             if (downFileName.substring(downFileName.length - ext.length) != ext)

server/core/opds/AuthorPage.js

@@ -66,7 +66,7 @@ class AuthorPage extends BasePage {
             author: req.query.author || '',
             series: req.query.series || '',
             genre: req.query.genre || '',
-            del: 0,
+            del: '0',
             
             all: req.query.all || '',
             depth: 0,
@@ -86,7 +86,7 @@ class AuthorPage extends BasePage {
 
             if (bookList.books) {
                 let books = bookList.books;
-                const booksAll = this.filterBooks(books, {del: 0});
+                const booksAll = this.filterBooks(books);
                 const filtered = (query.all ? booksAll : this.filterBooks(books, query));
                 const sorted = this.sortSeriesBooks(filtered);
 

server/core/opds/BasePage.js

@@ -20,6 +20,8 @@ class BasePage {
         this.webWorker = new WebWorker(config);
         this.rootTag = 'feed';
         this.opdsRoot = config.opdsRoot;
+
+        this.showDeleted = false;
     }
 
     makeEntry(entry = {}) {
@@ -213,7 +215,7 @@ class BasePage {
     }
 
     //скопировано из BaseList.js, часть функционала не используется
-    filterBooks(books, query) {
+    filterBooks(books, query = {}) {
         const s = query;
 
         const splitAuthor = (author) => {

server/core/opds/GenrePage.js

@@ -13,13 +13,17 @@ class GenrePage extends BasePage {
         const result = {};
 
         const query = {
-            from: req.query.from || '',
+            from: req.query.from || 'search',
+            term: req.query.term || '*',
             section: req.query.section || '',
         };
 
+        let searchQuery = '';
+        if (query.from == 'search')
+            searchQuery = `&type=title&term=${encodeURIComponent(query.term)}`;
+
         const entry = [];
         if (query.from) {
-
             if (query.section) {
                 //выбираем подразделы
                 const {genreSection} = await this.getGenres();
@@ -34,7 +38,7 @@ class GenrePage extends BasePage {
                             this.makeEntry({
                                 id: ++id,
                                 title: g.name,
-                                link: this.navLink({href: `/${encodeURIComponent(query.from)}?genre=${encodeURIComponent(g.value)}`}),
+                                link: this.navLink({href: `/${encodeURIComponent(query.from)}?genre=${encodeURIComponent(g.value)}${searchQuery}`}),
                             })
                         );
                     }
@@ -43,7 +47,7 @@ class GenrePage extends BasePage {
                         this.makeEntry({
                             id: 'whole_section',
                             title: '[Весь раздел]',
-                            link: this.navLink({href: `/${encodeURIComponent(query.from)}?genre=${encodeURIComponent(all.join(','))}`}),
+                            link: this.navLink({href: `/${encodeURIComponent(query.from)}?genre=${encodeURIComponent(all.join(','))}${searchQuery}`}),
                         })
                     );
                 }
@@ -56,7 +60,7 @@ class GenrePage extends BasePage {
                         this.makeEntry({
                             id: ++id,
                             title: section.name,
-                            link: this.navLink({href: `/genre?from=${encodeURIComponent(query.from)}&section=${encodeURIComponent(section.name)}`}),
+                            link: this.navLink({href: `/genre?from=${encodeURIComponent(query.from)}&section=${encodeURIComponent(section.name)}${searchQuery}`}),
                         })
                     );
                 }

server/core/opds/RootPage.js

@@ -2,6 +2,7 @@ const BasePage = require('./BasePage');
 const AuthorPage = require('./AuthorPage');
 const SeriesPage = require('./SeriesPage');
 const TitlePage = require('./TitlePage');
+const GenrePage = require('./GenrePage');
 
 class RootPage extends BasePage {
     constructor(config) {
@@ -13,6 +14,7 @@ class RootPage extends BasePage {
         this.authorPage = new AuthorPage(config);
         this.seriesPage = new SeriesPage(config);
         this.titlePage = new TitlePage(config);
+        this.genrePage = new GenrePage(config);
     }
 
     async body(req) {
@@ -30,6 +32,7 @@ class RootPage extends BasePage {
             this.authorPage.myEntry(),
             this.seriesPage.myEntry(),
             this.titlePage.myEntry(),
+            this.genrePage.myEntry(),
         ];
 
         return this.makeBody(result, req);

server/core/opds/SearchPage.js

@@ -15,6 +15,7 @@ class SearchPage extends BasePage {
         const query = {
             type: req.query.type || '',
             term: req.query.term || '',
+            genre: req.query.genre || '',
             page: parseInt(req.query.page, 10) || 1,
         };
 
@@ -27,7 +28,7 @@ class SearchPage extends BasePage {
 
                     const limit = 100;
                     const offset = (page - 1)*limit;
-                    const queryRes = await this.webWorker.search(from, {[from]: query.term, del: 0, offset, limit});
+                    const queryRes = await this.webWorker.search(from, {[from]: query.term, genre: query.genre, del: '0', offset, limit});
 
                     const found = queryRes.found;
 
@@ -98,6 +99,15 @@ class SearchPage extends BasePage {
                         '*TEXT': `Искать по названиям книг`,
                     },
                 }),
+                this.makeEntry({
+                    id: 'search_genre',
+                    title: 'Поиск книг в жанре',
+                    link: this.navLink({href: `/genre?from=search&term=${encodeURIComponent(query.term)}`}),
+                    content: {
+                        '*ATTRS': {type: 'text'},
+                        '*TEXT': `Искать по названиям книг в выбранном жанре`,
+                    },
+                }),
                 this.makeEntry({
                     id: 'search_help',
                     title: '[Памятка по поиску]',

server/core/opds/SeriesPage.js

@@ -26,7 +26,7 @@ class SeriesPage extends BasePage {
         const query = {
             series: req.query.series || '',
             genre: req.query.genre || '',
-            del: 0,
+            del: '0',
             
             all: req.query.all || '',
             depth: 0,
@@ -46,7 +46,7 @@ class SeriesPage extends BasePage {
 
             if (bookList.books) {
                 let books = bookList.books;
-                const booksAll = this.filterBooks(books, {del: 0});
+                const booksAll = this.filterBooks(books);
                 const filtered = (query.all ? booksAll : this.filterBooks(books, query));
                 const sorted = this.sortSeriesBooks(filtered);
 

server/core/opds/TitlePage.js

@@ -15,7 +15,7 @@ class TitlePage extends BasePage {
         const query = {
             title: req.query.title || '',
             genre: req.query.genre || '',
-            del: 0,
+            del: '0',
             
             depth: 0,
         };

server/index.js

@@ -84,7 +84,7 @@ async function init() {
     }
 
     if (!config.remoteLib) {
-        const libDir = argv['lib-dir'];
+        const libDir = argv['lib-dir'] || config.libDir;
         if (libDir) {
             if (await fs.pathExists(libDir)) {
                 config.libDir = libDir;
@@ -95,11 +95,12 @@ async function init() {
             config.libDir = config.execDir;
         }
 
-        if (argv.inpx) {
-            if (await fs.pathExists(argv.inpx)) {
-                config.inpxFile = argv.inpx;
+        const inpxFile = argv.inpx || config.inpx;
+        if (inpxFile) {
+            if (await fs.pathExists(inpxFile)) {
+                config.inpxFile = inpxFile;
             } else {
-                throw new Error(`File "${argv.inpx}" not found`);
+                throw new Error(`File "${inpxFile}" not found`);
             }
         } else {
             const inpxFiles = [];