karmaworld/templates/courses/course_detail.html

   1 {% extends "base.html" %}
   2 {% load url from future %}
   3
   4
   5 {% block pagescripts %}
   6     <script src="{{ STATIC_URL }}/js/bootstrap-modal.js" ></script>
   7     <script src="{{STATIC_URL}}ajaxuploader/js/fileuploader.js" ></script>
   8     <script>
   9         var course_pk = {{ course.id }};
  10         var course_name = "{{ course.name }}";
  11
  12         $(function(){
  13             var uploader = new qq.FileUploader( {
  14                 action: "{% url 'ajax_upload' %}",
  15                 element: $('#file-uploader')[0],
  16                 multiple: true,
  17                 onComplete: function( id, fileName, responseJSON ) {
  18                   if( responseJSON.success )
  19                     console.log( "success!" ) ;
  20                     $('form#upload_form').attr('action', responseJSON.note_url);
  21                     $('input.submit_upload').show();
  22                 },
  23                 onAllComplete: function( uploads ) {
  24                   // uploads is an array of maps
  25                   // the maps look like this: { file: FileObject, response: JSONServerResponse }
  26                   console.log( "All complete!" ) ;
  27                 },
  28                 params: {
  29                   'csrf_token': '{{ csrf_token }}',
  30                   'csrf_name': 'csrfmiddlewaretoken',
  31                   'csrf_xname': 'X-CSRFToken',
  32                   'course_id': {{ course.id }},
  33                 },
  34               }) ;
  35         });
  36     </script>
  37 {% endblock %}
  38
  39
  40 {% block pagestyle %}
  41   <link rel="stylesheet" type="text/css" media="all" href="/static/css/note_course_pages.css">
  42 {% endblock %}
  43
  44
  45 {% block lightboxen %}
  46   {% include 'lightbox/upload.html' %}
  47 {% endblock %}
  48
  49
  50 {% block title %}
  51   Share Notes for {{ course.name }} | {{ course.school.name }}
  52 {% endblock %}
  53
  54
  55 {% block content %}
  56   <section id="course_content">
  57
  58     <div id="course_header" class="hero_gradient_bar">
  59       <div class="row">
  60         <div id="course_subhead" class="twelve columns">
  61           course
  62         </div><!-- /course_subhead -->
  63       </div>
  64
  65       <div class="row">
  66         <div id="note_name" class="twelve columns">
  67           {{ course.name }}
  68         </div><!-- /note_name -->
  69       </div>
  70
  71       <div class="row">
  72         <div id="course_meta" class="twelve columns">
  73           <div class="activity_details_context">
  74             {% comment %}
  75             <!-- Version of the instructor//school with links to instructor//school
  76             <a href="#" class="prof_link">{{ course.instructor_name }}</a> // <a href="{{ course.school.get_absolute_url }}" class="school_link">{{ course.school.name }}</a>
  77             {% endcomment %}
  78             {{ course.instructor_name }} // {{ course.school.name }}
  79           </div><!-- /activity_details_context -->
  80         </div><!-- /course_meta -->
  81       </div>
  82
  83
  84       {% comment %}
  85       <div class="row">
  86         <div id="course_actions" class="two columns centered">
  87           <div class="row">
  88             <div class="six columns">
  89               {% if course in user.get_profile.courses.all %}
  90                 <div class="course_meta_action course_meta_drop" data-id="{{ course.id }}">
  91                   drop
  92                 </div>
  93               {% else %}
  94                 <div class="course_meta_action course_meta_join" data-id="{{ course.id }}">
  95                   join
  96                 </div>
  97               {% endif %}
  98             </div>
  99             <div id="course_meta_action_gear" class="six columns">
 100               <img src="/static/img/course_action_gear.png" alt="course_action_gear" width="39" height="37" />
 101             </div>
 102           </div>
 103         </div>
 104       </div>
 105       {% endcomment %}
 106
 107       <div class="row">
 108         <div id="course_description" class="eight columns centered">
 109          {% if course.desc %}
 110             {{ course.desc }}
 111          {% endif %}
 112           <!-- TODO: We don't provide a course description -->
 113         </div><!-- /course_description -->
 114       </div>
 115
 116       <div class="row">
 117         <div class="three columns centered">
 118           <div id=upload_button_container class=button_bevel >
 119             <div id=upload_button course=button_interior data-id="{{ course.id }}">
 120               upload
 121             </div>
 122           </div>
 123         </div>
 124       </div>
 125
 126     </div><!-- /course_header -->
 127
 128     <div class="row">
 129       <div class="ten columns offset-by-one">
 130         <div class="column_header" style="margin: 17px 0 -25px 0">
 131           Latest uploaded notes
 132         </div><!-- /column_header -->
 133       </div>
 134     </div> <!-- .row -->
 135
 136     <div id="course_container">
 137       <div class="row">
 138         <div class="ten columns offset-by-one">
 139
 140           {% for note in course.note_set.all %}
 141
 142           <div class="row notes_result_container wide">
 143             <div class="twelve columns notes_result {% if forloop.counter|divisibleby:"2" %}row_alt_on{% endif %}">
 144               <div class="activity_timestamp">
 145                 {{ note.uploaded_at|date:"gA" }} // {{ note.uploaded_at|date:"D M d o" }}
 146               </div>
 147
 148               <div class="activity_details_action">
 149                 <a href="{{ note.get_absolute_url }}" class="activity_target">{{ note.name }}</a>
 150                 {% comment %}
 151                 <!-- file name and info with uploader info -->
 152                 <a href="#" class="activity_actor">{{ note.owner.get_profile.get_name }}</a> added <a href="{{ note.get_absolute_url }}" class="activity_target">{{ file.name }}</a>
 153                 {% endcomment %}
 154               </div>
 155
 156               <div class="activity_details_context">
 157                 <a href="{{ course.get_absolute_url }}" class="course_link">{{ course.name }}</a>//<a href="{{ course.school.get_absolute_url }}" class="school_link">{{ course.school.name }}</a>
 158               </div>
 159               <div class="activity_details_callout">
 160                 <div class="row">
 161                   <div class="one column">
 162                     <img src="/static/img/dashboard_activity_callout_icon_notebook.png" alt="dashboard_activity_callout_icon_notebook" width="44" height="44" />
 163                   </div>
 164                   <div class="eleven columns activity_details_callout_copy">
 165
 166                     {% if note.text %}
 167                       {{ note.text|slice:":500" }}&hellip;
 168                     {% else %}
 169                       {{ note.description }}
 170                     {% endif %}
 171                   </div>
 172                 </div>
 173               </div>
 174               {% comment %}
 175               <!-- # users have liked, # users have viewed -->
 176               <div class="row">
 177                 <div class="twelve columns activity_details_status">
 178                   So far, <span class="activity_details_status_number">{{ note.numUpVotes }}</span> people have completely fallen in love with with these notes. <span class="activity_details_status_secondary_number">{{ note.viewCount }}</span> people have viewed them.
 179                 </div><!-- /activity_details_status -->
 180               </div>
 181               {% endcomment %}
 182             </div><!-- /notes_result -->
 183           </div><!-- /notes_result_container -->
 184           {% endfor %}
 185         </div>
 186       </div>
 187
 188     </div><!-- /course_container -->
 189
 190     {% comment %}
 191     <div class="row">
 192       <div class="twelve columns">
 193         <div id="search_pagination" style="width: 232px"><!-- WIDTH SHOULD BE SET DYNAMICALLY TO ENABLE MARGIN: AUTO -->
 194           <div id="search_pagination_left">
 195             <img src="img/search_arrow_left.png" alt="search_arrow_left" width="5" height="10" />
 196           </div><!-- /search_pagination_left -->
 197           <div id="search_pagination_numbers">
 198             <ul>
 199               <li class="button_interior">1</li>
 200               <li>2</li>
 201               <li>3</li>
 202               <li>4</li>
 203               <li>5</li>
 204               <li>6</li>
 205             </ul>
 206           </div><!-- /search_pagination_numbers -->
 207           <div id="search_pagination_right">
 208             <img src="img/search_arrow_right.png" alt="search_arrow_right" width="5" height="10" />
 209           </div><!-- /search_pagination_right -->
 210         </div><!-- /search_pagination -->
 211       </div>
 212     </div>
 213     {% endcomment %}
 214   </section><!--/note_content-->
 215 {% endblock %}