Essential Theme - Frontpage Slideshow in RTL languages

Essential Theme - Frontpage Slideshow in RTL languages

by Saeed Amiri -
Number of replies: 2

Hi everyone

Anyone using Moodle for an RTL language and interested in Theme Essential might have noticed that the frontpage slideshow does not support RTL languages, or at least does not do so in Persian language. To start with, the multi-lang span codes do not work in related settings, and the position of the  slide images, on one hand, and the slide title as well as the slide caption, on the other hand, need to be reversed. Previously we had the same problem with frontpage User Alerts, but fortunately a couple of workarounds were offered both by Mary Evans and Gareth J Barnard: here. The solution, of course, has been included, as far as I know, in the recent upgrade to the theme. Following Gareth's solution, I think I have found another similar workaround for the problem with the slideshow in RTL languages as follows.

Please note that the changes in frontpage.php and settings.php make changes to the first slide ONLY so you need to make similar changes to the three remaining slides.

 

1) settings.php

/*
* Slide 1
*/

// Title.
$name = 'theme_essential/slide1_'.current_language();
$title = get_string('slidetitle', 'theme_essential');
$description = get_string('slidetitledesc', 'theme_essential');
$setting = new admin_setting_configtext($name, $title, $description, '');
$default = '';
$setting->set_updatedcallback('theme_reset_all_caches');
$temp->add($setting);

// Caption.
$name = 'theme_essential/slide1caption_'.current_language();
$title = get_string('slidecaption', 'theme_essential');
$description = get_string('slidecaptiondesc', 'theme_essential');
$setting = new admin_setting_configtextarea($name, $title, $description, '');
$setting->set_updatedcallback('theme_reset_all_caches');
$temp->add($setting);

 

2) frontpage.php

/* Slide1 settings */
$slide1 = 'slide1_'.current_language();
$slide1caption = 'slide1caption_'.current_language();

if ($hasslide1) {
$slide1 = $PAGE->theme->settings->$slide1;
}
if ($hasslide1image) {
$slide1image = $PAGE->theme->setting_file_url('slide1image', 'slide1image');
}
if ($hasslide1caption) {
$slide1caption = $PAGE->theme->settings->$slide1caption;
}
if ($hasslide1url) {
$slide1url = $PAGE->theme->settings->slide1url;
}

3) slides.css

.dir-rtl .da-slide h2 {text-align:right; font-family:tahoma;font-size: 40px; right:10%}
.dir-rtl .da-slide p {text-align:right; font-family:tahoma; right:10%}
.dir-rtl .da-slide .da-link {right: 0}
.dir-rtl .da-slide .da-img {right: 800px}

 

/* Animation classes and animations for RTL Languages */

 

/* Slide in from the left*/
.dir-rtl .da-slide-fromleft h2{
-webkit-animation: fromLeftAnim1-1 0.6s ease-in-out 0.8s both;
-moz-animation: fromLeftAnim1-1 0.6s ease-in-out 0.8s both;
-o-animation: fromLeftAnim1-1 0.6s ease-in-out 0.8s both;
-ms-animation: fromLeftAnim1-1 0.6s ease-in-out 0.8s both;
animation: fromLeftAnim1-1 0.6s ease-in-out 0.8s both;
}
.dir-rtl .da-slide-fromleft p{
-webkit-animation: fromLeftAnim2-1 0.6s ease-in-out 0.8s both;
-moz-animation: fromLeftAnim2-1 0.6s ease-in-out 0.8s both;
-o-animation: fromLeftAnim2-1 0.6s ease-in-out 0.8s both;
-ms-animation: fromLeftAnim2-1 0.6s ease-in-out 0.8s both;
animation: fromLeftAnim2-1 0.6s ease-in-out 0.8s both;
}
.dir-rtl .da-slide-fromleft
.da-link{
-webkit-animation: fromLeftAnim3-1 0.4s ease-in-out 1.2s both;
-moz-animation: fromLeftAnim3-1 0.4s ease-in-out 1.2s both;
-o-animation: fromLeftAnim3-1 0.4s ease-in-out 1.2s both;
-ms-animation: fromLeftAnim3-1 0.4s ease-in-out 1.2s both;
animation: fromLeftAnim3-1 0.4s ease-in-out 1.2s both;
}
.dir-rtl .da-slide-fromleft
.da-img{
-webkit-animation: fromLeftAnim4-1 0.6s ease-in-out 0.8s both;
-moz-animation: fromLeftAnim4-1 0.6s ease-in-out 0.8s both;
-o-animation: fromLeftAnim4-1 0.6s ease-in-out 0.8s both;
-ms-animation: fromLeftAnim4-1 0.6s ease-in-out 0.8s both;
animation: fromLeftAnim4-1 0.6s ease-in-out 0.8s both;
}

 

