--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/src/ldt/ldt/ldt_utils/templates/front/front_all_contents.html Thu Jan 12 16:25:13 2012 +0100
@@ -0,0 +1,30 @@
+{% extends "front/front_base.html" %}
+{% load i18n %}
+{% load thumbnail %}
+{% load front_tags %}
+
+{% block title %}Lignes de temps : groupe "{{group.name}}"{% endblock %}
+
+{% block css_import %}
+{{block.super}}
+<link rel="stylesheet" href="{{LDT_MEDIA_PREFIX}}css/front_home.css" type="text/css"/>
+{% endblock %}
+
+{% block body %}
+{{block.super}}
+<!-- Last annotated contents -->
+<ul class="floatlist full_width" id="derniers_medias">
+ <li class="li_h2">
+ <h2>{% trans 'All medias' %}</h2>
+ </li>
+ {% for content in content_list %}
+ <li class="li_media">
+ <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">{{ content.nb_annotation }}</div>
+ <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>{% trans 'by' %} IRI | {{content.duration|str_duration:"h"}}</p>
+ </li>
+ {% endfor %}
+</ul>
+{% endblock %}
+
--- a/src/ldt/ldt/ldt_utils/templates/front/front_home.html Thu Jan 12 16:05:40 2012 +0100
+++ b/src/ldt/ldt/ldt_utils/templates/front/front_home.html Thu Jan 12 16:25:13 2012 +0100
@@ -16,7 +16,12 @@
<!-- Last annotated contents -->
<ul class="floatlist full_width" id="derniers_medias">
<li class="li_h2">
- <h2>{% trans 'Last annotated medias' %}</h2>
+ <ul class="title_ul">
+ <li><h2>{% trans 'Last annotated medias' %}</h2></li>
+ <li class="li_right">
+ <a class="blue" href="{% url ldt.ldt_utils.views.front.all_contents %}"><img src="{{LDT_MEDIA_PREFIX}}img/little_plus.png" alt="" /> {% trans 'All medias' %}</a>
+ </li>
+ </ul>
</li>
{% for content in last_contents %}
<li class="li_media">
@@ -30,7 +35,12 @@
<!-- Most annotated contents -->
<ul class="floatlist" id="plus_annotes">
<li class="li_h2">
- <h2>{% trans 'Most annotated medias' %}</h2>
+ <ul class="title_ul">
+ <li><h2>{% trans 'Most annotated medias' %}</h2></li>
+ <li class="li_right">
+ <a class="blue" href="{% url ldt.ldt_utils.views.front.all_contents %}"><img src="{{LDT_MEDIA_PREFIX}}img/little_plus.png" alt="" /> {% trans 'All medias' %}</a>
+ </li>
+ </ul>
</li>
{% for content in most_contents %}
<li class="li_media">
--- a/src/ldt/ldt/ldt_utils/templates/front/front_search_results.html Thu Jan 12 16:05:40 2012 +0100
+++ b/src/ldt/ldt/ldt_utils/templates/front/front_search_results.html Thu Jan 12 16:25:13 2012 +0100
@@ -18,11 +18,11 @@
{% block body %}
{{block.super}}
-
-
<script type="text/javascript">
$(document).ready(function () {
-
+ // We draw the annotation volume for each content
+ /* Use 'html' instead of an array of values to pass options
+ to a sparkline with data in the tag */
$('.graph_annotation').sparkline('html', {width: '340px',
height:'25px',
minSpotColor: false,
@@ -30,13 +30,29 @@
spotColor: false,
lineWidth: '0px',
fillColor: '#adadad',
- lineColor: '#adadad'});
-
- /* Use 'html' instead of an array of values to pass options
- to a sparkline with data in the tag */
+ lineColor: '#adadad'});
+
+ // We put the annotations into an object
+ var annots = [];
+ width_max = 340;
+ {% for res in results.object_list %}
+ // We get the canvas
+ var cnv = $('#{{ res.content.iri_id }}').children()[0];
+ var ctx = cnv.getContext("2d");
+ var content_dur = {{ res.content.duration }};
+ {% for segment in res.list %}
+ // We draw the segment in the canvas
+ ctx.fillStyle = 'rgba(244,154,245,0.5)';
+ x = (width_max*{{segment.begin}})/content_dur;
+ y = 0;
+ w = (width_max*{{segment.duration}})/content_dur;;
+ h = 25;
+ ctx.fillRect (x, y, w, h);
+ {% endfor %}
+ {% endfor %}
+ // We draw
});
-</script>
-
+</script>
{% if msg %}
{{ msg }}
@@ -76,10 +92,9 @@
<p>{{res.content.duration|str_duration:"::"}}</p>
</div>
<div class="graphe_result_media">
- <span class="graph_annotation">
+ <span id="{{ res.content.iri_id }}" class="graph_annotation">
{{ res.content.stat_annotation }}
</span>
- <!-- <img src="img/placeholder_media_graph.png" width="340" height="25" alt="graph de volume" />-->
</div>
</div>
--- a/src/ldt/ldt/ldt_utils/urls.py Thu Jan 12 16:05:40 2012 +0100
+++ b/src/ldt/ldt/ldt_utils/urls.py Thu Jan 12 16:25:13 2012 +0100
@@ -46,6 +46,7 @@
url(r'^front/player/(?P<content_iri_id>.*)$', 'views.front.annot_content'),
url(r'^front/search/$', 'views.front.search_index'),
url(r'^front/searchListing', 'views.front.search_listing'),
+ url(r'^front/medias', 'views.front.all_contents'),
)
urlpatterns += patterns('',
--- a/src/ldt/ldt/ldt_utils/views/front.py Thu Jan 12 16:05:40 2012 +0100
+++ b/src/ldt/ldt/ldt_utils/views/front.py Thu Jan 12 16:25:13 2012 +0100
@@ -48,6 +48,19 @@
@login_required
+def all_contents(request):
+ # Get all the public contents group
+ content_list = add_change_attr(request.user, Content.safe_objects.all())
+
+ is_gecko = ((request.META['HTTP_USER_AGENT'].lower().find("firefox")) > -1);
+
+ return render_to_response("front/front_all_contents.html",
+ {'content_list':content_list,
+ 'is_gecko': is_gecko},
+ 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)
--- a/src/ldt/ldt/static/ldt/css/front_home.css Thu Jan 12 16:05:40 2012 +0100
+++ b/src/ldt/ldt/static/ldt/css/front_home.css Thu Jan 12 16:25:13 2012 +0100
@@ -8,10 +8,20 @@
width: 960px;
}
+#derniers_medias .li_right {
+ float: right; margin-top:10px;
+}
+
#derniers_medias .li_media {
+ height: 225px;
width: 300px;
}
+/* Communs */
+.title_ul {
+ list-style: none;
+}
+
/* Plus annotés */
#plus_annotes {
@@ -22,6 +32,10 @@
width: 630px; margin-right: 10px;
}
+#plus_annotes .li_right {
+ float: right; margin-top:10px;
+}
+
#plus_annotes .li_media {
width: 140px;
height: 140px;
--- a/src/ldt/ldt/static/ldt/js/LdtPlayer-release.js Thu Jan 12 16:05:40 2012 +0100
+++ b/src/ldt/ldt/static/ldt/js/LdtPlayer-release.js Thu Jan 12 16:25:13 2012 +0100
@@ -1169,7 +1169,7 @@
onPause: IriSP.PopcornReplacement.__pauseHandler,
onSeek: IriSP.PopcornReplacement.__seekHandler
}
-
+
jwplayer(IriSP.PopcornReplacement._container).setup(options);
IriSP.PopcornReplacement.media.duration = options.duration;
return IriSP.PopcornReplacement;
@@ -1281,7 +1281,6 @@
}
if (IriSP.PopcornReplacement.__delay_seek_signal === true) {
- console.log(IriSP.PopcornReplacement.currentTime());
IriSP.PopcornReplacement.trigger("seeked");
}
IriSP.PopcornReplacement.trigger("timeupdate");
@@ -2223,8 +2222,7 @@
var list = [];
- if (typeof(view_type) === "undefined") {
- console.log("no type suitable for display");
+ if (typeof(view_type) === "undefined") {
return;
}
@@ -2233,7 +2231,7 @@
/* filter the annotations whose type is not the one we want */
if (typeof(annotation.meta) !== "undefined" && typeof(annotation.meta["id-ref"]) !== "undefined"
- && annotation.meta["id-ref"] != view_type) {
+ && annotation.meta["id-ref"] !== view_type) {
continue;
}
@@ -2507,7 +2505,9 @@
this.selector.append(annotationMarkup);
- this.selector.hide();
+ if (!this.cinecast_version)
+ this.selector.hide();
+
for (var i = 0; i < this.keywords.length; i++) {
var keyword = this.keywords[i];
var id = IriSP.guid("button_");
@@ -2520,9 +2520,14 @@
this.selector.find("#" + id).click(function(keyword) { return function() {
var contents = _this.selector.find(".Ldt-createAnnotation-Description").val();
if (contents.indexOf(keyword) != -1) {
- var newVal = contents.replace(keyword, "");
+ var newVal = contents.replace(" " + keyword, "");
+ if (newVal == contents)
+ newVal = contents.replace(keyword, "");
} else {
- var newVal = contents + keyword;
+ if (contents === "")
+ var newVal = keyword;
+ else
+ var newVal = contents + " " + keyword;
}
_this.selector.find(".Ldt-createAnnotation-Description").val(newVal);
@@ -2537,51 +2542,90 @@
this.selector.find(".Ldt-createAnnotation-Description")
.bind("propertychange keyup input paste", IriSP.wrap(this, this.handleTextChanges));
+
+ /* the cinecast version of the player is supposed to pause when the user clicks on the button */
+ if (this.cinecast_version) {
+ this.selector.find(".Ldt-createAnnotation-Description")
+ .one("propertychange keyup input paste js_mod",
+ function() { if (!_this._Popcorn.media.paused) _this._Popcorn.pause() });
+ }
+ /* the cinecast version expects the user to comment on a defined segment.
+ As the widget is always shown, we need a way to update it's content as
+ time passes. We do this like we did with the annotationsWidget : we schedule
+ a .code start function which will be called at the right time.
+ */
+ if (this.cinecast_version) {
+ var legal_ids;
+ if (typeof(this._serializer.getChapitrage()) !== "undefined")
+ legal_id = this._serializer.getChapitrage();
+ else
+ legal_id = this._serializer.getNonTweetIds()[0];
+
+ var annotations = this._serializer._data.annotations;
+ var i;
+
+ for (i in annotations) {
+ var annotation = annotations[i];
+ if (typeof(annotation.meta) !== "undefined" && typeof(annotation.meta["id-ref"]) !== "undefined"
+ && legal_id !== annotation.meta["id-ref"]) {
+ continue;
+ }
+
+ code = {start: annotation.begin / 1000, end: annotation.end / 1000,
+ onStart: function(annotation) { return function() {
+ if (typeof(annotation.content) !== "undefined")
+ _this.selector.find(".Ldt-createAnnotation-Title").html(annotation.content.title);
+
+ _this._currentAnnotation = annotation;
+ var beginTime = IriSP.msToTime(annotation.begin);
+ var endTime = IriSP.msToTime(annotation.end);
+ var timeTemplate = IriSP.templToHTML("- ({{begin}} - {{ end }})", {begin: beginTime, end: endTime });
+ _this.selector.find(".Ldt-createAnnotation-TimeFrame").html(timeTemplate);
+ } }(annotation)
+ };
+
+ this._Popcorn.code(code);
+ }
+ }
this.selector.find(".Ldt-createAnnotation-submitButton").click(IriSP.wrap(this, this.handleButtonClick));
- this._Popcorn.listen("IriSP.PlayerWidget.AnnotateButton.clicked",
- IriSP.wrap(this, this.handleAnnotateSignal));
+
+ if (!this.cinecast_version)
+ this._Popcorn.listen("IriSP.PlayerWidget.AnnotateButton.clicked",
+ IriSP.wrap(this, this.handleAnnotateSignal));
};
+/** handles clicks on the annotate button. Works only for the non-cinecast version */
IriSP.createAnnotationWidget.prototype.handleAnnotateSignal = function() {
+
if (this._hidden == false) {
this.selector.hide();
this._hidden = true;
- /* reinit the fields */
-
- this.selector.find(".Ldt-createAnnotation-DoubleBorder").children().show();
- this.selector.find("Ldt-createAnnotation-Description").val("");
- this.selector.find(".Ldt-createAnnotation-endScreen").hide();
// free the arrow.
this._Popcorn.trigger("IriSP.ArrowWidget.releaseArrow");
+ this._Popcorn.trigger("IriSP.SliceWidget.hide");
+
} else {
- if (this.cinecast_version) {
- var currentTime = this._Popcorn.currentTime();
- var currentAnnotation = this._serializer.currentAnnotations(currentTime)[0];
-
- var beginTime = IriSP.msToTime(currentAnnotation.begin);
- var endTime = IriSP.msToTime(currentAnnotation.end);
-
- /* save the variable because the user may take some time writing his
- comment so the currentAnnottion may change when it's time to post it */
- this._currentAnnotation = currentAnnotation;
-
- if (typeof(currentAnnotation.content) !== "undefined")
- this.selector.find(".Ldt-createAnnotation-Title").html(currentAnnotation.content.title);
-
- var timeTemplate = IriSP.templToHTML("- ({{begin}} - {{ end }})", {begin: beginTime, end: endTime });
- this.selector.find(".Ldt-createAnnotation-TimeFrame").html(timeTemplate);
- }
-
+ this.showStartScreen();
this.selector.show();
this._hidden = false;
+ var currentTime = this._Popcorn.currentTime();
// block the arrow.
this._Popcorn.trigger("IriSP.ArrowWidget.blockArrow");
+ var duration = +this._serializer.currentMedia().meta["dc:duration"];
+ var currentChapter = this._serializer.currentChapitre(currentTime);
+ console.log(currentTime);
+ var left = (currentChapter.begin / duration) * this.selector.width();
+ var width = (currentChapter.end / duration) * this.selector.width() - left;
+ console.log([left, width]);
+ this._Popcorn.trigger("IriSP.SliceWidget.position", [left, width]);
+ this._Popcorn.trigger("IriSP.SliceWidget.show");
}
};
+
/** watch for changes in the textfield and change the buttons accordingly */
IriSP.createAnnotationWidget.prototype.handleTextChanges = function(event) {
var contents = this.selector.find(".Ldt-createAnnotation-Description").val();
@@ -2605,14 +2649,37 @@
}
};
+IriSP.createAnnotationWidget.prototype.showStartScreen = function() {
+ this.selector.find(".Ldt-createAnnotation-DoubleBorder").children().show();
+ this.selector.find("Ldt-createAnnotation-Description").val("Type your annotation here.");
+ this.selector.find(".Ldt-createAnnotation-endScreen").hide();
+};
+
+IriSP.createAnnotationWidget.prototype.showEndScreen = function() {
+ this.selector.find(".Ldt-createAnnotation-DoubleBorder").children().hide();
+
+ if (this.cinecast_version) {
+ this.selector.find(".Ldt-createAnnotation-Title").parent().show();
+ }
+
+ var twStatus = IriSP.mkTweetUrl(document.location.href);
+ var gpStatus = IriSP.mkGplusUrl(document.location.href);
+ var fbStatus = IriSP.mkFbUrl(document.location.href);
+
+ this.selector.find(".Ldt-createAnnotation-endScreen-TweetLink").attr("href", twStatus);
+ this.selector.find(".Ldt-createAnnotation-endScreen-FbLink").attr("href", fbStatus);
+ this.selector.find(".Ldt-createAnnotation-endScreen-GplusLink").attr("href", gpStatus);
+
+ this.selector.find(".Ldt-createAnnotation-endScreen").show();
+};
+
/** handle clicks on "send annotation" button */
IriSP.createAnnotationWidget.prototype.handleButtonClick = function(event) {
var _this = this;
var textfield = this.selector.find(".Ldt-createAnnotation-Description");
var contents = textfield.val();
- if (contents === "") {
-
+ if (contents === "") {
if (this.selector.find(".Ldt-createAnnotation-errorMessage").length === 0) {
this.selector.find(".Ldt-createAnnotation-Container")
.after(IriSP.templToHTML(IriSP.createAnnotation_errorMessage_template));
@@ -2620,77 +2687,75 @@
} else {
this.selector.find(".Ldt-createAnnotation-errorMessage").show();
}
- // use namespaced events to be able to unbind them quickly and without unbinding
- // the other event handlers.
- textfield.bind("js_mod.tmp propertychange.tmp keyup.tmp input.tmp paste.tmp", IriSP.wrap(this, function() {
+
+ textfield.one("js_mod propertychange keyup input paste", IriSP.wrap(this, function() {
var contents = textfield.val();
- console.log(contents);
+
if (contents !== "") {
this.selector.find(".Ldt-createAnnotation-errorMessage").hide();
textfield.css("background-color", "");
- textfield.unbind(".tmp");
}
}));
} else {
- this.selector.find(".Ldt-createAnnotation-DoubleBorder").children().hide();
-
- if (this.cinecast_version) {
- this.selector.find(".Ldt-createAnnotation-Title").parent().show();
- }
-
- var twStatus = IriSP.mkTweetUrl(document.location.href);
- var gpStatus = IriSP.mkGplusUrl(document.location.href);
- var fbStatus = IriSP.mkFbUrl(document.location.href);
-
- this.selector.find(".Ldt-createAnnotation-endScreen-TweetLink").attr("href", twStatus);
- this.selector.find(".Ldt-createAnnotation-endScreen-FbLink").attr("href", fbStatus);
- this.selector.find(".Ldt-createAnnotation-endScreen-GplusLink").attr("href", gpStatus);
-
- this.selector.find(".Ldt-createAnnotation-endScreen").show();
-
+ this.showEndScreen();
if (typeof(this._currentAnnotation) === "undefined") {
console.log("this._currentAnnotation undefined");
return;
}
- var apiJson = {annotations : [{}], meta: {}};
- var annotation = apiJson["annotations"][0];
- //annotation["type_title"] = "Contributions";
- annotation["type_title"] = "";
- annotation["media"] = this._serializer.currentMedia()["id"];
- annotation["begin"] = this._currentAnnotation.begin;
- annotation["end"] = this._currentAnnotation.end;
- annotation["type"] = this._serializer.getContributions();
- annotation.content = {};
- annotation.content["data"] = contents;
-
- var meta = apiJson["meta"];
- meta.creator = "An User";
- meta.created = Date().toString();
-
- annotation["tags"] = [];
-
- for (var i = 0; i < this.keywords.length; i++) {
- var keyword = this.keywords[i];
- if (contents.indexOf(keyword) != -1)
- annotation["tags"].push(keyword);
- }
-
- var jsonString = JSON.stringify(apiJson);
- var project_id = this._serializer._data.meta.id;
-
- var url = Mustache.to_html("{{platf_url}}/ldtplatform/api/ldt/projects/{{id}}.json",
- {platf_url: IriSP.platform_url, id: project_id});
- console.log(url);
- IriSP.jQuery.ajax({
- url: url,
- type: 'PUT',
- contentType: 'application/json',
- data: jsonString,
- // bug with jquery >= 1.5, "json" adds a callback so we don't specify dataType
- dataType: 'json',
- success: function(json, textStatus, XMLHttpRequest) {
+ this.sendLdtData(contents, function() {
+ if (_this.cinecast_version) {
+ if (_this._Popcorn.media.paused)
+ _this._Popcorn.play();
+
+ window.setTimeout(IriSP.wrap(_this, function() { this.showStartScreen(); }), 5000);
+ }
+ });
+ }
+};
+
+IriSP.createAnnotationWidget.prototype.sendLdtData = function(contents, callback) {
+ var _this = this;
+ var apiJson = {annotations : [{}], meta: {}};
+ var annotation = apiJson["annotations"][0];
+
+ annotation["media"] = this._serializer.currentMedia()["id"];
+ annotation["begin"] = this._currentAnnotation.begin;
+ annotation["end"] = this._currentAnnotation.end;
+ annotation["type"] = this._serializer.getContributions();
+ if (typeof(annotation["type"]) === "undefined")
+ annotation["type"] = "";
+
+ annotation["type_title"] = "Contributions";
+ annotation.content = {};
+ annotation.content["data"] = contents;
+
+ var meta = apiJson["meta"];
+ meta.creator = "An User";
+ meta.created = Date().toString();
+
+ annotation["tags"] = [];
+
+ for (var i = 0; i < this.keywords.length; i++) {
+ var keyword = this.keywords[i];
+ if (contents.indexOf(keyword) != -1)
+ annotation["tags"].push(keyword);
+ }
+
+ var jsonString = JSON.stringify(apiJson);
+ var project_id = this._serializer._data.meta.id;
+
+ var url = Mustache.to_html("{{platf_url}}/ldtplatform/api/ldt/projects/{{id}}.json",
+ {platf_url: IriSP.platform_url, id: project_id});
+
+ IriSP.jQuery.ajax({
+ url: url,
+ type: 'PUT',
+ contentType: 'application/json',
+ data: jsonString,
+ dataType: 'json',
+ success: function(json, textStatus, XMLHttpRequest) {
/* add the annotation to the annotations and tell the world */
delete annotation.tags;
annotation.content.description = annotation.content.data;
@@ -2702,12 +2767,12 @@
// everything is shared so there's no need to propagate the change
_this._serializer._data.annotations.push(annotation);
_this._Popcorn.trigger("IriSP.createAnnotationWidget.addedAnnotation");
- },
- error: function(jqXHR, textStatus, errorThrown) {
- alert("ERROR = " + jqXHR.responseText + ", " + errorThrown);
- }
- });
- }
+ callback();
+ },
+ error:
+ function() {
+ console.log("an error occured while contacting "
+ + url + " and sending " + jsonString); } });
};IriSP.PlayerWidget = function(Popcorn, config, Serializer) {
IriSP.Widget.call(this, Popcorn, config, Serializer);
@@ -3599,9 +3664,16 @@
this._Popcorn.listen("IriSP.SliceWidget.position",
IriSP.wrap(this, this.positionSliceHandler));
- this._Popcorn.trigger("IriSP.SliceWidget.position", [57, 24]);
+
+ this._Popcorn.listen("IriSP.SliceWidget.show", IriSP.wrap(this, this.show));
+ this._Popcorn.listen("IriSP.SliceWidget.hide", IriSP.wrap(this, this.hide));
+ this.selector.hide();
};
+/** responds to an "IriSP.SliceWidget.position" message
+ @param params an array with the first element being the left distance in
+ percents and the second element the width of the slice in pixels
+*/
IriSP.SliceWidget.prototype.positionSliceHandler = function(params) {
left = params[0];
width = params[1];
@@ -3670,6 +3742,14 @@
var zonePercent = (this.zoneWidth / this.selector.width()) * 100;
this._Popcorn.trigger("IriSP.SliceWidget.zoneChange", [leftPercent, zonePercent]);
+};
+
+IriSP.SliceWidget.prototype.show = function() {
+ this.selector.show();
+};
+
+IriSP.SliceWidget.prototype.hide = function() {
+ this.selector.hide();
};IriSP.SliderWidget = function(Popcorn, config, Serializer) {
IriSP.Widget.call(this, Popcorn, config, Serializer);
};
@@ -4374,6 +4454,12 @@
return ret_array;
};
+/** return the current chapitre
+ @param currentTime the current time, in seconds.
+*/
+IriSP.JSONSerializer.prototype.currentChapitre = function(currentTime) {
+ return this.currentAnnotations(currentTime, this.getChapitrage())[0];
+};
/** returns a list of ids of tweet lines (aka: groups in cinelab) */
IriSP.JSONSerializer.prototype.getTweetIds = function() {