Foundation 5 and accordion - accordion

I'm using the Foundation 5 framework and trying to use the accordion.
If I use the sample code all ok: http://foundation.zurb.com/docs/components/accordion.html
If I try to use div tags and / or sectin in place of tag dl and dd does not work
Why?

Because the accordion code is with hardcoded tag names :) ... and you can't even configure them.
This is part of the accordion code:
........
.on('click.fndtn.accordion', '[' + this.attr_name() + '] dd > a', function (e) {
var accordion = S(this).closest('[' + self.attr_name() + ']'),
target = S('#' + this.href.split('#')[1]),
siblings = S('dd > .content', accordion),
aunts = $('> dd', accordion),
settings = accordion.data(self.attr_name(true) + '-init'),
active_content = S('dd > .content.' + settings.active_class, accordion),
active_parent = S('dd.' + settings.active_class, accordion);
........
You can see the dd and dl tag names inside :) ... but - of course - you can make them configurable :) ...

Related

Define editing date format in AG Grid

I have a SQL Server table which contains a DATETIME column SaleDate - and unfortunately, for now, I cannot change the datatype to just DATE (which would be sufficient).
I am trying to show data from that column in an Angular app using the Ag Grid.
For the display, I was able to use this in my Typescript code:
columnDefs = [
....
{ headerName: 'Sale', field: 'SaleDate', width: 120, editable: true,
cellRenderer: (data) => {
return data.value ? (new Date(data.value)).toLocaleDateString('de-CH', this.options) : '';
},
....
]
and it works quite nicely.
However, when I try to edit this cell, unfortunately the whole DATETIME details (including the time portion) is being displayed:
[ 2018-09-27T08:43:59 ]
That'll be quite confusing to the users.... so is there a way to also somehow set / define the format for the editing in an AG-Grid cell?
If you need to have a workaround (prepare visual and real data) for display and edit things, you should create an own cellRenderer and cellEditor for this cell.
Or you can just create a cellEditor for calendar component and valueFormatter for displaying the date.
Just my case for same requirements valueFormatter:
let result: string;
if (params.value) {
var formats = [
moment.ISO_8601
];
let date = moment(params.value, formats, true);
if (date.isValid()) {
let dateObject: Date = date.toDate();
result = ('0' + dateObject.getDate()).slice(-2) + '.'
+ ('0' + (dateObject.getMonth() + 1)).slice(-2) + '.'
+ dateObject.getFullYear();
if (element.DataType == "datetime")
result += ' ' + ('0' + dateObject.getHours()).slice(-2) + ':'
+ ('0' + dateObject.getMinutes()).slice(-2) + ':'
+ ('0' + dateObject.getSeconds()).slice(-2);
}
}
return result;
On custom cellEditor the major thing is getValue function - which will be used internally (for binding)
getValue(): any {
let value = (this.selectedDate.getFullYear() + '-'
+ ('0' + (this.selectedDate.getMonth() + 1)).slice(-2) + '-'
+ ('0' + this.selectedDate.getDate()).slice(-2)
+ 'T'
+ ('0' + this.selectedDate.getHours()).slice(-2) + ':'
+ ('0' + this.selectedDate.getMinutes()).slice(-2) + ':'
+ ('0' + this.selectedDate.getSeconds()).slice(-2));
return value;
}
And on the template, you can use any calendar template library.

Issues with naming ranges for charts within the Google Spreadsheet Script

I've been trying for days to create charts with an intelligent range, that differs when the data in the google spreadsheet is updated. However i succeeded doing so, i can't get the .setOption aspect to work. I want for example, a title, description etc with the chart. But this is not the main issue since i can insert there by hand.
More important however is the range name, because there isn't when i use the script. So, within the chart it is not possible to see what each column represents, and i really want to fix that. I tried to use the .setNamedRange() aspects, but that is not working.
Someone who can help me with that?
function check() {
var sheet = SpreadsheetApp.getActiveSheet();
var end = sheet.getLastRow();
var start = (end - 5);
var endnew = (end - 4);
var startnew = (end - 6);
if(sheet.getCharts().length == 0){
Logger.log("Er is geen grafiek");
var chartBuilder = sheet.newChart()
.asColumnChart().setStacked()
.addRange(sheet.getRange("A" + startnew + ":" + "A" + endnew)) // should have a name
.addRange(sheet.getRange("B" + startnew + ":" + "B" + endnew)) // should have a name
.addRange(sheet.getRange("E" + startnew + ":" + "E" + endnew)) //should have a name
.setOption('title', 'Effectief gebruik kantoorruimte') //not working
.setPosition(10, 10, 0, 0)
var chart = chartBuilder.build();
sheet.insertChart(chart);
}
else{
Logger.log("Er is wel een grafiek");
var charts = sheet.getCharts();
for (var i in charts) {
var chart = charts[i];
var ranges = chart.getRanges();
var builder = chart.modify();
for (var j in ranges) {
var range = ranges[j];
builder.removeRange(range);
builder
.addRange(sheet.getRange("A" + (start) + ":" + "A" + end)) //should have a name
.addRange(sheet.getRange("B" + (start) + ":" + "B" + end)) //should have a name
.addRange(sheet.getRange("E" + (start) + ":" + "E" + end)) // should have a name
.setOption('title', 'Effectief gebruik kantoorruimte')
.build();
sheet.updateChart(builder.build());
}
}
}
}
I'm assuming that this code is the issue?
builder
.addRange(sheet.getRange("A" + (start) + ":" + "A" + end))
Maybe try using the JavaScript toString() method to make sure that your text formula is working.
.addRange(sheet.getRange("A" + start.toString() + ":" + "A" + end.toString()))
There is a different format that you can use:
getRange(row, column, numRows, numColumns)
So, it would be:
getRange(start, 1, 1, numColumns)
That starts on row "start" in column A. It gets one row of data, and how ever many number of columns.

after effects Add days to current date DD/MM

So I have a text layer in aftereffects with text source expression:
D = new Date(Date(0));
D.getDate() + "/" + (D.getMonth()+1)
which gives me result like this 29/12 and I need to add 3 days to it.
I tried:
D = new Date(Date(0));
(D.getDate()+3) + "/" + (D.getMonth()+1)
But that results to 32/12 .. How do I make it so the result would be (in this particular case) 1/1? In Java people suggest to use calendar class. But I'm not sure if After Effects has such thing.
Try this:
D = new Date(Date(0));
D = new Date(D.getTime()+3*24*60*60*1000);
D.getDate() + "/" + (D.getMonth()+1)
you can use things like this:
DateTime.Now.AddDays(12);
DateTime.Now.AddYears(2);
in javascript you can set with the help of setDate() function
var d = new Date();
d.setDate(35); // this will give you 4 jan 2013
d.setDate(25); // this will give you 25 Dec 2012

Convert function to Classic ASP

I am using a mailing list program which inserts a date into a web link that is "encoded" so it can't be changed or edited by users.
The format is described as follows:
An eight character string, AABBCCDD,where:
Year = 1980 + HexToInt(BB) / 3
Month = HexToInt(CC) / 7 - 21
Day = HexToInt(DD) / 7 - 5
There is also a checksum included to avoid casual modification:
AA = IntToHex(Year + Month + Day mod 200)
For example 2660BDAF would refer to 20 June, 2012.
Can you help me convert the following to Classic ASP:
CodedDateStr = Request.querystring("Exp")
AYear = 1980 + HexToInt(CodedDateStr[3] + CodedDateStr[4]) / 3
AMonth = HexToInt(CodedDateStr[5] + CodedDateStr[6]) / 7 - 21
ADay = HexToInt(CodedDateStr[7] + CodedDateStr[8]) / 7 - 5
ACheckSum = AYear + AMonth + ADay mod 200
if ACheckSum <> HexToInt(CodedDateStr[1] + CodedDateStr[2]) then
ValidDate = 0
else
ValidDate = 1
end if
AExpiryDate = EncodeDate(ADay, AMonth, AYear)
if Date() > AExpiryDate then
ExpiredOffer = 1
else
ExpiredOffer = 0
end if
....
It looks like the HexToInt equivalent is clng("&h" & hexnumber)
I'm not sure about EncodeDate, i hope it is not something cludgy like CDate(AMonth + "/" + ADay + "/" + AYear)
CLng("&h" & hexnumber) looks like a good method for HexToInt.
For EncodeDate, look at the DateSerial function, which takes a year, month, and day, and returns a Date value.

How to get a copy of whole element in jQuery?

I want to get the selected element and then insert it's copies in few places.
var template = $("#info-" + country + " > .stats > .template").clone();
$(template).insertBefore("#info-" + country + " > .stats > .template");
What I'm doing wrong that it doesn't copy the element and insert it?
P.S. The element which I'm selecting to copy is display:none.
You have an extra wrap there, template is already a jQuery object, you just need:
var template = $("#info-" + country + " > .stats > .template").clone();
template.insertBefore("#info-" + country + " > .stats > .template");
Or a bit simpler:
var template = $("#info-" + country + " > .stats > .template");
template.clone().insertBefore(template);
Or use .before() with a function, like this:
$("#info-" + country + " > .stats > .template").before(function() {
return $(this).clone();
});