.dir-rtl .da-slide-fromleft
.variant2{
-webkit-animation: fromLeftAnim1-1 0.6s ease-in-out 0.8s both;
-moz-animation: fromLeftAnim1-1 0.6s ease-in-out 0.8s both;
-o-animation: fromLeftAnim1-1 0.6s ease-in-out 0.8s both;
-ms-animation: fromLeftAnim1-1 0.6s ease-in-out 0.8s both;
animation: fromLeftAnim1-1 0.6s ease-in-out 0.8s both;
}
@-webkit-keyframes fromLeftAnim1-1{
0%{ right: 110%; opacity: 0; }
100%{ right: 10%; opacity: 1; }
}
@-webkit-keyframes fromLeftAnim2-1{
0%{ right: 110%; opacity: 0; }
100%{ right: 10%; opacity: 1; }
}
@-webkit-keyframes fromLeftAnim3-1{
0%{ right: 110%; opacity: 0; }
1%{ right: 10%; opacity: 0; }
100%{ right: 10%; opacity: 1; }
}
@-webkit-keyframes fromLeftAnim4-1{
0%{ right: 110%; opacity: 0; }
100%{ right: 60%; opacity: 1; }
}

 

@-moz-keyframes fromLeftAnim1-1{
0%{ right: 110%; opacity: 0; }
100%{ right: 10%; opacity: 1; }
}
@-moz-keyframes fromLeftAnim2-1{
0%{ right: 110%; opacity: 0; }
100%{ right: 10%; opacity: 1; }
}
@-moz-keyframes fromLeftAnim3-1{
0%{ right: 110%; opacity: 0; }
1%{ right: 10%; opacity: 0; }
100%{ right: 10%; opacity: 1; }
}
@-moz-keyframes fromLeftAnim4-1{
0%{ right: 110%; opacity: 0; }
100%{ right: 60%; opacity: 1; }
}

 

@-o-keyframes fromLeftAnim1-1{
0%{ right: 110%; opacity: 0; }
100%{ right: 10%; opacity: 1; }
}
@-o-keyframes fromLeftAnim2-1{
0%{ right: 110%; opacity: 0; }
100%{ right: 10%; opacity: 1; }
}
@-o-keyframes fromLeftAnim3-1{
0%{ right: 110%; opacity: 0; }
1%{ right: 10%; opacity: 0; }
100%{ right: 10%; opacity: 1; }
}
@-o-keyframes fromLeftAnim4-1{
0%{ right: 110%; opacity: 0; }
100%{ right: 60%; opacity: 1; }
}

 

@-ms-keyframes fromLeftAnim1-1{
0%{ right: 110%; opacity: 0; }
100%{ right: 10%; opacity: 1; }
}
@-ms-keyframes fromLeftAnim2-1{
0%{ right: 110%; opacity: 0; }
100%{ right: 10%; opacity: 1; }
}
@-ms-keyframes fromLeftAnim3-1{
0%{ right: 110%; opacity: 0; }
1%{ right: 10%; opacity: 0; }
100%{ right: 10%; opacity: 1; }
}
@-ms-keyframes fromLeftAnim4-1{
0%{ right: 110%; opacity: 0; }
100%{ right: 60%; opacity: 1; }
}

 

@keyframes fromLeftAnim1-1{
0%{ right: 110%; opacity: 0; }
100%{ right: 10%; opacity: 1; }
}
@keyframes fromLeftAnim2-1{
0%{ right: 110%; opacity: 0; }
100%{ right: 10%; opacity: 1; }
}
@keyframes fromLeftAnim3-1{
0%{ right: 110%; opacity: 0; }
1%{ right: 10%; opacity: 0; }
100%{ right: 10%; opacity: 1; }
}
@keyframes fromLeftAnim4-1{
0%{ right: 110%; opacity: 0; }
100%{ right: 60%; opacity: 1; }
}

 

