Fong coding resources

08 August 2018

Windows 10 Sky Drive security flaw

If you are going to create an account on a share Windows 10 computer, just beware that Windows will download ALL you skydrive data locally and anyone else who has administrative privilege on that computer can see all your data.

They are stored in C:\Users\{Username}\OneDrive

So be careful, next time you use a share computer

Telstra vs Optus vs Vodafone - Aug 2018

I had been with Vodafone for many years and quite recently, I decided to go prepaid to try out the three different networks and compare their performance. Here is what I found

Telstra

I can call people at home, the reception is good.

I can talk to clients at office, the reception is like landline.

Internet connection is good on the Seaford trainline except certain areas near Hallett Cove where the reception can drop to 50% for a few minutes.

Optus

I can call people at home, the reception is good.

I can talk to clients at office, the reception is good.

Internet connection is good on the Seaford trainline except certain areas near Hallett Cove where there is no reception for a few minutes.

Vodafone

I can call people at home, the reception is good.

I can’t talk to clients at office, reception is intermittent.

Internet connection is average on the Seaford trainline and no reception near Hallett Cove and Seacliff area.

Money for value wise

Telstra charges $49 a month for 20G

Optus charges $36 a month for 30G

Vodafone charges $45 a month for 30G

Conclusion

If voice reception and data connection is critical to you, go with Telstra

If you want more data and pay less and are willing to put up with lesser reception at times, go with Optus

12 June 2018

tsconfig example with compileOnSave

{
"compilerOptions": {
"module": "system",
"noImplicitAny": true,
"removeComments": true,
"preserveConstEnums": true,
"outFile": "wwwroot/js/out.js",
"sourceMap": true
},
"include": [
"Pages/*.ts"
],
"compileOnSave": true
}

21 April 2018

Kendo UI grid center the progress bar

I found a solution on how to center the Kendo UI grid progress bar today. Thought I share, it turns out to be real easy. Just use overwrite the CSS

 <style>  
   .k-loading-mask .k-loading-image {  
     background-image: url('loadingtest2.png') !important;  
     position: fixed !important;  
     top: 50% !important;  
     left: 50% !important;  
     /* bring your own prefixes */  
     transform: translate(-50%, -50%) !important;  
   }  
 </style>

This method can of course be apply to anything you want to display on the center of the screen.

