🐛 fix focus on date, extend the empty all button to timespans

develop
Baptiste Lemoine 3 years ago
parent 1055a0cdbe
commit cf2a12507e
  1. 2
      package.json
  2. 14
      src/app/config/PollConfig.ts
  3. 1
      src/app/config/Routes.ts
  4. 1
      src/app/pages/dates/dates.component.html
  5. 20
      src/app/pages/dates/dates.component.ts

@ -32,9 +32,9 @@
"@angular/cli": "~8.2.1",
"@angular/compiler-cli": "~8.2.0",
"@angular/language-service": "~8.2.0",
"@types/node": "~8.9.4",
"@types/jasmine": "~3.3.8",
"@types/jasminewd2": "~2.0.3",
"@types/node": "~8.9.4",
"codelyzer": "^5.0.0",
"jasmine-core": "~3.4.0",
"jasmine-spec-reporter": "~4.2.1",

@ -2,13 +2,17 @@
* une option de date dans les sondages spéciaux
*/
export interface DateOption {
timeList: any;
literal: string;
}
export const timeOfDay = [{literal: 'matin'},
{literal: 'midi'},
{literal: 'après-midi'},
{literal: 'soirée'}];
export const timeOfDay = [{
timeList: [],
literal: 'matin'
},
{timeList: [], literal: 'midi'},
{timeList: [], literal: 'après-midi'},
{timeList: [], literal: 'soirée'}];
export const defaultDates = [
{
literal: `${new Date().getDate()}-${new Date().getMonth()}-${new Date().getFullYear()}`,
@ -37,7 +41,7 @@ export class PollConfig {
visibility = 'link_only';
// date specific poll
allowSeveralHours = 'true';
dateList: DateOption[] = defaultDates; // sets of days as strings
dateList: DateOption[] = defaultDates; // sets of days as strings, config to set identical time for days in a special days poll
timeList: DateOption[] = timeOfDay; // ranges of time expressed as strings
answers: any = [{
id: 0,

@ -18,6 +18,7 @@ export const Routes =
{path: '', component: CreateOrRetrieveComponent},
{path: 'home', component: HomeComponent},
{path: 'base', component: BaseComponent},
{path: 'step/base', component: BaseComponent},
{path: 'step/creation', component: CreateOrRetrieveComponent},
{path: 'step/date', component: DatesComponent},
{path: 'step/kind', component: KindComponent},

@ -32,6 +32,7 @@
class="btn btn-primary"
(click)="addtime()"
id="add_time_button"
*ngIf="config.allowSeveralHours=='false'"
>
{{"dates.addTime"|translate}}
</button>

@ -1,6 +1,7 @@
import {ChangeDetectorRef, Component, OnInit} from '@angular/core';
import {ChangeDetectorRef, Component, Inject, OnInit} from '@angular/core';
import {ConfigService} from '../../config.service';
import {BaseComponent} from '../base-page/base.component';
import {DOCUMENT} from '@angular/common';
@Component({
selector: 'framadate-dates',
@ -8,7 +9,10 @@ import {BaseComponent} from '../base-page/base.component';
styleUrls: ['./dates.component.scss']
})
export class DatesComponent extends BaseComponent implements OnInit {
constructor(public config: ConfigService, private cd: ChangeDetectorRef) {
constructor(public config: ConfigService,
private cd: ChangeDetectorRef,
@Inject(DOCUMENT) private document: any
) {
super(config);
}
@ -16,11 +20,11 @@ export class DatesComponent extends BaseComponent implements OnInit {
}
addDate() {
this.config.dateList.push({literal: ''});
this.config.dateList.push({literal: '', timeList: []});
}
addtime() {
this.config.timeList.push({literal: ''});
this.config.timeList.push({literal: '', timeList: []});
}
/**
@ -34,15 +38,19 @@ export class DatesComponent extends BaseComponent implements OnInit {
let selector = '[ng-reflect-name="dateTime_' + id + '_Choices_' + (config.timeList.length - 1) + '"]';
console.log('selector', selector);
this.cd.detectChanges();
const elem = document.querySelector(selector);
const elem = this.document.querySelector(selector);
if (elem) {
//this.elem.focus();
elem.focus();
}
}
emptyAll() {
this.config.dateList.forEach(element => {
element.literal = '';
element.timeList = ['', '', ''];
});
this.config.timeList.forEach(element => {
element.literal = '';
});
}
}

Loading…
Cancel
Save