/* Slide in from the right*/
.dir-rtl .da-slide-fromright h2{
-webkit-animation: fromRightAnim1-2 0.6s ease-in-out 0.6s both;
-moz-animation: fromRightAnim1-2 0.6s ease-in-out 0.6s both;
-o-animation: fromRightAnim1-2 0.6s ease-in-out 0.6s both;
-ms-animation: fromRightAnim1-2 0.6s ease-in-out 0.6s both;
animation: fromRightAnim1-2 0.6s ease-in-out 0.6s both;
}
.dir-rtl .da-slide-fromright p{
-webkit-animation: fromRightAnim2-2 0.6s ease-in-out 0.6s both;
-moz-animation: fromRightAnim2-2 0.6s ease-in-out 0.6s both;
-o-animation: fromRightAnim2-2 0.6s ease-in-out 0.6s both;
-ms-animation: fromRightAnim2-2 0.6s ease-in-out 0.6s both;
animation: fromRightAnim2-2 0.6s ease-in-out 0.6s both;
}
.dir-rtl .da-slide-fromright
.da-link{
-webkit-animation: fromRightAnim3-2 0.4s ease-in-out 1.2s both;
-moz-animation: fromRightAnim3-2 0.4s ease-in-out 1.2s both;
-o-animation: fromRightAnim3-2 0.4s ease-in-out 1.2s both;
-ms-animation: fromRightAnim3-2 0.4s ease-in-out 1.2s both;
animation: fromRightAnim3-2 0.4s ease-in-out 1.2s both;
}
.dir-rtl .da-slide-fromright
.da-img{
-webkit-animation: fromRightAnim4-2 0.6s ease-in-out 0.6s both;
-moz-animation: fromRightAnim4-2 0.6s ease-in-out 0.6s both;
-o-animation: fromRightAnim4-2 0.6s ease-in-out 0.6s both;
-ms-animation: fromRightAnim4-2 0.6s ease-in-out 0.6s both;
animation: fromRightAnim4-2 0.6s ease-in-out 0.6s both;
}
@-webkit-keyframes fromRightAnim1-2{
0%{ right: -110%; opacity: 0; }
100%{ right: 10%; opacity: 1; }
}
@-webkit-keyframes fromRightAnim2-2{
0%{ right: -110%; opacity: 0; }
100%{ right: 10%; opacity: 1; }
}
@-webkit-keyframes fromRightAnim3-2{
0%{ right: -110%; opacity: 0; }
1%{ right: 10%; opacity: 0; }
100%{ right: 10%; opacity: 1; }
}
@-webkit-keyframes fromRightAnim4-2{
0%{ right: -110%; opacity: 0; }
100%{ right: 60%; opacity: 1; }
}

 

@-moz-keyframes fromRightAnim1-2{
0%{ right: -110%; opacity: 0; }
100%{ right: 10%; opacity: 1; }
}
@-moz-keyframes fromRightAnim2-2{
0%{ right: -110%; opacity: 0; }
100%{ right: 10%; opacity: 1; }
}
@-moz-keyframes fromRightAnim3-2{
0%{ right: -110%; opacity: 0; }
1%{ right: 10%; opacity: 0; }
100%{ right: 10%; opacity: 1; }
}
@-moz-keyframes fromRightAnim4-2{
0%{ right: -110%; opacity: 0; }
100%{ right: 60%; opacity: 1; }
}

 

@-o-keyframes fromRightAnim1-2{
0%{ right: -110%; opacity: 0; }
100%{ right: 10%; opacity: 1; }
}
@-o-keyframes fromRightAnim2-2{
0%{ right: -110%; opacity: 0; }
100%{ right: 10%; opacity: 1; }
}
@-o-keyframes fromRightAnim3-2{
0%{ right: -110%; opacity: 0; }
1%{ right: 10%; opacity: 0; }
100%{ right: 10%; opacity: 1; }
}
@-o-keyframes fromRightAnim4-2{
0%{ right: -110%; opacity: 0; }
100%{ right: 60%; opacity: 1; }
}

 

