Merge branch 'css-rtl'

Conflicts:
	public/javascripts/application.js
	public/javascripts/inbox.js

app/helpers/application_helper.rb

@@ -283,4 +283,12 @@ module ApplicationHelper
 
     defaults
   end
+
+  def direction_for(string)
+    return (string.cleaned_is_rtl?) ? 'rtl' : ''
+  end
+
+  def rtl?
+    @rtl ||= RTL_LANGUAGES.include? I18n.locale
+  end
 end

app/views/comments/_comment.html.haml

@@ -13,5 +13,5 @@
       %time.timeago{:datetime => comment.created_at}
         = comment.created_at ? timeago(comment.created_at) : timeago(Time.now)
 
-    %p
+    %p{ :class => direction_for(comment.text) }
       = markdownify(comment.text, :youtube_maps => comment.youtube_titles)

app/views/comments/_comment.mobile.haml

@@ -14,5 +14,6 @@
   .content
     .from
       = person_link(comment.author)
-    = markdownify(comment.text, :youtube_maps => comment[:youtube_titles])
+    %p{ :class => direction_for(comment.text) }
+      = markdownify(comment.text, :youtube_maps => comment[:youtube_titles])
 

app/views/conversations/_conversation.haml

@@ -10,7 +10,8 @@
       .message_count
         = conversation.messages.size
 
-      = conversation.subject[0..30]
+      %div{ :class => direction_for(conversation.subject) }
+        = conversation.subject[0..30]
 
     .last_author
       .timestamp

app/views/conversations/_show.haml

@@ -6,7 +6,7 @@
 .span-16.last
   .conversation_participants
     .span-9
-      %h3
+      %h3{ :class => direction_for(conversation.subject) }
         = conversation.subject
 
       .conversation_controls

app/views/invitations/edit.html.haml

@@ -1,7 +1,7 @@
 = javascript_include_tag "validation"
 :javascript
   $(function() {
-    $('#user_new [title]').tipsy({trigger: 'focus', gravity: 'w'});
+    $('#user_new [title]').tipsy({trigger: 'focus', gravity: ($('html').attr('dir') == 'rtl') ? 'e' : 'w'});
     $("#user_username").focus();
   });
 

app/views/invitations/new.html.haml

@@ -1,6 +1,6 @@
 :javascript
   $(function() {
-    $('#new_user [title]').tipsy({trigger: 'focus', gravity: 'w'});
+    $('#new_user [title]').tipsy({trigger: 'focus', gravity: ($('html').attr('dir') == 'rtl') ? 'e' : 'w'});
     $("#user_email").focus();
   });
 

app/views/layouts/application.html.haml

@@ -3,7 +3,7 @@
 -#   the COPYRIGHT file.
 
 !!!
-%html{:lang => I18n.locale.to_s}
+%html{:lang => I18n.locale.to_s, :dir => (rtl?) ? 'rtl' : 'ltr'}
   %head
     %meta{:charset => 'utf-8'}
 
@@ -22,6 +22,8 @@
     = stylesheet_link_tag "blueprint/screen", :media => 'screen'
     = stylesheet_link_tag "blueprint/print", :media => 'print'
     = include_stylesheets :default, :media => 'all'
+    - if rtl?
+      = include_stylesheets :rtl, :media => 'all'
 
     <!--[if IE]>
     = javascript_include_tag "/javascripts/ie.js"

app/views/layouts/application.mobile.haml

@@ -3,7 +3,7 @@
 -#   the COPYRIGHT file.
 
 !!!
-%html{:lang => I18n.locale.to_s}
+%html{:lang => I18n.locale.to_s, :dir => (rtl?) ? 'rtl' : 'ltr'}
   %head
     %title
       DIASPORA*
@@ -17,6 +17,9 @@
 
     = stylesheet_link_tag 'vendor/jquery.mobile-1.0a4.min', 'mobile'
     = csrf_meta_tag
+    
+    - if rtl?
+      = include_stylesheets :rtl, :media => 'all'
 
     = yield(:head)
 

app/views/messages/_message.haml

