added filenames back to media items

Author: Devendork

src/app/core/modal/imageeditor/imageeditor.component.html

@@ -2,14 +2,15 @@
 cdkDrag
  cdkDragRootElement=".cdk-overlay-pane" 
  cdkDragHandle>
- Manage Image Colors
+ <span *ngIf="editable">View/Edit Image Colors</span>
+ <span *ngIf="!editable">View Image Colors</span>
 </p>
 
 
 <mat-dialog-content >
 
     <div class="content_left">
-        <p>Use this editor to modify the color space of your image. You can do this grouping colors together that you would like the software to treat as the same.</p>
+        <p *ngIf="editable">Use this editor to modify the color space of your image. You can do this grouping colors together that you would like the software to treat as the same.</p>
 
         <div class="image_preview" id="image_preview">
             <canvas id="preview_canvas"></canvas>
@@ -41,7 +42,7 @@
                      <!--color mapped to-->
                     <mat-form-field>
                         <mat-label>groups with:</mat-label>
-                        <mat-select [(value)]="color.to" (selectionChange)="mappingChanged(color.from, $event)">
+                        <mat-select [disabled]="!editable" [(value)]="color.to" (selectionChange)="mappingChanged(color.from, $event)">
                             <mat-option *ngFor="let to_color of img.colors; index as i" [value]="i">  
                                 <div class="swatch" [style.background-color]="to_color.hex">
                                     <div class="centered_id">{{i}}</div>

src/app/core/modal/imageeditor/imageeditor.component.ts

@@ -17,6 +17,7 @@ export class ImageeditorComponent {
   img: AnalyzedImage;
   color_table: Array<{from: number, from_hex:string, to:number, to_hex: string}>;
   resulting_color_space: Array<{from: number, from_hex:string, to:number, to_hex: string}>;
+  editable: boolean = true;
 
   constructor(
     public tree: TreeService,
@@ -26,7 +27,11 @@ export class ImageeditorComponent {
     @Inject(MAT_DIALOG_DATA) public obj: any){
 
 
-      this.media_id = obj;
+      if(obj.src == 'bwimagemap'){
+        this.editable = false;
+      }
+
+      this.media_id = obj.media_id;
       const media_item = <IndexedColorImageInstance> this.mediaService.getMedia(this.media_id);
       this.img = media_item.img;
 

src/app/core/operations/bwimagemap/bwimagemap.ts

@@ -1,6 +1,6 @@
 import { createCell } from "../../model/cell";
-import { AnalyzedImage, Cell, Color, Draft, DynamicOperation, FileParam, NumParam, OperationInlet, OpInput, OpParamVal } from "../../model/datatypes";
-import { getHeddle, initDraftFromDrawdown, initDraftWithParams, warps, wefts } from "../../model/drafts";
+import { AnalyzedImage, Cell, Draft, DynamicOperation, FileParam, NumParam, OperationInlet, OpInput, OpParamVal } from "../../model/datatypes";
+import { createDraft, getHeddle, initDraftFromDrawdown, initDraftWithParams, warps, wefts } from "../../model/drafts";
 import { getOpParamValById } from "../../model/operations";
 
 
@@ -61,21 +61,17 @@ const  perform = (op_params: Array<OpParamVal>, op_inputs: Array<OpInput>) => {
 
     const data:AnalyzedImage = file_param.data;
 
-    const color_to_drafts = data.colors_mapping.map((color, ndx) => {
-
-       let color_to:Color = data.colors[color.to];
-
+ 
+    const color_to_drafts = data.colors.map((color, ndx) => {
+    const child_of_color = op_inputs.find(input => (input.params.findIndex(param => param === color.hex) !== -1));
 
-        if(color_to.hex == '#000000'){
-            if(op_inputs.findIndex(input => input.inlet_id == 0) !== -1) return {color: color_to.hex, draft: op_inputs[0].drafts[0]}
-            else return {color: color_to.hex, draft: initDraftWithParams({warps: 1, wefts: 1, drawdown: [[createCell(true)]]})}
-          } else{
-            if(op_inputs.findIndex(input => input.inlet_id == 1) !== -1) return {color: color_to.hex, draft: op_inputs[1].drafts[0]}
-            else return {color: color_to.hex, draft: initDraftWithParams({warps: 1, wefts: 1, drawdown: [[createCell(false)]]})}
+      if(child_of_color === undefined){
+        if(color.hex == '#000000')  return {color: color.hex, draft: initDraftWithParams({warps: 1, wefts:1, drawdown: [[createCell(true)]]})};
+        else return {color: color.hex, draft: initDraftWithParams({warps: 1, wefts:1, drawdown: [[createCell(false)]]})};;
+      } 
+      else return {color: color.hex, draft: child_of_color.drafts[0]};
+    });
 
-          } 
-        });
-      
 
     const pattern: Array<Array<Cell>> = [];
       for(let i = 0; i < res_h; i++){
@@ -88,8 +84,13 @@ const  perform = (op_params: Array<OpParamVal>, op_inputs: Array<OpInput>) => {
           const map_i = Math.floor(i * i_ratio);
           const map_j = Math.floor(j * j_ratio);
 
-          const color_ndx = data.image_map[map_i][map_j]; //
-          const color_draft = color_to_drafts[color_ndx].draft;
+          const color_ndx = data.image_map[map_i][map_j];
+          const mapped_color = data.colors_mapping.find(el => el.from == color_ndx); //this is the mapped id
+          const mapped_color_hex = data.colors[mapped_color.to].hex
+          const color_draft = color_to_drafts.find(el => el.color == mapped_color_hex).draft;
+
+
+     
 
           if(color_draft === null) pattern[i].push( createCell(false));
           else {
@@ -120,11 +121,44 @@ const generateName = (param_vals: Array<OpParamVal>, op_inputs: Array<OpInput>)
 
 const onParamChange = (param_vals: Array<OpParamVal>, inlets: Array<OperationInlet>, inlet_vals: Array<any>, changed_param_id: number, param_val: any) : Array<any> => {
 
+    //go through the image and adjust the mapping data so that it adds black and white and maps to those. 
     const new_inlets: Array<any> = ['#000000', '#ffffff']
+    let img = param_val.data;
+    console.log("IMG", img);
+
+    if(img == undefined) return new_inlets;
+
+
+
+    let has_black = false;
+    let has_white = false;
+
+    img.colors.forEach(color => {
+      if(color.hex == '#000000') has_black = true;
+      if(color.hex == '#ffffff') has_white = true;
+    })
+
+    if(!has_black) img.colors.push({r: 0, g: 0, b: 0, hex: '#000000', black: true})
+    if(!has_white) img.colors.push({r: 255, g: 255, b: 255, hex: '#ffffff', black: false})
+
+    let black_id = img.colors.findIndex(el => el.hex == '#000000');
+    let white_id = img.colors.findIndex(el => el.hex == '#ffffff');
+
+
+    img.colors_mapping.forEach(mapping => {
+      let c = img.colors[mapping.from];
+      if(c.black) mapping.to = black_id;
+      else mapping.to = white_id;
+    })  
 
     return new_inlets;
 
 
+
+
+
+
+
 }
 
 

src/app/core/operations/system_notation/system_notation.ts

@@ -61,7 +61,6 @@ const  perform = (op_params: Array<OpParamVal>, op_inputs: Array<OpInput>) => {
 
       //make sure the system draft map has a representation for every layer, even if the draft at that layer is null.
       const layer_draft_map = original_string_split.map((unit, ndx) => {
-        
         let layer_id = layer_units.findIndex(el => el.includes(unit));
 
         let drafts = getAllDraftsAtInlet(op_inputs, ndx+1);

src/app/core/provider/media.service.ts

@@ -183,30 +183,28 @@ export class MediaService {
           warning: filewarning
         }
 
-        return obj;
-      
+        return this.addMediaNameFromStorage(ref, obj);
+
       }).then(imageobj => {
 
         if(imageobj.data == null){
           return Promise.reject("no image object found when loading indexed color file");
         }
         const media_ref  = this.addIndexColorMediaInstance(id, ref, imageobj)
         return Promise.resolve(media_ref);
-
-        // return this.upSvc.getDownloadMetaData(ref)
-        // .then(metadata => {
-        //   if(metadata.customMetadata.filename !== undefined) imageobj.name = metadata.customMetadata.filename;
-        //   const media_ref  = this.addIndexColorMediaInstance(id, ref, imageobj)
-        //   return Promise.resolve(media_ref);
-
-        // })
-
       }) ;
   });
   }
 
 
 
+  addMediaNameFromStorage(ref: string, img: AnalyzedImage) : Promise<AnalyzedImage>{
+     return this.upSvc.getDownloadMetaData(ref)
+        .then(metadata => {
+          if(metadata.customMetadata.filename !== undefined) img.name = metadata.customMetadata.filename;
+          return Promise.resolve(img);
+        })
+  }
 
 
   createColorMap(colors: Array<Color>, prox: Array<{a: number, b: number, dist: number}>, space: number) : Array<{from: number, to: number}>{

src/app/mixer/palette/operation/parameter/parameter.component.ts

@@ -214,7 +214,7 @@ export class ParameterComponent implements OnInit {
 
     if(obj === undefined || obj.img == undefined || obj.img.image == null ) return;
 
-    const dialogRef = this.dialog.open(ImageeditorComponent, {data: obj.id});
+    const dialogRef = this.dialog.open(ImageeditorComponent, {data: {media_id: obj.id, src: this.opnode.name}});
     dialogRef.afterClosed().subscribe(nothing => {
 
       let updated_media = <IndexedColorImageInstance> this.mediaService.getMedia( this.opnode.params[this.paramid].id)