@-ms-keyframes fromRightAnim1-2{
0%{ right: -110%; opacity: 0; }
100%{ right: 10%; opacity: 1; }
}
@-ms-keyframes fromRightAnim2-2{
0%{ right: -110%; opacity: 0; }
100%{ right: 10%; opacity: 1; }
}
@-ms-keyframes fromRightAnim3-2{
0%{ right: -110%; opacity: 0; }
1%{ right: 10%; opacity: 0; }
100%{ right: 10%; opacity: 1; }
}
@-ms-keyframes fromRightAnim4-2{
0%{ right: -110%; opacity: 0; }
100%{ right: 60%; opacity: 1; }
}

 

@keyframes fromRightAnim1-2{
0%{ right: -110%; opacity: 0; }
100%{ right: 10%; opacity: 1; }
}
@keyframes fromRightAnim2-2{
0%{ right: -110%; opacity: 0; }
100%{ right: 10%; opacity: 1; }
}
@keyframes fromRightAnim3-2{
0%{ right: -110%; opacity: 0; }
1%{ right: 10%; opacity: 0; }
100%{ right: 10%; opacity: 1; }
}
@keyframes fromRightAnim4-2{
0%{ right: -110%; opacity: 0; }
100%{ right: 60%; opacity: 1; }
}

 

/* Slide out to the left */
.dir-rtl .da-slide-toleft h2{
-webkit-animation: toLeftAnim1-3 0.6s ease-in-out 0.6s both;
-moz-animation: toLeftAnim1-3 0.6s ease-in-out 0.6s both;
-o-animation: toLeftAnim1-3 0.6s ease-in-out 0.6s both;
-ms-animation: toLeftAnim1-3 0.6s ease-in-out 0.6s both;
animation: toLeftAnim1-3 0.6s ease-in-out 0.6s both;
}
.dir-rtl .da-slide-toleft p{
-webkit-animation: toLeftAnim2-3 0.6s ease-in-out 0.3s both;
-moz-animation: toLeftAnim2-3 0.6s ease-in-out 0.3s both;
-o-animation: toLeftAnim2-3 0.6s ease-in-out 0.3s both;
-ms-animation: toLeftAnim2-3 0.6s ease-in-out 0.3s both;
animation: toLeftAnim2-3 0.6s ease-in-out 0.3s both;
}
.dir-rtl .da-slide-toleft
.da-link{
-webkit-animation: toLeftAnim3-3 0.4s ease-in-out both;
-moz-animation: toLeftAnim3-3 0.4s ease-in-out both;
-o-animation: toLeftAnim3-3 0.4s ease-in-out both;
-ms-animation: toLeftAnim3-3 0.4s ease-in-out both;
animation: toLeftAnim3-3 0.4s ease-in-out both;
}
.dir-rtl .da-slide-toleft
.da-img{
-webkit-animation: toLeftAnim4-3 0.6s ease-in-out both;
-moz-animation: toLeftAnim4-3 0.6s ease-in-out both;
-o-animation: toLeftAnim4-3 0.6s ease-in-out both;
-ms-animation: toLeftAnim4-3 0.6s ease-in-out both;
animation: toLeftAnim4-3 0.6s ease-in-out both;
}
@-webkit-keyframes toLeftAnim1-3{
0%{ right: 10%; opacity: 1; }
100%{ right: 100%; opacity: 0; }
}
@-webkit-keyframes toLeftAnim2-3{
0%{ right: 10%; opacity: 1; }
100%{ right: 100%; opacity: 0; }
}
@-webkit-keyframes toLeftAnim3-3{
0%{ right: 10%; opacity: 1; }
99%{ right: 10%; opacity: 0; }
100%{ right: 100%; opacity: 0; }
}
@-webkit-keyframes toLeftAnim4-3{
0%{ right: 60%; opacity: 1; }
30%{ right: 55%; opacity: 1; }
100%{ right: 100%; opacity: 0; }
}

 

@-moz-keyframes toLeftAnim1-3{
0%{ right: 10%; opacity: 1; }
100%{ right: 100%; opacity: 0; }
}
@-moz-keyframes toLeftAnim2-3{
0%{ right: 10%; opacity: 1; }
100%{ right: 100%; opacity: 0; }
}
@-moz-keyframes toLeftAnim3-3{
0%{ right: 10%; opacity: 1; }
99%{ right: 10%; opacity: 0; }
100%{ right: 100%; opacity: 0; }
}
@-moz-keyframes toLeftAnim4-3{
0%{ right: 60%; opacity: 1; }
30%{ right: 55%; opacity: 1; }
100%{ right: 100%; opacity: 0; }
}

 

