welcome_social.html 6.02 KB
Newer Older
1 2
{% extends 'layouts/base.html' %}

3
{% block title %} SRCT RoomList | Welcome | Step 4 of 4 {% endblock %}
4 5 6

{% block content %}

7 8 9
<div class="progress">
  <div class="progress-bar" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100" style="width: 100%;">
    <span class="sr-only">100% complete</span>
10
  </div>
11 12
</div>

13 14 15
<div class="page-header" id="banner">
  <div class="row">
    <div class="col-md-12 text-center">
16
      <h1>Welcome to <strong>SRCT</strong>ROOMLIST! <small>Step 4 of 4</small></h1>
17 18 19 20
    </div>
  </div>
</div>

21 22
<div class="row">
  <div class="col-md-8 col-md-offset-2">
23
    <p>
24
      We're <strong>not</strong> recreating yet <em>another</em> social network. Instead,
25
      {{ student.get_first_name_or_uname }}, point other students to the
26
      social media accounts you <em>already</em> use on your directory page.
27 28 29 30 31 32
    </p>
    <p>
      You'll be asked to sign in to verify each account actually belongs to you.
      Otherwise, we don't use anything from these sites, with one exception. If you
      connect your Facebook account, we'll display your profile picture.
    </p>
33 34 35
  </div>
</div>

36 37
<br />

38
{% load socialaccount %}
39

40 41
{% get_social_accounts request.user as accounts %}

42
<div class="row">
43
  <div class="col-md-offset-2 col-md-8">
44 45 46

    <div class="panel panel-default">
      <div class="panel-heading">
47
        <h1 class="panel-title text-center"><strong>Social Media Accounts</strong></h1>
48 49 50
      </div>

      <div class="panel-body">
51
        <div class="row text-center">
52
          {% comment %} is it not possible to redirect the login failure? {% endcomment %}
53
          <div class="col-md-3 col-sm-6 col-xs-6">
Daniel W Bond's avatar
Daniel W Bond committed
54
            {% if accounts.facebook %}
55
              <p><i class="fa fa-check-square-o"></i> Verified!</p>
56
              <h4><i class="fa fa-facebook fa-2x"></i></h4>
57 58
              <h4>Facebook</h4>
            {% else %}
59
              <br />
60
            <a href="{% provider_login_url 'facebook' process='connect' %}">
61
              <h4><i class="fa fa-facebook fa-2x"></i></h4>
62
              <h4>Facebook</h4>
63
            </a>
64
            {% endif %}
65
            <br />
66
          </div>
67
          <div class="col-md-3 col-sm-6 col-xs-6">
Daniel W Bond's avatar
Daniel W Bond committed
68
            {% if accounts.google %}
69
              <p><i class="fa fa-check-square-o"></i> Verified!</p>
70
              <h4><i class="fa fa-google fa-2x"></i></h4>
71 72
              <h4>Google</h4>
            {% else %}
73
              <br />
74
            <a href="{% provider_login_url 'google' process='connect' %}">
75
              <h4><i class="fa fa-google fa-2x"></i></h4>
76
              <h4>Google</h4>
77
            </a>
78
            {% endif %}
79
            <br />
80
          </div>
81
          <div class="col-md-3 col-sm-6 col-xs-6">
Daniel W Bond's avatar
Daniel W Bond committed
82
            {% if accounts.twitter %}
83
              <p><i class="fa fa-check-square-o"></i> Verified!</p>
84
              <h4><i class="fa fa-twitter fa-2x"></i></h4>
85 86 87
              <h4>Twitter</h4>
            {% else %}
            <a href="{% provider_login_url 'twitter' process='connect' %}">
88
              <br />
89
              <h4><i class="fa fa-twitter fa-2x"></i></h4>
90
              <h4>Twitter</h4>
91
            </a>
92
            {% endif %}
93
            <br />
94
          </div>
95
          <div class="col-md-3 col-sm-6 col-xs-6">
Daniel W Bond's avatar
Daniel W Bond committed
96
            {% if accounts.instagram %}
97
              <p><i class="fa fa-check-square-o"></i> Verified!</p>
98
              <h4><i class="fa fa-instagram fa-2x"></i></h4>
99 100
              <h4>Instagram</h4>
            {% else %}
101
              <br />
102
            <a href="{% provider_login_url 'instagram' process='connect' %}">
103
              <h4><i class="fa fa-instagram fa-2x"></i></h4>
104
              <h4>Instagram</h4>
105
            </a>
106
            {% endif %}
107
            <br />
108
          </div>
109
          <div class="col-md-3 col-sm-6 col-xs-6">
110 111
            {% if accounts.tumblr %}
              <p><i class="fa fa-check-square-o"></i> Verified!</p>
112
              <h4><i class="fa fa-tumblr fa-2x"></i></h4>
113 114
              <h4>Tumblr</h4>
            {% else %}
115
              <br />
116
            <a href="{% provider_login_url 'tumblr' process='connect' %}">
117
              <h4><i class="fa fa-tumblr fa-2x"></i></h4>
118 119 120
              <h4>Tumblr</h4>
            </a>
            {% endif %}
121
            <br />
122
          </div>
123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151
          <div class="col-md-3 col-sm-6 col-xs-6">
            {% if accounts.pinterest %}
              <p><i class="fa fa-check-square-o"></i> Verified!</p>
              <h4><i class="fa fa-pinterest-p fa-2x"></i></h4>
              <h4>Pinterest</h4>
            {% else %}
              <br />
            <a href="{% provider_login_url 'pinterest' process='connect' %}">
              <h4><i class="fa fa-pinterest-p fa-2x"></i></h4>
              <h4>Pinterest</h4>
            </a>
            {% endif %}
            <br />
          </div>
          <div class="col-md-3 col-sm-6 col-xs-6">
            {% if accounts.spotify %}
              <p><i class="fa fa-check-square-o"></i> Verified!</p>
              <h4><i class="fa fa-spotify fa-2x"></i></h4>
              <h4>Spotify</h4>
            {% else %}
              <br />
            <a href="{% provider_login_url 'spotify' process='connect' %}">
              <h4><i class="fa fa-spotify fa-2x"></i></h4>
              <h4>Spotify</h4>
            </a>
            {% endif %}
            <br />
          </div>
          <div class="col-md-3 col-sm-6 col-xs-6">
152 153
            {% if accounts.github %}
              <p><i class="fa fa-check-square-o"></i> Verified!</p>
154
              <h4><i class="fa fa-github fa-2x"></i></h4>
155 156
              <h4>Github</h4>
            {% else %}
157
              <br />
158
            <a href="{% provider_login_url 'github' process='connect' %}">
159
              <h4><i class="fa fa-github fa-2x"></i></h4>
160 161 162
              <h4>Github</h4>
            </a>
            {% endif %}
163
            <br />
164
          </div>
165
        </div>
166
        <hr/>
167
        <form action="" method="post">{% csrf_token %}
Daniel W Bond's avatar
Daniel W Bond committed
168
          {{ form.as_p }}
169 170
          <input type="submit" value="Finish" class="btn btn-primary"/>
        </form>
171 172 173 174 175 176 177 178
      </div>
    </div>

  </div>
</div>


{% endblock %}