Skip to content

Commit

Permalink
feat(imrove hebrew language): some improvements for hebrew
Browse files Browse the repository at this point in the history
  • Loading branch information
Moshe Vilner committed Feb 3, 2019
1 parent d931b1b commit d4964fe
Show file tree
Hide file tree
Showing 15 changed files with 151 additions and 38 deletions.
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<div class="container">
<div class="container" rtl>
<div class="row">
<div class="col-12">
<h1 class="main-heading">{{ 'anms.examples.auth.title' | translate }}</h1>
Expand Down
2 changes: 1 addition & 1 deletion src/app/examples/crud/components/crud.component.html
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<div class="container">
<div class="container" rtl>
<h1>{{ 'anms.examples.crud.title' | translate }}</h1>
<div class="row">
<div class="col-md-6">
Expand Down
2 changes: 1 addition & 1 deletion src/app/examples/form/components/form.component.html
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<div class="container">
<div class="container" rtl>
<div class="row">
<div class="col">
<h1 class="main-heading">{{ 'anms.examples.form.title' | translate }}</h1>
Expand Down
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<div class="container">
<div class="container" rtl>

<div class="row">
<div class="col-12">
Expand Down
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
<div class="container">
<div class="row">
<div class="col-md-12">
<h1 class="main-heading">{{ 'anms.examples.stocks.title' | translate }}</h1>
<h1 rtl class="main-heading">{{ 'anms.examples.stocks.title' | translate }}</h1>
</div>
</div>
<div class="row" [ngClass]="routeAnimationsElements">
<div class="row" [ngClass]="routeAnimationsElements" rtl>
<ng-container *ngIf="stocks$ | async as stocks">
<div class="col-md-6 col-lg-3">
<form autocomplete="false">
Expand Down
2 changes: 1 addition & 1 deletion src/app/examples/theming/child/child.component.html
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<div>
<div rtl>
<h1>
{{ 'anms.examples.theming.child.title' | translate }}
<br>{{ 'anms.examples.theming.child.subtitle' | translate }}
Expand Down
10 changes: 5 additions & 5 deletions src/app/examples/theming/parent/parent.component.html
Original file line number Diff line number Diff line change
@@ -1,20 +1,20 @@
<div class="container">
<div class="row">
<div class="col-12">
<h1 class="main-heading">{{ 'anms.examples.theming.parent.title' | translate }}</h1>
<h1 rtl class="main-heading">{{ 'anms.examples.theming.parent.title' | translate }}</h1>
</div>
</div>
<div class="row">
<div class="col-md-6" [ngClass]="routeAnimationsElements">
<p>
<div class="col-md-6" [ngClass]="routeAnimationsElements">
<p rtl>
{{ 'anms.examples.theming.parent.text1' | translate }} <code>stylesUrls</code>
{{ 'anms.examples.theming.parent.text2' | translate }} <code>@Component</code>
{{ 'anms.examples.theming.parent.text3' | translate }} <code>styles.scss</code>
{{ 'anms.examples.theming.parent.text4' | translate }}
<strong>{{ 'anms.examples.theming.parent.text5' | translate }}</strong>
{{ 'anms.examples.theming.parent.text6' | translate }}
</p>
<p>
<p rtl>
{{ 'anms.examples.theming.parent.text7' | translate }}
<strong>{{ 'anms.examples.theming.parent.text8' | translate }}</strong>
{{ 'anms.examples.theming.parent.text9' | translate }}
Expand All @@ -25,7 +25,7 @@ <h1 class="main-heading">{{ 'anms.examples.theming.parent.title' | translate }}<
{{themeSrc}}
</pre>
</div>
<div class="col-md-6" [ngClass]="routeAnimationsElements">
<div rtl class="col-md-6" [ngClass]="routeAnimationsElements">
<div class="example">
<h1>{{ 'anms.examples.theming.parent.description' | translate }}</h1>
<anms-child></anms-child>
Expand Down
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
<div class="container">
<div class="row">
<div class="offset-md-2 col-md-8 entry">
<anms-big-input [placeholder]="'anms.examples.todos.input' | translate" [value]="newTodo" (keyup)="onNewTodoChange($event.target.value)"
<anms-big-input rtl [placeholder]="'anms.examples.todos.input' | translate" [value]="newTodo" (keyup)="onNewTodoChange($event.target.value)"
(keyup.enter)="!isAddTodoDisabled && onAddTodo()" (keyup.escape)="onNewTodoClear()">
<anms-big-input-action ariaLabel="add todo" fontSet="fas" fontIcon="fa-plus" faIcon="plus" color="accent"
(action)="onAddTodo()" [disabled]="isAddTodoDisabled" [matTooltip]="'anms.examples.todos.tooltip.add' | translate"
Expand Down Expand Up @@ -67,7 +67,7 @@ <h2>
<br>
</div>
</ng-container>
<div class="offset-md-1 col-md-5" [ngClass]="routeAnimationsElements">
<div class="offset-md-1 col-md-5" [ngClass]="routeAnimationsElements" rtl>
<h2>{{ 'anms.examples.todos.example' | translate }}</h2>
<p>
{{ 'anms.examples.todos.text1' | translate }}
Expand Down
75 changes: 75 additions & 0 deletions src/app/shared/rtl-support/rtl-support.directive.spec.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,75 @@
import { Component, DebugElement } from '@angular/core';
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { By } from '@angular/platform-browser';