@-o-keyframes toLeftAnim1-3{
0%{ right: 10%; opacity: 1; }
100%{ right: 100%; opacity: 0; }
}
@-o-keyframes toLeftAnim2-3{
0%{ right: 10%; opacity: 1; }
100%{ right: 100%; opacity: 0; }
}
@-o-keyframes toLeftAnim3-3{
0%{ right: 10%; opacity: 1; }
99%{ right: 10%; opacity: 0; }
100%{ right: 100%; opacity: 0; }
}
@-o-keyframes toLeftAnim4-3{
0%{ right: 60%; opacity: 1; }
30%{ right: 55%; opacity: 1; }
100%{ right: 100%; opacity: 0; }
}

 

@-ms-keyframes toLeftAnim1-3{
0%{ right: 10%; opacity: 1; }
100%{ right: 100%; opacity: 0; }
}
@-ms-keyframes toLeftAnim2-3{
0%{ right: 10%; opacity: 1; }
100%{ right: 100%; opacity: 0; }
}
@-ms-keyframes toLeftAnim3-3{
0%{ right: 10%; opacity: 1; }
99%{ right: 10%; opacity: 0; }
100%{ right: 100%; opacity: 0; }
}
@-ms-keyframes toLeftAnim4-3{
0%{ right: 60%; opacity: 1; }
30%{ right: 55%; opacity: 1; }
100%{ right: 100%; opacity: 0; }
}

 

@keyframes toLeftAnim1-3{
0%{ right: 10%; opacity: 1; }
100%{ right: 100%; opacity: 0; }
}
@keyframes toLeftAnim2-3{
0%{ right: 10%; opacity: 1; }
100%{ right: 100%; opacity: 0; }
}
@keyframes toLeftAnim3-3{
0%{ right: 10%; opacity: 1; }
99%{ right: 10%; opacity: 0; }
100%{ right: 100%; opacity: 0; }
}
@keyframes toLeftAnim4-3{
0%{ right: 60%; opacity: 1; }
30%{ right: 55%; opacity: 1; }
100%{ right: 100%; opacity: 0; }
}

 

/* Slide out to the right*/
.dir-rtl .da-slide-toleft h2{
-webkit-animation: toRightAnim1-4 0.6s ease-in-out both;
-moz-animation: toRightAnim1-4 0.6s ease-in-out both;
-o-animation: toRightAnim1-4 0.6s ease-in-out both;
-ms-animation: toRightAnim1-4 0.6s ease-in-out both;
animation: toRightAnim1-4 0.6s ease-in-out both;
}
.dir-rtl .da-slide-toleft p{
-webkit-animation: toRightAnim2-4 0.6s ease-in-out 0.3s both;
-moz-animation: toRightAnim2-4 0.6s ease-in-out 0.3s both;
-o-animation: toRightAnim2-4 0.6s ease-in-out 0.3s both;
-ms-animation: toRightAnim2-4 0.6s ease-in-out 0.3s both;
animation: toRightAnim2-4 0.6s ease-in-out 0.3s both;
}
.dir-rtl .da-slide-toleft
.da-link{
-webkit-animation: toRightAnim3-4 0.6s ease-in-out 0.6s both;
-moz-animation: toRightAnim3-4 0.6s ease-in-out 0.6s both;
-o-animation: toRightAnim3-4 0.6s ease-in-out 0.6s both;
-ms-animation: toRightAnim3-4 0.6s ease-in-out 0.6s both;
animation: toRightAnim3-4 0.6s ease-in-out 0.6s both;
}
.dir-rtl .da-slide-toleft
.da-img{
-webkit-animation: toRightAnim4-4 0.6s ease-in-out 0.5s both;
-moz-animation: toRightAnim4-4 0.6s ease-in-out 0.5s both;
-o-animation: toRightAnim4-4 0.6s ease-in-out 0.5s both;
-ms-animation: toRightAnim4-4 0.6s ease-in-out 0.5s both;
animation: toRightAnim4-4 0.6s ease-in-out 0.5s both;
}
@-webkit-keyframes toRightAnim1-4{
0%{ right: 10%; opacity: 1; }
30%{ right: 15%; opacity: 1; }
100%{ right: -50%; opacity: 0; }
}
@-webkit-keyframes toRightAnim2-4{
0%{ right: 10%; opacity: 1; }
30%{ right: 15%; opacity: 1; }
100%{ right: -50%; opacity: 0; }
}
@-webkit-keyframes toRightAnim3-4{
0%{ right: 10%; opacity: 1; }
100%{ right: -50%; opacity: 0; }
}
@-webkit-keyframes toRightAnim4-4{
0%{ right: 60%; opacity: 1; }
70%{ right: 30%; opacity: 0; }
100%{ right: -50%; opacity: 0; }
}

 

