Created
November 7, 2014 11:42
-
-
Save nikolak/37e134c741127380f5d6 to your computer and use it in GitHub Desktop.
Simple flask example that uses fullcalendar.io
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| [ | |
| { | |
| "title": "All Day Event", | |
| "start": "2014-09-01" | |
| }, | |
| { | |
| "title": "Long Event", | |
| "start": "2014-09-07", | |
| "end": "2014-09-10" | |
| }, | |
| { | |
| "id": "999", | |
| "title": "Repeating Event", | |
| "start": "2014-09-09T16:00:00-05:00" | |
| }, | |
| { | |
| "id": "999", | |
| "title": "Repeating Event", | |
| "start": "2014-09-16T16:00:00-05:00" | |
| }, | |
| { | |
| "title": "Conference", | |
| "start": "2014-09-11", | |
| "end": "2014-09-13" | |
| }, | |
| { | |
| "title": "Meeting", | |
| "start": "2014-09-12T10:30:00-05:00", | |
| "end": "2014-09-12T12:30:00-05:00" | |
| }, | |
| { | |
| "title": "Lunch", | |
| "start": "2014-09-12T12:00:00-05:00" | |
| }, | |
| { | |
| "title": "Meeting", | |
| "start": "2014-09-12T14:30:00-05:00" | |
| }, | |
| { | |
| "title": "Happy Hour", | |
| "start": "2014-09-12T17:30:00-05:00" | |
| }, | |
| { | |
| "title": "Dinner", | |
| "start": "2014-09-12T20:00:00" | |
| }, | |
| { | |
| "title": "Birthday Party", | |
| "start": "2014-09-13T07:00:00-05:00" | |
| }, | |
| { | |
| "title": "Click for Google", | |
| "url": "http://google.com/", | |
| "start": "2014-09-28" | |
| } | |
| ] |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta charset='utf-8' /> | |
| <link href="{{ url_for('static', filename='fullcalendar.min.css') }}" rel='stylesheet' /> | |
| <link href="{{ url_for('static', filename='fullcalendar.print.css') }}" rel='stylesheet' media='print' /> | |
| <script src="{{ url_for('static', filename='lib/moment.min.js') }}"></script> | |
| <script src="{{ url_for('static', filename='lib/jquery.min.js') }}"></script> | |
| <script src="{{ url_for('static', filename='fullcalendar.min.js') }}"></script> | |
| <script> | |
| $(document).ready(function() { | |
| $('#calendar').fullCalendar({ | |
| header: { | |
| left: 'prev,next today', | |
| center: 'title', | |
| right: 'month,agendaWeek,agendaDay' | |
| }, | |
| defaultDate: '2014-09-12', | |
| editable: true, | |
| eventLimit: true, // allow "more" link when too many events | |
| events: { | |
| url: 'data', | |
| error: function() { | |
| $('#script-warning').show(); | |
| } | |
| }, | |
| loading: function(bool) { | |
| $('#loading').toggle(bool); | |
| } | |
| }); | |
| }); | |
| </script> | |
| <style> | |
| body { | |
| margin: 0; | |
| padding: 0; | |
| font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif; | |
| font-size: 14px; | |
| } | |
| #script-warning { | |
| display: none; | |
| background: #eee; | |
| border-bottom: 1px solid #ddd; | |
| padding: 0 10px; | |
| line-height: 40px; | |
| text-align: center; | |
| font-weight: bold; | |
| font-size: 12px; | |
| color: red; | |
| } | |
| #loading { | |
| display: none; | |
| position: absolute; | |
| top: 10px; | |
| right: 10px; | |
| } | |
| #calendar { | |
| max-width: 900px; | |
| margin: 40px auto; | |
| padding: 0 10px; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <div id='script-warning'> | |
| Error getting data from <code>/data</code> endpoint. | |
| </div> | |
| <div id='loading'>loading...</div> | |
| <div id='calendar'></div> | |
| </body> | |
| </html> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| from flask import Flask | |
| from flask import request, render_template, jsonify | |
| import json | |
| app = Flask(__name__) | |
| @app.route('/') | |
| def calendar(): | |
| return render_template("json.html") | |
| @app.route('/data') | |
| def return_data(): | |
| start_date = request.args.get('start', '') | |
| end_date = request.args.get('end', '') | |
| # You'd normally use the variables above to limit the data returned | |
| # you don't want to return ALL events like in this code | |
| # but since no db or any real storage is implemented I'm just | |
| # returning data from a text file that contains json elements | |
| with open("events.json", "r") as input_data: | |
| # you should use something else here than just plaintext | |
| # check out jsonfiy method or the built in json module | |
| # http://flask.pocoo.org/docs/0.10/api/#module-flask.json | |
| return input_data.read() | |
| if __name__ == '__main__': | |
| app.debug = True | |
| app.run() |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment