Wednesday 30 May 2018

Count down using jquery Days, hour, min, sec.


<!DOCTYPE html>
<html>
<style>
    body, html
    {
        height: 100%;
        margin: 0 auto;
        padding: 0px;
        color: #333;
    }
   
    .bgimg
    {
        min-height: 100%;
        background-position: center;
        background-size: cover;
        position: relative;
        color: #333;
        font-family: "Courier New" , Courier, monospace;
        font-size: 25px;
    }
   
    .topleft
    {
        position: absolute;
        top: 0;
        left: 16px;
    }
   
    .bottomleft
    {
        position: absolute;
        bottom: 0;
        left: 16px;
    }
   
    .middle
    {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        text-align: center;
    }
</style>
<body>
    <div class="bgimg">
        <div style="width: 100%;">
            <div style="width: 100%; height: 60px; background-color: #D6BE94;">
                <div style="width: 100%; height: 65px; background-color: #D6BE94; background-image: url('images/logo1.png');
                    background-repeat: no-repeat;">
                </div>
            </div>
        </div>
        <div class="divround" style="width: 100%; float: right; height: 27px; background-color: #4F8C68;
            margin: 0px 0px 0 0;" align="right">
        </div>
        <div class="middle">
            <h1>
                Site under maintenance</h1>
            <hr style="margin: auto; width: 40%" />
            <p id="cntDown" style="font-weigth: bold; font-size: 30px">
            </p>
        </div>
      <!--  <div class="bottomleft">
            <p>
                We are under maintenance....</p>
        </div>-->
    </div>
    <script>
        // Set the date we're counting down to
        var countDownDate = new Date("May 30, 2018 15:37:25").getTime();

        // Update the count down every 1 second
        var countdownfunction = setInterval(function () {

            // Get todays date and time
            var now = new Date().getTime();

            // Find the distance between now an the count down date
            var distance = countDownDate - now;

            // Time calculations for days, hours, minutes and seconds
            var days = Math.floor(distance / (1000 * 60 * 60 * 24));
            var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
            var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
            var seconds = Math.floor((distance % (1000 * 60)) / 1000);

            // Output the result in an element with id="demo"
            document.getElementById("cntDown").innerHTML = days + " Days : " + hours + " Hour :"
    + minutes + " Min. : " + seconds + " Sec. ";

            // If the count down is over, write some text
            if (distance < 0) {
                clearInterval(countdownfunction);
                document.getElementById("cntDown").innerHTML = "EXPIRED";
            }
        }, 10);
    </script>
</body>
</html>



Tuesday 22 May 2018

Convert Fusion chart SVG to Png,jpg using jquery in asp.net c#

//////////////////////////////////////////////// Fusion fusion chart js

Step 1.  Generate fusion chart





Step 2.  Set a Java-script  function for converting the  SVG data into 64byte image file. and set this value into the hidden field variable.

<script type="text/javascript">
        function Convert_Svg_Png() {
            if (!$('#mDmyChartar2_div').length) {
                var svgString = $('#myChartar2_div span').html();
                var canvas = document.createElement('canvas');
                var DOMURL = self.URL || self.webkitURL || self;
                var img = new Image();
                var svg = new Blob([svgString], { type: 'image/svg+xml;charset=utf-8' });
                var url = DOMURL.createObjectURL(svg);
                img.onload = function () {
                    canvas.width = img.width; canvas.height = img.height; canvas.getContext('2d').drawImage(img, 0, 0);
                    var png = canvas.toDataURL('image/png');
                    var div = document.createElement('div'); $(div).attr('id', 'mDmyChartar2_div');
                    $(div).html('<img id="img_myChartar2_div" src="' + png + '" />'); $(div).css('display', 'none');
                    $('#myChartar2_div').append(div); DOMURL.revokeObjectURL(png);
                }; img.src = url;
            }
        }
    </script>








Setp 3. Convert 64byte image into png file and save server folder


var p = System.Text.Encoding.UTF8.GetBytes(64byteImgData);
string p1 = Encoding.UTF8.GetString(p);

byte[] bytes = Convert.FromBase64String(p1);
System.Drawing.Image image;
using (MemoryStream ms = new MemoryStream(bytes))
{
image = System.Drawing.Image.FromStream(ms);
}


string FilePath = Server.MapPath("~/Charts/" + FileName + i + ".jpg");
image.Save(FilePath);

Setp 4.  Now You can any thing with this image








Generate google chart using common function in asp.net c#


//////////////// JS

<script type="text/javascript" src="https://www.google.com/jsapi"></script>

/////////////////////////HTML

         <asp:Literal ID="ltScripts" runat="server"></asp:Literal>
        <div id="chart_div" style="width: 660px; height: 400px;"></div>


