Code Samples

Thursday, April 20, 2017

How to remove a package from Laravel using composer?

Running the following command will remove the package from vendor (or wherever you install packages), composer.json and composer.lock. Change vendor/package appropriately.

It is important that you must remove all references from your project before execute the command below.

composer remove vendor/package

'C:\Program' is not recognized as an internal or external command

This seems to happen from time to time with programs that are very sensitive to command lines, but one option is to just use the DOS path instead of the Windows path. This means that C:\Program Files\ would resolve to C:\PROGRA~1\ and generally avoid any issues with spacing.

So your command would like below:

C:\PROGRA~1\.......

Friday, April 14, 2017

Laravel DOM-PDF include custom font

Laravel is a strong php based framework today. If you have not install dompdf yet, follow this link to install dompdf in your project. After installation of dompdf follow the below steps:

1. Create a folder named "fonts" under root folder.

2. Download your preferred font and put them in "fonts" directory.

3. Now need to add font as font-face in your css file as follows:

@font-face {
    font-family: cedarville-font-family;
    src: url("{{ asset('fonts/Cedarville-Cursive.ttf') }}");
    font-weight: normal;
}

4. Now you need to set font-family to see desired output, below is a full example of view page:

<!DOCTYPE html>
<html lang="en" >
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
    <title>First Laravel DOM PDF</title>
    <style>
        @font-face {
            font-family: cedarville-font-family;
            src: url("{{ asset('fonts/Cedarville-Cursive.ttf') }}");
            font-weight: normal;
        }
        @font-face {
            font-family: cedarville-font-family;
            src: url("{{ asset('fonts/Cedarville-Cursive.ttf') }}");
            font-weight: bold;
        }
    </style>
</head>
<body>
<div style="font-family: cedarville-font-family;">Test PDF</div>
</body>
</html>

5. And now your pdf would look like:

Laravel 5.x Install DOM-PDF

Laravel is a strong php based framework today. Its very important that we can create PDF using our application. Laravel & DOM-PDF both makes it easy. Just follow the following steps:

1. Add the following line to "composer.json" in "require" section:

"barryvdh/laravel-dompdf": "^0.8.0"

2. Open command prompt and navigate to project directory & execute following command:

composer update barryvdh/laravel-dompdf --lock

Above command will install dompdf in your project

3. After installation open "conig/app.php" and add following line to providers:

Barryvdh\DomPDF\ServiceProvider::class

4. Add the following line to create an alias for dompdf:

'PDF' => Barryvdh\DomPDF\Facade::class

5. Now create a folder named "fonts" in "storage" folder.

This folder will used to store font cache.

6. Now create a Controller as follows:

<?php
namespace App\Http\Controllers;

use PDF;
use Illuminate\Routing\Controller as BaseController;

class HomeController extends BaseController
{
    public function pdf()
    {
        $pdf = PDF::loadView('home.pdf');
        //return $pdf->download('review.pdf'); //Download        
        return $pdf->stream('review.pdf'); //Stream    
    }
}
?>

7. Now create a view under "resource/views/home" named "pdf.blade.php" with following contents:

<!DOCTYPE html>
<html lang="en" >
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
</head>
<body>
<h1>Test PDF</h1>
</body>
</html>

8. Add the following line to "routes/web.php":

Route::get('/pdf', "HomeController@pdf");

9. Now browser {{Base_Url}}/pdf to view your pdf:

10. You are done.

Saturday, April 8, 2017

Radar Charh with multiple value axis - amCharts

AmChart is now very popular to display data using charts. One of them different charts Radar Chart is most used chart to display graphical data. Its very easy to plot data in radar chart, but we sometimes need multiple radar on same chart. To do so we need to do some extra java-script coding as follows. Below code will also do some extra work such change color of radar as configured.

JavaScript Code:

var chart = AmCharts.makeChart("chartdiv", {
    "type": "radar",
    "theme": "light",
    "addClassNames": true,
    "dataProvider": [{
        "title": "Mango",
        "weight": 100, "count": 1400, "color": "red"
    }, {
        "title": "Banana",
        "weight": 125, "count": 1750, "color": "green"
    }, {
        "title": "Apple",
        "weight": 220, "count": 2850, "color": "blue"
    }, {
        "title": "Blackberry",
        "weight": 200, "count": 2150, "color": "hotpink"
    }, {
        "title": "Gooseberry",
        "weight": 123, "count": 2650, "color": "black"
    }, {
        "title": "Grapes",
        "weight": 98, "count": 1670, "color": "orange"
    }],
    "valueAxes": [{
        "axisTitleOffset": 20,
        "minimum": 0,
        "axisAlpha": 0.15
    }, {
        "id": "v2",
        "axisTitleOffset": 20,
        "minimum": 0,
        "axisAlpha": 0,
        "inside": true
    }],
    "startDuration": 0.2,
    "graphs": [{
        "balloonText": "[[value]] Kg of [[title]] per year",
        "bullet": "round",
        "lineThickness": 2,
        "valueField": "weight"
    }, {
        "balloonText": "[[value]] piece of [[title]] per year",
        "bullet": "square",
        "lineThickness": 2,
        "valueField": "count",
        "valueAxis": "v2"
    }],
    "categoryField": "title",
    "listeners": [{
        "event": "rendered",
        "method": updateLabels
    }, {
        "event": "resized",
        "method": updateLabels
    }],
    "export": {
        "enabled": false
    }
});

function updateLabels(event) {
    try {
        var labels = event.chart.chartDiv.getElementsByClassName("amcharts-axis-title");
        for (var i = 0; i < labels.length; i++) {
            try {
                var color = event.chart.dataProvider[i - event.chart.dataProvider.length + 1].color;
                if (color !== undefined) {
                    labels[i].setAttribute("fill", color);
                }
            } catch (e) {}
        }
    } catch (e) {}

    var x = event.chart.chartDiv.getElementsByClassName("amcharts-graph-line");

    for (var i = 0; i < x.length; i++) {
        try {
            if (i % 2 != 0) {
                var _g = x[i];
                var _p = _g.getElementsByTagName("path");
                _p[0].setAttribute("stroke", "blue");
            }
        }
        catch (e) {}

        var _c = event.chart.chartDiv.getElementsByClassName("amcharts-graph-bullet");
        try {
            for (var c = _c.length / 2; c < _c.length; c++) {
                _c[c].setAttribute("fill", "blue");
            }
        }
        catch (e) {}
    }
}

HtmlCode:

<script src="//www.amcharts.com/lib/3/amcharts.js"></script>
<script src="//www.amcharts.com/lib/3/radar.js"></script>
<script src="//www.amcharts.com/lib/3/themes/light.js"></script>

<div id="chartdiv"></div>

<style type="text/css">
    #chartdiv {
        width: 100%;
        height: 500px;
    }
</style> 

And output would be like below image:







If you need you can download related resources from this link.

Friday, April 7, 2017

Git Bash Inside PhpStorm

It would be very helpful if we can use Git Bash inside PhpStorm itself.
The fact is, though, that it's a terminal client and that's how PhpStorm thinks of it. To implement it, you have to go to:

>> File -> Settings -> Tools -> Terminal

Once you're there, here are the steps necessary to enable Git Bash in the Terminal dialogue.
Now you can browse git.sh file from your git installation location.
That would be like below path:
C:\Program Files\Git\bin\sh.exe and it may differ in your machine

And then need to bound the path by double quotation like:
"C:\Program Files\Git\bin\sh.exe"

And add the following line after that "-login -i"

And the final output be like:
"C:\Program Files\Git\bin\sh.exe" -login -i

Your set-up is completed, now press Alt+F12 to see git window inside PhpStorm.

And your are done.

Friday, March 17, 2017

Copy text value to clipboard using jQuery

Its very important task for us to able to copy some value to clipboard using jQuery. Its now so much easy to make it without any hassle. Almost all browser support it. Its nothing but use some jQuery code to make it easier.

function copyTextToClipboard($value) {
    var $temp = $("<input>");
    $(document.body).append($temp);
    $temp.val($value).select();
    document.execCommand("copy");
    $temp.remove();
    alert("Text copied to your clipboard");
}

Pages