First step of player page in front. Old version of metadata player integrated.
--- a/src/ldt/ldt/ldt_utils/templates/front/front_base.html Mon Jan 09 15:12:15 2012 +0100
+++ b/src/ldt/ldt/ldt_utils/templates/front/front_base.html Mon Jan 09 18:58:42 2012 +0100
@@ -9,7 +9,7 @@
<meta http-equiv="Content-type" content="text/html;charset=UTF-8" />
<meta http-equiv="content-language" content="{{LANGUAGE_CODE}}" />
<link rel="SHORTCUT ICON" href="{{LDT_MEDIA_PREFIX}}/img/favicon.ico" />
- <title>{% block title %}{% trans "page_title" %}{% endblock %}</title>
+ <title>{% block title %}Lignes de temps{% endblock %}</title>
{% block js_import %}{% endblock %}
{% block css_declaration %}{% endblock %}
{% block css_import %}
--- a/src/ldt/ldt/ldt_utils/templates/front/front_group.html Mon Jan 09 15:12:15 2012 +0100
+++ b/src/ldt/ldt/ldt_utils/templates/front/front_group.html Mon Jan 09 18:58:42 2012 +0100
@@ -2,7 +2,8 @@
{% load i18n %}
{% load thumbnail %}
-{% block title %}Home{% endblock %}
+{% block title %}Lignes de temps : groupe "{{group.name}}"{% endblock %}
+
{% block css_import %}
{{block.super}}
<link rel="stylesheet" href="{{LDT_MEDIA_PREFIX}}css/front_group.css" type="text/css"/>
@@ -17,9 +18,9 @@
</li>
{% for content in content_list %}
<li class="li_media">
- <a href="#">{% thumbnail content.image "134x75" format="PNG" crop="center" as im %}<img src="{{ im.url }}" class="img_media" width="{{ im.width }}" height="{{ im.height }}">{% endthumbnail %}</a>
+ <a href="{% url ldt.ldt_utils.views.front.annot_content content.iri_id %}">{% thumbnail content.image "134x75" format="PNG" crop="center" as im %}<img src="{{ im.url }}" class="img_media" width="{{ im.width }}" height="{{ im.height }}">{% endthumbnail %}</a>
<div class="bulle_annot">120</div>
- <p><a href="#"><b>{% if content.title|length > 69 %}{{content.title|slice:":69"}}...{% else %}{{content.title}}{% endif %}</b></a></p>
+ <p><a href="{% url ldt.ldt_utils.views.front.annot_content content.iri_id %}"><b>{% if content.title|length > 69 %}{{content.title|slice:":69"}}...{% else %}{{content.title}}{% endif %}</b></a></p>
<p class="font_11">{% trans 'by' %} IRI | {{content.duration_str}}</p>
</li>
{% endfor %}
--- a/src/ldt/ldt/ldt_utils/templates/front/front_home.html Mon Jan 09 15:12:15 2012 +0100
+++ b/src/ldt/ldt/ldt_utils/templates/front/front_home.html Mon Jan 09 18:58:42 2012 +0100
@@ -2,7 +2,8 @@
{% load i18n %}
{% load thumbnail %}
-{% block title %}Home{% endblock %}
+{% block title %}Lignes de temps : Home{% endblock %}
+
{% block css_import %}
{{block.super}}
<link rel="stylesheet" href="{{LDT_MEDIA_PREFIX}}css/front_home.css" type="text/css"/>
@@ -17,9 +18,9 @@
</li>
{% for content in last_contents %}
<li class="li_media">
- <a href="#">{% thumbnail content.image "294x165" format="PNG" crop="center" as im %}<img src="{{ im.url }}" class="img_media" width="{{ im.width }}" height="{{ im.height }}">{% endthumbnail %}</a>
+ <a href="{% url ldt.ldt_utils.views.front.annot_content content.iri_id %}">{% thumbnail content.image "294x165" format="PNG" crop="center" as im %}<img src="{{ im.url }}" class="img_media" width="{{ im.width }}" height="{{ im.height }}">{% endthumbnail %}</a>
<div class="bulle_annot">250</div>
- <p><a href="#"><b>{{content.title}}</b></a></p>
+ <p><a href="{% url ldt.ldt_utils.views.front.annot_content content.iri_id %}"><b>{{content.title}}</b></a></p>
<p>{% trans 'by' %} IRI | {{content.duration_str}}</p>
</li>
{% endfor %}
@@ -31,9 +32,9 @@
</li>
{% for content in most_contents %}
<li class="li_media">
- <a href="#">{% thumbnail content.image "134x75" format="PNG" crop="center" as im %}<img src="{{ im.url }}" class="img_media" width="{{ im.width }}" height="{{ im.height }}">{% endthumbnail %}</a>
+ <a href="{% url ldt.ldt_utils.views.front.annot_content content.iri_id %}">{% thumbnail content.image "134x75" format="PNG" crop="center" as im %}<img src="{{ im.url }}" class="img_media" width="{{ im.width }}" height="{{ im.height }}">{% endthumbnail %}</a>
<div class="bulle_annot">120</div>
- <p><a href="#"><b>{% if content.title|length > 69 %}{{content.title|slice:":69"}}...{% else %}{{content.title}}{% endif %}</b></a></p>
+ <p><a href="{% url ldt.ldt_utils.views.front.annot_content content.iri_id %}"><b>{% if content.title|length > 69 %}{{content.title|slice:":69"}}...{% else %}{{content.title}}{% endif %}</b></a></p>
<p class="font_11">{% trans 'by' %} IRI | {{content.duration_str}}</p>
</li>
{% endfor %}
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/src/ldt/ldt/ldt_utils/templates/front/front_player.html Mon Jan 09 18:58:42 2012 +0100
@@ -0,0 +1,196 @@
+{% extends "front/front_base.html" %}
+{% load i18n %}
+{% load thumbnail %}
+
+{% block title %}Lignes de temps : {% trans 'Annotate' %} "{{content.title}}"{% endblock %}
+
+{% block css_import %}
+{{block.super}}
+<link rel="stylesheet" href="{{LDT_MEDIA_PREFIX}}css/front_player.css" type="text/css"/>
+<link rel="stylesheet" href="{{LDT_MEDIA_PREFIX}}css/embed_popup.css" type="text/css"/>
+<link rel="stylesheet" href="{{LDT_MEDIA_PREFIX}}css/jq-css/jquery.qtip.css" type="text/css"/>
+{% endblock %}
+
+{% block js_declaration %}
+<script type="text/javascript" src="{{LDT_MEDIA_PREFIX}}js/jquery.min.js"></script>
+<script type="text/javascript" src="{{LDT_MEDIA_PREFIX}}js/jquery.qtip.min.js"></script>
+<script type="text/javascript">
+ var $j = jQuery.noConflict();
+</script>
+<script type="text/javascript" src="{{LDT_MEDIA_PREFIX}}js/LdtPlayer.min.js"></script>
+<script type="text/javascript">
+ __IriSP.lib = {
+ jQuery:"{{LDT_MEDIA_PREFIX}}js/jquery.min.js",
+ jQueryUI:"{{LDT_MEDIA_PREFIX}}js/jquery-ui.min.js",
+ jQueryToolTip:"{{LDT_MEDIA_PREFIX}}js/jquery.tools.min.js",
+ swfObject:"{{LDT_MEDIA_PREFIX}}js/swfobject.js",
+ cssjQueryUI:"{{LDT_MEDIA_PREFIX}}css/jq-css/themes/base/jquery-ui.css"
+ };
+</script>
+<script type="text/javascript" src="{{LDT_MEDIA_PREFIX}}js/embed_popup.js"></script>
+<script type="text/javascript" src="{{LDT_MEDIA_PREFIX}}js/ZeroClipboard.js"></script>
+<script type="text/javascript">
+ $j(document).ready(function(){
+ ZeroClipboard.setMoviePath( '{{WEB_URL}}{{LDT_MEDIA_PREFIX}}swf/ZeroClipboard10.swf' );
+ clip = new ZeroClipboard.Client();
+ $j("#clipboard_button").html(clip.getHTML(32,32));
+ clip.setHandCursor(true);
+ clip.setText('{{ldt_id}}');
+ $j("#clipboard_button").qtip({
+ style: {
+ classes: 'ui-tooltip-dark ui-tooltip-rounded qtipldt'
+ }
+ });
+ });
+</script>
+{% endblock %}
+
+{% block body %}
+{{block.super}}
+<!-- Player column -->
+<div id="player_col_g">
+ <ul class="floatlist" id="top_media">
+ <li id="title_media"><h2>{{content.title}}</h2></li>
+ <!--li id="media_share">
+ <ul class="floatlist">
+ <li class="share_li">
+ <a href="https://twitter.com/share" class="twitter-share-button" data-count="none">Twitter</a>
+ <script src="http://platform.twitter.com/widgets.js" type="text/javascript"></script>
+ </li>
+ <li class="share_li" style="padding-top: 3px">
+ <a name="fb_share">Partager</a>
+ <script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script>
+ </li>
+ <li class="share_li">
+ <g:plusone size="medium" annotation="none"></g:plusone>
+ <script type="text/javascript">
+ (function() {
+ var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
+ po.src = 'https://apis.google.com/js/plusone.js';
+ var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
+ })();
+ </script>
+ </li>
+ </ul>
+ </li -->
+ </ul>
+ <!--img src="img/placeholder.png" alt="ICI LE PLAYER" width="550" height="420" /-->
+ <div class="ldt_player" id="wrapper_{{player_id}}">
+ {% include "ldt/ldt_utils/partial/embed_player.html" %}
+ </div>
+</div>
+
+<!-- Right column -->
+<div id="player_col_d">
+ <div class="li_h2">
+ <h2>{% trans 'All annotations on the media' %}</h2>
+ </div>
+ <ul class="floatlist" id="annot_media">
+ <li>
+ <img class="fl img_media" src="{{LDT_MEDIA_PREFIX}}img/annot_icon_80x45.png" width="80" height="45" />
+ <div class="fl une_annot">
+ <h5><a class="blue">Lorem Ipsum Dolor</a></h5>
+ <p class="fr pink font_11">00:12:12 - 00:15:13</p>
+ <p class="clear font_11">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque</p>
+ </div>
+ </li>
+ <li>
+ <img class="fl img_media" src="{{LDT_MEDIA_PREFIX}}img/annot_icon_80x45.png" width="80" height="45" />
+ <div class="fl une_annot">
+ <h5><a class="blue">Lorem Ipsum Dolor</a></h5>
+ <p class="fr pink font_11">00:12:12 - 00:15:13</p>
+ <p class="clear font_11">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque</p>
+ </div>
+ </li>
+ <li>
+ <img class="fl img_media" src="{{LDT_MEDIA_PREFIX}}img/annot_icon_80x45.png" width="80" height="45" />
+ <div class="fl une_annot">
+ <h5><a class="blue">Lorem Ipsum Dolor</a></h5>
+ <p class="fr pink font_11">00:12:12 - 00:15:13</p>
+ <p class="clear font_11">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque</p>
+ </div>
+ </li>
+ <li class="selected">
+ <img class="fl img_media" src="{{LDT_MEDIA_PREFIX}}img/annot_icon_80x45.png" width="80" height="45" />
+ <div class="fl une_annot">
+ <h5><a class="blue">Lorem Ipsum Dolor</a></h5>
+ <p class="fr pink font_11">00:12:12 - 00:15:13</p>
+ <p class="clear font_11">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque</p>
+ </div>
+ </li>
+ <li>
+ <img class="fl img_media" src="{{LDT_MEDIA_PREFIX}}img/annot_icon_80x45.png" width="80" height="45" />
+ <div class="fl une_annot">
+ <h5><a class="blue">Lorem Ipsum Dolor</a></h5>
+ <p class="fr pink font_11">00:12:12 - 00:15:13</p>
+ <p class="clear font_11">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque</p>
+ </div>
+ </li>
+ <li>
+ <img class="fl img_media" src="{{LDT_MEDIA_PREFIX}}img/annot_icon_80x45.png" width="80" height="45" />
+ <div class="fl une_annot">
+ <h5><a class="blue">Lorem Ipsum Dolor</a></h5>
+ <p class="fr pink font_11">00:12:12 - 00:15:13</p>
+ <p class="clear font_11">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque</p>
+ </div>
+ </li>
+ <li>
+ <img class="fl img_media" src="{{LDT_MEDIA_PREFIX}}img/annot_icon_80x45.png" width="80" height="45" />
+ <div class="fl une_annot">
+ <h5><a class="blue">Lorem Ipsum Dolor</a></h5>
+ <p class="fr pink font_11">00:12:12 - 00:15:13</p>
+ <p class="clear font_11">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque</p>
+ </div>
+ </li>
+ <li>
+ <img class="fl img_media" src="{{LDT_MEDIA_PREFIX}}img/annot_icon_80x45.png" width="80" height="45" />
+ <div class="fl une_annot">
+ <h5><a class="blue">Lorem Ipsum Dolor</a></h5>
+ <p class="fr pink font_11">00:12:12 - 00:15:13</p>
+ <p class="clear font_11">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque</p>
+ </div>
+ </li>
+ <li>
+ <img class="fl img_media" src="{{LDT_MEDIA_PREFIX}}img/annot_icon_80x45.png" width="80" height="45" />
+ <div class="fl une_annot">
+ <h5><a class="blue">Lorem Ipsum Dolor</a></h5>
+ <p class="fr pink font_11">00:12:12 - 00:15:13</p>
+ <p class="clear font_11">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque</p>
+ </div>
+ </li>
+ <li>
+ <img class="fl img_media" src="{{LDT_MEDIA_PREFIX}}img/annot_icon_80x45.png" width="80" height="45" />
+ <div class="fl une_annot">
+ <h5><a class="blue">Lorem Ipsum Dolor</a></h5>
+ <p class="fr pink font_11">00:12:12 - 00:15:13</p>
+ <p class="clear font_11">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque</p>
+ </div>
+ </li>
+ <li>
+ <img class="fl img_media" src="{{LDT_MEDIA_PREFIX}}img/annot_icon_80x45.png" width="80" height="45" />
+ <div class="fl une_annot">
+ <h5><a class="blue">Lorem Ipsum Dolor</a></h5>
+ <p class="fr pink font_11">00:12:12 - 00:15:13</p>
+ <p class="clear font_11">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque</p>
+ </div>
+ </li>
+ <li>
+ <img class="fl img_media" src="{{LDT_MEDIA_PREFIX}}img/annot_icon_80x45.png" width="80" height="45" />
+ <div class="fl une_annot">
+ <h5><a class="blue">Lorem Ipsum Dolor</a></h5>
+ <p class="fr pink font_11">00:12:12 - 00:15:13</p>
+ <p class="clear font_11">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque</p>
+ </div>
+ </li>
+ <li>
+ <img class="fl img_media" src="{{LDT_MEDIA_PREFIX}}img/annot_icon_80x45.png" width="80" height="45" />
+ <div class="fl une_annot">
+ <h5><a class="blue">Lorem Ipsum Dolor</a></h5>
+ <p class="fr pink font_11">00:12:12 - 00:15:13</p>
+ <p class="clear font_11">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque</p>
+ </div>
+ </li>
+ </ul>
+</div>
+{% endblock %}
+
--- a/src/ldt/ldt/ldt_utils/urls.py Mon Jan 09 15:12:15 2012 +0100
+++ b/src/ldt/ldt/ldt_utils/urls.py Mon Jan 09 18:58:42 2012 +0100
@@ -42,6 +42,7 @@
url(r'^updateGroup/(?P<group_id>.*)$', 'views.group.update_group'),
url(r'^front/$', 'views.front.front_home'),
url(r'^front/group/(?P<group_id>.*)$', 'views.front.group_info'),
+ url(r'^front/player/(?P<content_iri_id>.*)$', 'views.front.annot_content'),
)
urlpatterns += patterns('',
--- a/src/ldt/ldt/ldt_utils/views/front.py Mon Jan 09 15:12:15 2012 +0100
+++ b/src/ldt/ldt/ldt_utils/views/front.py Mon Jan 09 18:58:42 2012 +0100
@@ -1,6 +1,7 @@
from django.conf import settings
from django.contrib.auth.decorators import login_required
from django.contrib.auth.models import Group, User
+from django.core.urlresolvers import reverse
from django.http import HttpResponseServerError
from django.shortcuts import render_to_response, get_object_or_404
from django.template import RequestContext
@@ -9,9 +10,6 @@
from ldt.security.utils import add_change_attr
-
-
-
@login_required
def front_home(request):
# Get the 3 last annotated contents
@@ -48,4 +46,30 @@
context_instance=RequestContext(request))
+@login_required
+def annot_content(request, content_iri_id):
+ # Get the wanted content
+ content = Content.objects.get(iri_id=content_iri_id)
+ # The main project for the content
+ proj = Project.objects.filter(contents__in=[content])[0]
+ # Vars for player
+ player_id = "player_project_" + proj.ldt_id
+ json_url = reverse("ldt.ldt_utils.views.json.project_json_id", args=[proj.ldt_id])
+ player_width = 550
+ player_height = 380
+ stream_mode = proj.stream_mode
+ if stream_mode != "video":
+ stream_mode = 'radio'
+
+ is_gecko = ((request.META['HTTP_USER_AGENT'].lower().find("firefox")) > -1);
+
+
+ return render_to_response("front/front_player.html",
+ {'content': content, 'project':proj, 'player_id': player_id,
+ 'json_url': json_url, 'player_width':player_width, 'player_height':player_height, 'stream_mode':stream_mode,
+ 'is_gecko': is_gecko},
+ context_instance=RequestContext(request))
+
+
+
--- a/src/ldt/ldt/static/ldt/css/front_player.css Mon Jan 09 15:12:15 2012 +0100
+++ b/src/ldt/ldt/static/ldt/css/front_player.css Mon Jan 09 18:58:42 2012 +0100
@@ -1,5 +1,5 @@
#player_col_g {
- float: left; width: 550px;
+ float: left; width: 550px; margin: 10px 0;
}
#top_media {
@@ -41,7 +41,7 @@
/* COLONNE DE DROITE */
#player_col_d {
- float: left; width: 410px;
+ float: left; width: 410px; margin: 9px 0;
}
#player_col_d .li_h2 {
Binary file src/ldt/ldt/static/ldt/img/annot_icon_80x45.png has changed
