sort full history in chronological order (ascending by time)

This feels more intuitive. The snippet on the landing page remains in
reverse chronological order (descending by time).

7 files changed, 104 insertions, 47 deletions

diff --git a/lib/Travelynx/Controller/Traveling.pm b/lib/Travelynx/Controller/Traveling.pm
index 28d7bfd..da889f0 100755
--- a/lib/Travelynx/Controller/Traveling.pm
+++ b/lib/Travelynx/Controller/Traveling.pm
@@ -1582,6 +1582,7 @@ sub yearly_history {
 		uid           => $self->current_user->{id},
 		after         => $interval_start,
 		before        => $interval_end,
+		sort          => 'asc',
 		with_datetime => 1
 	);
 
@@ -1664,6 +1665,7 @@ sub monthly_history {
 		uid           => $self->current_user->{id},
 		after         => $interval_start,
 		before        => $interval_end,
+		sort          => 'asc',
 		with_datetime => 1
 	);
 
diff --git a/lib/Travelynx/Model/Journeys.pm b/lib/Travelynx/Model/Journeys.pm
index 40ccfa8..d49c03d 100755
--- a/lib/Travelynx/Model/Journeys.pm
+++ b/lib/Travelynx/Model/Journeys.pm
@@ -698,9 +698,14 @@ sub get {
 		user_id   => $uid,
 		cancelled => 0
 	);
+
+	my $order_key = '-desc';
+	if ( $opt{sort} and $opt{sort} eq 'asc' ) {
+		$order_key = '-asc';
+	}
 	my %order = (
 		order_by => {
-			-desc => 'real_dep_ts',
+			$order_key => 'real_dep_ts',
 		}
 	);
 
diff --git a/sass/src/common/local.scss b/sass/src/common/local.scss
index 9c03675..c0552eb 100644
--- a/sass/src/common/local.scss
+++ b/sass/src/common/local.scss
@@ -163,15 +163,30 @@ ul.route-history > li {
 	}
 
 	// route icon bubble
