Question

I've created a small app in Flask that allows the users to book on the calendar .

I want just the subscribed user to make an appointment, if the current_user is not a subscriber , a message you get in place of the calendar that says 'you must be a subscriber to make a book', otherwise the calendar appears .

Am using SocketIO for live changing inside the DOM , in my views i've created two separated emits, the first one after the user subscribe and the second is if the user unsubscribed . If he subscribed the calendar should appear immediately and he can make the appointment if unsubscribed the calendar also should disappear the moment that the socket being sent .

Here is my views.py for both subscribe and after unsubscribe :

@client_route.route('/client/cat-<dir_code>/subscribe/<int:worker_id>', methods=['POST'])
@only_client
@is_active_client
def subscribe_worker(worker_id):

    client = Client.query.filter_by(tele=session.get('client_phone') ,name=session.get('client_logged_in'), family=session.get('client_family')).first_or_404()

    worker = Worker.query.filter_by(id=worker_id).first_or_404()

    if not client.is_subscriber(worker.id):
        client.subscribe(worker.id)
        client.in_chat = True
        db.session.add(client)
        db.session.commit()
        socketio.emit('show_calendar', namespace='/notifications-{}-{}'.format(client.name, client.family)
        )
        return jsonify({'success': Thanks for subscription.'})


@client_route.route('/client/cat-<dir_code>/subscribe/<int:worker_id>', methods=['POST'])
@only_client
@is_active_client
def unsubscribe_worker(worker_id):

    client = Client.query.filter_by(tele=session.get('client_phone') ,name=session.get('client_logged_in'), family=session.get('client_family')).first_or_404()

    worker = Worker.query.filter_by(id=worker_id).first_or_404()

    if client.is_subscriber(worker.id):
        client.unsubscribe(worker.id)
        client.in_chat = False
        db.session.add(client)
        db.session.commit()
        socketio.emit('hide_calendar', namespace='/notifications-{}-{}'.format(client.name, client.family)
        )
        return jsonify({'success': Thanks for subscription.'})

Now inside my template, i've initialized socketio , here is the code :

<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.0.1/socket.io.js"></script>
<script type="text/javascript">

  var socket = io.connect('http://' + document.domain + ':' + location.port + '/notifications-{{session.get("client_logged_in")}}-{{session.get("client_family")}}');

  socket.on('show_calendar', function(){
    alert('Now you can make a book .');
    $('#show_calendar').html('<div id="calendar"></div>');
  });

  socket.on('hide_calendar', function(){
    console.log('Calendar will be disabled .');
    $('#show_calendar').html('\
      <div class="alert alert-warning alert-dismissible alert-disappear" role="alert">\
          You have to subscribe to make a book .\
      </div>\
    ');
  });

</script>

Last thing the calendar block :

<div id="schedule" class="column_left wrap">
  <div class="header_block">
    <span>Calendar</span>
  </div>
  <div id="show_calendar">
    {% if client.is_subscriber(worker.id) %}
      <div id="calendar"></div>
    {% else %}
      <div class="alert alert-warning alert-dismissible alert-disappear" role="alert">
          You have to subscribe to make a book .
      </div>
    {% endif %}
  </div>
</div>

Now the problem is , if i subscribed , i can see inside the DOM the text that says You have to subscribe to make a book gets removed and the calendar div get placed but the calendar doesn't open i see just an empty white space, after page reloading it appears and i won't that , i want the calendar to appear immediately after i subscribe .

Please any help would be tons appreciated !!!

Update

I think there should be a way to load another jquery code that initiate and run the fullcalendar with all events and appointments that made by another users !!

How to show calendar on socket emit inside the page?

0 个答案: