From ed7c9d39d05e7cf4db5c8c1e14e309aad500fc0d Mon Sep 17 00:00:00 2001 From: Denys Vuika Date: Mon, 9 May 2016 13:31:39 +0100 Subject: [PATCH] #9 Accessibility improvements --- .../src/components/content-column.d.ts | 4 ++++ .../src/components/content-column.js | 8 +++++++ .../src/components/content-column.js.map | 2 +- .../src/components/content-column.ts | 23 ++++++++++++++++--- .../src/components/document-list.html | 9 ++++++-- .../src/models/content-column.model.d.ts | 1 + .../src/models/content-column.model.js.map | 2 +- .../src/models/content-column.model.ts | 1 + 8 files changed, 43 insertions(+), 7 deletions(-) diff --git a/ng2-components/ng2-alfresco-documentlist/src/components/content-column.d.ts b/ng2-components/ng2-alfresco-documentlist/src/components/content-column.d.ts index 148d0f029b..01afac2694 100644 --- a/ng2-components/ng2-alfresco-documentlist/src/components/content-column.d.ts +++ b/ng2-components/ng2-alfresco-documentlist/src/components/content-column.d.ts @@ -19,6 +19,10 @@ import { ContentColumnList } from './content-column-list'; export declare class ContentColumn implements OnInit { private list; title: string; + /** + * Title to be used for screen readers. + */ + srTitle: string; source: string; cssClass: string; constructor(list: ContentColumnList); diff --git a/ng2-components/ng2-alfresco-documentlist/src/components/content-column.js b/ng2-components/ng2-alfresco-documentlist/src/components/content-column.js index 76a358ac72..0851eb3d4c 100644 --- a/ng2-components/ng2-alfresco-documentlist/src/components/content-column.js +++ b/ng2-components/ng2-alfresco-documentlist/src/components/content-column.js @@ -48,14 +48,22 @@ System.register(['angular2/core', './content-column-list', './../models/content- ContentColumn.prototype.ngOnInit = function () { var model = new content_column_model_1.ContentColumnModel(); model.title = this.title; + model.srTitle = this.srTitle; model.source = this.source; model.cssClass = this.cssClass; + if (!model.srTitle && model.source === '$thumbnail') { + model.srTitle = 'Thumbnail'; + } this.list.registerColumn(model); }; __decorate([ core_1.Input(), __metadata('design:type', String) ], ContentColumn.prototype, "title", void 0); + __decorate([ + core_1.Input('sr-title'), + __metadata('design:type', String) + ], ContentColumn.prototype, "srTitle", void 0); __decorate([ core_1.Input(), __metadata('design:type', String) diff --git a/ng2-components/ng2-alfresco-documentlist/src/components/content-column.js.map b/ng2-components/ng2-alfresco-documentlist/src/components/content-column.js.map index c305495f51..be345dae57 100644 --- a/ng2-components/ng2-alfresco-documentlist/src/components/content-column.js.map +++ b/ng2-components/ng2-alfresco-documentlist/src/components/content-column.js.map @@ -1 +1 @@ -{"version":3,"file":"content-column.js","sourceRoot":"","sources":["content-column.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;;;;;;;;;;;;;;;;;;;;;;;;;;;YAUH;gBAKI,uBACY,IAAuB;oBAAvB,SAAI,GAAJ,IAAI,CAAmB;oBAL1B,UAAK,GAAW,EAAE,CAAC;gBAM5B,CAAC;gBAED,gCAAQ,GAAR;oBACI,IAAI,KAAK,GAAG,IAAI,yCAAkB,EAAE,CAAC;oBACrC,KAAK,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC;oBACzB,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC,MAAM,CAAC;oBAC3B,KAAK,CAAC,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC;oBAE/B,IAAI,CAAC,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;gBACpC,CAAC;gBAfD;oBAAC,YAAK,EAAE;;4DAAA;gBACR;oBAAC,YAAK,EAAE;;6DAAA;gBACR;oBAAC,YAAK,CAAC,OAAO,CAAC;;+DAAA;gBAPnB;oBAAC,gBAAS,CAAC;wBACP,QAAQ,EAAE,gBAAgB;wBAC1B,QAAQ,EAAE,EAAE;qBACf,CAAC;;iCAAA;gBAkBF,oBAAC;YAAD,CAAC,AAjBD,IAiBC;YAjBD,yCAiBC,CAAA"} \ No newline at end of file +{"version":3,"file":"content-column.js","sourceRoot":"","sources":["content-column.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;;;;;;;;;;;;;;;;;;;;;;;;;;;YAUH;gBAiBI,uBACY,IAAuB;oBAAvB,SAAI,GAAJ,IAAI,CAAmB;oBAfnC,UAAK,GAAW,EAAE,CAAC;gBAgBnB,CAAC;gBAED,gCAAQ,GAAR;oBACI,IAAI,KAAK,GAAG,IAAI,yCAAkB,EAAE,CAAC;oBACrC,KAAK,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC;oBACzB,KAAK,CAAC,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC;oBAC7B,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC,MAAM,CAAC;oBAC3B,KAAK,CAAC,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC;oBAE/B,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,IAAI,KAAK,CAAC,MAAM,KAAK,YAAY,CAAC,CAAC,CAAC;wBAClD,KAAK,CAAC,OAAO,GAAG,WAAW,CAAC;oBAChC,CAAC;oBAED,IAAI,CAAC,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;gBACpC,CAAC;gBA/BD;oBAAC,YAAK,EAAE;;4DAAA;gBAMR;oBAAC,YAAK,CAAC,UAAU,CAAC;;8DAAA;gBAGlB;oBAAC,YAAK,EAAE;;6DAAA;gBAGR;oBAAC,YAAK,CAAC,OAAO,CAAC;;+DAAA;gBAlBnB;oBAAC,gBAAS,CAAC;wBACP,QAAQ,EAAE,gBAAgB;wBAC1B,QAAQ,EAAE,EAAE;qBACf,CAAC;;iCAAA;gBAmCF,oBAAC;YAAD,CAAC,AAlCD,IAkCC;YAlCD,yCAkCC,CAAA"} \ No newline at end of file diff --git a/ng2-components/ng2-alfresco-documentlist/src/components/content-column.ts b/ng2-components/ng2-alfresco-documentlist/src/components/content-column.ts index 040955349e..65a2d23ec6 100644 --- a/ng2-components/ng2-alfresco-documentlist/src/components/content-column.ts +++ b/ng2-components/ng2-alfresco-documentlist/src/components/content-column.ts @@ -24,9 +24,21 @@ import {ContentColumnModel} from './../models/content-column.model'; template: '' }) export class ContentColumn implements OnInit { - @Input() title: string = ''; - @Input() source: string; - @Input('class') cssClass: string; + + @Input() + title: string = ''; + + /** + * Title to be used for screen readers. + */ + @Input('sr-title') + srTitle: string; + + @Input() + source: string; + + @Input('class') + cssClass: string; constructor( private list: ContentColumnList) { @@ -35,9 +47,14 @@ export class ContentColumn implements OnInit { ngOnInit() { let model = new ContentColumnModel(); model.title = this.title; + model.srTitle = this.srTitle; model.source = this.source; model.cssClass = this.cssClass; + if (!model.srTitle && model.source === '$thumbnail') { + model.srTitle = 'Thumbnail'; + } + this.list.registerColumn(model); } } diff --git a/ng2-components/ng2-alfresco-documentlist/src/components/document-list.html b/ng2-components/ng2-alfresco-documentlist/src/components/document-list.html index 0199b3f23d..2ad7e3f7b8 100644 --- a/ng2-components/ng2-alfresco-documentlist/src/components/document-list.html +++ b/ng2-components/ng2-alfresco-documentlist/src/components/document-list.html @@ -8,9 +8,14 @@ - {{col.title}} + + {{col.srTitle}} + {{col.title}} + - + + Actions + diff --git a/ng2-components/ng2-alfresco-documentlist/src/models/content-column.model.d.ts b/ng2-components/ng2-alfresco-documentlist/src/models/content-column.model.d.ts index 83cc12c94f..aa9147c959 100644 --- a/ng2-components/ng2-alfresco-documentlist/src/models/content-column.model.d.ts +++ b/ng2-components/ng2-alfresco-documentlist/src/models/content-column.model.d.ts @@ -16,6 +16,7 @@ */ export declare class ContentColumnModel { title: string; + srTitle: string; source: string; cssClass: string; } diff --git a/ng2-components/ng2-alfresco-documentlist/src/models/content-column.model.js.map b/ng2-components/ng2-alfresco-documentlist/src/models/content-column.model.js.map index a7029a60ae..431c2144c5 100644 --- a/ng2-components/ng2-alfresco-documentlist/src/models/content-column.model.js.map +++ b/ng2-components/ng2-alfresco-documentlist/src/models/content-column.model.js.map @@ -1 +1 @@ -{"version":3,"file":"content-column.model.js","sourceRoot":"","sources":["content-column.model.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;;;;;;;;YAEH;gBAAA;gBAIA,CAAC;gBAAD,yBAAC;YAAD,CAAC,AAJD,IAIC;YAJD,mDAIC,CAAA"} \ No newline at end of file +{"version":3,"file":"content-column.model.js","sourceRoot":"","sources":["content-column.model.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;;;;;;;;YAEH;gBAAA;gBAKA,CAAC;gBAAD,yBAAC;YAAD,CAAC,AALD,IAKC;YALD,mDAKC,CAAA"} \ No newline at end of file diff --git a/ng2-components/ng2-alfresco-documentlist/src/models/content-column.model.ts b/ng2-components/ng2-alfresco-documentlist/src/models/content-column.model.ts index 23391a08b3..5fe2d6d890 100644 --- a/ng2-components/ng2-alfresco-documentlist/src/models/content-column.model.ts +++ b/ng2-components/ng2-alfresco-documentlist/src/models/content-column.model.ts @@ -17,6 +17,7 @@ export class ContentColumnModel { title: string; + srTitle: string; source: string; cssClass: string; }