-	i.material-icons {
-		&[aria-label=nach] {
-			padding-top: 0.4rem;
+	&.order-asc {
+		i.material-icons {
+			&[aria-label=von] {
+				display: block;
+				transform: rotate(90deg);
+				height: 1rem;
+				margin-top: 0.4rem;
+			}
+			&[aria-label=nach] {
+				padding-top: 0.4rem;
+			}
 		}
-		&[aria-label=von] {
-			display: block;
-			transform: rotate(-90deg);
-			height: 1rem;
-			margin-top: 0.4rem;
+	}
+	&.order-desc {
+		i.material-icons {
+			&[aria-label=nach] {
+				padding-top: 0.4rem;
+			}
+			&[aria-label=von] {
+				display: block;
+				transform: rotate(-90deg);
+				height: 1rem;
+				margin-top: 0.4rem;
+			}
 		}
 	}
 
diff --git a/templates/_history_trains.html.ep b/templates/_history_trains.html.ep
index 0a9abd5..3550c79 100644
--- a/templates/_history_trains.html.ep
+++ b/templates/_history_trains.html.ep
@@ -27,44 +27,79 @@
 					</span>
 				</a>
 
-				<ul class="route-history">
-					<li>
-						<i class="material-icons tiny" aria-label="nach">radio_button_unchecked</i>
-
-						<a href="<%= $detail_link %>" class="unmarked">
-						% if (param('cancelled') and $travel->{sched_arrival}->epoch != 0) {
-							%= $travel->{sched_arrival}->strftime('%H:%M')
-						% }
-						% else {
-							% if ($travel->{rt_arrival}->epoch == 0 and $travel->{sched_arrival}->epoch == 0) {
-								<i class="material-icons">timer_off</i>
-							% } else {
-								%= $travel->{rt_arrival}->strftime('%H:%M');
-								% if ($travel->{delay_arr} and int($travel->{delay_arr} / 60)) {
-									(<%= sprintf('%+d', $travel->{delay_arr} / 60) %>)
+				<ul class="route-history route-history-<%= stash('order') // q{} %>">
+					% if (stash('order') and stash('order') eq 'asc') {
+						<li class="order-asc">
+							<i class="material-icons tiny" aria-label="von">play_circle_filled</i>
+							<a href="<%= $detail_link %>" class="unmarked">
+							% if (param('cancelled')) {
+								%= $travel->{sched_departure}->strftime('%H:%M')
+							% }
+							% else {
+								<%= $travel->{rt_departure}->strftime('%H:%M') %>
+								% if ($travel->{delay_dep} and int($travel->{delay_dep} / 60)) {
+									(<%= sprintf('%+d', $travel->{delay_dep} / 60) %>)
 								% }
 							% }
-						% }
-						<strong><%= $travel->{to_name} %></strong>
-						</a>
-					</li>
-
-					<li>
-						<i class="material-icons tiny" aria-label="von">play_circle_filled</i>
-
-						<a href="<%= $detail_link %>" class="unmarked">
-						% if (param('cancelled')) {
-							%= $travel->{sched_departure}->strftime('%H:%M')
-						% }
-						% else {
-							<%= $travel->{rt_departure}->strftime('%H:%M') %>
-							% if ($travel->{delay_dep} and int($travel->{delay_dep} / 60)) {
-								(<%= sprintf('%+d', $travel->{delay_dep} / 60) %>)
+							<strong><%= $travel->{from_name} %></strong>
+							</a>
+						</li>
+						<li class="order-asc">
+							<i class="material-icons tiny" aria-label="nach">radio_button_unchecked</i>
+							<a href="<%= $detail_link %>" class="unmarked">
+							% if (param('cancelled') and $travel->{sched_arrival}->epoch != 0) {
+								%= $travel->{sched_arrival}->strftime('%H:%M')
 							% }
-						% }
-						<strong><%= $travel->{from_name} %></strong>
-						</a>
-					</li>
+							% else {
+								% if ($travel->{rt_arrival}->epoch == 0 and $travel->{sched_arrival}->epoch == 0) {
+									<i class="material-icons">timer_off</i>
+								% } else {
+									%= $travel->{rt_arrival}->strftime('%H:%M');
+									% if ($travel->{delay_arr} and int($travel->{delay_arr} / 60)) {
+										(<%= sprintf('%+d', $travel->{delay_arr} / 60) %>)
+									% }
+								% }
+							% }
+							<strong><%= $travel->{to_name} %></strong>
+							</a>
+						</li>
+					% }
+					% else {
+						<li class="order-desc">
+							<i class="material-icons tiny" aria-label="nach">radio_button_unchecked</i>
+							<a href="<%= $detail_link %>" class="unmarked">
+							% if (param('cancelled') and $travel->{sched_arrival}->epoch != 0) {
+								%= $travel->{sched_arrival}->strftime('%H:%M')
+							% }
+							% else {
+								% if ($travel->{rt_arrival}->epoch == 0 and $travel->{sched_arrival}->epoch == 0) {
+									<i class="material-icons">timer_off</i>
+								% } else {
+									%= $travel->{rt_arrival}->strftime('%H:%M');
+									% if ($travel->{delay_arr} and int($travel->{delay_arr} / 60)) {
+										(<%= sprintf('%+d', $travel->{delay_arr} / 60) %>)
+									% }
+								% }
+							% }
+							<strong><%= $travel->{to_name} %></strong>
+							</a>
+						</li>
+						<li class="order-desc">
+							<i class="material-icons tiny" aria-label="von">play_circle_filled</i>
+							<a href="<%= $detail_link %>" class="unmarked">
+							% if (param('cancelled')) {
+								%= $travel->{sched_departure}->strftime('%H:%M')
+							% }
+							% else {
+								<%= $travel->{rt_departure}->strftime('%H:%M') %>
+								% if ($travel->{delay_dep} and int($travel->{delay_dep} / 60)) {
+									(<%= sprintf('%+d', $travel->{delay_dep} / 60) %>)
+								% }
+							% }
+							<strong><%= $travel->{from_name} %></strong>
+							</a>
+						</li>
+					% }
 				</ul>
 			</li>
 		% }
diff --git a/templates/history_by_month.html.ep b/templates/history_by_month.html.ep
index dec4c8b..217177b 100644
--- a/templates/history_by_month.html.ep
+++ b/templates/history_by_month.html.ep
@@ -11,5 +11,5 @@
 </div>
 
 % if (stash('journeys')) {
-	%= include '_history_trains', date_format => '%d.%m.', journeys => stash('journeys');
+	%= include '_history_trains', date_format => '%d.%m.', journeys => stash('journeys'), order => 'asc';
 % }
diff --git a/templates/history_by_year.html.ep b/templates/history_by_year.html.ep
index 4fe87ab..5c034b3 100644
--- a/templates/history_by_year.html.ep
+++ b/templates/history_by_year.html.ep
@@ -32,5 +32,5 @@
 % }
 
 % if (stash('journeys')) {
-	%= include '_history_trains', date_format => '%d.%m.', journeys => stash('journeys');
+	%= include '_history_trains', date_format => '%d.%m.', journeys => stash('journeys'), order => 'asc';
 % }
diff --git a/templates/landingpage.html.ep b/templates/landingpage.html.ep
index 189fac4..ff775250 100644
--- a/templates/landingpage.html.ep
+++ b/templates/landingpage.html.ep
@@ -106,7 +106,7 @@
 		</div>
 	% }
 	<h2 style="margin-left: 0.75rem;"><%= L('landingpage.latest-trips') %></h2>
-	%= include '_history_trains', date_format => L('landingpage.date-format'), journeys => [journeys->get(uid => $user->{id}, limit => 5, with_datetime => 1)];
+	%= include '_history_trains', date_format => L('landingpage.date-format'), journeys => [journeys->get(uid => $user->{id}, limit => 5, with_datetime => 1)], order => 'desc';
 % }
 % else {
 	<div class="row">