move rtl class to root el

src/content-handlers/iiif/modules/uv-contentleftpanel-module/TreeView.ts

@@ -17,8 +17,7 @@ export class TreeView extends BaseView {
  create(): void {
  this.setConfig("contentLeftPanel");
  super.create();
-
- this.$tree = $('<div class="iiif-tree-component rtl"></div>');
+ this.$tree = $('<div class="iiif-tree-component"></div>');
  this.$element.append(this.$tree);
  }
 

src/content-handlers/iiif/modules/uv-contentleftpanel-module/css/styles.less

@@ -115,11 +115,6 @@
  font-weight: normal;
  overflow: auto;
 
- .iiif-tree-component.rtl {
- direction: rtl;
- padding-right: @padding-medium-horizontal;
- }
-
  .iiif-tree-component ul li a.selected {
  color: @brand-primary !important;
  }
@@ -132,6 +127,19 @@
  }
 }
 
+.uv-iiif-extension-host.rtl {
+ .leftPanel {
+ .views {
+ .treeView {
+ .iiif-tree-component {
+ direction: rtl;
+ padding-right: @padding-medium-horizontal;
+ }
+ }
+ }
+ }
+}
+
 .uv.browser-Explorer {
  .leftPanel {
  .views {

src/content-handlers/iiif/modules/uv-openseadragoncenterpanel-module/OpenSeadragonCenterPanel.ts

@@ -1313,13 +1313,6 @@ export class OpenSeadragonCenterPanel extends CenterPanel {
  this.$title.text(sanitize(this.title));
  }
 
- // if the manifest has a right-to-left viewing direction, add a class to the title to display it rtl
- if (this.extension.helper.isRightToLeft()) {
- this.$title.addClass("rtl");
- } else {
- this.$title.removeClass("rtl");
- }
-
  if (
  this.extension.helper.isMultiCanvas() &&
  this.$prevButton &&

src/content-handlers/iiif/modules/uv-shared-module/BaseExtension.ts

@@ -143,6 +143,10 @@ export class BaseExtension implements IExtension {
  this.$element.addClass("fullscreen");
  }
 
+ if (this.helper.isRightToLeft()) {
+ this.$element.addClass("rtl");
+ }
+
  this.$element.on("mousemove", (e) => {
  this.mouseX = e.pageX;
  this.mouseY = e.pageY;
@@ -319,7 +323,8 @@ export class BaseExtension implements IExtension {
  );
 
  this.extensionHost.subscribe(IIIFEvents.CLOSE_LEFT_PANEL, () => {
- if (that.$element.hasClass("loading")) that.$element.removeClass("loading")
+ if (that.$element.hasClass("loading"))
+ that.$element.removeClass("loading");
  this.resize();
  });
 
@@ -475,11 +480,11 @@ export class BaseExtension implements IExtension {
  }
 
  public async loadConfig(locale: string, extension: string): Promise<any> {
-
  let uv_locale = locale;
- if(extension) {
- uv_locale = '_';
- this.locales['_'] = () => import(`../../extensions/${extension}/config/config.json`)
+ if (extension) {
+ uv_locale = "_";
+ this.locales["_"] = () =>
+ import(`../../extensions/${extension}/config/config.json`);
  }
 
  let config = this.locales[uv_locale];
@@ -497,14 +502,16 @@ export class BaseExtension implements IExtension {
  return this.translateLocale(config, locale);
  }
 
- private async translateLocale(config: Object, locale: String): Promise<Object> {
-
- let localeStrings = await import(`../../../../locales/${locale}.json`); 
+ private async translateLocale(
+ config: Object,
+ locale: String
+ ): Promise<Object> {
+ let localeStrings = await import(`../../../../locales/${locale}.json`);
  let conf = JSON.stringify(config);
 
- for(let str in localeStrings) {
- let replaceStr = str.replace('$','');
- let re = new RegExp(`\\$${replaceStr}\\b`, 'g');
+ for (let str in localeStrings) {
+ let replaceStr = str.replace("$", "");
+ let re = new RegExp(`\\$${replaceStr}\\b`, "g");
  conf = conf.replace(re, localeStrings[str]);
  }
 

src/content-handlers/iiif/modules/uv-shared-module/css/center-panel.less

@@ -12,10 +12,6 @@
  text-overflow: ellipsis;
  line-height: 30px;
 
- &.rtl {
- direction: rtl;
- }
-
  .xl-mediaquery({
  padding: 0 20px 0 20px;
  });
@@ -161,3 +157,12 @@
  }
  }
 }
+
+.uv-iiif-extension-host.rtl {
+ .centerPanel {
+ .title {
+ direction: rtl;
+ padding-right: @padding-medium-horizontal;
+ }
+ }
+}