/////////////////////CS


  public string Generate_GoogleChart(DataTable dt, string ChartType, string ChartID, string FunctionName, string Is3D, string ChartTitle,string vAxis,string hAxis,string SeriesType,string NoOfSeries,string TypeOfCombo,string IspieHole)
    {
        StringBuilder strScript = new StringBuilder();
        strScript.Append(@"<script type='text/javascript'>google.load('visualization', '1', {packages: ['corechart']}); </script> <script type='text/javascript'>function " + FunctionName + "() { var data = google.visualization.arrayToDataTable([[");
        for (int i = 0; i < dt.Columns.Count; i++)
        {
            if (i < dt.Columns.Count - 1)
            {
                strScript.Append(@"'" + dt.Columns[i].ColumnName + "',");
            }
            else
            {
                strScript.Append(@"'" + dt.Columns[i].ColumnName + "'");
            }
        }

        strScript.Append(@"],");
        for (int i = 0; i < dt.Rows.Count; i++)
        {
            strScript.Append(@"[");
            for (int c = 0; c < dt.Columns.Count; c++)
            {
                if (c == 0)
                    strScript.Append("'" + dt.Rows[i][c] + "',");
                else
                {
                    if (c < dt.Columns.Count - 1)
                    { strScript.Append("" + dt.Rows[i][c] + ","); }
                    else
                    {
                        strScript.Append("" + dt.Rows[i][c] + "");
                    }
                }
            }
            strScript.Append(@"],");

        }
        strScript.Remove(strScript.Length - 1, 1);
        strScript.Append("]);");
        string OtherOptions = "";
        if (!ChartType.ToLower().Contains("pie"))
        {
            OtherOptions = " ,vAxis: { title: '" + vAxis + "' }, hAxis: { title: '" + hAxis + "' }";
            if (ChartType.ToLower().Contains("Combo"))
            {
                OtherOptions = OtherOptions + ", seriesType: '" + SeriesType + "', series: { " + NoOfSeries + ": { type: '" + TypeOfCombo + "'} ";
            }
       
        }
        else
        {
           // OtherOptions = IspieHole == "" ? "" : ", pieHole: 0.5";  //
        }

        strScript.Append(@" var options = {title: '" + ChartTitle + "',is3D: " + Is3D + " " + OtherOptions + "}; ");
        strScript.Append(@"var chart = new google.visualization." + ChartType + "(document.getElementById('" + ChartID + "')); chart.draw(data, options);}google.setOnLoadCallback(" + FunctionName + ");");
        strScript.Append(" </script>");
        return strScript.ToString();
    }

///////////////////////Pass variable

private void BindChart()
    {
        DataTable dsChartData = new DataTable();       
            string chrt = Generate_GoogleChart(dsChartData, "BarChart", "chart_div", "drawVisualization", "false", "Monthly Coffee Production by Country", "Cups", "Month", "", "", "", "");
            ltScripts.Text = chrt;
        }
        catch
        {
        }
    }

Friday 4 May 2018

Change Selected Row Color in Gridview in on mouser over Asp.Net

/////////////////// HTML



<asp:GridView ID="GridView1" runat="server" OnRowDataBound="GridView1_RowDataBound"
            BackColor="White" BorderColor="#CCCCCC" BorderStyle="None" BorderWidth="1px"
            CellPadding="4" ForeColor="Black" GridLines="Horizontal"     OnSelectedIndexChanged="OnSelectedIndexChanged" Height="153px" Width="681px">
            <FooterStyle BackColor="#CCCC99" ForeColor="Black" />
            <HeaderStyle BackColor="#333333" Font-Bold="True" ForeColor="White" />
            <PagerStyle BackColor="White" ForeColor="Black" HorizontalAlign="Right" />
            <SelectedRowStyle BackColor="#CC3333" Font-Bold="True" ForeColor="White" />
            <SortedAscendingCellStyle BackColor="#F7F7F7" />
            <SortedAscendingHeaderStyle BackColor="#4B4B4B" />
            <SortedDescendingCellStyle BackColor="#E5E5E5" />
            <SortedDescendingHeaderStyle BackColor="#242121" />
</asp:GridView>

<asp:Label ID="msg" runat="server" Text=""></asp:Label>


/////////////////// CS

  protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)

    {
        if (e.Row.RowType == DataControlRowType.DataRow)
        {
            e.Row.Attributes["onmouseover"] = "this.style.backgroundColor='Lime';";
            e.Row.Attributes["onmouseout"] = "this.style.backgroundColor='white';";
        }
    }



Single user login at a time using asp.net c#

//////////////// at login page load event


public System.Data.DataTable dtSessionGlobal = new DataTable();
    string clientIp = "";

    protected void Page_Load(object sender, EventArgs e)
    {
        Session["OptionDB"] = null;
        if (Cache["UserSessions"] != null)
        {
            dtSessionGlobal = (DataTable)Cache["UserSessions"];
            if (dtSessionGlobal.Columns.Count == 0)
            {
                dtSessionGlobal.Columns.Add("UserName");
                dtSessionGlobal.Columns.Add("SessionID");
            }
        }
        else
        {
            dtSessionGlobal.Columns.Add("UserName");
            dtSessionGlobal.Columns.Add("SessionID");
            Cache["UserSessions"] = dtSessionGlobal;
        }
    }

////////////////////////


if (dtSessionGlobal.Rows.Count > 0)

        {
            System.Data.DataRow[] dr = dtSessionGlobal.Select(" UserName='" + Session["UName"] + "'");
            if (dr.Length > 0)
            {
                /// write code here which you want
                return;

            }
        }

Excel Sort values in ascending order using function TEXTJOIN

 Excel ::  Text ::  1,3,5,2,9,5,11 Result :: 1,2,3,5,5,9,11 Formula ::     TEXTJOIN ( ",",1,SORT(MID(SUBSTITUTE( A1 ,","...