HoloViz, Panel. DateRangeSlider or DateSlider: how can I change the step to hours instead of days? - widget

With the following code:
pn.extension(sizing_mode='stretch_width')
start=df.index[0]
end = df.index[-1]
time_slider = pn.widgets.DateRangeSlider(value=(start,end), name='Fecha', start=start, end=end, format="%d/%m/%y %H:%M:%S")
time_slider
I get this Time Slider:
TimeSlider
Is there any formatting tool so I can change the step from days to hours?
Thank you!

dateslider don't have an option to change hours. but you could add a regular slider and add only hours to that slider to change.

you can try with EditableRangeSlider or RangeSlider widgets, heres an example:
time_slider = pn.widgets.EditableRangeSlider(name='Hora', format=['%Hh', '%H:%M'], start='00:00', end='23:59')

Related

Clicking checkbox for website with only div class available

HTML Code
<div class="_2yjv">
<input type="checkbox">
VBA Code
'Click check box
Dim cbox As Object
Set cbox = ie.document.getElementsByClassName("_2yjv")(0)
cbox.Click
Hi, I have been trying to put a check on a checkbox for a couple of hours now and have tried the following:
cbox.Click
cbox.DoubleClick
cbox.Value = True
cbox.Checked = True
cbox.Value = 1
cbox.Click and cbox.DoubleClick had no errors, but is not doing anything.
The rest shows errors. It's the only checkbox from a popup window.
I've been searching this forum and others but they usually have the name value on them, and I can only find those two lines from inspect element which points to the checkbox button. Would really appreciate any help on this. I'm new and still learning VBA. Thank you.
Thank you #Zwenn, cbox.FirstChild.Click did the trick.

Hide character with jQuery inside a span with a class

I've looked for the solution to this but nothing seems to be working.
I have an SKU within a span with a class of "sku". Some of the SKUs have periods before the SKU to allow for adding more than one product with the same SKU.
I'd like to hide the periods when the SKU is displayed though.
This is my code:
<span class="sku">..THESKU</span>
And this is the jQuery I am using:
<script>
$('span.sku').html($('span.sku').html().replace('.',''));
</script>
Is the right, or am I missing something? Thanks.
Your code will only replace one dot '.'. You can use regex to remove all the dots instead:
const skus = $('span.sku');
$('span.sku').each(function() {
const text = $(this).html();
const cleaned = text.replace(/\./g,'');
$(this).html(cleaned);
})
Hope this helps!
EDIT: Updated as suggested by #Taplar
I just wanted to give an update with this. I still couldn't get the periods to hide, but I found a way to have duplicate SKUs so there was no longer a need for this. Thanks for all your help.
If anyone has a similar issue, the code I used is below which I added to the themes functions file.
add_filter( 'wc_product_has_unique_sku', '__return_false', PHP_INT_MAX );

How to print the current printing date and time along with the page number?

I need the format like HH:MM:SS Date Time
With the help of css and html ,how can I show the page number and printing date and time in the footer of the page.
By using HTML and CSS you can only write it by yourself but if you want it to be automated so you must use a server language like PHP or another.
You can also do it by using Javascript or Jquery like so :
var d = new Date().toLocaleTimeString();
document.getElementById("date").innerHTML = d;
<p id="date"></p>
You can use moment library to get a better display of the date on your jsreport
first, Install moment package inside your docker container
second, you need to allow custom script in your jsreport config.json by adding
"allowedModules": "moment" or allow all "allowedModules": "*"
Third, import moment to your jsreport var moment = require('moment')
and finally, add a helper for the time and display it on your jsreport {{now}}
var moment = require('moment')
Handlebars.registerHelper("now", function(date) {
return moment(date).format('L');
});
Here how to achieve with css print media
Page numbering
css
#page {
#bottom-right {
content: "Page "counter(page);
}
}

Load html table at specific column

