ログイン後の初期設定 - helpy code reading

Rails 勉強

github.com

初期ログイン後に表示される初期設定画面周りのコードを見ていく。

流れ

ログイン後のリダイレクト

admin's root admin/dashboard#index to admin/topics#index

def index
    #@topics = Topic.mine(current_user.id).pending.page params[:page]

    if current_user.is_admin? || current_user.is_agent?
      redirect_to admin_topics_path
    elsif current_user.is_editor?
      redirect_to admin_categories_path
    else
      redirect_to root_url
    end
  end

ダイアログの表示

初期設定 = onboardingというキーワードで表現されていて、済みかの判定は下記のメソッドで定義されている。

# Admin::BaseController
def show_onboarding?
    User.first.email == 'admin@test.com' && current_user.email == 'admin@test.com' && current_user.is_admin?
  end

上記のメソッドをhelper_methodに登録して、html側で呼び出している。

# views/admin/topics/index.html.erb
<% if show_onboarding? %>
<div id='modal' class="modal" tabindex="-1" role="dialog" data-backdrop="static">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
      <iframe src="/admin/onboarding/index" width="100%" height="900" frameborder="no" scrolling="no"></iframe>
    </div>
  </div>
</div>
<script>
// Fire the onboarding modal if needed
$('#modal').modal('toggle');
</script>
<% end %>

onboarding modal

上記のmodal内のiframeに設定されているところを見ていく。

登録のステップとして、メッセージ表示、サービス設定、アカウント設定がある。

htmlは全てonboarding/index.html.erbに記載されていて、class onboard-panel を遷移させていく形で実装してある。

panel遷移のJS処理は assets/javascripts/admin.js に描かれている

var Helpy = Helpy || {};

...

Helpy.showPanel = function(panel) {
  var currentPanel = panel-1;
  $('.onboard-panel').addClass('hidden');
  $('#panel-' + panel).removeClass('hidden');
  $('li.step-' + currentPanel).html("<span class='glyphicon glyphicon-ok'></span>").addClass('filled-circle');
  $('li.step-' + panel).addClass('active-step');
  return true;
};

...

サービス設定のフォームはAjax化されている。

# onboarding/index.html.erb
...

<div id="panel-2" class="onboard-panel text-center hidden">
  <div class="onboard-message">
    <h2>Great! Lets Customize your Helpdesk:</h2>
  </div>
  <div class="text-left">
  <%= bootstrap_form_tag url: admin_onboard_settings_path, method: 'patch', remote: true do |f| %>

...

コントローラー側は下記のようになっている。

# admin/onboarding_controoer.rb

def update_settings

    設定保存処理

    respond_to do |format|
      format.html { redirect_to(admin_settings_path) }
      format.js {
          render js: "Helpy.showPanel(3);$('#edit_user_1').enableClientSideValidations();"
      }
    end
  end

アカウント設定のフォームはAjaxではなくて、onboarding#update_user で設定保存後にonboarding#complete リダイレクトして動作完了。

参考になる箇所