| 1 | Mobile Indico
|
|---|
| 2 | =============
|
|---|
| 3 |
|
|---|
| 4 | Mobile Indico aims to display an indico event in a mobile friendly way.
|
|---|
| 5 |
|
|---|
| 6 |
|
|---|
| 7 | Quick guide - direct access
|
|---|
| 8 | ===========================
|
|---|
| 9 |
|
|---|
| 10 | If you are happy with the existuing layout, you can access an event
|
|---|
| 11 | with a given id (example: 254) from a given indico server (example:
|
|---|
| 12 | https://indico.scc.kit.edu/indico/) as a mobile version directly by
|
|---|
| 13 |
|
|---|
| 14 | https://www.fact-project.org/svn/trunk/MobileIndico/indico.html?url=https://indico.scc.kit.edu/indico/&id=254
|
|---|
| 15 |
|
|---|
| 16 | If you find that too long, you can use http://tinyurl.com to shorten
|
|---|
| 17 | the link.
|
|---|
| 18 |
|
|---|
| 19 | A short version of the core url is available as
|
|---|
| 20 |
|
|---|
| 21 | http://tinyurl.com/MyIndico?url=https://indico.scc.kit.edu/indico/&id=254
|
|---|
| 22 |
|
|---|
| 23 |
|
|---|
| 24 | Introduction
|
|---|
| 25 | ============
|
|---|
| 26 |
|
|---|
| 27 | Mobile Indico is a simple web-page which converts an indico timetable
|
|---|
| 28 | into a mobile webpage. The trick is to request the data through the
|
|---|
| 29 | Indico Export API (https://indico.readthedocs.io/en/master/http_api/)
|
|---|
| 30 | and display it in a mobile friendly way.
|
|---|
| 31 |
|
|---|
| 32 | Therefore, the webpage requests the timetable (see 2.3.3) as JSON
|
|---|
| 33 | object which is then formatted to HTML in a Javascript. To avoid that a
|
|---|
| 34 | server is required (e.g. php script) which retrieves the JSON (to work
|
|---|
| 35 | around restirctions on cross site scripting) the JSONP interface is
|
|---|
| 36 | used.
|
|---|
| 37 |
|
|---|
| 38 | The trick of JSONP is to wrap the JSON opject into a script (Javascript
|
|---|
| 39 | function) and insert a <script> tag into the webpage. Thus the script
|
|---|
| 40 | containing the data is loaded and the data can be processed.
|
|---|
| 41 |
|
|---|
| 42 | The advantage now is that the client side browser will request the data
|
|---|
| 43 | directly from the indico server.
|
|---|
| 44 |
|
|---|
| 45 |
|
|---|
| 46 | Installation on your own server
|
|---|
| 47 | ===============================
|
|---|
| 48 |
|
|---|
| 49 | First download all files from
|
|---|
| 50 |
|
|---|
| 51 | https://trac.fact-project.org/browser/trunk/MobileIndico
|
|---|
| 52 |
|
|---|
| 53 | and copy them to a webserver.
|
|---|
| 54 |
|
|---|
| 55 | The current version is bound to a single indico server which is
|
|---|
| 56 | specified in indico.js in the first line, as well as the number
|
|---|
| 57 | of the default event if no event is specified:
|
|---|
| 58 |
|
|---|
| 59 | var indico_url = "https://indico.scc.kit.edu/indico/";
|
|---|
| 60 | var default_event = 215;
|
|---|
| 61 |
|
|---|
| 62 | Adapt that according to your needs.
|
|---|
| 63 |
|
|---|
| 64 |
|
|---|
| 65 | User access to indico.html
|
|---|
| 66 | ==========================
|
|---|
| 67 |
|
|---|
| 68 | The default timetable is then accessed through
|
|---|
| 69 |
|
|---|
| 70 | http://you.web-server.com/your-path/indico.html
|
|---|
| 71 |
|
|---|
| 72 | and another event (e.g. 215) through
|
|---|
| 73 |
|
|---|
| 74 | http://you.web-server.com/your-path/indico.html?id=215
|
|---|
| 75 |
|
|---|
| 76 | A debug mode in which the received JSON object is displayed is
|
|---|
| 77 | available as well
|
|---|
| 78 |
|
|---|
| 79 | http://you.web-server.com/your-path/indico.html?id=215&debug
|
|---|
| 80 |
|
|---|
| 81 | It is also possible to overwrite the default indico url, for exmaple
|
|---|
| 82 |
|
|---|
| 83 | http://you.web-server.com/your-path/indico.html?url=https://indico.scc.kit.edu/indico/&id=215
|
|---|
| 84 |
|
|---|
| 85 |
|
|---|
| 86 | Files
|
|---|
| 87 | =====
|
|---|
| 88 |
|
|---|
| 89 | indico.css: A simple style sheet to format the output
|
|---|
| 90 | indico.svg: The indico logo at the header line
|
|---|
| 91 | rwth.avg: The rwth logo at the footer
|
|---|
| 92 | indico.js: The javascript retrieving the data and formatting the html
|
|---|
| 93 | indico.html: The main html page for user access
|
|---|
| 94 |
|
|---|
| 95 |
|
|---|
| 96 | Style sheet
|
|---|
| 97 | ===========
|
|---|
| 98 |
|
|---|
| 99 | For formatting purpose, the data is wrapped in classes like this:
|
|---|
| 100 |
|
|---|
| 101 | <indico>
|
|---|
| 102 | Date
|
|---|
| 103 | <session>
|
|---|
| 104 | <date>
|
|---|
| 105 | Time
|
|---|
| 106 | </date>
|
|---|
| 107 | <body>
|
|---|
| 108 | <type>
|
|---|
| 109 | entryType
|
|---|
| 110 | <location>
|
|---|
| 111 | Location
|
|---|
| 112 | </location>
|
|---|
| 113 | </type>
|
|---|
| 114 | <contribution>
|
|---|
| 115 | <date>
|
|---|
| 116 | Time
|
|---|
| 117 | <title>
|
|---|
| 118 | Title
|
|---|
| 119 | </title>
|
|---|
| 120 | </date>
|
|---|
| 121 | <presenters>
|
|---|
| 122 | Name Affiliation Email
|
|---|
| 123 | </presenters>
|
|---|
| 124 | <presenters>
|
|---|
| 125 | ...
|
|---|
| 126 | </presenters>
|
|---|
| 127 | ...
|
|---|
| 128 | <description>
|
|---|
| 129 | Description
|
|---|
| 130 | </description>
|
|---|
| 131 | <material>
|
|---|
| 132 | <title>
|
|---|
| 133 | Title
|
|---|
| 134 | </title>
|
|---|
| 135 | <resources>
|
|---|
| 136 | <url>
|
|---|
| 137 | URL
|
|---|
| 138 | </url>
|
|---|
| 139 | <description>
|
|---|
| 140 | Description
|
|---|
| 141 | </description>
|
|---|
| 142 | ...
|
|---|
| 143 | </resources>
|
|---|
| 144 | <description>
|
|---|
| 145 | Description
|
|---|
| 146 | </description>
|
|---|
| 147 | </material>
|
|---|
| 148 | <material>
|
|---|
| 149 | ...
|
|---|
| 150 | </material>
|
|---|
| 151 | ...
|
|---|
| 152 | </contribution>
|
|---|
| 153 | <contribution>
|
|---|
| 154 | ...
|
|---|
| 155 | </contribution>
|
|---|
| 156 | ....
|
|---|
| 157 | </body>
|
|---|
| 158 | </session>
|
|---|
| 159 | <session>
|
|---|
| 160 | ...
|
|---|
| 161 | </session>
|
|---|
| 162 | ...
|
|---|
| 163 | </indico>
|
|---|