import { RtlSupportDirective } from './rtl-support.directive';
import { TranslateModule, TranslateService } from '@ngx-translate/core';
import { of } from 'rxjs';
import { cold, getTestScheduler } from 'jasmine-marbles';
@Component({
template: `
<h2 rtl>Something Yellow</h2>
<h2 rtl>The Default (Gray)</h2>
<h2>No Highlight</h2>
<div rtl>Vasili</div>`
})
class TestComponent {}

describe('RtlSupportDirective', () => {
let fixture: ComponentFixture<TestComponent>;
let des: DebugElement[]; // the three elements w/ the directive
let bareH2: DebugElement; // the <h2> w/o the directive

beforeEach(() => {
fixture = TestBed.configureTestingModule({
imports: [TranslateModule.forRoot()],
declarations: [RtlSupportDirective, TestComponent],
providers: [
{
provide: TranslateService,
useValue: {
currentLang: 'he',
onLangChange: cold('--x--y|', {
x: { lang: 'he' },
y: { lang: 'de' }
})
}
}
]
}).createComponent(TestComponent);

getTestScheduler().flush(); // flush the observables
fixture.detectChanges(); // initial binding

// all elements with an attached RtlDirective
des = fixture.debugElement.queryAll(By.directive(RtlSupportDirective));

// the h2 without the RtlDirective
bareH2 = fixture.debugElement.query(By.css('h2:not([rtl])'));
});

// color tests
it('should have three rtl styled elements', () => {
expect(des.length).toBe(3);
});

it('should set "text-align" rule value to "right" if current language is hebrew', () => {
const textAlign = des[0].nativeElement.style.textAlign;
expect(textAlign).toBe('right');
});

it('should set "direction" rule value to "rtl" if current language is hebrew', () => {
const direction = des[0].nativeElement.style.direction;
expect(direction).toBe('rtl');
});

it('should set "direction" rule value to "ltr" after current language changed to NOT hebrew', () => {
getTestScheduler().flush(); // flush the observables
fixture.detectChanges();

const textAlign = des[0].nativeElement.style.textAlign;
expect(textAlign).toBe('left');
const direction = des[0].nativeElement.style.direction;
expect(direction).toBe('ltr');
});
});
32 changes: 32 additions & 0 deletions src/app/shared/rtl-support/rtl-support.directive.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,32 @@
import { Directive, ElementRef, OnInit, OnDestroy } from '@angular/core';
import { TranslateService, LangChangeEvent } from '@ngx-translate/core';
import { Subscription } from 'rxjs';

