[gnome-maps/wip/mlundblad/transit-abbreviations] transitItineraryRow: Ellipsize long lists



commit fe9a0dc8017c6e70ec80e4caefb2e12cb895a452
Author: Marcus Lundblad <ml update uu se>
Date:   Wed Nov 13 22:10:18 2019 +0100

    transitItineraryRow: Ellipsize long lists
    
    Add a middle ellipsis when more than eight
    legs in an itinerary to avoid overflowing
    the sidebar.

 src/transitItineraryRow.js | 22 +++++++++++++++++++++-
 1 file changed, 21 insertions(+), 1 deletion(-)
---
diff --git a/src/transitItineraryRow.js b/src/transitItineraryRow.js
index 239c529b..c93cc385 100644
--- a/src/transitItineraryRow.js
+++ b/src/transitItineraryRow.js
@@ -24,6 +24,9 @@ const Gtk = imports.gi.Gtk;
 
 const TransitRouteLabel = imports.transitRouteLabel;
 
+// maximum number of legs to show before abbreviating with a … in the middle
+const MAX_LEGS_SHOWN = 8;
+
 var TransitItineraryRow = GObject.registerClass({
     Template: 'resource:///org/gnome/Maps/ui/transit-itinerary-row.ui',
     InternalChildren: ['timeLabel',
@@ -59,7 +62,24 @@ var TransitItineraryRow = GObject.registerClass({
         let estimatedSpace = this._calculateEstimatedSpace();
         let useContractedLabels = estimatedSpace > 26;
 
-        this._itinerary.legs.forEach((leg, i) => {
+        if (length > MAX_LEGS_SHOWN) {
+            // ellipsize list with horizontal dots to avoid overlowing
+            this._renderLegs(this._itinerary.legs.slice(0, MAX_LEGS_SHOWN / 2),
+                             true, true);
+            this._summaryGrid.add(new Gtk.Label({ visible: true,
+                                                  label: '\u22ef' } ));
+            this._renderLegs(this._itinerary.legs.slice(-MAX_LEGS_SHOWN / 2),
+                             true, true);
+        } else {
+            this._renderLegs(this._itinerary.legs, useCompact,
+                             useContractedLabels);
+        }
+    }
+
+    _renderLegs(legs, useCompact, useContractedLabels) {
+        let length = legs.length;
+
+        legs.forEach((leg, i) =>  {
             this._summaryGrid.add(this._createLeg(leg, useCompact,
                                                   useContractedLabels));
             if (i !== length - 1)


[Date Prev][Date Next]   [Thread Prev][Thread Next]   [Thread Index] [Date Index] [Author Index]