adding photo counter to navbar

README.md

@@ -15,6 +15,7 @@ Live Demo @ heroku: https://pigallery2.herokuapp.com/
 1. [Getting started](#getting-started-on-raspberry-pi-1)
 3. [Translate the page to your own language](#translate-the-page-to-your-own-language)
 2. [Feature list](#feature-list)
+2. [Known errors](#known-errors)
 4. [Credits](#credits) 
 
 

frontend/app/gallery/navigator/navigator.gallery.component.css

@@ -2,13 +2,23 @@
   position: relative;
 }
 
-.btn-group {
+.right-side {
   position: absolute;
   right: 1rem;
   top: 50%;
   transform: translateY(-50%);
 }
 
+.photos-count {
+  display: inline-block;
+}
+
+.divider{
+  margin: 5px 10px;
+  border-left: 1px solid #6c757d;
+  display: inline-block;
+}
+
 ol {
   padding-right: 130px;
 }
@@ -23,9 +33,10 @@ ol {
   cursor: pointer;
 }
 
-nav{
+nav {
   z-index: 1;
 }
+
 .dropdown-toggle::after {
-  display:none;
+  display: none;
 }

frontend/app/gallery/navigator/navigator.gallery.component.html

@@ -7,20 +7,27 @@
     </li>
   </ol>
 
-  <div class="btn-group" dropdown placement="bottom right">
+  <div class="right-side">
-    <button id="button-alignment" dropdownToggle type="button"
+    <div class="photos-count" *ngIf="directory.photos.length > 0">
-            class="btn btn-default dropdown-toggle" aria-controls="dropdown-alignment"
+      {{directory.photos.length}} <span i18n>items</span>
-            [innerHTML]="galleryService.sorting.value| iconizeSorting">
+    </div>
-    </button>
+    <div class="divider" *ngIf="directory.photos.length > 0">&nbsp;</div>
-    <ul id="dropdown-alignment" *dropdownMenu class="dropdown-menu dropdown-menu-right"
+    <div class="btn-group" dropdown placement="bottom right">
-        role="menu" aria-labelledby="button-alignment">
+      <button id="button-alignment" dropdownToggle type="button"
-      <li class="row dropdown-item" role="menuitem"
+              class="btn btn-default dropdown-toggle" aria-controls="dropdown-alignment"
-          *ngFor="let type of sortingMethodsType"
+              [innerHTML]="galleryService.sorting.value| iconizeSorting">
-          (click)="setSorting(type.key)">
+      </button>
-        <div class="col-3" [outerHTML]="type.key | iconizeSorting"></div>
+      <ul id="dropdown-alignment" *dropdownMenu class="dropdown-menu dropdown-menu-right"
-        <div class="col-9">{{type.key | stringifySorting}}</div>
+          role="menu" aria-labelledby="button-alignment">
-      </li>
+        <li class="row dropdown-item" role="menuitem"
-    </ul>
+            *ngFor="let type of sortingMethodsType"
+            (click)="setSorting(type.key)">
+          <div class="col-3" [outerHTML]="type.key | iconizeSorting"></div>
+          <div class="col-9">{{type.key | stringifySorting}}</div>
+        </li>
+      </ul>
+    </div>
   </div>
+
 </nav>
 

frontend/translate/messages.en.xlf

@@ -198,7 +198,7 @@
         <source>Settings</source>
         <context-group purpose="location">
           <context context-type="sourcefile">app/frame/frame.component.html</context>
-          <context context-type="linenumber">41</context>
+          <context context-type="linenumber">42</context>
         </context-group>
         <target>Settings</target>
       </trans-unit>
@@ -206,7 +206,7 @@
         <source>Logout</source>
         <context-group purpose="location">
           <context context-type="sourcefile">app/frame/frame.component.html</context>
-          <context context-type="linenumber">47</context>
+          <context context-type="linenumber">48</context>
         </context-group>
         <target>Logout</target>
       </trans-unit>
@@ -295,6 +295,14 @@
         </context-group>
         <target>Months</target>
       </trans-unit>
+      <trans-unit id="064ce5140698af55532d5c8c6355e4605d2bcc1b" datatype="html">
+        <source>items</source>
+        <context-group purpose="location">
+          <context context-type="sourcefile">app/gallery/navigator/navigator.gallery.component.html</context>
+          <context context-type="linenumber">12</context>
+        </context-group>
+        <target>items</target>
+      </trans-unit>
       <trans-unit id="ac9751501a838bfb31f23e94ceb9616fe498a267" datatype="html">
         <source>
         Server notifications
@@ -890,9 +898,7 @@
           <context context-type="sourcefile">app/settings/random-photo/random-photo.settings.component.html</context>
           <context context-type="linenumber">25</context>
         </context-group>
-        <target>This feature enables you to generate 'random photo' urls.
+        <target>This feature enables you to generate 'random photo' urls. That URL returns a photo random selected from your gallery. You can use the url with 3rd party like random changing desktop background.</target>
-          That URL returns a photo random selected from your gallery.
-          You can use the url with 3rd party like random changing desktop background.</target>
       </trans-unit>
       <trans-unit id="6c02e8541a2e670f80de8b5a218ea14a16bb6c42" datatype="html">
         <source>

frontend/translate/messages.hu.xlf

@@ -198,7 +198,7 @@
         <source>Settings</source>
         <context-group purpose="location">
           <context context-type="sourcefile">app/frame/frame.component.html</context>
-          <context context-type="linenumber">41</context>
+          <context context-type="linenumber">42</context>
         </context-group>
         <target>Beállítások</target>
       </trans-unit>
@@ -206,7 +206,7 @@
         <source>Logout</source>
         <context-group purpose="location">
           <context context-type="sourcefile">app/frame/frame.component.html</context>
-          <context context-type="linenumber">47</context>
+          <context context-type="linenumber">48</context>
         </context-group>
         <target>Kijelentkezés</target>
       </trans-unit>
@@ -295,6 +295,14 @@
         </context-group>
         <target>Hónapok</target>
       </trans-unit>
+      <trans-unit id="064ce5140698af55532d5c8c6355e4605d2bcc1b" datatype="html">
+        <source>items</source>
+        <context-group purpose="location">
+          <context context-type="sourcefile">app/gallery/navigator/navigator.gallery.component.html</context>
+          <context context-type="linenumber">12</context>
+        </context-group>
+        <target>elem</target>
+      </trans-unit>
       <trans-unit id="ac9751501a838bfb31f23e94ceb9616fe498a267" datatype="html">
         <source>
         Server notifications
@@ -890,9 +898,7 @@
           <context context-type="sourcefile">app/settings/random-photo/random-photo.settings.component.html</context>
           <context context-type="linenumber">25</context>
         </context-group>
-        <target>Ez a funkció lehetővé teszi a "véletlenszerű fotó" URL-ek létrehozását.
+        <target>Ez a funkció lehetővé teszi a "véletlenszerű fotó" URL-ek létrehozását. Ez az URL egy galériából kiválasztott véletlenszerű fényképet jelenít meg. Használhatja az url-t külső alkalmazásokhoz, például a asztali háttérkép beállításához.</target>
-          Ez az URL egy galériából kiválasztott véletlenszerű fényképet jelenít meg.
-          Használhatja az url-t külső alkalmazásokhoz, például a asztali háttérkép beállításához.</target>
       </trans-unit>
       <trans-unit id="6c02e8541a2e670f80de8b5a218ea14a16bb6c42" datatype="html">
         <source>