Browse Source

Layout Assistent Formulare #5

makro_datasrc
Daniel Quathamer 2 years ago
parent
commit
3a2fd9b2f8
  1. 147
      superx/xml/js/viz/viz_functions.js
  2. 424
      superx/xml/viz_html_chart.xsl

147
superx/xml/js/viz/viz_functions.js

@ -160,7 +160,8 @@ function prepareChartProperties(chartType) @@ -160,7 +160,8 @@ function prepareChartProperties(chartType)
return false;
break;
}
renderForm("chartPropertiesFormDetails",chartProperties,commonChartProperties);
renderForm("chartPropertiesForm",chartProperties);
renderFormDetails("chartPropertiesFormDetails",commonChartProperties);
return true;
@ -365,27 +366,26 @@ function fillSelectionResult(selectionRsMetaData) @@ -365,27 +366,26 @@ function fillSelectionResult(selectionRsMetaData)
}
function renderForm(formDiv,chartProperties,myCommonChartProperties)
function renderForm(formDiv,myChartProperties)
{
//first empty form:
var myForm=document.getElementById(formDiv);
while (myForm.firstChild) {
myForm.removeChild(myForm.firstChild);
}
/*
const tabElem = document.createElement("table");
//tabElem.caption="Eigenschaften";
myForm.appendChild(tabElem);
for(var k=0;k < chartProperties.length;k++)
for(var k=0;k < myChartProperties.length;k++)
{
const rowElem = document.createElement("tr");
const tdCap = document.createElement("td");
const textnode = document.createTextNode(chartProperties[k].caption);
const textnode = document.createTextNode(myChartProperties[k].caption);
tdCap.appendChild(textnode);
const tdSelElem = document.createElement("td");
const selElem = document.createElement("select");
selElem.name=chartProperties[k].name;
selElem.id=chartProperties[k].name;
fillSelectOptions(selElem,chartProperties[k].getValueResultset(),chartProperties[k].isMandatory);
selElem.name=myChartProperties[k].name;
selElem.id=myChartProperties[k].name;
fillSelectOptions(selElem,myChartProperties[k].getValueResultset(),myChartProperties[k].isMandatory);
tdSelElem.appendChild(selElem);
rowElem.appendChild(tdCap);
@ -393,6 +393,58 @@ function renderForm(formDiv,chartProperties,myCommonChartProperties) @@ -393,6 +393,58 @@ function renderForm(formDiv,chartProperties,myCommonChartProperties)
//here values, and then:
tabElem.appendChild( rowElem);
}
myForm.appendChild(tabElem);
*/
for(var k=0;k < myChartProperties.length;k++)
{
const fieldElem = document.createElement("div");
fieldElem.classList.add("field");
fieldElem.classList.add("is-grouped");
//label:
const labelElem = document.createElement("div");
labelElem.classList.add("label-container");
const label = document.createElement("label");
label.classList.add("label");
label.classList.add("is-required");
label.classList.add("is-small");
const textnode = document.createTextNode(myChartProperties[k].caption);
label.appendChild(textnode);
labelElem.appendChild(label);
fieldElem.appendChild(labelElem);
//input:
const inputFieldElem = document.createElement("div");
inputFieldElem.classList.add("field");
inputFieldElem.classList.add("is-active");
const inputParaElem = document.createElement("p");
inputParaElem.classList.add("control-new");
const inputSelectElem = document.createElement("div");
inputSelectElem.classList.add("select");
inputSelectElem.classList.add("is-small");
inputSelectElem.classList.add("is-fullwidth");
const selElem = document.createElement("select");
selElem.name=myChartProperties[k].name;
selElem.id=myChartProperties[k].name;
fillSelectOptions(selElem,myChartProperties[k].getValueResultset(),myChartProperties[k].isMandatory);
inputSelectElem.appendChild(selElem);
inputParaElem.appendChild(inputSelectElem);
inputFieldElem.appendChild(inputParaElem);
fieldElem.appendChild(inputFieldElem);
myForm.appendChild(fieldElem);
}
}
function renderFormDetails(formDiv,myCommonChartProperties)
{
//first empty form:
var myForm=document.getElementById(formDiv);
while (myForm.firstChild) {
myForm.removeChild(myForm.firstChild);
}
const tabElem = document.createElement("table");
//tabElem.caption="Eigenschaften";
for(var k=0;k < myCommonChartProperties.length;k++)
{
const rowElem = document.createElement("tr");
@ -426,14 +478,10 @@ function renderForm(formDiv,chartProperties,myCommonChartProperties) @@ -426,14 +478,10 @@ function renderForm(formDiv,chartProperties,myCommonChartProperties)
//here values, and then:
tabElem.appendChild( rowElem);
}
myForm.appendChild(tabElem);
//TODO: myCommonChartProperties auf separatem TAB
}
function fillSelectOptions(myCombo,myValues,isMandatory)
{
var optionCounter=0;
@ -595,17 +643,15 @@ for(row=1;row<rowcount;row++) @@ -595,17 +643,15 @@ for(row=1;row<rowcount;row++)
tableDiv.appendChild(tabElem);
}
function createChart()
function createChart(chartDivElem)
{
chartType=document.getElementById("viz_chart_type").value;
/*
if(document.getElementById("dimension1").value=="" ||
document.getElementById("measure1").value=="" )
{
alert("Bitte wählen Sie eine Kategorie und ein Maß");
return false;
}
*/
var myDiv=document.getElementById(chartDivElem);
if(myDiv.style.display=="block")
myDiv.style.display="none";
else
myDiv.style.display="block";
var selectionRsMetaData=[];
var selectionRs=[];
@ -622,8 +668,8 @@ var gridChartOffset = getCommonChartProperty("gridChartOffset"); @@ -622,8 +668,8 @@ var gridChartOffset = getCommonChartProperty("gridChartOffset");
var chartWidth=getCommonChartProperty("chartWidth");
var fontSize=getCommonChartProperty("fontSize");
//svg,data
document.getElementById("chartDiv").innerHTML=""; //reset canvas
var svg = d3.select("#chartDiv").append("svg")
document.getElementById(chartDivElem).innerHTML=""; //reset canvas
var svg = d3.select("#"+chartDivElem).append("svg")
.attr("width", chartWidth) //maxBarWidth + barLabelWidth + valueLabelWidth)
//.attr("height", y.range()[1])
.attr("font-family", fontFamily)
@ -638,19 +684,19 @@ case "sample": @@ -638,19 +684,19 @@ case "sample":
makeSample();
break;
case "bar_x":
makeBarX(selectionRs);
makeBarX(chartDivElem,selectionRs);
break;
case "bar_x_alt":
makeBarX(svg,data);
break;
case "bar_y":
makeBarY(selectionRs);
makeBarY(chartDivElem,selectionRs);
break;
case "area_y":
makeAreaY(selectionRs);
makeAreaY(chartDivElem,selectionRs);
break;
case "line":
makeLine(selectionRs);
makeLine(chartDivElem,selectionRs);
break;
default:
alert("Please select a chart type");
@ -775,6 +821,7 @@ function getChartOptions(categoryDim,measureDim,marksArray,chartOrientationVerti @@ -775,6 +821,7 @@ function getChartOptions(categoryDim,measureDim,marksArray,chartOrientationVerti
var myFontFamily=getCommonChartProperty("font-family");
var myBgColor=getCommonChartProperty("background-color");
var myColor=getCommonChartProperty("color");
var myCaption=getCommonChartProperty("chartCaption");
var marginLeftDefault=chartWidth/5; //20% liner Rand
var marginBottomDefault=100;
@ -804,7 +851,8 @@ function getChartOptions(categoryDim,measureDim,marksArray,chartOrientationVerti @@ -804,7 +851,8 @@ function getChartOptions(categoryDim,measureDim,marksArray,chartOrientationVerti
label: measureLabel
},
marks: marksArray,
style: styles
style: styles,
caption: myCaption
}
}
else
@ -822,7 +870,8 @@ function getChartOptions(categoryDim,measureDim,marksArray,chartOrientationVerti @@ -822,7 +870,8 @@ function getChartOptions(categoryDim,measureDim,marksArray,chartOrientationVerti
label: measureLabel
},
marks: marksArray,
style: styles
style: styles,
caption:myCaption
}
@ -831,21 +880,31 @@ function getChartOptions(categoryDim,measureDim,marksArray,chartOrientationVerti @@ -831,21 +880,31 @@ function getChartOptions(categoryDim,measureDim,marksArray,chartOrientationVerti
return options;
}
function makeBarX(selectionRs) {
function makeBarX(chartDivElem,selectionRs) {
var categoryDim=document.getElementById("viz_dimension1").value;
var measureDim=document.getElementById("viz_measure1").value;
var fillDim=document.getElementById("fill").value;
var marksArray=new Array();
if(fillDim=="")
marksArray[0]=Plot.barX(selectionRs,
{
x: measureDim,
y: categoryDim
y: categoryDim,
fill: "blue"
});
else
marksArray[0]=Plot.barX(selectionRs,
{
x: measureDim,
y: categoryDim,
fill: fillDim
});
var options= getChartOptions(categoryDim,measureDim,marksArray,false);
document.getElementById("chartDiv").appendChild(Plot.plot(options));
document.getElementById(chartDivElem).appendChild(Plot.plot(options));
}
function makeBarY(selectionRs) {
function makeBarY(chartDivElem,selectionRs) {
var categoryDim=document.getElementById("viz_dimension1").value;
var measureDim=document.getElementById("viz_measure1").value;
var marksArray=new Array();
@ -857,9 +916,9 @@ function makeBarY(selectionRs) { @@ -857,9 +916,9 @@ function makeBarY(selectionRs) {
var options= getChartOptions(categoryDim,measureDim,marksArray,true);
document.getElementById("chartDiv").appendChild(Plot.plot(options));
document.getElementById(chartDivElem).appendChild(Plot.plot(options));
}
function makeAreaY(selectionRs) {
function makeAreaY(chartDivElem,selectionRs) {
var categoryDim=document.getElementById("viz_dimension1").value;
var measureDim=document.getElementById("viz_measure1").value;
var marksArray=new Array();
@ -871,9 +930,9 @@ function makeAreaY(selectionRs) { @@ -871,9 +930,9 @@ function makeAreaY(selectionRs) {
var options= getChartOptions(categoryDim,measureDim,marksArray,true);
document.getElementById("chartDiv").appendChild(Plot.plot(options));
document.getElementById(chartDivElem).appendChild(Plot.plot(options));
}
function makeLine(selectionRs) {
function makeLine(chartDivElem,selectionRs) {
var categoryDim=document.getElementById("viz_dimension1").value;
var measureDim=document.getElementById("viz_measure1").value;
var marksArray=new Array();
@ -891,7 +950,7 @@ function makeLine(selectionRs) { @@ -891,7 +950,7 @@ function makeLine(selectionRs) {
var options= getChartOptions(categoryDim,measureDim,marksArray,true);
document.getElementById("chartDiv").appendChild(Plot.plot(options));
document.getElementById(chartDivElem).appendChild(Plot.plot(options));
}
function makeBarY_alt(svg,data) {
var xLabel=rsMetaData[document.getElementById("dimension1").value-1].colcaption;
@ -951,7 +1010,13 @@ function getCommonChartProperty(name) @@ -951,7 +1010,13 @@ function getCommonChartProperty(name)
function showSrcCode()
{
var myChartDiv= document.getElementById("chartDiv");
var myChartDiv= document.getElementById("chartDiv2");
var mySrcDiv=document.getElementById("chartSVGsrc");
if(mySrcDiv.style.display=="block")
mySrcDiv.style.display="none";
else
mySrcDiv.style.display="block";
var numberOfChildNodes=myChartDiv.childNodes.length;
var svg_xml ="";
for (var i=0;i<numberOfChildNodes;i++)
@ -966,7 +1031,7 @@ for (var i=0;i<numberOfChildNodes;i++) @@ -966,7 +1031,7 @@ for (var i=0;i<numberOfChildNodes;i++)
}
//alert(svg_xml);
document.getElementById("chartSrc").innerHTML=svg_xml;
document.getElementById("chartSVGsrc").style.visibility="visible";
//document.getElementById("chartSVGsrc").style.visibility="visible";
/*
const selection = window.getSelection();
const range = document.createRange();

424
superx/xml/viz_html_chart.xsl

@ -164,6 +164,9 @@ commonChartProperties.push(newCommonChartProperty); @@ -164,6 +164,9 @@ commonChartProperties.push(newCommonChartProperty);
var newCommonChartProperty = new commonChartProperty("background-color","Hintergrundfarbe", false,0, null,"#ffffeb");
commonChartProperties.push(newCommonChartProperty);
var newCommonChartProperty = new commonChartProperty("fill","Füllfarbe", false,0, null,"blue");
commonChartProperties.push(newCommonChartProperty);
var newCommonChartProperty = new commonChartProperty("color","Farbe Text- und Diagrammelemente", false,0, null,"#3333ff");
commonChartProperties.push(newCommonChartProperty);
@ -1123,13 +1126,13 @@ var platform='superx'; @@ -1123,13 +1126,13 @@ var platform='superx';
<div class="tabs is-left is-small" id="viznav">
<ul>
<li data-target="viznav-tab1" id="1">
<a onclick="showVizNavTab(1);"><span>Diagramm-Daten</span></a>
<a onclick="showVizNavTab(1);"><span>Diagramm-Daten</span></a>
</li>
<li data-target="viznav-tab2" id="2">
<a onclick="showVizNavTab(2);"><span>Diagramm-Layout</span></a>
</li>
<li data-target="viznav-tab3" id="3">
<a onclick="showVizNavTab(3);"><span>Diagramm-Nutzung</span></a>
<a onclick="showVizNavTab(3);"><span>Diagramm-Nutzung</span></a>
</li>
</ul>
</div>
@ -1296,46 +1299,55 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/> @@ -1296,46 +1299,55 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/>
</script>
</xsl:template>
<xsl:template name="diagrammdaten">
<div class="field is-grouped">
<div class="label-container">
<label class="label is-required is-small"><strong>Datentabelle</strong></label>
</div>
<span class="separator"> </span>
<button class="button is-small is-rounded is-white is-outlined"
onClick="showDataTable('dataDivTable',rs,rsMetaData,10);"><!--is-focused-->
<span class="icon is-small"><i class="../images/more.svg"></i>
<img src="../images/more.svg" title="Laden" />
</span>
</button>
</div>
<div id="dataDiv" class="section">
<div id="dataDivTable"> <!--style="border:thin solid black">-->
</div>
<!--Aufruf/Anzeige Diagrammdaten-->
<div class="field is-grouped">
<div class="label-container">
<label class="label is-required is-small"><strong>Daten-Tabelle</strong></label>
</div>
<span class="separator">&#160;</span>
<span class="separator">&#160;</span>
<button class="button is-small is-rounded is-white is-outlined"
onClick="showDataTable('dataDivTable',rs,rsMetaData,10);">
<span class="icon is-small"><i class="../images/more.svg"></i>
<img src="../images/more.svg" title="Laden" />
</span>
</button>
</div>
<div class="field is-grouped">
<div class="label-container">
<label class="label is-required is-small"><strong>Datenset</strong></label>
</div>
<div id="dataDiv"> <!--class="section">-->
<div id="dataDivTable"> <!--style="border:thin solid black">-->
</div>
</div>
<span class="separator"> </span>
<button class="button is-small is-rounded is-white is-outlined"
onClick="fillDataSelectionForm('dataSelectionFormDiv');"><!--is-focused-->
<span class="icon is-small"><i class="../images/more.svg"></i>
<img src="../images/more.svg" title="Laden" />
</span>
</button>
</div>
<span class="separator">&#160;</span>
<span class="separator">&#160;</span>
<div id="dataSelectionDiv" class="section">
<form name="dataSelectionForm" id="dataSelectionForm">
<!--Aufruf/Anzeige Formular Datenauswahl-->
<div class="field is-grouped">
<div class="label-container">
<label class="label is-required is-small"><strong>Daten-Auswahl</strong></label>
</div>
<span class="separator">&#160;</span>
<span class="separator">&#160;</span>
<button class="button is-small is-rounded is-white is-outlined"
onClick="fillDataSelectionForm('dataSelectionFormDiv');">
<span class="icon is-small"><i class="../images/more.svg"></i>
<img src="../images/more.svg" title="Laden" />
</span>
</button>
</div>
<div id="dataSelectionFormDiv" style="display:none">
<div id="dataSelectionDiv"> <!--class="section"-->
<form name="dataSelectionForm" id="dataSelectionForm">
<div id="dataSelectionFormDiv" style="display:none">
<div class="field is-grouped">
<div class="field is-grouped">
<div class="label-container">
<label class="label is-required is-small">Dimension 1</label>
</div>
@ -1345,8 +1357,8 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/> @@ -1345,8 +1357,8 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/>
<div class="field is-active">
<p class="control-new">
<div class="select is-small is-fullwidth is-focused">
<select class="maskinputPflicht" id="dimension1" name="dimension1"><!--tabindex="210">-->
<option class="maskinput" value="" selected="selected">Bitte wählen Sie Dimension 1</option>
<select class="maskinputPflicht" id="dimension1" name="dimension1" tabindex="210">
<option class="maskinput" value="" selected="selected"><!--211122BF Bitte wählen Sie Dimension 1--></option>
</select>
</div>
</p>
@ -1369,8 +1381,8 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/> @@ -1369,8 +1381,8 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/>
<div class="field is-active">
<p class="control-new">
<div class="select is-small is-fullwidth">
<select id="dimension1_fn" name="dimension1_fn"><!-- tabindex="210">-->
<option class="maskinput" value="" selected="selected">Optional: Vordefinierte Transformation</option>
<select id="dimension1_fn" name="dimension1_fn" tabindex="210">
<option class="maskinput" value="" selected="selected">Optional: Vordefinierte Transformation></option>
</select>
</div>
</p>
@ -1386,18 +1398,19 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/> @@ -1386,18 +1398,19 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/>
</span>
</div>
<div class="field is-grouped">
<div class="field is-grouped">
<div class="label-container">
<label class="label is-required is-small">Dimension 2</label>
</div>
<span class="separator">&#160;</span>
<span class="separator">&#160;</span>
<div class="field is-active">
<p class="control-new">
<div class="select is-small is-fullwidth is-focused">
<select class="maskinputPflicht" id="dimension2" name="dimension2"><!--tabindex="210">-->
<option class="maskinput" value="" selected="selected">Bitte wählen Sie Dimension 1</option>
<select class="maskinputPflicht" id="dimension2" name="dimension2" tabindex="210">
<option class="maskinput" value="" selected="selected"><!--211122BFBitte wählen Sie Dimension 2--></option>
</select>
</div>
</p>
@ -1420,7 +1433,7 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/> @@ -1420,7 +1433,7 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/>
<div class="field is-active">
<p class="control-new">
<div class="select is-small is-fullwidth">
<select id="dimension2_fn" name="dimension2_fn"><!-- tabindex="210">-->
<select id="dimension2_fn" name="dimension2_fn" tabindex="210">
<option class="maskinput" value="" selected="selected">Optional: Vordefinierte Transformation</option>
</select>
</div>
@ -1438,7 +1451,7 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/> @@ -1438,7 +1451,7 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/>
</div>
<div class="field is-grouped">
<div class="field is-grouped">
<div class="label-container">
<label class="label is-required is-small">Maß</label>
</div>
@ -1449,8 +1462,8 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/> @@ -1449,8 +1462,8 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/>
<div class="field is-active">
<p class="control-new">
<div class="select is-small is-fullwidth">
<select class="maskinputPflicht" id="measure1" name="measure1"><!-- tabindex="220" >-->
<option class="maskinput" value="" selected="selected">Bitte wählen Sie die Maßangabe</option>
<select class="maskinputPflicht" id="measure1" name="measure1" tabindex="230" >
<option class="maskinput" value="" selected="selected"><!--211122BF Bitte wählen Sie die Maßangabe--></option>
</select>
</div>
</p>
@ -1479,7 +1492,7 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/> @@ -1479,7 +1492,7 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/>
<div class="field is-active">
<p class="control-new">
<div class="select is-small is-fullwidth is-focused">
<select id="measure1_fn" name="measure1_fn"> <!--tabindex="230">-->
<select id="measure1_fn" name="measure1_fn" tabindex="230">
<option class="maskinput" value="" selected="selected">Optional: Vordefinierte Transformation</option>
</select>
</div>
@ -1533,47 +1546,50 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/> @@ -1533,47 +1546,50 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/>
</tr>
</table>-->
</div>
</form>
</div>
</form>
</div>
<!--Ende Formular Datenauswahl-->
<div id="selectionResultPreview" class="section">
<span class="separator">&#160;</span>
<span class="separator">&#160;</span>
<!--
<div class="field is-grouped">
<div class="label-container">
<label class="label is-required is-small"><strong>Datenvorschau</strong></label>
</div>
<span class="separator"> </span>
<button class="button is-small is-rounded is-white is-outlined"
onClick="selectionResultPreview('selectionResultPreviewTable');">
<span class="icon is-small"><i class="../images/more.svg"></i>
<img src="../images/more.svg" title="Laden" />
</span>
</button>
</div>-->
<footer class="card-footer">
<p class="card-footer-item"><button class="button is-link is-outlined is-small" onclick="selectionResultPreview('selectionResultPreviewTable');">Vorschau</button></p>
<!--***Selektionsergebnis
<div id="selectionResultPreview" class="section">
<div id="selectionResultPreviewHeader"><input type="button" tabindex="10010" class="sx_buttondiv_submit" value="Laden" onclick="selectionResultPreview('selectionResultPreviewTable');"></div>
<div id="selectionResultPreviewTable" style="border:thin solid black"></div>
</div>
Selektionsergebnis***-->
<p class="card-footer-item"><button class="button is-link is-outlined is-small" type="submit">Speichern</button></p>
<!--****noch anzupassen: <input name="navi" type="hidden" value="true"><input type="hidden" name="tid" value="16000"><input type="hidden" name="UserID" value="4"><input type="hidden" name="reuseresult" value="true"><input type="hidden" name="maxoffset" value=""><input type="hidden" name="contenttype" value="application/jrxml"><input type="hidden" name="irowno" value=""><input type="hidden" name="Köpfe oder Fälle ?" value="studiengang_nr = 1 and fach_nr = 1"><input type="hidden" name="Stichtag" value="6"><input type="hidden" name="Seit Semester" value="20161"><input type="hidden" name="Bis Semester" value="20221"><input type="hidden" name="Studiengang" value=""><input type="hidden" name="Fächer" value=""><input type="hidden" name="Status" value="1,2,3,5,6"><input type="hidden" name="##line##" value="1"><input type="hidden" name="Hörerstatus" value="1=1"><input type="hidden" name="##line##" value="1"><input type="hidden" name="RPTPageOrientation" value="Landscape"><input type="hidden" name="RPTPagination" value="False"></ul>-->
<p class="card-footer-item"><button class="button is-link is-outlined is-small" type="reset">Zurücksetzen</button></p>
</footer>
<div id="selectionResultPreviewTable" style="display:none">
<!--Aufruf/Anzeige Daten-Vorschau-->
<div class="field is-grouped">
<div class="label-container">
<label class="label is-required is-small"><strong>Daten-Vorschau</strong></label>
</div>
<span class="separator">&#160;</span>
<span class="separator">&#160;</span>
<button class="button is-small is-rounded is-white is-outlined"
onClick="selectionResultPreview('selectionResultPreviewTable');">
<span class="icon is-small"><i class="../images/more.svg"></i>
<img src="../images/more.svg" title="Laden" />
</span>
</button>
</div>
<div id="selectionResultPreview"> <!--class="section">-->
<div id="selectionResultPreviewTable" style="display:none"></div>
</div>
<!--footer BF: nach unten verschoben-->
<footer class="card-footer">
<!--<p class="card-footer-item"><button class="button is-link is-outlined is-small" onclick="selectionResultPreview('selectionResultPreviewTable');">Daten-Vorschau</button></p>-->
<p class="card-footer-item"><button class="button is-link is-outlined is-small" type="submit">Speichern</button></p>
<p class="card-footer-item"><button class="button is-link is-outlined is-small" type="reset">Zurücksetzen</button></p>
</footer>
</xsl:template>
<xsl:template name="diagrammlayout">
<div id="chartProperties" class="section">
<!--Formular Allg. Layoutmerkmale-->
<div id="chartProperties"> <!--class="section">-->
<form name="chartPropertiesForm">
<table border="0">
<!--<table border="0">
<tr><td>Ausgabetyp:</td>
<td><select class="maskinputPflicht" id="viz_chart_type" NAME="viz_chart_type" tabindex="200" onChange="prepareChartProperties(this.value)" >
<option class="maskinput" value="">Bitte wählen</option>
@ -1585,86 +1601,236 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/> @@ -1585,86 +1601,236 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/>
</select>
</td>
</tr>
</table>
<hr />
<div class="field is-grouped">
<div class="label-container">
<label class="label is-required is-small"><strong>Erweiterte Layouteigenschaften</strong></label>
</div>
</table>-->
<span class="separator"> </span>
<a onClick="showChartPropertiesForm();"><!--is-focused-->
<span class="icon is-small"><i class="../images/more.svg"></i>
<img src="../images/more.svg" title="Laden" />
</span>
</a>
</div>
<div class="label-container">
<label class="label is-required is-small"><strong>Allgemeine Layoutmerkmale</strong></label>
</div>
<span class="separator">&#160;</span>
<span class="separator">&#160;</span>
<div id="chartPropertiesFormDetails" style="display:none">
<div class="field is-grouped">
<div class="label-container">
<label class="label is-required is-small">Diagramm-Typ</label>
</div>
</div>
<div class="field is-active">
<p class="control-new">
<div class="select is-small is-fullwidth">
<select class="maskinputPflicht" id="viz_chart_type" NAME="viz_chart_type" tabindex="200" onChange="prepareChartProperties(this.value)" >
<option class="maskinput" value="" selected="selected">Bitte wählen Sie</option>
<option class="maskinput" value="sample">Beispiel</option>
<option class="maskinput" value="bar_x">Balkendiagramm horizontal (einfach)</option>
<option class="maskinput" value="bar_y">Balkendiagramm vertikal (einfach)</option>
<option class="maskinput" value="line">Liniendiagramm vertikal (einfach)</option>
</select>
</div>
</p>
</div>
<span class="separator">&#160;</span>
<span class="separator">&#160;</span>
<!-- <div class="field is-grouped">
<span class="info" onclick="window.open('https://super-ics.de/superx/doku/kern_modul/admin/f_Patcheinspielen.htm','_blank','directories=no,location=no,menubar=no,scrollbars=yes,resizable=yes,toolbar=no,width=800,height=660');">
<figure class="image is-24x24">
<img src="../images/information_grey_liberation.svg" />
</figure>
</span>
</div>
<div id="chartPropertiesForm"> <!--style="visibility:hidden" class="section"--></div>
<!--Ende Formular Allg. Layoutmerkmale-->
<!--<div class="field is-grouped">
<div class="label-container">
<label class="label is-required is-small"><strong>Diagramm-Vorschau</strong></label>
<label class="label is-required is-small">Kategorie-Dimension</label>
</div>
<span class="separator"> </span>
<a onClick="createChart();" >
<div class="field is-active">
<p class="control-new">
<div class="select is-small is-fullwidth">
<select class="maskinputPflicht" id="measure1" name="measure1">
<option class="maskinput" value="" selected="selected">Bitte wählen Sie</option>
</select>
</div>
</p>
</div>
<span class="separator">&#160;</span>
<span class="separator">&#160;</span>
<span class="info" onclick="window.open('https://super-ics.de/superx/doku/kern_modul/admin/f_Patcheinspielen.htm','_blank','directories=no,location=no,menubar=no,scrollbars=yes,resizable=yes,toolbar=no,width=800,height=660');">
<figure class="image is-24x24">
<img src="../images/information_grey_liberation.svg" />
</figure>
</span>
</div>
<div class="field is-grouped">
<div class="label-container">
<label class="label is-required is-small">Maß</label>
</div>
<div class="field is-active">
<p class="control-new">
<div class="select is-small is-fullwidth">
<select class="maskinputPflicht" id="measure1" name="measure1">
<option class="maskinput" value="" selected="selected">Bitte wählen Sie</option>
</select>
</div>
</p>
</div>
<span class="separator">&#160;</span>
<span class="separator">&#160;</span>
<span class="info" onclick="window.open('https://super-ics.de/superx/doku/kern_modul/admin/f_Patcheinspielen.htm','_blank','directories=no,location=no,menubar=no,scrollbars=yes,resizable=yes,toolbar=no,width=800,height=660');">
<figure class="image is-24x24">
<img src="../images/information_grey_liberation.svg" />
</figure>
</span>
</div> -->
<!--<div class="field is-grouped">
<div class="label-container">
<label class="label is-required is-small">Serien-Dimension</label>
</div>
<div class="field is-active">
<p class="control-new">
<div class="select is-small is-fullwidth">
<select class="maskinputPflicht" id="measure1" name="measure1" tabindex="220"
<option class="maskinput" value="" selected="selected">Bitte wählen Sie</option>
</select>
</div>
</p>
</div>
<span class="separator">&#160;</span>
<span class="separator">&#160;</span>
<span class="info" onclick="window.open('https://super-ics.de/superx/doku/kern_modul/admin/f_Patcheinspielen.htm','_blank','directories=no,location=no,menubar=no,scrollbars=yes,resizable=yes,toolbar=no,width=800,height=660');">
<figure class="image is-24x24">
<img src="../images/information_grey_liberation.svg" />
</figure>
</span>
</div>-->
<span class="separator">&#160;</span>
<span class="separator">&#160;</span>
<!--Formular Erweiterte Layoutmerkmale-->
<div class="label-container">
<label class="label is-required is-small"><strong>Erweiterte Layoutmerkmale</strong></label>
</div>
<span class="separator">&#160;</span>
<span class="separator">&#160;</span>
<a
onClick="showChartPropertiesForm();">
<span class="icon is-small"><i class="../images/more.svg"></i>
<img src="../images/more.svg" title="Laden" />
</span>
</a>
</div>
-->
</a>
<div id="chartPropertiesFormDetails" style="display:none"><p>Eigenschaften</p> </div>
</form>
</div>
<!--Ende Formular Erweiterte Layoutmerkmale-->
<span class="separator">&#160;</span>
<span class="separator">&#160;</span>
<!--Aufruf/Anzeige Layout-Vorschau-->
<div class="field is-grouped">
<div class="label-container">
<label class="label is-required is-small"><strong>Layout-Vorschau</strong></label>
</div>
<span class="separator">&#160;</span>
<span class="separator">&#160;</span>
<button class="button is-small is-rounded is-white is-outlined"
onClick="createChart('chartDiv');">
<span class="icon is-small"><i class="../images/more.svg"></i>
<img src="../images/more.svg" title="Laden" />
</span>
</button>
</div>
<div id="chartCanvas"> <!--class="section"-->
<!--<div id="chartCanvasHeader"> </div>-->
<div id="chartDiv"> <!--style="border:thin solid black"--></div>
<!--<div id="chartCanvasFooter"></div>-->
</div>
<!--footer (BF nach unten verschoben)-->
<footer class="card-footer">
<p class="card-footer-item"><button class="button is-link is-outlined is-small" onClick="createChart();">Vorschau</button></p>
<!--***Selektionsergebnis
<div id="selectionResultPreview" class="section">
<div id="selectionResultPreviewHeader"><input type="button" tabindex="10010" class="sx_buttondiv_submit" value="Laden" onclick="selectionResultPreview('selectionResultPreviewTable');"></div>
<div id="selectionResultPreviewTable" style="border:thin solid black"></div>
</div>
Selektionsergebnis***-->
<!--<p class="card-footer-item"><button class="button is-link is-outlined is-small" onClick="createChart();">Layout-Vorschau</button></p>-->
<p class="card-footer-item"><button class="button is-link is-outlined is-small" type="submit">Speichern</button></p>
<!--****noch anzupassen: <input name="navi" type="hidden" value="true"><input type="hidden" name="tid" value="16000"><input type="hidden" name="UserID" value="4"><input type="hidden" name="reuseresult" value="true"><input type="hidden" name="maxoffset" value=""><input type="hidden" name="contenttype" value="application/jrxml"><input type="hidden" name="irowno" value=""><input type="hidden" name="Köpfe oder Fälle ?" value="studiengang_nr = 1 and fach_nr = 1"><input type="hidden" name="Stichtag" value="6"><input type="hidden" name="Seit Semester" value="20161"><input type="hidden" name="Bis Semester" value="20221"><input type="hidden" name="Studiengang" value=""><input type="hidden" name="Fächer" value=""><input type="hidden" name="Status" value="1,2,3,5,6"><input type="hidden" name="##line##" value="1"><input type="hidden" name="Hörerstatus" value="1=1"><input type="hidden" name="##line##" value="1"><input type="hidden" name="RPTPageOrientation" value="Landscape"><input type="hidden" name="RPTPagination" value="False"></ul>-->
<p class="card-footer-item"><button class="button is-link is-outlined is-small" type="reset">Zurücksetzen</button></p>
</footer>
<div id="chartCanvas" class="section">
<div id="chartCanvasHeader">
</xsl:template>
<xsl:template name="diagrammnutzung">
<!-- Aufruf/Anzeige Diagramm-Vorschau-->
<div class="field is-grouped">
<div class="label-container">
<label class="label is-required is-small"><strong>Diagramm-Vorschau</strong></label>
</div>
<span class="separator">&#160;</span>
<span class="separator">&#160;</span>
<button class="button is-small is-rounded is-white is-outlined"
onClick="createChart('chartDiv2');">
<span class="icon is-small"><i class="../images/more.svg"></i>
<img src="../images/more.svg" title="Laden" />
</span>
</button>
</div>
<div id="chartDiv" style="border:thin solid black">
<div id="chartCanvas"> <!--class="section"-->
<!--<div id="chartCanvasHeader"> </div>-->
<div id="chartDiv2"> </div>
<!--<div id="chartCanvasFooter"></div>-->
</div>
<div id="chartCanvasFooter">
<span class="separator">&#160;</span>
<span class="separator">&#160;</span>
<!-- Aufruf/Anzeige SVG-Quellcode-->
<div class="field is-grouped">
<div class="label-container">
<label class="label is-required is-small"><strong>Diagramm-Quellcode (svg)</strong></label>
</div>
<span class="separator">&#160;</span>
<span class="separator">&#160;</span>
<button class="button is-small is-rounded is-white is-outlined"
onClick="showSrcCode();">
<span class="icon is-small"><i class="../images/more.svg"></i>
<img src="../images/more.svg" title="Laden" />
</span>
</button>
</div>
</div>
</xsl:template>
<xsl:template name="diagrammnutzung">
<div id="chartSVGsrcDiv" class="section">
<div class="field is-grouped">
<div class="label-container">
<label class="label is-required is-small"><strong>SVG-Quellcode</strong></label>
</div>
<span class="separator"> </span>
<a onClick="showSrcCode();" ><!--is-focused-->
<span class="icon is-small"><i class="../images/more.svg"></i>
<img src="../images/more.svg" title="Laden" />
</span>
</a>
</div>
<div id="chartSVGsrcDiv"> <!--class="section">-->
<div id="chartSVGsrc" style="display:none">
<textarea id="chartSrc" name="chartSrc" class="textarea" placeholder="Quellcode..."> <!--cols="100" rows="20"--></textarea><!--<button class="sx_buttondiv_submit" onClick="copySrcCode('chartSrc');">Kopieren</button>-->
</div>
</div>
<!--footer (BF eingefügt *** Klärungsbedarf bzgl. notwendiger Buttons)-->
<footer class="card-footer">
<!--<p class="card-footer-item"><button class="button is-link is-outlined is-small" onClick="createChart();">Diagramm-Vorschau</button></p> -->
<p class="card-footer-item"><button class="button is-link is-outlined is-small" type="submit" onClick="copySrcCode('chartSrc');">Kopieren</button></p>
<!--<p class="card-footer-item"><button class="button is-link is-outlined is-small" type="reset">Zurücksetzen</button></p>-->
</footer>
<div id="chartSVGsrc" style="visibility:hidden">
<textarea id="chartSrc" name="chartSrc" class="textarea" placeholder="Quellcode..." cols="100" rows="20"></textarea><button class="sx_buttondiv_submit" onClick="copySrcCode('chartSrc');">Kopieren</button>
</div>
</div>
</xsl:template>
</xsl:stylesheet>

Loading…
Cancel
Save