Full source code based on the Grid\Api example from their sample codes is as below

 <!DOCTYPE html>  
 <html lang="en" xmlns="http://www.w3.org/1999/xhtml">  
 <head>  
   <title>API</title>  
   <meta charset="utf-8">  
   <link href="../content/shared/styles/examples-offline.css" rel="stylesheet">  
   <link href="../../styles/kendo.common.min.css" rel="stylesheet">  
   <link href="../../styles/kendo.rtl.min.css" rel="stylesheet">  
   <link href="../../styles/kendo.default.min.css" rel="stylesheet">  
   <link href="../../styles/kendo.default.mobile.min.css" rel="stylesheet">  
   <script src="../../js/jquery.min.js"></script>  
   <script src="../../js/jszip.min.js"></script>  
   <script src="../../js/kendo.all.min.js"></script>  
   <script src="../content/shared/js/console.js"></script>  
   <script>  
   </script>  
 </head>  
 <style>  
   .k-loading-mask .k-loading-image {  
     background-image: url('loadingtest2.png') !important;  
     position: fixed !important;  
     top: 50% !important;  
     left: 50% !important;  
     /* bring your own prefixes */  
     transform: translate(-50%, -50%) !important;  
   }  
 </style>  
 <body>  
   <a class="offline-button" href="../index.html">Back</a>  
   <div id="example">  
     <div class="box wide">  
       <div class="box-col">  
         <h4>Selection</h4>  
         <ul class="options">  
           <li>  
             <input type="text" value="0" id="selectRow" class="k-textbox" />  
             <button class="selectRow k-button">Select row</button>  
           </li>  
           <li>  
             <button class="clearSelection k-button">Clear selected rows</button>  
           </li>  
         </ul>  
       </div>  
       <div class="box-col">  
         <h4>Expand/Collapse</h4>  
         <ul class="options">  
           <li>  
             <input type="text" value="0" id="groupRow" class="k-textbox"/>  
             <button class="toggleGroup k-button">Collapse/Expand group</button>  
           </li>  
         </ul>  
       </div>  
     </div>  
     <div id="grid"></div>  
     <script>  
         $(document).ready(function () {  
           $("#grid").kendoGrid({  
             dataSource: {  
               transport: {  
                 read: {  
                   url: "https://demos.telerik.com/kendo-ui/service/Products",  
                   dataType: "jsonp"  
                 }  
               },  
               pageSize: 5,  
               group: {  
                 field: "UnitsInStock",  
                 dir: "asc"  
               }  
             },  
             selectable: "multiple row",  
             pageable: {  
               buttonCount: 5  
             },  
             scrollable: false,  
             groupable: true,  
             columns: [  
               {  
                 field: "ProductName",  
                 title: "Product Name"  
               },  
               {  
                 field: "UnitPrice",  
                 title: "Unit Price",  
                 format: "{0:c}"  
               },  
               {  
                 field: "UnitsInStock",  
                 title: "Units In Stock"  
               }  
             ]  
           });  
           $(".clearSelection").click(function () {  
             $("#grid").data("kendoGrid").clearSelection();  
           });  
           var selectRow = function (e) {  
             if (e.type != "keypress" || kendo.keys.ENTER == e.keyCode) {  
               var grid = $("#grid").data("kendoGrid"),  
                 rowIndex = $("#selectRow").val(),  
                 row = grid.tbody.find(">tr:not(.k-grouping-row)").eq(rowIndex);  
               grid.select(row);  
             }  
           },  
             toggleGroup = function (e) {  
               if (e.type != "keypress" || kendo.keys.ENTER == e.keyCode) {  
                 var grid = $("#grid").data("kendoGrid"),  
                   rowIndex = $("#groupRow").val(),  
                   row = grid.tbody.find(">tr.k-grouping-row").eq(rowIndex);  
                 if (row.has(".k-i-collapse").length) {  
                   grid.collapseGroup(row);  
                 } else {  
                   grid.expandGroup(row);  
                 }  
               }  
             };  
           $(".selectRow").click(selectRow);  
           $("#selectRow").keypress(selectRow);  
           $(".toggleGroup").click(toggleGroup);  
           $("#groupRow").keypress(toggleGroup);  
         });  
     </script>  
   </div>  
 </body>  
 </html>

04 April 2018

Custom JavaScript event illustrated

The trigger function is called when user clicks on p, myCustomEvent is bubble up from p to div1 and div2, but not pass on to div3 because of event.stopPropagation();

 <!DOCTYPE html>  
 <head>  
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>  
 </head>  
 <style>  
   form, div, p {  
     border-style: solid;  
     border-width: 1px;  
   }  
   p{  
     background-color:green;  
   }  
 </style>  
 <form>  
 FORM  
   <div id="div3">div3  
     <div id="div2">div2  
       <div id="div1">div1  
         <p onclick="trigger(this)">P</p>  
       </div>  
     </div>  
   </div>  
 </form>  
 <script>  
   $(function () {  
     $("#div3").on("myCustomEvent",  
       function (event, arg1, arg2) {  
         alert("div3 will not receive the event");  
       });  
     $("#div2").on("myCustomEvent",   
       function (event, arg1, arg2) {  
         var s = "div2 arg1:" + arg1 + ", arg2:" + arg2;  
         alert(s);  
         event.stopPropagation();  
       });  
     $("#div1").on("myCustomEvent",  
       function (event, arg1, arg2) {  
         alert("div1 caught myCustomEvent and pass it on");  
       });  
   });  
   function trigger(source)  
   {  
     //trigger myCustomEvent which will bubble up to its parents  
     $(source).trigger("myCustomEvent", ["hello", "world"]);  
   }  
 </script>

30 March 2018

An improved version of WPF usercontrol drag and drop tutorial

This is based on Microsoft - Walkthrough: Enabling Drag and Drop on a User Control

The improved circle usercontrol has a CircleID property