@-moz-keyframes toRightAnim1-4{
0%{ right: 10%; opacity: 1; }
30%{ right: 15%; opacity: 1; }
100%{ right: -50%; opacity: 0; }
}
@-moz-keyframes toRightAnim2-4{
0%{ right: 10%; opacity: 1; }
30%{ right: 15%; opacity: 1; }
100%{ right: -50%; opacity: 0; }
}
@-moz-keyframes toRightAnim3-4{
0%{ right: 10%; opacity: 1; }
100%{ right: -50%; opacity: 0; }
}
@-moz-keyframes toRightAnim4-4{
0%{ right: 60%; opacity: 1; }
70%{ right: 30%; opacity: 0; }
100%{ right: -50%; opacity: 0; }
}

 

@-o-keyframes toRightAnim1-4{
0%{ right: 10%; opacity: 1; }
30%{ right: 15%; opacity: 1; }
100%{ right: -50%; opacity: 0; }
}
@-o-keyframes toRightAnim2-4{
0%{ right: 10%; opacity: 1; }
30%{ right: 15%; opacity: 1; }
100%{ right: -50%; opacity: 0; }
}
@-o-keyframes toRightAnim3-4{
0%{ right: 10%; opacity: 1; }
100%{ right: -50%; opacity: 0; }
}
@-o-keyframes toRightAnim4-4{
0%{ right: 60%; opacity: 1; }
70%{ right: 30%; opacity: 0; }
100%{ right: -50%; opacity: 0; }
}

 

@-ms-keyframes toRightAnim1-4{
0%{ right: 10%; opacity: 1; }
30%{ right: 15%; opacity: 1; }
100%{ right: -50%; opacity: 0; }
}
@-ms-keyframes toRightAnim2-4{
0%{ right: 10%; opacity: 1; }
30%{ right: 15%; opacity: 1; }
100%{ right: -50%; opacity: 0; }
}
@-ms-keyframes toRightAnim3-4{
0%{ right: 10%; opacity: 1; }
100%{ right: -50%; opacity: 0; }
}
@-ms-keyframes toRightAnim4-4{
0%{ right: 60%; opacity: 1; }
70%{ right: 30%; opacity: 0; }
100%{ right: -50%; opacity: 0; }
}

 

@keyframes toRightAnim1-4{
0%{ right: 10%; opacity: 1; }
30%{ right: 15%; opacity: 1; }
100%{ right: -50%; opacity: 0; }
}
@keyframes toRightAnim2-4{
0%{ right: 10%; opacity: 1; }
30%{ right: 15%; opacity: 1; }
100%{ right: -50%; opacity: 0; }
}
@keyframes toRightAnim3-4{
0%{ right: 10%; opacity: 1; }
100%{ right: -50%; opacity: 0; }
}
@keyframes toRightAnim4-4{
0%{ right: 60%; opacity: 1; }
70%{ right: 30%; opacity: 0; }
100%{ right: -50%; opacity: 0; }
}

 

.dir-rtl .da-slide
.da-link{
white-space: nowrap;
}

Regards

Saeed

 

Average of ratings: Useful (3)
In reply to Saeed Amiri

Re: Essential Theme - Frontpage Slideshow in RTL languages

by Mary Evans -
Picture of Core developers Picture of Documentation writers Picture of Peer reviewers Picture of Plugin developers Picture of Testers

Hi Saeed,

Thanks for sharing your code with us...that is very kind of you. I am sure it will be very useful.

Can I make a suggestion? The next time you add lots of code, it might be better to add it as a file, that way other users can download it. smile

Thanks

Mary

In reply to Mary Evans

Re: Essential Theme - Frontpage Slideshow in RTL languages

by Saeed Amiri -

Hi Mary

Thanks for the encouraging words. I am happy it might be useful to somebody. 

And, sure, I think adding the codes in separate files would be a  much better idea. It just did not cross my mind. Thank you for the suggestion.

Regards

Saeed