@@ -11,6 +11,6 @@
       %time.timeago{:datetime => message.created_at}
         = how_long_ago(message)
 
-    %p
+    %p{ :class => direction_for(message.text) }
       = markdownify(message.text)
 

app/views/people/_profile_sidebar.html.haml

@@ -41,12 +41,14 @@
         %li
           %h4
             =t('.bio')
-          = markdownify(person.profile.bio, :newlines => true)
+          %div{ :class => direction_for(person.profile.bio) }
+            = markdownify(person.profile.bio, :newlines => true)
       - unless person.profile.location.blank?
         %li
           %h4
             =t('.location')
-          = markdownify(person.profile.location, :newlines => true)
+          %div{ :class => direction_for(person.profile.location) }
+            = markdownify(person.profile.location, :newlines => true)
 
       %li.span-8.last
         .span-4

app/views/registrations/new.html.haml

@@ -2,7 +2,7 @@
 
 :javascript
   $(function() {
-    $('#user_new [title]').tipsy({trigger: 'focus', gravity: 'w'});
+    $('#user_new [title]').tipsy({trigger: 'focus', gravity: ($('html').attr('dir') == 'rtl')? 'e' : 'w'});
     $("#user_username").focus();
   });
 

app/views/status_messages/_status_message.haml

@@ -14,5 +14,5 @@
         - for photo in photos[1..photos.size]
           = link_to (image_tag photo.url(:thumb_small), :class => 'thumb_small'), photo_path(photo)
 
-%p
+%p{ :class => direction_for(post.text) }
   = markdownify(post.text, :youtube_maps => post[:youtube_titles])

config/assets.yml

@@ -29,6 +29,7 @@ javascripts:
     - public/javascripts/widgets/alert.js
     - public/javascripts/widgets/embedder.js
     - public/javascripts/widgets/timeago.js
+    - public/javascripts/widgets/directionDetector.js
     - public/javascripts/view.js
     - public/javascripts/stream.js
     - public/javascripts/search.js
@@ -76,4 +77,6 @@ stylesheets:
     - public/stylesheets/vendor/fileuploader.css
     - public/stylesheets/vendor/tipsy.css
     - public/stylesheets/vendor/autoSuggest.css
+  rtl:
+    - public/stylesheets/rtl.css
  

config/environment.rb

@@ -13,11 +13,13 @@ if File.exists?(File.expand_path("./config/locale_settings.yml"))
   DEFAULT_LANGUAGE = (AVAILABLE_LANGUAGES.include?(locale_settings['default'])) ? locale_settings['default'] : AVAILABLE_LANGUAGES.keys[0].to_s
   AVAILABLE_LANGUAGE_CODES = locale_settings['available'].keys.map { |v| v.to_s }
   LANGUAGE_CODES_MAP = locale_settings['fallbacks']
+  RTL_LANGUAGES = locale_settings['rtl']
 else
   AVAILABLE_LANGUAGES = { :en => 'English' }
   DEFAULT_LANGUAGE = 'en'
   AVAILABLE_LANGUAGE_CODES = ['en']
   LANGUAGE_CODES_MAP = {}
+  RTL_LANGUAGES = []
 end
 
 # Initialize the rails application

config/initializers/direction_detector.rb

@@ -0,0 +1,5 @@
+#   Copyright (c) 2010, Diaspora Inc.  This file is
+#   licensed under the Affero General Public License version 3 or later.  See
+#   the COPYRIGHT file.
+
+require File.join(Rails.root, 'lib/direction_detector')

config/locale_settings.yml

@@ -57,3 +57,6 @@ fallbacks:
   zh:
     - :zh-CN
     - :zh-TW
+rtl:
+  - :ar
+  - :he

lib/direction_detector.rb