Circle.xaml.cs

 using System.Windows;  
 using System.Windows.Controls;  
 using System.Windows.Input;  
 using System.Windows.Media;  
 namespace WpfApp3  
 {  
   /// <summary>  
   /// Interaction logic for Circle.xaml  
   /// </summary>  
   public partial class Circle : UserControl  
   {  
     private Brush _previousFill = null;  
     public Circle()  
     {  
       InitializeComponent();  
     }  
     public Circle(Circle c)  
     {  
       InitializeComponent();  
       this.circleUI.Height = c.circleUI.Height;  
       this.circleUI.Width = c.circleUI.Height;  
       this.circleUI.Fill = c.circleUI.Fill;  
       this.CircleID = c.CircleID;  
     }  
     public int CircleID  
     {  
       get { return (int)GetValue(CircleIDProperty); }  
       set { SetValue(CircleIDProperty, value); }  
     }  
     public static readonly DependencyProperty CircleIDProperty =  
       DependencyProperty.Register("CircleID", typeof(int), typeof(Circle));  
     protected override void OnDragEnter(DragEventArgs e)  
     {  
       base.OnDragEnter(e);  
       _previousFill = circleUI.Fill;  
       if (e.Data.GetDataPresent(DataFormats.StringFormat))  
       {  
         string dataString = (string)e.Data.GetData(DataFormats.StringFormat);  
         BrushConverter converter = new BrushConverter();  
         if (converter.IsValid(dataString))  
         {  
           Brush newFill = (Brush)converter.ConvertFromString(dataString.ToString());  
           circleUI.Fill = newFill;  
         }  
       }  
     }  
     protected override void OnDragLeave(DragEventArgs e)  
     {  
       base.OnDragLeave(e);  
       circleUI.Fill = _previousFill;  
     }  
     protected override void OnDrop(DragEventArgs e)  
     {  
       base.OnDrop(e);  
       if (e.Data.GetDataPresent(DataFormats.StringFormat))  
       {  
         string dataString = (string)e.Data.GetData(DataFormats.StringFormat);  
         BrushConverter converter = new BrushConverter();  
         if (converter.IsValid(dataString))  
         {  
           Brush newFill = (Brush)converter.ConvertFromString(dataString);  
           circleUI.Fill = newFill;  
           if (e.KeyStates.HasFlag(DragDropKeyStates.ControlKey))  
           {  
             e.Effects = DragDropEffects.Copy;  
           }  
           else  
           {  
             e.Effects = DragDropEffects.Move;  
           }  
         }  
       }  
       e.Handled = true;  
     }  
     protected override void OnDragOver(DragEventArgs e)  
     {  
       base.OnDragOver(e);  
       e.Effects = DragDropEffects.None;  
       if (e.Data.GetDataPresent(DataFormats.StringFormat))  
       {  
         string dataString = (string)e.Data.GetData(DataFormats.StringFormat);  
         BrushConverter converter = new BrushConverter();  
         if (converter.IsValid(dataString))  
         {  
           if (e.KeyStates.HasFlag(DragDropKeyStates.ControlKey ))  
           {  
             e.Effects = DragDropEffects.Copy;  
           }  
           else  
           {  
             e.Effects = DragDropEffects.Move;  
           }  
         }  
       }  
       e.Handled = true;  
     }  
     protected override void OnMouseMove(MouseEventArgs e)  
     {  
       base.OnMouseMove(e);  
       if (e.LeftButton == MouseButtonState.Pressed)  
       {  
         DataObject data = new DataObject();  
         data.SetData(DataFormats.StringFormat, circleUI.Fill.ToString());  
         data.SetData("Double", circleUI.Height);  
         data.SetData("Object", this);  
         data.SetData("CircleID", CircleID);  
         DragDrop.DoDragDrop(this, data, DragDropEffects.Copy | DragDropEffects.Move);  
       }  
     }  
     protected override void OnGiveFeedback(GiveFeedbackEventArgs e)  
     {  
       base.OnGiveFeedback(e);  
       // These Effects values are set in the drop target's  
       // DragOver event handler.  
       if (e.Effects.HasFlag(DragDropEffects.Copy))  
       {  
         Mouse.SetCursor(Cursors.Cross);  
       }  
       else if (e.Effects.HasFlag(DragDropEffects.Move))  
       {  
         Mouse.SetCursor(Cursors.Pen);  
       }  
       else  
       {  
         Mouse.SetCursor(Cursors.No);  
       }  
       e.Handled = true;  
     }  
   }  
 }

Circle.xaml

 <UserControl x:Class="WpfApp3.Circle" x:Name="CircleControl"  
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"  
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"  
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"   
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"   
        xmlns:local="clr-namespace:WpfApp3"  
        mc:Ignorable="d"   
        d:DesignHeight="300" d:DesignWidth="300"  
        AllowDrop="True">  
   <Grid>  
     <Grid.RowDefinitions>  
       <RowDefinition />  
       <RowDefinition />  
     </Grid.RowDefinitions>  
     <Label Content="{Binding Path=CircleID, ElementName=CircleControl}" Grid.Row="0" />  
     <Ellipse x:Name="circleUI" Grid.Row="1"  
      Height="100" Width="100"  
      Fill="Blue" />  
   </Grid>  
 </UserControl>

