Refactor getting_started page, test if facebook is available, fix #4520

Changelog.md

@@ -20,6 +20,7 @@
 * Disable submit button in sign up form after submission to avoid email already exists error [#4506](https://github.com/diaspora/diaspora/issues/4506)
 * Do not pull the 404 pages assets from Amazon S3 [#4501](https://github.com/diaspora/diaspora/pull/4501)
 * Fix counter background does not cover more than 2 digits on profile [#4499](https://github.com/diaspora/diaspora/issues/4499)
+* Refactor getting_started page, test if facebook is available, fix [#4520](https://github.com/diaspora/diaspora/issues/4520)
 
 ## Features
 * Add oEmbed content to the mobile view [#4343](https://github.com/diaspora/diaspora/pull/4353)

app/assets/stylesheets/application.css.sass

@@ -2508,6 +2508,38 @@ a.toggle_selector
   :-moz-box-shadow none
   :box-shadow none
 
+#hello-there
+  p
+    :font-size medium
+  h1
+    :margin 0px
+  h2
+    :margin
+      :top 80px
+      :bottom 12px
+  h3
+    :font
+      :size large
+      :weight 200
+    :margin 0px
+  form, p
+    :margin-left 30px
+  input
+    :margin-bottom 15px
+  .hero-unit
+    :margin 20px 42px
+    :padding 40px 80px
+  .awesome
+    :text-align center
+    :margin-top 60px
+    .creation
+      :font-size 16px
+      
+#profile_photo_upload
+  #fileInfo
+    :margin-top 12px
+    :text-align left
+
 #welcome-to-diaspora
   :-webkit-box-shadow inset 0 -2px 10px rgba(0,0,0,0.35)
   :-moz-box-shadow inset 0 -2px 10px rgba(0,0,0,0.35)

app/assets/stylesheets/mobile.css.scss

@@ -1282,3 +1282,20 @@ input#q.search {
 .remove_comment {
   opacity: 0.5;
 }
+
+.center {
+  text-align: center;
+}
+
+/* --- Getting started page --- */
+#hello-there {
+  h1, h2, h3 { line-height: normal; }
+  h1 { font-size: 25px; }
+  h2 { font-size: 20px; }
+  h3 { font-size: 15px; }
+  
+  h2, #awesome_button {
+    margin-top: 30px;
+  }
+}
+

app/views/people/_add_contact.html.haml

@@ -1,4 +1,4 @@
-.span7.offset1.well
+.well
   = t('.invited_by')
   .media
     .float-right

app/views/photos/_new_profile_photo.haml

@@ -60,17 +60,11 @@
 #profile_photo_upload
   = owner_image_tag(:thumb_medium)
 
-  -if !aspect.nil? && aspect == :getting_started
-    %br
-    %br
-
   #file-upload.button
     =t('.upload')
 
   = image_tag('mobile-spinner.gif', :class => 'hidden', :style => "z-index:-1", :id => 'file-upload-spinner')
 
-  %br
-  %br
   %p
     #fileInfo
 

app/views/photos/_new_profile_photo.mobile.haml

@@ -43,17 +43,11 @@
 #profile_photo_upload
   = owner_image_tag(:thumb_medium)
 
-  -if !aspect.nil? && aspect == :getting_started
-    %br
-    %br
-
   #file-upload.button
     =t('.upload')
 
   = image_tag('mobile-spinner.gif', :class => 'hidden', :style => "z-index:-1", :id => 'file-upload-spinner')
 
-  %br
-  %br
   %p
     #fileInfo
 

app/views/users/getting_started.haml

@@ -4,72 +4,43 @@
 
 - content_for :head do
   = javascript_include_tag :profile
-:css
-  .media, .bd{ overflow: visible;}
-
-%br
 
 %section#hello-there
   .hero-unit
     %h1.center
       = t('.well_hello_there')
-    %p.center
+    %h3.center
       = t(".community_welcome")
 
     = invited_by_message
+    
+    %h2
+      = t(".who_are_you")
 
-    .clearfix
+    - if AppConfig.configured_services.include? :facebook
-      %br
+      %p
-      %br
+        != t('.connect_to_facebook', :link => link_to(t('.connect_to_facebook_link'), "auth/facebook?callback_url=#{getting_started_url}"))
 
-    .clearfix
+    = form_tag profile_path, :method => :put, :remote => true, :id => 'edit_profile' do
-      .row
+      %fieldset
-        %h2
+        = label_tag 'profile[first_name]', t('profiles.edit.your_name')
-          = t(".who_are_you")
+        = text_field_tag 'profile[first_name]', current_user.first_name
+        = image_tag 'ajax-loader.gif', :id => "gs-name-form-spinner", :class => "hidden"
+        = label_tag :your_photo, t('profiles.edit.your_photo')
+        = render 'photos/new_profile_photo', :aspect => :getting_started, :person => current_user.person
 
-      .row
+    %h2
-        %p
+      = t('.what_are_you_in_to')
-          != t('.connect_to_facebook', :link => link_to(t('.connect_to_facebook_link'), "auth/facebook?callback_url=#{getting_started_url}"))
 
-      .row
+    %p
-        .span6
+      = t('.hashtag_explanation')
-          = form_tag profile_path, :method => :put, :remote => true, :id => 'edit_profile' do
-            %fieldset
-              .clearfix
-                = label_tag 'profile[first_name]', t('profiles.edit.your_name'), :class => "bootstrapped"
-                .input
-                  = text_field_tag 'profile[first_name]', current_user.first_name
-                  = image_tag 'ajax-loader.gif', :id => "gs-name-form-spinner", :class => "hidden"
 
-            .clearfix
+    = form_tag(tag_followings_path, :method => 'get', :class => "tag_input search_form") do
-              = label_tag :your_photo, t('profiles.edit.your_photo'), :class => "bootstrapped"
+      %fieldset
-              .input{:style => "position:relative;"}
+        = label_tag 'follow_tags', t('.hashtag_suggestions')
-                = render 'photos/new_profile_photo', :aspect => :getting_started, :person => current_user.person
+        #tags_list
-      %br
+          = text_field_tag 'follow_tags', nil, :class => "nostrap"
-      %br
 
-    .clearfix
+    .awesome
-      .row
+      = link_to "#{t('.awesome_take_me_to_diaspora')} »", stream_path, :id => "awesome_button", :class => "button creation"
-        %h2
-          = t('.what_are_you_in_to')
-
-      .row
-        %p
-          = t('.hashtag_explanation')
-
-      .row
-        .span13
-          = form_tag(tag_followings_path, :method => 'get', :class => "tag_input search_form") do
-            %fieldset
-              .clearfix
-                = label_tag 'follow_tags', t('.hashtag_suggestions'), :class => "bootstrapped"
-                .input
-                  = text_field_tag 'follow_tags', nil, :class => "nostrap"
-
-            .clearfix
-              %br
-              %br
-              %br
-              .input
-                = link_to "#{t('.awesome_take_me_to_diaspora')} »", stream_path, :id => "awesome_button", :class => "btn primary"
 

app/views/users/getting_started.mobile.haml

@@ -42,64 +42,43 @@
 
 %section#hello-there
   .hero-unit-mobile
-    %h3.center
+    %h1.center
       = t('.well_hello_there')
-    %p.center
+    %h3.center
       = t(".community_welcome")
 
     = invited_by_message
 
-    .clearfix
+    %h2
+      = t(".who_are_you")
 
-    .clearfix
+    - if AppConfig.configured_services.include? :facebook
-      .row
+      %p
-        %h3
+        != t('.connect_to_facebook', :link => link_to(t('.connect_to_facebook_link'), "auth/facebook?callback_url=#{getting_started_url}"))
-          = t(".who_are_you")
 
-      .row
+    = form_tag profile_path, :method => :put, :remote => true, :id => 'edit_profile' do
-        %p
+      %fieldset
-          != t('.connect_to_facebook', :link => link_to(t('.connect_to_facebook_link'), "auth/facebook?callback_url=#{getting_started_url}"))
+        = label_tag 'profile[first_name]', t('profiles.edit.your_name'), :class => "bootstrapped"
+        = text_field_tag 'profile[first_name]', current_user.first_name
+        = image_tag 'ajax-loader.gif', :id => "gs-name-form-spinner", :class => "hidden"
+        %span.saved{:class => "hidden"}
+          = image_tag 'icons/check_yes_ok.png'
+          = t(".saved")
 
-      .row
+        = label_tag :your_photo, t('profiles.edit.your_photo'), :class => "bootstrapped"
-        .span6
+        = render 'photos/new_profile_photo', :aspect => :getting_started, :person => current_user.person
-          = form_tag profile_path, :method => :put, :remote => true, :id => 'edit_profile' do
-            %fieldset
-              .clearfix
-                = label_tag 'profile[first_name]', t('profiles.edit.your_name'), :class => "bootstrapped"
-                .input
-                  = text_field_tag 'profile[first_name]', current_user.first_name
-                  = image_tag 'ajax-loader.gif', :id => "gs-name-form-spinner", :class => "hidden"
 
-              %span.saved{:class => "hidden"}
+    %h2
-                = image_tag 'icons/check_yes_ok.png'
+      = t('.what_are_you_in_to')
-                = t(".saved")
 
-            .clearfix
+    %p
-              = label_tag :your_photo, t('profiles.edit.your_photo'), :class => "bootstrapped"
+      = t('.hashtag_explanation')
-              = render 'photos/new_profile_photo', :aspect => :getting_started, :person => current_user.person
 
-    .clearfix
+    = form_tag(tag_followings_path, :method => 'get', :class => "tag_input search_form") do
-      .row
+      %fieldset
-        %h3
+        = label_tag 'follow_tags', t('.hashtag_suggestions'), :class => "bootstrapped"
-          = t('.what_are_you_in_to')
+        = text_field_tag 'follow_tags', nil, :class => "nostrap"
-
+    
-      .row
+    .center
-        %p
+      = link_to "#{t('.awesome_take_me_to_diaspora')} »", stream_path, :id => "awesome_button", :class => "button creation"
-          = t('.hashtag_explanation')
-
-      .row
-        .span13
-          = form_tag(tag_followings_path, :method => 'get', :class => "tag_input search_form") do
-            %fieldset
-              .clearfix
-                = label_tag 'follow_tags', t('.hashtag_suggestions'), :class => "bootstrapped"
-                .input
-                  = text_field_tag 'follow_tags', nil, :class => "nostrap"
-
-            .clearfix
-              %br
-              %br
-              %br
-              .input
-                = link_to "#{t('.awesome_take_me_to_diaspora')} »", stream_path, :id => "awesome_button", :class => "btn primary"