diff --git a/docker/nginx/czydojade b/docker/nginx/czydojade index e9fbde6..0a33eed 100644 --- a/docker/nginx/czydojade +++ b/docker/nginx/czydojade @@ -26,4 +26,4 @@ server { internal; } } -} \ No newline at end of file +} diff --git a/resources/components/departures.html b/resources/components/departures.html index e2f02b8..20a1c04 100644 --- a/resources/components/departures.html +++ b/resources/components/departures.html @@ -2,8 +2,4 @@ -
- - Wybierz przystanki korzystając z wyszukiwarki poniżej, aby zobaczyć listę odjazdów. -
diff --git a/resources/components/settings/departures.html b/resources/components/settings/departures.html new file mode 100644 index 0000000..402fca6 --- /dev/null +++ b/resources/components/settings/departures.html @@ -0,0 +1,31 @@ + +
+

+ + +

+
+ +
+ +
+ s +
+
+
+
+
+ + +
+
diff --git a/resources/styles/_form.scss b/resources/styles/_form.scss index 7e14acc..14da9d3 100644 --- a/resources/styles/_form.scss +++ b/resources/styles/_form.scss @@ -38,6 +38,11 @@ label { margin-left: 0; } +.btn-addon:disabled { + opacity: 1; + color: rgba($dark, .5) +} + .input-group-prepend { margin-right: 0; } diff --git a/resources/ts/components/app.ts b/resources/ts/components/app.ts index c8cfd93..0d06caa 100644 --- a/resources/ts/components/app.ts +++ b/resources/ts/components/app.ts @@ -2,9 +2,8 @@ import Vue from 'vue' import store from '../store' import { Component, Watch } from "vue-property-decorator"; import { Mutation, Action } from 'vuex-class' -import { ObtainPayload } from "../store/departures"; import { Stop } from "../model"; -import { PopperComponent } from "./utils"; +import { DeparturesSettingsState } from "../store/settings/departures"; @Component({ store }) export class Application extends Vue { @@ -23,15 +22,9 @@ export class Application extends Vue { messages: { active: true, interval: 60 - }, - departures: { - active: true, - interval: 10 } }; - private count = 8; - private intervals = { messages: null, departures: null }; get messages() { @@ -60,16 +53,39 @@ export class Application extends Vue { this.$el.classList.remove('not-ready'); } + created() { + this.initDeparturesRefreshInterval(); + } + + private initDeparturesRefreshInterval() { + const departuresAutorefreshCallback = () => { + const {autorefresh, autorefreshInterval} = this.$store.state['departures-settings'] as DeparturesSettingsState; + + if (this.intervals.departures) { + clearInterval(this.intervals.departures); + } + + if (autorefresh) { + this.intervals.departures = setInterval(() => this.updateDepartures(), Math.max(5, autorefreshInterval) * 1000) + } + }; + + this.$store.watch(({"departures-settings": state}) => state.autorefresh, departuresAutorefreshCallback); + this.$store.watch(({"departures-settings": state}) => state.autorefreshInterval, departuresAutorefreshCallback); + + departuresAutorefreshCallback(); + } + @Action('messages/update') updateMessages: () => void; - @Action('departures/update') updateDepartures: (payload: ObtainPayload) => void; + @Action('departures/update') updateDepartures: () => void; @Mutation add: (stops: Stop[]) => void; @Mutation remove: (stop: Stop) => void; @Mutation clear: () => void; @Watch('stops') - onStopUpdate(this: any, stops) { - this.updateDepartures({ stops }); + onStopUpdate() { + this.updateDepartures(); } @Watch('autorefresh', { immediate: true, deep: true }) @@ -79,17 +95,8 @@ export class Application extends Vue { this.intervals.messages = null; } - if (this.intervals.departures) { - clearInterval(this.intervals.departures); - this.intervals.messages = null; - } - if (settings.messages.active) { this.intervals.messages = setInterval(() => this.updateMessages(), Math.max(5, settings.messages.interval) * 1000); } - - if (settings.departures.active) { - this.intervals.departures = setInterval(() => this.updateDepartures({ stops: this.stops }), Math.max(5, settings.departures.interval) * 1000); - } } } diff --git a/resources/ts/components/departures.ts b/resources/ts/components/departures.ts index 7668877..f85e846 100644 --- a/resources/ts/components/departures.ts +++ b/resources/ts/components/departures.ts @@ -1,21 +1,15 @@ import Vue from 'vue' -import { Departure, Stop } from "../model"; +import { Departure } from "../model"; import { Component, Prop, Watch } from "vue-property-decorator"; -import { namespace } from 'vuex-class'; -import store from '../store' +import store, { Departures } from '../store' import { Trip } from "../model/trip"; import urls from "../urls"; import { Jsonified } from "../utils"; import * as moment from "moment"; -const { State } = namespace('departures'); - @Component({ template: require("../../components/departures.html"), store }) export class DeparturesComponent extends Vue { - @State departures: Departure[]; - - @Prop(Array) - stops: Stop[]; + @Departures.State departures: Departure[]; } @Component({ template: require("../../components/departures/departure.html") }) diff --git a/resources/ts/components/index.ts b/resources/ts/components/index.ts index cda0742..337f4e2 100644 --- a/resources/ts/components/index.ts +++ b/resources/ts/components/index.ts @@ -10,3 +10,5 @@ export * from './app' export * from './favourites' export * from './trip' export * from './ui' +export * from './settings' +export { Departures } from "../store"; diff --git a/resources/ts/components/settings/departures.ts b/resources/ts/components/settings/departures.ts new file mode 100644 index 0000000..c7b2499 --- /dev/null +++ b/resources/ts/components/settings/departures.ts @@ -0,0 +1,21 @@ +import { Component, Prop } from "vue-property-decorator"; +import store, { DeparturesSettings } from "../../store"; +import Vue from "vue"; +import { DeparturesSettingsState } from "../../store/settings/departures"; + +@Component({ template: require("../../../components/settings/departures.html"), store }) +export class SettingsDepartures extends Vue { + @DeparturesSettings.State + public autorefresh: boolean; + + @DeparturesSettings.State + public autorefreshInterval: number; + + @DeparturesSettings.State + public displayedEntriesCount: number; + + @DeparturesSettings.Mutation + public update: (state: Partial) => void; +} + +Vue.component('SettingsDepartures', SettingsDepartures); diff --git a/resources/ts/components/settings/index.ts b/resources/ts/components/settings/index.ts new file mode 100644 index 0000000..10d35a6 --- /dev/null +++ b/resources/ts/components/settings/index.ts @@ -0,0 +1 @@ +export * from "./departures" diff --git a/resources/ts/store/common.ts b/resources/ts/store/common.ts index 49e12c0..9daa91b 100644 --- a/resources/ts/store/common.ts +++ b/resources/ts/store/common.ts @@ -1,7 +1,6 @@ import { FetchingState } from "../utils"; import { Moment } from "moment"; import { Module, MutationTree } from "vuex"; -import { RootState } from "./root"; import * as moment from "moment"; export interface CommonState { @@ -24,4 +23,4 @@ export const mutations: MutationTree = { } }; -export default { state, mutations }; \ No newline at end of file +export default { state, mutations }; diff --git a/resources/ts/store/departures.ts b/resources/ts/store/departures.ts index 220ac06..201cbca 100644 --- a/resources/ts/store/departures.ts +++ b/resources/ts/store/departures.ts @@ -10,10 +10,6 @@ export interface DeparturesState extends CommonState { departures: Departure[], } -export interface ObtainPayload { - stops: Stop[] -} - export const departures: Module = { namespaced: true, state: { @@ -29,10 +25,15 @@ export const departures: Module = { ...common.mutations }, actions: { - async update({ commit }, { stops }: ObtainPayload) { + async update({ commit }) { + const count = this.state['departures-settings'].displayedEntriesCount; + const stops = this.state.stops; + commit('fetching'); + const response = await fetch(urls.prepare(urls.departures, { stop: stops.map(stop => stop.id), + limit: count || 8, })); if (!response.ok) { diff --git a/resources/ts/store/index.ts b/resources/ts/store/index.ts index 0719309..0feca3b 100644 --- a/resources/ts/store/index.ts +++ b/resources/ts/store/index.ts @@ -4,9 +4,10 @@ import messages, { MessagesState } from './messages'; import departures, { DeparturesState } from './departures' import favourites, { FavouritesState, localStorageSaver } from './favourites' -import { state, mutations, actions, RootState } from "./root"; +import { actions, mutations, RootState, state } from "./root"; import VuexPersistence from "vuex-persist"; import { namespace } from "vuex-class"; +import departureSettings from "./settings/departures"; export type State = { messages: MessagesState; @@ -15,7 +16,7 @@ export type State = { } & RootState; const localStoragePersist = new VuexPersistence({ - reducer: state => ({ favourites: state.favourites }) + modules: ['favourites', 'departures-settings'], }); const sessionStoragePersist = new VuexPersistence({ @@ -25,7 +26,12 @@ const sessionStoragePersist = new VuexPersistence({ const store = new Vuex.Store({ state, mutations, actions, - modules: { messages, departures, favourites }, + modules: { + messages, + departures, + favourites, + 'departures-settings': departureSettings + }, plugins: [ // todo: remove after some time localStorageSaver('favourites.favourites', 'favourites'), @@ -37,3 +43,5 @@ const store = new Vuex.Store({ export default store; export const Favourites = namespace('favourites'); +export const DeparturesSettings = namespace('departures-settings'); +export const Departures = namespace('departures'); diff --git a/resources/ts/store/settings/departures.ts b/resources/ts/store/settings/departures.ts new file mode 100644 index 0000000..919c984 --- /dev/null +++ b/resources/ts/store/settings/departures.ts @@ -0,0 +1,24 @@ +import { ActionContext, Module } from "vuex"; +import { RootState } from "../root"; + +export type DeparturesSettingsState = { + autorefresh: boolean; + autorefreshInterval?: number; + displayedEntriesCount?: number; +} + +const departureSettings: Module = { + namespaced: true, + state: { + autorefresh: true, + autorefreshInterval: 10, + displayedEntriesCount: 10 + }, + mutations: { + update(state: DeparturesSettingsState, patch: Partial) { + Object.assign(state, patch); + } + } +}; + +export default departureSettings; diff --git a/src/Controller/Api/v1/DeparturesController.php b/src/Controller/Api/v1/DeparturesController.php index afa0798..2f98869 100644 --- a/src/Controller/Api/v1/DeparturesController.php +++ b/src/Controller/Api/v1/DeparturesController.php @@ -68,7 +68,7 @@ class DeparturesController extends Controller */ public function stops(DepartureRepository $departures, StopRepository $stops, Request $request) { - $stops = $stops->all(new IdFilter($request->query->get('stop'))); + $stops = $stops->all(new IdFilter($request->query->get('stop', []))); $result = $departures->current($stops, ...$this->getModifiersFromRequest($request)); return $this->json( diff --git a/templates/app.html.twig b/templates/app.html.twig index eb64bd6..d3b9f5f 100644 --- a/templates/app.html.twig +++ b/templates/app.html.twig @@ -73,38 +73,15 @@ -
-

- - -

-
- -
- -
- s -
-
-
-
-
- - -
+
- + +
+ + Wybierz przystanki korzystając z wyszukiwarki poniżej, aby zobaczyć listę odjazdów. +
{% if provider.attribution %}