@Directive({
selector: '[rtl]'
})
export class RtlSupportDirective implements OnInit, OnDestroy {
private subscription: Subscription;
constructor(private el: ElementRef, public translate: TranslateService) {
el.nativeElement.style.textAlign =
translate.currentLang === 'he' ? 'right' : 'left';
el.nativeElement.style.direction =
translate.currentLang === 'he' ? 'rtl' : 'ltr';
}
ngOnInit() {
this.subscription = this.translate.onLangChange.subscribe(
(event: LangChangeEvent) => {
this.el.nativeElement.style.textAlign =
event.lang === 'he' ? 'right' : 'left';
this.el.nativeElement.style.direction =
event.lang === 'he' ? 'rtl' : 'ltr';
}
);
}

ngOnDestroy() {
if (this.subscription) {
this.subscription.unsubscribe();
}
}
}
10 changes: 8 additions & 2 deletions src/app/shared/shared.module.ts
Original file line number Diff line number Diff line change
Expand Up @@ -93,6 +93,7 @@ library.add(

import { BigInputComponent } from './big-input/big-input.component';
import { BigInputActionComponent } from './big-input/big-input-action.component';
import { RtlSupportDirective } from './rtl-support/rtl-support.directive';

@NgModule({
imports: [
Expand Down Expand Up @@ -121,7 +122,11 @@ import { BigInputActionComponent } from './big-input/big-input-action.component'

FontAwesomeModule
],
declarations: [BigInputComponent, BigInputActionComponent],
declarations: [
BigInputComponent,
BigInputActionComponent,
RtlSupportDirective
],
exports: [
CommonModule,
FormsModule,
Expand Down Expand Up @@ -153,7 +158,8 @@ import { BigInputActionComponent } from './big-input/big-input-action.component'
FontAwesomeModule,

BigInputComponent,
BigInputActionComponent
BigInputActionComponent,
RtlSupportDirective
]
})
export class SharedModule {}
6 changes: 3 additions & 3 deletions src/app/static/about/about.component.html
Original file line number Diff line number Diff line change
Expand Up @@ -58,8 +58,8 @@ <h2 data-testid='get-started'>{{ 'anms.about.get-started' | translate }}</h2>
</div>
<div class="container">
<div class="follow-releases" [ngClass]="routeAnimationsElements">
<h2>{{ 'anms.about.get-notified.title' | translate }}</h2>
<p>
<h2 rtl>{{ 'anms.about.get-notified.title' | translate }}</h2>
<p rtl>
{{ 'anms.about.get-notified.follow' | translate }} <a href="https://www.twitter.com/releasebutler" target="_blank">Release
Butler</a>
{{ 'anms.about.get-notified.description' | translate }}
Expand All @@ -68,7 +68,7 @@ <h2>{{ 'anms.about.get-notified.title' | translate }}</h2>
<img [src]="releaseButler" alt="Release Butler tweet example">
</div>
</div>
<div class="container">
<div class="container" rtl>
<div class="contributors" [ngClass]="routeAnimationsElements">
<h2>{{ 'anms.about.contributors.title' | translate }}</h2>
<p>{{ 'anms.about.contributors.description1' | translate }}</p>
Expand Down
4 changes: 2 additions & 2 deletions src/app/static/features/features.component.html
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
<div class="container">
<div class="row">
<div class="col-md-12">
<h1 class="main-heading">{{ 'anms.features.title' | translate }}</h1>
<h1 rtl class="main-heading">{{ 'anms.features.title' | translate }}</h1>
</div>
</div>
<div class="row align-items-end">
Expand All @@ -10,7 +10,7 @@ <h1 class="main-heading">{{ 'anms.features.title' | translate }}</h1>
<mat-card-title>
<code *ngIf="feature.version">{{feature.version}}</code>{{feature.name | translate}}
</mat-card-title>
<mat-card-subtitle>
<mat-card-subtitle rtl>
{{ feature.description | translate }}
</mat-card-subtitle>
<mat-card-actions>
Expand Down
18 changes: 9 additions & 9 deletions src/assets/i18n/examples/he.json
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@
"anms.examples.crud.subtitle1": "ספרים שלך",
"anms.examples.crud.subtitle2": "ערוך ספרים",
"anms.examples.crud.text": "בעזרת כלי זה אפשר לנהל ספרים: להוסיף ולמחוק לעדכן ולבחור",
"anms.examples.crud.title": "עריכה מחיקה והוספה (crud) - בנויה בעזרת @ngrx/entity & @ngrx/router-store",
"anms.examples.crud.title": "עריכה מחיקה והוספה (crud) - בנויה בעזרת ngrx/entity@ ו ngrx/router-store@",
"anms.examples.crud.tooltip.delete": "מחק ספר",
"anms.examples.crud.tooltip.deselect": "שחרר את הבחירה",
"anms.examples.crud.tooltip.edit": "ערוך ספר",
Expand All @@ -40,7 +40,7 @@
"anms.examples.form.text4": "מתנה נשלחה!",
"anms.examples.form.text5": "מתנה לא נשלחה.",
"anms.examples.form.text6": "מחיאת כף",
"anms.examples.form.title": "form builder טופס ריאקטיבי בעזרת",
"anms.examples.form.title": " טופס ריאקטיבי בעזרת form builder",
"anms.examples.menu.auth": "אימות",
"anms.examples.menu.crud": "קראד",
"anms.examples.menu.form": "טופס",
Expand All @@ -59,20 +59,20 @@
"anms.examples.notifications.title": "התראות",
"anms.examples.notifications.warning.description": "התראות אזהרה כדי להסב את תשומת לב המשתמש",
"anms.examples.notifications.warning.title": "אזהרה",
"anms.examples.stocks.description": "נא לספר סמל מניה מקובל ,כגון:",
"anms.examples.stocks.description": "הזן סמל מניה מקובל ,כגון:",
"anms.examples.stocks.error1": "מניה",
"anms.examples.stocks.error2": "לא נמצא",
"anms.examples.stocks.symbol": "סמל מניה",
"anms.examples.stocks.text1": "דוגמא של שוק מניות שמראה איך לישם",
"anms.examples.stocks.text2": " רקווסטים שמשתמשים ב",
"anms.examples.stocks.text3": "מודול.",
"anms.examples.stocks.text4": "על ידי עידכון שאילתה עם סמל אחר של מניה תגרם אקציה שמעדכנת סטייט בערך ״נטען״ וגרומת לאפקט של טעינה של מניה הנבחרת",
"anms.examples.stocks.text5": "אקציות מנוטרות כך שכל שליחה תפסיק את קודמתה",
"anms.examples.stocks.text4": "על ידי עידכון שאילתה עם סמל אחר של מניה תגרם שליחת אקציה שמעדכנת סטייט בערך ״נטען״ וגרומת לאפקט של טעינה של מניה הנבחרת",
"anms.examples.stocks.text5": " אקציות מנוטרות כך שכל שליחה תפסיק את קודמתה בעזרת שימוש ב",
"anms.examples.stocks.text6": "אקציות של הצלחה או כשלון תשלחנה עם סיום הרקווסט. אנמיצית טעינה תיעלם ובמקומה יוםיע המידע של מניה או מודעה של כישלון",
"anms.examples.stocks.title": "שוק מניות",
"anms.examples.theming.child.description": "הילד עובד!",
"anms.examples.theming.child.subtitle": "אמור להיות ללא סגנון",
"anms.examples.theming.child.title": "של הבן h1",
"anms.examples.theming.child.title": "h1 של הבן",
"anms.examples.theming.parent.description": "האב עובד!",
"anms.examples.theming.parent.text1": " בקומפוננט זה הסגנון לא מיובא בעזרת שדה",
"anms.examples.theming.parent.text10": "בהגדרות css כדי להדגיש את הייחודיות שלהם. ראה את קובץ ערכת הנושא של הקומפוננט:",
Expand Down Expand Up @@ -100,12 +100,12 @@
"anms.examples.todos.input": "בקרוב אני מתכנן...",
"anms.examples.todos.list": "רשימת מטלות",
"anms.examples.todos.remove.notification": "רשימות שבוצעו הוסרו",
"anms.examples.todos.text1": "זה קלאסי",
"anms.examples.todos.text1": "זו דוגמא קלאסית של ",
"anms.examples.todos.text2": "רשימה",
"anms.examples.todos.text3": "דוגמא שמדגימה הוספה החלפה הסרה וסינון של רשימות.",
"anms.examples.todos.text3": " שמדגימה הוספה החלפה הסרה וסינון של רשימות.",
"anms.examples.todos.text4": "טיפול בסטייט מתאפשר בעזרת שימוש ב",
"anms.examples.todos.text5": "שגם מאפשר תמיכה במודולים הניטענים בצורת לייזי (זהו מודול מסוג פיצ׳ר הנטען בלייזי)",
"anms.examples.todos.text6": "רישמות נשמרות בלוקאל סטוראג׳, ולכן יישמרו גם בעתיד, באותו דפדפן",
"anms.examples.todos.text6": "רישמות נשמרות בלוקאל סטוראג׳, ולכן יישמרו גם בעתיד, כל עוד משתמשים באותו דפדפן",
"anms.examples.todos.toggle.notification": "שונה {{name}} ל",
"anms.examples.todos.tooltip.add": "הוסף רשימה חדשה",
"anms.examples.todos.tooltip.remove": "הסר רשימות שבוצעו",
Expand Down
16 changes: 8 additions & 8 deletions src/assets/i18n/he.json
Original file line number Diff line number Diff line change
Expand Up @@ -3,18 +3,18 @@
"anms.about.check-blogs": "או קרא בלוגים בנושא",
"anms.about.contributors.description1": "רוצה לעזור לנו עם אנגולר?",
"anms.about.contributors.description2": "השאר את הסימן שלך ותצטרף לצוות!",
"anms.about.contributors.description3": "לפני שאתה מתחיל - כדאי שתעיף מבט על ",
"anms.about.contributors.description3": "לפני שאתה מתחיל - כדאי שתעיף מבט על ",
"anms.about.contributors.guide": "מדריך לתורם",
"anms.about.contributors.description4": " וגם ",
"anms.about.contributors.description4": " וגם על",
"anms.about.contributors.issues": "נושאים פתוחים",
"anms.about.contributors.title": "רשימת התורמים",
"anms.about.get-notified.description": "בוט של טיוטר שעוזר לך להיות מעודכן בחידושים בתחום ספריות פופלריות ופריימוורקים של פרונטנד ",
"anms.about.get-notified.follow": "עקוב",
"anms.about.get-notified.title": "עידכונים על גרסאות חדשות",
"anms.about.get-notified.follow": "עקוב אחרי ",
"anms.about.get-notified.title": "קבל עידכונים על גרסאות חדשות",
"anms.about.get-started": "התחל כאן",
"anms.features.angular": "פריימוורק חזק וחדשני",
"anms.features.angular-cli": "ממשק command line של אנגולר",
"anms.features.angular-material": "Material design ספריית",
"anms.features.angular-material": " ספריית Material design",
"anms.features.bootstrap": "ליאאוט רספנוסיבי של ספריית UI המפורסמת ביותר בעולם",
"anms.features.cypress": "Cypress דור חדש בעולם הכלים לבדיקת אפליקציות ווב.",
"anms.features.documentation": "תיעוד",
Expand All @@ -23,8 +23,8 @@
"anms.features.lazyloading.description": "זמן איתחול מואץ בזכות שימוש בlazy loading modules",
"anms.features.lazyloading.title": "Lazy loading",
"anms.features.ngrx": "זרימת דטה חד-כיוונית בעזרת RxJS Observables",
"anms.features.ngxtranslate": "תמיכה ריבוי שפות בשביל אנגולר",
"anms.features.rxjs": "Observablesריאקטיב פרוגראמינג עם קולקציות אסינכרוניות ו",
"anms.features.ngxtranslate": "תמיכה בריבוי שפות בשביל אנגולר",
"anms.features.rxjs": " ריאקטיב פרוגראמינג עם קולקציות אסינכרוניות ו Observables",
"anms.features.themes.description": "תמיכת גמישה בשינוי ערכת נושא, גם בשביל קומפוננטות ייחודיות (custom)",
"anms.features.themes.title": "ערכות נושא",
"anms.features.title": "פיצ׳רים",
Expand Down Expand Up @@ -59,6 +59,6 @@
"anms.settings.themes.sticky-header": "חלק עליון נצמד",
"anms.settings.themes.title": "ערכאות נושא",
"anms.settings.title": "הגדרות",
"anms.title.long": "ערכת התחלה לפרויקט אנגולר מטריאל ונג׳אראיקס",
"anms.title.long": "ngrx ערכת התחלה לפרויקט אנגולר מטריאל ו",
"anms.title.short": "ערכת התחלה לפרויקט אנגולר"
}

0 comments on commit d4964fe

Please sign in to comment.