This version of MainWindow identify the circle usercontrol by CircleID and parent panel by its Name
MainWindow.xaml.cs

 using System.Windows;  
 using System.Windows.Controls;  
 using System.Windows.Media;  
 namespace WpfApp3  
 {  
   /// <summary>  
   /// Interaction logic for MainWindow.xaml  
   /// </summary>  
   public partial class MainWindow : Window  
   {  
     public MainWindow()  
     {  
       InitializeComponent();  
     }  
     private void panel_DragOver(object sender, DragEventArgs e)  
     {  
       if (e.Data.GetDataPresent("Object"))  
       {  
         if (e.KeyStates == DragDropKeyStates.ControlKey )  
         {  
           e.Effects = DragDropEffects.Copy;  
         }  
         else  
         {  
           e.Effects = DragDropEffects.Move;  
         }  
       }  
     }  
     private void panel_Drop(object sender, DragEventArgs e)  
     {  
       string panelName;  
       if (e.Handled == false)  
       {  
         Panel _panel = (Panel)sender;  
         UIElement _element = (UIElement)e.Data.GetData("Object");  
         if (_panel!= null && _element!=null)  
         {  
           panelName = _panel.Name;  
           Panel _parent = (Panel)VisualTreeHelper.GetParent(_element);  
           if (_parent!=null)  
           {  
             if (e.KeyStates ==DragDropKeyStates.ControlKey &&  
               e.AllowedEffects.HasFlag(DragDropEffects.Copy))  
             {  
               Circle _circle = new Circle((Circle)_element);  
               int cid = _circle.CircleID;  
               string s = cid.ToString() + " is in " + panelName;  
               MessageBox.Show(s);  
               _panel.Children.Add(_circle);  
               e.Effects = DragDropEffects.Copy;  
             }  
             else if (e.AllowedEffects.HasFlag(DragDropEffects.Move))  
             {  
               Circle _circle = new Circle((Circle)_element);  
               int cid = _circle.CircleID;  
               string s = cid.ToString() + " is in " + panelName;  
               MessageBox.Show(s);  
               _parent.Children.Remove(_element);  
               _panel.Children.Add(_element);  
               e.Effects = DragDropEffects.Move;  
             }  
           }  
         }  
       }  
     }  
   }  
 }

MainWindow.xaml

 <Window x:Class="WpfApp3.MainWindow"  
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"  
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"  
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"  
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"  
     xmlns:local="clr-namespace:WpfApp3"  
     mc:Ignorable="d"  
     Title="MainWindow" Height="350" Width="525">  
   <Grid>  
     <Grid.ColumnDefinitions>  
       <ColumnDefinition />  
       <ColumnDefinition />  
     </Grid.ColumnDefinitions>  
     <StackPanel Grid.Column="0"  
           x:Name="LeftPanel"  
       Background="Beige"  
           AllowDrop="True"  
       DragOver="panel_DragOver"  
       Drop="panel_Drop"  
           >  
       <TextBox Width="Auto" Margin="2"  
        Text="green"/>  
       <local:Circle Margin="2" CircleID="1" />  
       <local:Circle Margin="2" CircleID="2"/>  
     </StackPanel>  
     <StackPanel Grid.Column="1"  
            x:Name="RightPanel"  
       Background="Bisque"  
       AllowDrop="True"  
       DragOver="panel_DragOver"  
       Drop="panel_Drop"     
           >  
     </StackPanel>  
   </Grid>  
 </Window>

26 January 2018

How to find kickass torrent proxy servers?

How to find kickass torrent proxy servers? As you can see Google is blocking relevant searches.

Easy, use baidu

www.baidu.com

Fong coding resources

08 August 2018

Windows 10 Sky Drive security flaw

Telstra vs Optus vs Vodafone - Aug 2018

12 June 2018

tsconfig example with compileOnSave

21 April 2018

Kendo UI grid center the progress bar

04 April 2018

Custom JavaScript event illustrated

30 March 2018

An improved version of WPF usercontrol drag and drop tutorial

26 January 2018

How to find kickass torrent proxy servers?

About Me

Blog Archive