@@ -0,0 +1,53 @@
+# coding: utf-8
+#   Copyright (c) 2010, Diaspora Inc.  This file is
+#   licensed under the Affero General Public License version 3 or later.  See
+#   the COPYRIGHT file.
+# Deeply inspired by https://gitorious.org/statusnet/mainline/blobs/master/plugins/DirectionDetector/DirectionDetectorPlugin.php
+
+class String
+
+  def is_rtl?
+    return false if self.strip.empty?
+    count = 0
+    self.split(" ").each do |word|
+      if starts_with_rtl_char?(word)
+        count += 1
+      else
+        count -= 1
+      end
+    end
+    return true if count > 0 # more than half of the words are rtl words
+    return starts_with_rtl_char?(self) # otherwise let the first word decide
+  end
+
+  # Diaspora specific
+  def cleaned_is_rtl?
+    string = String.new(self)
+    [ /@[^ ]+|#[^ ]+/u, # mention, tag
+      /^RT[: ]{1}| RT | RT: |[♺♻:]/u # retweet
+    ].each do |cleaner|
+      string.gsub!(cleaner, '')
+    end
+    string.is_rtl?
+  end
+
+  def starts_with_rtl_char?(string = self)
+    return false if string.strip.empty?
+    char = string.strip.unpack('U*').first
+    limits = [
+      [1536, 1791], # arabic, persian, urdu, kurdish, ...
+      [65136, 65279], # arabic peresent 2
+      [64336, 65023], # arabic peresent 1
+      [1424, 1535], # hebrew
+      [64256, 64335], # hebrew peresent
+      [1792, 1871], # syriac
+      [1920, 1983], # thaana
+      [1984, 2047], # nko
+      [11568, 11647] # tifinagh
+    ]
+    limits.each do |limit|
+      return true if char >= limit[0] && char <= limit[1]
+    end
+    return false
+  end
+end

public/javascripts/inbox.js