I'm trying to on page load get my html table to load at a specific column, I wouldn't even know where to start with this.
I've uploaded it here to see a demo: http://jsfiddle.net/3EFqD/
I've tried this in my body tag:
onload=' location.href="#right_column" '
and added id='right_column' to the correct td but that didn't work
Trying to get it to load on the cell that is labeled "this one"
Here's a fiddle incorporating the width of the header: Fiddle
Again, a jquery solution, essentially the same as above but needs to subtract the header width to hit the right position. See the fiddle for where the id's are added
$(document).ready(function(){
var hw = $('#headerWidth').width();
var f = $('#scrollToMe').position().left - hw;
$('.inner').scrollLeft(f);
})
If Im right in thinking you want a specific column to be scrolled to on page load, the easiest way would be to use a library, e.g. jQuery:
$('.inner').stop().animate({
scrollLeft: $('#right_column').offset().left
}, 1000);
Demo Fiddle
You're trying to make it work in a similar way to using anchors- however this isnt possible for horizontally aligned content.
May be if you are trying to load some html code(like table) in the mentioned td(This one), as you mentioned add id=right_column to this td and then use the below jquery logic -
var newtable = '<table class="newtable">New table, this may be from ajax call also</table>'
$('#right_column').html(newtable);

Windows Phone 8 ApplicationBar expanded unchangable transparancy

following Code...
<!--Navigation-Bar-->
<phone:PhoneApplicationPage.ApplicationBar>
<shell:ApplicationBar IsVisible="True" ForegroundColor="White" IsMenuEnabled="True" BackgroundColor="#002B55">
<shell:ApplicationBarIconButton Click="B_Search_Click" IconUri="Images\Pic_Search.png" Text="Search"/>
<shell:ApplicationBarIconButton Click="B_Media_Click" IconUri="Images\Pic_Media.png" Text="Media"/>
<shell:ApplicationBarIconButton Click="B_Scan_Click" IconUri="Images\Pic_Scan.png" Text="Scanner"/>
<shell:ApplicationBarIconButton Click="B_Charts_Click" IconUri="Images\Pic_Charts.png" Text="Charts"/>
<shell:ApplicationBar.MenuItems>
<shell:ApplicationBarMenuItem Click="B_Logout_Click" Text="Logout"/>
</shell:ApplicationBar.MenuItems>
</shell:ApplicationBar>
</phone:PhoneApplicationPage.ApplicationBar>
gives me following ApplicationBar...
http://s14.directupload.net/file/d/3341/4xiadbvz_jpg.htm
(Solid background when expanded)
BUT if I create the AppBar in CodeBehind like this...
private void ResetApplicationBar()
{
ApplicationBar = new ApplicationBar();
ApplicationBar.BackgroundColor = Color.FromArgb(150, 0, 43, 85);;
ApplicationBar.ForegroundColor = Colors.White;
ApplicationBar.Opacity = 1;
ApplicationBarIconButton B_Search = new ApplicationBarIconButton();
B_Search.IconUri = new Uri("/Images/Pic_Search.png", UriKind.Relative);
B_Search.Text = "search";
ApplicationBar.Buttons.Add(B_Search);
B_Search.Click += new EventHandler(B_Search_Click);
(more Buttons...)
then I get that misterios unchangable Transparency...
http://s1.directupload.net/file/d/3341/zjo57e37_jpg.htm
(Half-Transparent when expanded)
How can I change the Background to solid???
-Yes I have mostly overwritten the theme
-Changing global colors doesnt work
-changing background/foreground doesnt work
-changing opacity doesnt work...
I need to generate it from code behind because im changing it dynamically in one window
(or is it possible to define multiple AppBars in markup?)
Thanks in advance!
Please try this one
ApplicationBar.BackgroundColor = Color.FromArgb(52,0,2,181);
ApplicationBar.ForegroundColor = Colors.White;
You will get the same color in designer page by this way.
This (52,0,2,181) is the conversion value of #002B55
On a fresh project, everything seems fine, here.
"- changing background/foreground doesnt work
- changing opacity doesnt work..."
Using the Application Bar sample, you provided in XAML, but with Opacity=0.5, I get this :
After I click the "Change Color" button, which does ApplicationBar.Opacity = 1;, I get this result :
(The background image is slightly moved up, because in first case we provided an opacity and in the second there was none explicitly specified and it seems the app bar didn't layered over the image, but to fix this you can set an Opacity=0.999, close to 1).
It must have something to do with all the theme overwriting you have done or some customization you attempted.
If this isn't quite helpful, provide me more details and I'll try to help as I can.
Thank you very much for effort, but changing opacity didnt to 0.999 didnt help either.
I found a solution!! And its quite simple :)
I Just take the old bar instead of creating a new one:
//Old Code
ApplicationBar = new ApplicationBar();
//New Code
ApplicationBar.Buttons.Clear();
ApplicationBar.MenuItems.Clear();
Hope it helps someone!