Merge pull request #1561 from RADAR-base/release=2.6.1-alpha

Release 2.6.1-alpha

README.md

@@ -150,6 +150,8 @@ Certain values can be overriden using Firebase Remote Config. Specifically, the
 | `app_credits_body`              | Body of the popup box that appears when you tap on the app logo on the left hand side of the homepage.                                                                                                    | `Made with ♥ for you by the RADAR-Base community.`                                                        |
 | `auto_next_questionnaire_types` | String list of question/question input types where the questionnaire will automatically move to the next question upon answering the question. It is recommended to always include timed and audio types. | `timed,audio`                                                                                                    |
 | `skippable_questionnaire_types` | String list of question/question input types where the next button is enabled by default, allowing the question to be skippable.                                                                          | `audio`                                                                                                          |
+| `show_task_calendar_name`       | The task calendar by default shows the task timestamp instead of the task name. This allows showing of the task name instead of the timestamp.                                                            | `false`                                                                                                          |
+| `show_task_progress_count`      | In the questionnaire page, by default, only the task progress bar is shown. This config will enable the showing of the "question number / total questions" count.                                         | `false`                                                                                                          |
 
 #### Conditions
 
@@ -305,9 +307,10 @@ Here are some common errors you might find during installation.
 When you are running `ionic cordova run ios`, you might encounter the problem, we solved this problem by refering this [issue](https://github.com/dpa99c/cordova-custom-config/issues/144) with `cordova-custom-config`.
 
 We enter the following command at the root directory.
+
 ```
 cd plugins/cordova-custom-config
-yarn install 
+yarn install
 ```
 
 ### Error: Failed to fetch platform. Probably this is either a connection problem.

config.xml

@@ -1,5 +1,5 @@
 <?xml version='1.0' encoding='utf-8'?>
-<widget android-versionCode="570" id="org.phidatalab.radar_armt" ios-CFBundleIdentifier="org.phidatalab.radar-armt" ios-CFBundleVersion="1" version="2.6.0-alpha" xmlns:android="http://schemas.android.com/apk/res/android">
+<widget android-versionCode="571" id="org.phidatalab.radar_armt" ios-CFBundleIdentifier="org.phidatalab.radar-armt" ios-CFBundleVersion="1" version="2.6.1-alpha" xmlns:android="http://schemas.android.com/apk/res/android">
     <name>RADAR Questionnaire</name>
     <description>An application that collects active data for research.</description>
     <author email="[email protected]" href="http://radar-base.org/">RADAR-Base</author>

src/app/core/services/kafka/kafka.service.ts

@@ -85,8 +85,14 @@ export class KafkaService {
   }
 
   private fetchTopics() {
-    return this.http.get(this.KAFKA_CLIENT_URL + this.URI_topics, {observe: 'body'})
-      .toPromise()
+    return this.getAccessToken()
+      .then(accessToken => this.http.get(this.KAFKA_CLIENT_URL + this.URI_topics,
+        {
+          observe: 'body',
+          headers: new HttpHeaders()
+            .set('Authorization', 'Bearer ' + accessToken)
+            .set('Accept', DefaultClientAcceptType),
+        }).toPromise())
       .then((topics: string[]) => {
         this.topics = topics
         this.lastTopicFetch = Date.now()
@@ -173,7 +179,7 @@ export class KafkaService {
       .then(data =>
         this.http
           .post(this.KAFKA_CLIENT_URL + this.URI_topics + topic, data, {
-            headers: headers
+            headers
           })
           .toPromise()
       )
@@ -205,12 +211,17 @@ export class KafkaService {
     })
   }
 
-  getKafkaHeaders() {
+  getAccessToken() {
     return Promise.all([this.updateURI(), this.token.refresh()])
       .then(() => this.token.getTokens())
-      .then(tokens =>
+      .then(tokens => tokens.access_token)
+  }
+
+  getKafkaHeaders() {
+    return this.getAccessToken()
+      .then(accessToken =>
         new HttpHeaders()
-          .set('Authorization', 'Bearer ' + tokens.access_token)
+          .set('Authorization', 'Bearer ' + accessToken)
           .set('Content-Type', DefaultKafkaRequestContentType)
           .set('Accept', DefaultClientAcceptType)
       )

src/app/pages/home/components/task-calendar-row/task-calendar-row.component.html

@@ -0,0 +1,43 @@
+<div id="task-item" [class.task-item-name]="isTaskNameShown">
+  <ion-row>
+    <ion-col>
+      <div class="task-info-left">
+        <div class="start-time">
+          {{ taskLabel }}
+        </div>
+        <div>
+          <img
+            class="extra-info-icon"
+            *ngIf="task.warning"
+            src="assets/imgs/warning.png"
+          />
+        </div>
+      </div>
+      <div class="task-info-right">
+        <div class="metrics">
+          <div class="metric-time">
+            <img
+              class="icon-padding icon-xsm"
+              src="assets/imgs/stopwatch.png"
+            />
+            {{ task.estimatedCompletionTime }}
+            <span class="units">min</span>
+          </div>
+          <div class="metric-q">
+            <img class="icon-padding icon-xsm" src="assets/imgs/nTasks.png" />
+            {{ task.nQuestions }}
+            <span class="units">x</span>
+          </div>
+        </div>
+        <div class="status-div">
+          <div *ngIf="!task.completed">
+            <ion-icon name="radio-button-off" class="status"></ion-icon>
+          </div>
+          <div *ngIf="task.completed">
+            <ion-icon name="checkmark" class="status-checked"></ion-icon>
+          </div>
+        </div>
+      </div>
+    </ion-col>
+  </ion-row>
+</div>

src/app/pages/home/components/task-calendar-row/task-calendar-row.component.scss

@@ -0,0 +1,92 @@
+task-calendar-row {
+  #task-item {
+    display: block;
+    margin-bottom: 3px;
+    padding: 3px 9px;
+    padding-bottom: 0;
+    background-color: $cl-primary-40;
+    text-align: center;
+    font-size: 18px;
+  }
+
+  .task-item-name {
+    font-size: 15px !important;
+  }
+
+  .units {
+    margin-right: 2px;
+    font-size: 12px;
+  }
+
+  .icon-padding {
+    padding-right: 5px;
+    padding-left: 5px;
+  }
+
+  .extra-info-icon {
+    padding-left: 3px;
+  }
+
+  .icon-xsm {
+    height: 14px;
+  }
+
+  .task-info-left {
+    display: inline-flex;
+    float: left;
+    padding-left: 5px;
+    width: auto;
+  }
+
+  .task-info-right {
+    display: inline-flex;
+    float: right;
+    margin-right: 10px;
+    max-width: 160px;
+    width: 160px;
+  }
+
+  .metrics {
+    display: inline-flex;
+    float: left;
+    margin-right: 8px;
+    text-align: left;
+  }
+
+  .metric-time {
+    float: left;
+    margin-right: 10px;
+    width: 64px;
+    white-space: nowrap;
+  }
+
+  .metric-q {
+    float: left;
+    width: 56px;
+    white-space: nowrap;
+  }
+
+  .status-div {
+    float: right;
+    margin-top: -8px;
+    margin-right: 8px;
+    margin-bottom: -7px;
+    padding-top: 5px;
+    padding-bottom: 5px;
+    width: 24px;
+  }
+
+  .status {
+    color: map-get($colors, tertiary);
+    font-size: 26px;
+  }
+
+  .status-checked {
+    padding-top: 2px;
+    width: 23px;
+    height: 23px;
+    border-radius: 50%;
+    background-color: map-get($colors, tertiary);
+    font-size: 21px;
+  }
+}

src/app/pages/home/components/task-calendar-row/task-calendar-row.component.ts

@@ -0,0 +1,28 @@
+import { Component, Input, OnInit } from '@angular/core'
+
+import { LocalizationService } from '../../../../core/services/misc/localization.service'
+import { Task } from '../../../../shared/models/task'
+
+@Component({
+  selector: 'task-calendar-row',
+  templateUrl: 'task-calendar-row.component.html'
+})
+export class TaskCalendarRowComponent implements OnInit {
+  @Input()
+  isTaskNameShown: boolean
+  @Input()
+  task
+
+  taskLabel: string
+
+  constructor(private localization: LocalizationService) {}
+
+  ngOnInit() {
+    if (this.isTaskNameShown) this.taskLabel = this.task.name
+    else this.taskLabel = this.getStartTime(this.task)
+  }
+
+  getStartTime(task: Task) {
+    return this.localization.moment(task.timestamp).format('HH:mm')
+  }
+}

src/app/pages/home/components/task-calendar-row/task-calendar-row.module.ts

@@ -0,0 +1,19 @@
+import { CommonModule } from '@angular/common'
+import { NgModule } from '@angular/core'
+import { IonicModule } from 'ionic-angular'
+import { MomentModule } from 'ngx-moment'
+
+import { TaskCalendarRowComponent } from './task-calendar-row.component'
+
+const COMPONENTS = [TaskCalendarRowComponent]
+
+@NgModule({
+  imports: [
+    MomentModule,
+    CommonModule,
+    IonicModule.forRoot(TaskCalendarRowComponent)
+  ],
+  declarations: COMPONENTS,
+  exports: COMPONENTS
+})
+export class TaskCalendarRowModule {}