@@ -5,8 +5,10 @@
 
 $(document).ready(function(){
 
-  $('a.conversation').click(function(){
-    $.getScript(this.href);
+  $('a.conversation').live('click', function(){
+    $.getScript(this.href, function() {
+      Diaspora.widgets.directionDetector.updateBinds();
+    });
     history.pushState(null, "", this.href);
 
     var conv = $(this).children('.stream_element'),
@@ -29,7 +31,9 @@ $(document).ready(function(){
 
   $(window).bind("popstate", function(){
     if (location.href.match(/conversations\/\d+/) != null) {
-      $.getScript(location.href);
+	  $.getScript(location.href, function() {
+        Diaspora.widgets.directionDetector.updateBinds();
+      });
       return false;
     }
   });

public/javascripts/stream.js

@@ -11,6 +11,7 @@ var Stream = {
     $(".status_message_delete").tipsy({trigger: 'hover', gravity: 'n'});
 
     Diaspora.widgets.timeago.updateTimeAgo();
+    Diaspora.widgets.directionDetector.updateBinds();
     $stream.not(".show").delegate("a.show_post_comments", "click", Stream.toggleComments);
     //audio linx
     Stream.setUpAudioLinks();

public/javascripts/view.js

@@ -65,6 +65,9 @@ var View = {
     $.facebox.settings.closeImage = '/images/facebox/closelabel.png'
     $.facebox.settings.loadingImage = '/images/facebox/loading.gif'
     $('a[rel*=facebox]').facebox();
+    $(document).bind('reveal.facebox', function() {
+      Diaspora.widgets.directionDetector.updateBinds();
+    });
 
     /* facebox 'done' buttons */
     $("a[rel*=close]").live('click', function(){ $.facebox.close() });
@@ -156,7 +159,7 @@ var View = {
     addAspect: {
       bind: function() {
         $(".add_aspect_button", "#aspect_nav").tipsy({
-          gravity:"w"
+          gravity: ($('html').attr('dir') == 'rtl')? "e" : "w"
         });
       }
     },

public/javascripts/web-socket-receiver.js

@@ -126,6 +126,7 @@ var WebSocketReceiver = {
     }
 
     Diaspora.widgets.timeago.updateTimeAgo();
+    Diaspora.widgets.directionDetector.updateBinds();
   },
 
   processLike: function(postId, html) {
@@ -157,6 +158,7 @@ var WebSocketReceiver = {
         showMessage();
       }
       Diaspora.widgets.timeago.updateTimeAgo();
+      Diaspora.widgets.directionDetector.updateBinds();
     }
   },
 

public/javascripts/widgets/directionDetector.js

@@ -0,0 +1,67 @@
+/*   Copyright (c) 2010, Diaspora Inc.  This file is
+ *   licensed under the Affero General Public License version 3 or later.  See
+ *   the COPYRIGHT file.
+ */
+/* Modified version of https://gitorious.org/statusnet/mainline/blobs/master/plugins/DirectionDetector/jquery.DirectionDetector.js */
+
+Diaspora.widgets.add("directionDetector", function() {
+
+  this.start = function() {
+    Diaspora.widgets.directionDetector.updateBinds();
+    InfiniteScroll.postScrollCallback = function() {
+      Diaspora.widgets.directionDetector.updateBinds();
+    }
+  };
+
+  this.isRTL = function(str) {
+    if(typeof str != typeof "" || str.length<1)
+      return false;
+    var cc = str.charCodeAt(0);
+    if(cc>=1536 && cc<=1791) // arabic, persian, ...
+      return true;
+    if(cc>=65136 && cc<=65279) // arabic peresent 2
+      return true;
+    if(cc>=64336 && cc<=65023) // arabic peresent 1
+      return true;
+    if(cc>=1424 && cc<=1535) // hebrew
+      return true;
+    if(cc>=64256 && cc<=64335) // hebrew peresent
+      return true;
+    if(cc>=1792 && cc<=1871) // Syriac
+      return true;
+    if(cc>=1920 && cc<=1983) // Thaana
+      return true;
+    if(cc>=1984 && cc<=2047) // NKo
+      return true;
+    if(cc>=11568 && cc<=11647) // Tifinagh
+      return true;
+    return false;
+    };
+
+  this.cleaner = new RegExp('@[^ ]+|^RT[: ]{1}| RT | RT: |[♺♻:]+', 'g');
+
+  this.binds = [];
+  
+  this.updateBinds = function() {
+    $.each(Diaspora.widgets.directionDetector.binds, function(i, v) {v.unbind('keyup', Diaspora.widgets.directionDetector.updateDirection);});
+    Diaspora.widgets.directionDetector.binds = [];
+
+    $("textarea").each(Diaspora.widgets.directionDetector.bind);
+    $("input[type='text']").each(Diaspora.widgets.directionDetector.bind);
+    $("input[type='search']").each(Diaspora.widgets.directionDetector.bind);
+  };
+
+  this.bind = function() {
+    $(this).bind('keyup', Diaspora.widgets.directionDetector.updateDirection);
+    Diaspora.widgets.directionDetector.binds.push($(this));
+  };
+
+  this.updateDirection = function() {
+    tArea = $(this);
+    var cleaned = tArea.val().replace(Diaspora.widgets.directionDetector.cleaner, '').replace(/^[ ]+/, '');
+    if(Diaspora.widgets.directionDetector.isRTL(cleaned))
+      tArea.css('direction', 'rtl');
+    else
+      tArea.css('direction', 'ltr');
+  };
+});

public/stylesheets/sass/application.sass

@@ -47,6 +47,10 @@ form
     :font
       :size auto
 
+.rtl
+  :direction rtl
+  :text-align right
+
 .hidden
   :display none
 

public/stylesheets/sass/rtl.sass

@@ -0,0 +1,214 @@
+body
+  :direction rtl
+  :text-align right
+
+#user_menu
+  :left 0
+  :right auto
+
+.diaspora_header_logo
+  :float right
+  :margin-left 1em
+  :margin-right 0
+
+#global_search
+  :float right
+
+#notification_badge, #message_inbox_badge
+  :margin 0 10px 0 -5px
+
+#notification_badge a, #message_inbox_badge a
+  :right 0
+
+.append-2
+  :padding-left 80px
+  :padding-right 0px
+  :float right
+
+footer ul#footer_nav
+  :float left
+
+.right
+  :left 0
+  :right auto
+
+.stream .avatar
+  :float right
+
+.stream_element .content
+  :padding-right 60px
+  :padding-left 0
+
+#publisher_textarea_wrapper textarea
+  :left auto
+  :right -9999px
+
+#publisher #file-upload
+  :float left
+
+#publisher .options_and_submit .public_toggle
+  :text-align left
+
+#publisher #click_to_share img
+  :right 0
+  :left auto
+
+#publisher #click_to_share span
+  :margin-right 12px
+  :margin-left 0
+
+#publisher_textarea_wrapper #photodropzone
+  :right 5px
+  :left auto
+
+#publisher_textarea_wrapper #photodropzone li .circle
+  :left -7px
+  :right auto
+
+#publisher_textarea_wrapper #photodropzone li .x
+  :left -1px
+  :right auto
+
+#webSocketContainer
+  :left auto !important
+  :right -100px
+
+header ul#user_menu
+  :padding 5px 30px 5px 5px
+  :right auto
+  :margin -2px 0 0 -5px
+
+header ul#user_menu .avatar
+  :left auto
+  :right 2px
+
+header ul#user_menu a
+  :padding-left 15px
+
+header ul#user_menu .right
+  :right auto
+  :left 5px
+
+.stream_element .right
+  :left 12px
+  :right auto
+
+ul.as-selections li
+  :float right
+
+ul.as-selections li.as-selection-item a.as-close
+  :float left
+  :margin 0 0 0 3px
+
+ul.as-selections li.as-selection-item
+  :padding 3px 6px 3px 0
+
+#profile_photo_upload img
+  :left auto
+  :right 0
+
+#profile_photo_upload
+  :padding-left 0
+  :padding-right 120px
+
+form p.checkbox_select label
+  :right 20px
+  :left auto
+
+.prepend-5
+  :float right
+  :padding-right 200px
+  :padding-left 0
+
+#update_profile_form h4 textarea[placeholder]
+  :right -9999px
+  :left auto
+
+.prepend-8
+  :padding-right 320px
+  :padding-left 0
+
+.span-2
+  :float right
+  :text-align right
+  :margin-left 0
+  :margin-right 10px
+
+#facebox_header h3, #facebox_header h4
+  :text-align right
+
+textarea.comment_box
+  :left auto
+  :right -9999px
+
+label
+  :right 0.48em
+  :left auto
+
+ul#settings_nav
+  :right 198px
+  :left auto
+
+ul, ol
+  :margin 0 0 1.5em 1.5em
+  :padding-right 3.333em
+
+ul#settings_nav > li
+  :margin-left 1em
+  :margin-right 0
+
+.column, .span-1, .span-2, .span-3, .span-4, .span-5, .span-6, .span-7, .span-8, .span-9, .span-10, .span-11, .span-12, .span-13, .span-14, .span-15, .span-16, .span-17, .span-18, .span-19, .span-20, .span-21, .span-22, .span-23, .span-24
+  :float right
+  :margin-left 10px
+  :margin-right 0
+
+.last
+  :margin-left 0
+
+ul.comments li .content, ul.show_comments li .content, div.likes li .content, div.dislikes li .content
+  :padding-left 10px
+  :padding-right 36px
+
+ul.comments li form p, ul.show_comments li form p, div.likes li form p, div.dislikes li form p
+  :left auto
+  :right 35px
+
+.stream .stream_element time
+  :right auto
+  :left 20px
+
+.aspect_list .name
+  :right 1em
+  :left auto
+
+.aspect_list ul > li .right
+  :left 1em
+  :right auto
+
+.share_with .add_aspect .right
+  :right auto
+  :left 1em
+
+.share_with .done .right
+  :right auto
+  :left 1em
+
+.share_with .add_aspect p
+  :padding-right 1em
+  :padding-left 0
+
+#facebox
+  :text-align right
+
+.stream_element.conversation .message_count
+  :right auto
+  :left 10px
+
+.stream_element.conversation .timestamp
+  :right auto
+  :left 10px
+
+.conversation_participants .conversation_controls a
+  :margin-right 0
+  :margin-left 10px
+

spec/lib/direction_detector_spec.rb

@@ -0,0 +1,90 @@
+# coding: utf-8
+# Copyright (c) 2010, Diaspora Inc.  This file is
+# licensed under the Affero General Public License version 3 or later.  See
+# the COPYRIGHT file.
+
+require 'spec_helper'
+
+describe String do
+  let(:english) { "Hello World" }
+  let(:chinese) { "你好世界" }
+  let(:arabic) { "مرحبا العالم" }
+  let(:hebrew) { "שלום העולם" }
+  let(:english_chinese) { "#{english} #{chinese}" }
+  let(:english_arabic) { "#{english} #{chinese}" }
+  let(:english_hebrew) { "#{english} #{chinese}" }
+  let(:chinese_english) { "#{chinese} #{english}" }
+  let(:chinese_arabic) { "#{chinese} #{arabic}" }
+  let(:chinese_hebrew) { "#{chinese} #{hebrew}" }
+  let(:arabic_english) { "#{arabic} #{english}" }
+  let(:arabic_chinese) { "#{arabic} #{chinese}" }
+  let(:arabic_hebrew) { "#{arabic} #{hebrew}" }
+  let(:hebrew_english) { "#{hebrew} #{english}" }
+  let(:hebrew_chinese) { "#{hebrew} #{chinese}" }
+  let(:hebrew_arabic) { "#{hebrew} #{arabic}" }
+
+
+  describe "#stats_with_rtl_char?" do
+    it 'returns true or false correctly' do
+      english.starts_with_rtl_char?.should be_false
+      chinese.starts_with_rtl_char?.should be_false
+      arabic.starts_with_rtl_char?.should be_true
+      hebrew.starts_with_rtl_char?.should be_true
+      hebrew_arabic.starts_with_rtl_char?.should be_true
+    end
+
+    it 'only looks at the first char' do
+      english_chinese.starts_with_rtl_char?.should be_false
+      chinese_english.starts_with_rtl_char?.should be_false
+      english_arabic.starts_with_rtl_char?.should be_false
+      hebrew_english.starts_with_rtl_char?.should be_true
+      arabic_chinese.starts_with_rtl_char?.should be_true
+    end
+    
+    it 'ignores whitespaces' do
+      " \n \r \t".starts_with_rtl_char?.should be_false
+      " #{arabic} ".starts_with_rtl_char?.should be_true
+    end
+  end
+
+  describe "#is_rtl?" do
+    it 'returns true or false correctly' do
+      english.is_rtl?.should be_false
+      chinese.is_rtl?.should be_false
+      arabic.is_rtl?.should be_true
+      hebrew.is_rtl?.should be_true
+    end
+
+    it 'respects all words' do
+      chinese_arabic.is_rtl?.should be_true
+      chinese_hebrew.is_rtl?.should be_true
+      english_hebrew.is_rtl?.should be_false
+      hebrew_arabic.is_rtl?.should be_true
+      "#{english} #{arabic} #{chinese}".is_rtl?.should be_false
+      "Translated to arabic, Hello World means: #{arabic}".is_rtl?.should be_false
+      "#{english} #{arabic} #{arabic}".is_rtl?.should be_true
+    end
+
+    it "fallbacks to the first word if there's no majority" do
+      hebrew_english.is_rtl?.should be_true
+      english_hebrew.is_rtl?.should be_false
+      arabic_english.is_rtl?.should be_true
+      english_arabic.is_rtl?.should be_false
+    end
+
+    it 'ignores whitespaces' do
+      " \n \r \t".is_rtl?.should be_false
+      " #{arabic} ".is_rtl?.should be_true
+    end
+  end
+
+  describe '#cleaned_is_rtl?' do
+    it 'should clean the string' do
+      "RT: #{arabic}".cleaned_is_rtl?.should be_true
+      "#{hebrew} RT: #{arabic}".cleaned_is_rtl?.should be_true
+      "@foo #{arabic}".cleaned_is_rtl?.should be_true 
+      "#{hebrew} #example".cleaned_is_rtl?.should be_true 
+      "♺: #{arabic} ♻: #{hebrew}".cleaned_is_rtl?.should be_true 
+    end
+  end
+end