Skip to content
Snippets Groups Projects
Commit 9abc1dd1 authored by srosse's avatar srosse
Browse files

OO-2057: hardened load and reload of the timeline

parent bf242125
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
Showing
with 43 additions and 54 deletions
pom.xml
+ 7
− 0
View file @ 9abc1dd1
......@@ -259,6 +259,13 @@
<include>${basedir}/target/jquery/jquery/openolat/jquery.statistics.chart.min.js</include>
</includes>
</aggregation>
<aggregation>
<output>${basedir}/src/main/webapp/static/js/jquery/openolat/jquery.timeline.min.js</output>
<removeIncluded>false</removeIncluded>
<includes>
<include>${basedir}/target/jquery/jquery/openolat/jquery.timeline.min.js</include>
</includes>
</aggregation>
</aggregations>
</configuration>
</execution>
......
src/main/java/org/olat/modules/portfolio/ui/AbstractPageListController.java
+ 1
− 1
View file @ 9abc1dd1
......@@ -122,7 +122,7 @@ implements Activateable2, TooledController, FlexiTableComponentDelegate {
@Override
protected void initForm(FormItemContainer formLayout, Controller listener, UserRequest ureq) {
timelineEl = new TimelineElement("timeline");
timelineEl.setContainerId("o_portfolio_entries_timeline");
timelineEl.setContainerId("o_portfolio_entries_timeline_" + timelineEl.getComponent().getDispatchID());
formLayout.add("timeline", timelineEl);
initTimeline();
......
src/main/java/org/olat/modules/portfolio/ui/_content/binder_pages.html
+ 1
− 1
View file @ 9abc1dd1
......@@ -32,7 +32,7 @@
#if($timelineSwitch)
<div class="o_portfolio_timeline">
<div id="o_portfolio_entries_timeline">$r.render("timeline")</div>
<div id='o_portfolio_entries_timeline_${r.getComponent("timeline").getDispatchID()}'>$r.render("timeline")</div>
</div>
#end
</div>
\ No newline at end of file
src/main/java/org/olat/modules/portfolio/ui/_content/my_pages.html
+ 1
− 1
View file @ 9abc1dd1
......@@ -13,7 +13,7 @@
#if($timelineSwitch)
<div class="o_portfolio_timeline">
<div id="o_portfolio_entries_timeline">$r.render("timeline")</div>
<div id='o_portfolio_entries_timeline_${r.getComponent("timeline").getDispatchID()}'>$r.render("timeline")</div>
</div>
#end
</div>
\ No newline at end of file
src/main/java/org/olat/modules/portfolio/ui/component/TimelineComponent.java
+ 2
− 22
View file @ 9abc1dd1
......@@ -30,7 +30,6 @@ import org.olat.core.gui.components.form.flexible.impl.FormBaseComponentImpl;
import org.olat.core.gui.render.ValidationResult;
import org.olat.core.helpers.Settings;
import org.olat.core.util.Formatter;
import org.olat.core.util.StringHelper;
/**
*
......@@ -96,36 +95,17 @@ public class TimelineComponent extends FormBaseComponentImpl {
return formattedDate;
}
@Override
protected void doDispatchRequest(UserRequest ureq) {
String slideCmd = ureq.getParameter("slide");
if(StringHelper.containsNonWhitespace(slideCmd)) {
if("up".equals(slideCmd)) {
slideUp();
} else if("down".equals(slideCmd)) {
slideDown();
}
}
}
private void slideUp() {
}
private void slideDown() {
}
@Override
public void validate(UserRequest ureq, ValidationResult vr) {
super.validate(ureq, vr);
if(Settings.isDebuging()) {
vr.getJsAndCSSAdder().addRequiredStaticJsFile("js/d3/d3.js");
vr.getJsAndCSSAdder().addRequiredStaticJsFile("js/jquery/openolat/jquery.timeline.js");
} else {
vr.getJsAndCSSAdder().addRequiredStaticJsFile("js/d3/d3.min.js");
vr.getJsAndCSSAdder().addRequiredStaticJsFile("js/jquery/openolat/jquery.timeline.min.js");
}
vr.getJsAndCSSAdder().addRequiredStaticJsFile("js/jquery/openolat/jquery.timeline.js");
}
@Override
......
src/main/java/org/olat/modules/portfolio/ui/component/TimelineComponentRenderer.java
+ 4
− 5
View file @ 9abc1dd1
......@@ -41,13 +41,12 @@ public class TimelineComponentRenderer extends DefaultComponentRenderer {
RenderResult renderResult, String[] args) {
TimelineComponent cmp = (TimelineComponent)source;
//Translator translator = cmp.getTranslator();
sb.append("<div id='timeline'></div>");
String dispatchId = cmp.getDispatchID();
sb.append("<div id='timeline_").append(dispatchId).append("'></div>");
sb.append("<script type='text/javascript'>\n")
.append("/* <![CDATA[ */ \n")
.append("jQuery(function() {\n");
sb.append(" jQuery('#timeline').timeline({")
.append("jQuery(function() {\n")
.append(" jQuery('#timeline_").append(dispatchId).append("').timeline({")
.append(" parentContainerId: '").append(cmp.getContainerId()).append("',\n");
if(cmp.getStartTime() != null && cmp.getEndTime() != null) {
sb.append(" startTime: ").append(cmp.getStartTime().getTime()).append(",\n")
......
src/main/webapp/static/js/jquery/openolat/jquery.timeline.js
+ 26
− 24
View file @ 9abc1dd1
(function ($) {
$.fn.timeline = function(options) {
var settings = $.extend({
parentContainerId:'',
startTime: null,
endTime: null,
dateFormat: '%d.%m.%y',
dateLabel: 'Date',
status: { draft: "Draft", published: "Published", inRevision: "In revision", closed: "Closed", deleted: "Deleted"},
values: []
}, options );
createButtons(this, settings);
createGraph(this, settings);
timelineItems(this, settings);
addHandlers(this, settings);
var settings = this.data("data-oo-timeline");
if(typeof timeline === "undefined") {
settings = $.extend({
parentContainerId:'',
startTime: null,
endTime: null,
dateFormat: '%d.%m.%y',
dateLabel: 'Date',
status: { draft: "Draft", published: "Published", inRevision: "In revision", closed: "Closed", deleted: "Deleted"},
values: []
}, options );
this.data("data-oo-timeline", settings);
createButtons(this, settings);
createGraph(this, settings);
timelineItems(this, settings);
addHandlers(this, settings);
}
return this;
};
createButtons = function($obj, settings) {
var parentContainer = jQuery('#' + settings.parentContainerId);
parentContainer.prepend( "<div class='o_timeline_up'><a href='javascript:;' onclick=''><i class='o_icon o_icon-lg o_icon o_icon_slide_up'> </i></a></div>" );
parentContainer.append("<div class='o_timeline_down'><a href='javascript:;' onclick=''><i class='o_icon o_icon-lg o_icon o_icon_slide_down'> </i></a></div>")
}
var svg;
var maxCurveY = 10;
var x, y, xAxis, yAxis;
......@@ -36,6 +31,13 @@
var data, statusTranslations;
var slideDelta = (183 * 24 * 60 * 60 * 1000);//six month in milliseconds
var sliding = false;
createButtons = function($obj, settings) {
sliding = false;
var parentContainer = jQuery('#' + settings.parentContainerId);
parentContainer.prepend( "<div class='o_timeline_up'><a href='javascript:;' onclick=''><i class='o_icon o_icon-lg o_icon o_icon_slide_up'> </i></a></div>" );
parentContainer.append("<div class='o_timeline_down'><a href='javascript:;' onclick=''><i class='o_icon o_icon-lg o_icon o_icon_slide_down'> </i></a></div>")
}
createGraph = function($obj, settings) {
......
src/main/webapp/static/js/jquery/openolat/jquery.timeline.min.js 0 → 100644
+ 1
− 0
View file @ 9abc1dd1
(function(f){f.fn.timeline=function(w){var x=this.data("data-oo-timeline");if(typeof timeline==="undefined"){x=f.extend({parentContainerId:"",startTime:null,endTime:null,dateFormat:"%d.%m.%y",dateLabel:"Date",status:{draft:"Draft",published:"Published",inRevision:"In revision",closed:"Closed",deleted:"Deleted"},values:[]},w);this.data("data-oo-timeline",x);createButtons(this,x);createGraph(this,x);timelineItems(this,x);addHandlers(this,x)}return this};var o;var d=10;var j,i,h,b;var l,r,n;var g,q,p,c,a;var t;var m,e;var v,u;var k=(183*24*60*60*1000);var s=false;createButtons=function(y,w){s=false;var x=jQuery("#"+w.parentContainerId);x.prepend("<div class='o_timeline_up'><a href='javascript:;' onclick=''><i class='o_icon o_icon-lg o_icon o_icon_slide_up'> </i></a></div>");x.append("<div class='o_timeline_down'><a href='javascript:;' onclick=''><i class='o_icon o_icon-lg o_icon o_icon_slide_down'> </i></a></div>")};createGraph=function(C,z){this.parentContainer=jQuery("#"+z.parentContainerId);var B=parentContainer.width();C.width(B);var A=C.height();if(parentContainer.height()<500){A=500}C.height(A);v=z.values;e=z.endTime;m=z.startTime;u=z.status;l={top:10,right:60,bottom:40,left:80};r=B-l.left-l.right;n=A-l.top-l.bottom;var y=d3.time.format(z.dateFormat);t=function(D){return y(new Date(D))};j=d3.scale.linear().domain([0,1]).range([0,r]);h=d3.svg.axis().scale(j).ticks(0).orient("bottom");var w=z.startTime==null?d3.min(v,function(D){return D.time}):z.startTime;var x=z.endTime==null?d3.max(v,function(D){return D.time}):z.endTime;i=d3.scale.linear().domain([w,x]).range([n,0]);b=d3.svg.axis().scale(i).orient("left").ticks(5).tickFormat(t).tickSize(-r,5);o=d3.select("#"+C.attr("id")).append("svg").attr("width",r+l.left+l.right).attr("height",n+l.top+l.bottom).append("g").attr("transform","translate("+l.left+","+l.top+")");q=d3.scale.linear().domain([0,1]).range([0,r]);p=d3.scale.linear().domain([0,d]).range([n,0]);a=d3.scale.linear().domain([w,x]).range([0,d]);g=d3.svg.line().x(function(D){return q(curvedX(D.y))}).y(function(D){return p(D.y)}).interpolate("linear")};addHandlers=function(x,w){jQuery("#"+w.parentContainerId+" .o_timeline_up a").on("click",function(){slideUp()});jQuery("#"+w.parentContainerId+" .o_timeline_down a").on("click",function(){slideDown()})};slideUp=function(){if(s){return}s=true;e=e+k;m=m+k;updateTimeline(true)};slideDown=function(){if(s){return}s=true;e=e-k;m=m-k;updateTimeline(false)};updateTimeline=function(w){try{a.domain([m,e]);i.domain([m,e]);drawAxis();drawDots(w)}catch(x){if(window.console){console.log(x)}}};drawAxis=function(){o.select(".y").call(b)};drawDots=function(w){var x=o.selectAll(".dot").data(v,idKey);x.transition().duration(1000).ease("linear").attrTween("cx",function(y){return function(z){var B=(1-z)*k;var A=w?(y.time+B):(y.time-B);return q(curvedX(a(A)))}}).attr("cy",function(y){return i(y.time)}).each("end",function(){s=false})};timelineItems=function(B,y){o.append("g").attr("class","x axis").attr("transform","translate(0,"+n+")").call(h);o.append("g").attr("class","y axis").call(b).append("text").attr("class","label").attr("transform","rotate(-90)").attr("y",6).attr("dy",".71em").attr("dx","-.71em").style("text-anchor","end").text("Date");var A=[];for(var x=0;x<(d*20);x++){A.push({y:(x==0?0:x/20)})}var w=o.append("path").data([A]).attr("d",g).attr("class","o_timeline_curve");var z=o.selectAll(".dot").data(v,idKey);z.enter().append("g").append("circle").attr("r",function(C){return(7+Math.floor(Math.random()*5))}).attr("id",idKey).attr("class",function(C){return"dot o_pf_status_"+C.status}).attr("cx",function(C){return q(curvedX(a(C.time)))}).attr("cy",function(C){return i(C.time)});jQuery("g .dot").tooltip({html:true,container:"body",title:function(){var F=jQuery(this).attr("id");var E;for(var D=v.length;D-->0;){if(F==v[D].id){E=v[D]}}var C=u[E.status];return"<p>"+E.title+"<br>Status: "+C+"</p>"}});z.exit()};idKey=function(w){return w.id};curvedX=function(w){return(1.5+Math.sin(w*1.1))/3}}(jQuery));
\ No newline at end of file
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment