add mods download

app/app-detail.component.html

 <h1>{{'app.' + currentApp.id + '.name' | translate}}</h1>
 <h2>{{appsService._aa}}</h2>
 <div *ngIf="!isInstalled">
-    <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#install-modal">安装</button>
-    <button type="button" class="btn btn-secondary">导入</button>
-    <button type="button" class="btn btn-secondary">正版代购</button>
+    <div *ngIf="!appsService.getDownloadInfo(routingService.app)">
+        <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#install-modal">安装</button>
+        <button type="button" class="btn btn-secondary">导入</button>
+        <button type="button" class="btn btn-secondary">正版代购</button>
+    </div>
+    <div *ngIf="appsService.getDownloadInfo(routingService.app)">
+        <progress *ngIf="appsService.getDownloadInfo(routingService.app).status === 'active'" class="progress progress-striped progress-animated" value="{{appsService.getDownloadInfo(mod.id).progress}}" max="100"></progress>
+    </div>
 </div>
 <div *ngIf="isInstalled">
     <button type="button" class="btn btn-primary">运行</button>
@@ -57,16 +62,19 @@
             <td *ngIf="checkInstall(mod.id)">
                 <button type="button" class="btn btn-danger btn-sm">卸载</button></td>
             <td *ngIf="!checkInstall(mod.id)">
-                <button (click)="install(mod.id)" type="button" class="btn btn-primary btn-sm">安装</button>
-                <progress class="progress progress-striped progress-animated" value="25" max="100"></progress>
-                {{appsService.getDownloadStatus(mod.id) | json}}
-                {{appsService.downloads_info | json}}
+                <button *ngIf="!appsService.getDownloadInfo(mod.id)" (click)="install(mod.id)" type="button" class="btn btn-primary btn-sm">安装</button>
+                <progress *ngIf="appsService.getDownloadInfo(mod.id) && appsService.getDownloadInfo(mod.id).status === 'active'" class="progress progress-striped progress-animated" value="{{appsService.getDownloadInfo(mod.id).progress}}" max="100"></progress>
             </td>
         </tr>
         </tbody>
     </table>
 </div>
 
+<!== DEBUG -->
+<pre class="debug">
+{{appsService.downloadsInfo | json}}
+</pre>
+
 <!-- Modal -->
 <div class="modal fade" id="install-modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
      aria-hidden="true">
@@ -106,7 +114,7 @@
                 <h4>附加内容</h4>
                 <div *ngFor="let mod of currentApp.references[platform]">
                     <label>
-                        <input type="checkbox" (ngModel)="__todo__"
+                        <input type="checkbox" [(ngModel)]="model" name="{{mod.id}}"
                                [disabled]="['dependency', 'runtime'].includes(mod.type)">
                         {{searchApp(mod.id).name[searchApp(mod.id).locales[0]]}}
                     </label>
@@ -116,6 +124,7 @@
                 <button type="button" class="btn btn-secondary" data-dismiss="modal">取消</button>
                 <button type="button" class="btn btn-primary">安装</button>
             </div>
+            <pre>{{model}}</pre>
         </form>
     </div>
 </div>

app/app-detail.component.ts

@@ -33,6 +33,7 @@ export class AppDetailComponent {
         return this.checkInstall(this.routingService.app);
     }
 
+
     _news;
     get news() {
         if(this.currentApp) {
@@ -112,4 +113,6 @@ export class AppDetailComponent {
 
     }
 
+    model;
+
 }

app/apps.service.ts

@@ -12,7 +12,18 @@ export class AppsService {
         let loop = setInterval(()=> {
             this.aria2.tellActive().then((res)=> {
                 console.log('res:', res);
-                this.downloadsInfo = res;
+                if(res) {
+                    res.map((v)=>{
+                        let index = this.downloadsInfo.findIndex((info)=>{
+                            return info.gid == v.gid;
+                        });
+                        this.downloadsInfo[index].progress = (v.completedLength / v.totalLength) * 100;
+
+                    });
+
+                }
+
+                //this.downloadsInfo = res;
             })
         }, 1000);
 
@@ -25,7 +36,9 @@ export class AppsService {
     Aria2 = window['System']._nodeRequire('aria2');
 
     data: App[];
-    downloadsInfo = {};
+
+    //[{"id": "th01", "gid": "aria2gid", "status": "active/install/complete/wait", "progress": "0-100"}]
+    downloadsInfo = [];
 
 
     aria2IsOpen = false;
@@ -45,12 +58,21 @@ export class AppsService {
             };
             this._aria2.onDownloadComplete = (response)=> {
                 console.log(response);
-                //aria2.tellStatus(tmp_gid, (err, res)=>{
-                //    if(res.followedBy) {
-                //        this.downloadsInfo[id] = res.followedBy[0];
-                //    }
-                //    console.log(res);
-                //});
+                this.aria2.tellStatus(response.gid, (err, res)=>{
+                    console.log(res);
+                    let index = this.downloadsInfo.findIndex((v)=>{return v.gid == res.gid});
+                    if(index !== -1) {
+                        if(res.followedBy) {
+                            this.downloadsInfo[index].gid = res.followedBy[0];
+                            this.downloadsInfo[index].progress = 0;
+
+                        } else {
+                            this.downloadsInfo[index].status = "wait";
+                        }
+                    } else {
+                        console.log("cannot found download info!");
+                    }
+                });
             };
             this._aria2.onmessage = (m)=> {
                 console.log('IN:', m);
@@ -117,20 +139,30 @@ export class AppsService {
         console.log(id);
         console.log(uri);
         let tmp_gid;
-        this.aria2.addUri([uri], {'dir': this.download_dir}, (error, gid)=> {
-            if (error) {
-                console.error(error);
-            }
-            console.log(gid);
-            tmp_gid = gid;
-        });
+        let i = this.downloadsInfo.findIndex((v)=>{return v.id == id});
+        console.log(i);
+        if(this.downloadsInfo.findIndex((v)=>{return v.id == id}) !== -1) {
+            console.log("this app downloading")
+
+        } else {
+            this.aria2.addUri([uri], {'dir': this.download_dir}, (error, gid)=> {
+                if (error) {
+                    console.error(error);
+                }
+                console.log(gid);
+                this.downloadsInfo.push({"id": id, "gid": gid, "status": "active", "progress": 0});
+            });
+        }
 
-    }
 
-    getDownloadStatus(id) {
 
-        let info = {};
+    }
 
+    getDownloadInfo(id) {
+        let info;
+        info = this.downloadsInfo.find((v)=>{
+            return v.id == id;
+        });
 
         return info;
 

app/mycard.module.ts

 import {NgModule, NO_ERRORS_SCHEMA}      from '@angular/core';
 import {BrowserModule} from '@angular/platform-browser';
+import {FormsModule} from '@angular/forms';
 import {HttpModule}    from '@angular/http';
 
 import {MyCardComponent}  from './mycard.component';
@@ -18,7 +19,7 @@ import {AppsService} from './apps.service';
 import {TranslateModule} from 'ng2-translate/ng2-translate';
 
 @NgModule({
-    imports: [BrowserModule, HttpModule, TranslateModule.forRoot()],
+    imports: [BrowserModule, FormsModule, HttpModule, TranslateModule.forRoot()],
     declarations: [MyCardComponent, LoginComponent, StoreComponent, LobbyComponent, CommunityComponent, AppsComponent, AppDetailComponent, RosterComponent, CandyComponent],
     bootstrap: [MyCardComponent],
     providers: [RoutingService, AppsService],