Start Page

index.cfrm

<!--- cfscript --->
<cfscript>
    
    VARIABLES.arr_stages = [
        {
            "name"   : "staging",
            "prefix" : "d5117" 
        },
        {
            "name"   : "local",
            "prefix" : "d51ts"
        }
    ];

    VARIABLES.arr_internal_tools = [
        {
            "title" : "Channel Guide",
            "url"   : "squirrel.comcar.co.uk/channels/guide/"
        },
        {
            "title" : "Error Log",
            "url"   : "squirrel.comcar.co.uk/devtools/errorlog/"
        },
        {
            "title" : "Remake Javascript",
            "url"   : "squirrel.comcar.co.uk/afteranupload/remake/"
        },
        {
            "title" : "Points",
            "url"   : "squirrel.comcar.co.uk/devtools/points/"
        },
        {
            "title" : "Rates Panel",
            "url"   : "ratespanel.co.uk"
        },
        {
            "title" : "Vehicle Lookup",
            "url"   : "obsidian.carmendata.co.uk/lookup/vehicleIdLookup/"
        },
        {
            "title" : "Xenon Browser",
            "url"   : "obsidian.carmendata.co.uk/xenon/browser/"
        }

    ];


    VARIABLES.arr_client_sites = [
        {
            "title" : "Ford Quote",
            "url"   : "ford-quote.uk"
        },
        {
            "title" : "Perrys Ford",
            "url"   : "perrys-cars.ford-deal.uk"
        },
        {
            "title" : "Vauxhall Quote",
            "url"   : "vauxhallquote.uk"
        },
        {
            "title" : "Tempest",
            "url"   : "htempest.cbvcvehiclemanagement.co.uk"
        }
    ];

    VARAIBLES.arr_web_links = [
    {
        "title" : "Github",
        "url"   : "https://github.com/carmendata",
        "img"   : "github.png"
    },
    {
        "title" : "Trello",
        "url"   : "https://trello.com/b/dh0NysmB/seed",
        "img"   : "trello.png"
    },
    {
        "title" : "Stack Overflow",
        "url"   : "https://stackoverflow.com/users/4293734/sauntimo",
        "img"   : "so.png"
    },
    {
        "title" : "CF Docs",
        "url"   : "https://cfdocs.org/",
        "img"   : "coldfusion.png"
    }
];


    /**
        I build links to useful websites
    */  

    private string function buildWebLinks(){

        var str_html = '<div class="web_links link_container">';

        for( var skv_link in VARAIBLES.arr_web_links ){
            str_html &= '<a class="link_wrapper" href="' & skv_link.url & '">' 
                & '<img class="link_content" '
                & 'src="/assets/' & skv_link.img & '" '
                & 'title="' & skv_link.title & '">'
                & '</a>';
        }

        return str_html & '</div>';

    }


    /**
        I build links to arrays of stuff
    */  

    private string function buildLinks(
        required array arr_links,
        required string str_title,
        required string str_classes,
        boolean incl_stages = false
    ){

        var str_classlist = ARGUMENTS.str_classes & ' ' & ( ARGUMENTS.incl_stages ? '' : 'non_' ) & 'staged_links';

        var str_html = '<fieldset class="' & str_classlist & ' link_container">'
            & '<legend><h2>' & ARGUMENTS.str_title & '</h2></legend>';

        for( var skv_link in arr_links ){
            // var str_title = replace( str_link, '_', ' ', 'all' );
            str_html &= '<div class="link_wrapper">'
                & '<a class="link live_link" href="http://' & skv_link.url & '">' 
                & '<span class="link_content">'
                & skv_link.title
                & '</span>'
                & '</a>';
                

            if( ARGUMENTS.incl_stages ){
                str_html &= '<div class="stages">';
                for( var skv_stage in VARIABLES.arr_stages  ){
                        str_html &= '<a class="link ' & skv_stage.name  & '_link" '
                        & 'href="http://' & skv_stage.prefix & '.' & skv_link.url & '">'
                        & '<span class="link_content">' & skv_stage.name & '</span>'
                        & '</a>';
                }
                str_html &= '</div>';
            }

            str_html &= '</div>';
        }

        return str_html & '</fieldset>';

    }


    /**
        I get links to local experiments
    */  

    private array function getExperiments(){
        var arr_links = directoryList( expandPath( './' ), false, "name", "", "Name ASC", "dir" );
        for( var folder in ['core','page','archive'] ){
            arr_links.delete( folder );
        }

        var arr_links_rtn = [];

        for( str_link in arr_links ){
            arr_links_rtn.append({
                "title" : replace( str_link, '_', ' ', 'all' ),
                "url"   : '/' & str_link
            });
        } 

        return arr_links_rtn;
    }


</cfscript>

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Tim's Start Page</title>

<!--- style --->

    <style>

        *{
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        body{
            font-family: helvetica, arial, sans-serif;
            padding: 20px;
        }
    
        h1 {
            font-size: 50px;
        }

        .container {
            width: 1360px;
            margin: 0 auto;
        }

		.title {
			padding: 10px;
		}

        fieldset legend {
            margin-left: 20px;
            padding: 5px;
        }

        fieldset {
            padding-bottom: 10px;
            margin-bottom: 20px;
            border-radius: 4px;
        }

		.link_wrapper {
			display: inline-block;
			margin: 10px;
            width: 250px;
            text-align: center;
        }

        .link_wrapper .link {
            display: inline-block;
            padding: 10px;
            background-color:  #337ab7;
            color: white;
            text-decoration: none;
        }

        .link_wrapper .link:hover {
            text-decoration: none;
            background-color: #4f93ce;
        }

        .link_wrapper .live_link {
            width: 230px;
            border-top-left-radius: 4px;
            border-top-right-radius: 4px;
            font-weight: bold;
            font-size: 18px;
        }

        .non_staged_links .link_wrapper .live_link {
            border-radius: 4px;
        }

        .staged_links .link_wrapper .staging_link {
            width: 115px;
            border-bottom-left-radius: 4px;
            border-top: 1px solid white;
        }

        .staged_links .link_wrapper .local_link {
            width: 115px;
            border-bottom-right-radius: 4px;
            border-top: 1px solid white;
            border-left: 1px solid white;
        }


        
        .web_links .link_content{
            height: 150px;
            width: 150px;
            padding: 10px;
            margin: 10px;
        }

        .web_links .link_content:hover {
            border-radius: 10px;
            box-shadow: 0 0 1em #4f93ce;
        }

    </style>

</head>
<body>

<!--- Markup --->
<cfoutput>
    <div class="container">

        <h1 class="title">Tim's Start Page</h1>

        <h2 class="title">Web Links</h2>
        #buildWebLinks()#

        #buildLinks(
            arr_links = VARIABLES.arr_internal_tools,
            str_title = "Internal Tools",
            str_classes = "internal_tools",
            incl_stages = true
        )#

        #buildLinks(
            arr_links = VARIABLES.arr_client_sites,
            str_title = "Client Sites",
            str_classes = "client_sites",
            incl_stages = true
        )#

        #buildLinks( 
            arr_links = getExperiments(),
            str_title = "Experiment Links",
            str_classes = "experiment_links",
            incl_stages = false )#

    </div>
</cfoutput>

    <!--- Javascript --->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

    <script type="text/javascript">

        $(document).ready(function($) {
        

        });

    </script>
</body>
</html>