NAME

A1z::HTML5::Template - Fast and easy Web Apps

VERSION

version 0.22

SYNOPSIS

    use A1z::HTML5::Template;
    my $h = A1z::HTML5::Template->new();

    This directory should be writable by the web server, required to create/hold page content files.
        This may also contain your custom JavaScript/CSS libraries.
        Works for both Windows and Linux
        
                use lib '/home/user/path/to/app';
                or
                use lib 'C:/Inetpub/wwwroot/path/to/app';

        # for features like 'say'
        use 5.10.0;

        my $h = A1z::HTML5::Template->new(); 

        Fast, Easy, and Simple: Just Two Lines!
        
                say $h->head( -title => "My Brand Name" );
                say $h->body( -content => qq{ Coming Soon });

        For More Control/Customization: Not for the lazy!
        
        say $h->header('utf8');  
        say $h->start_html(); 
        say $h->head_title("My New App"); 
        say $h->head_meta(); 

        Load basic/required JavaScript/CSS libraries
        say $h->head_js_css(); 

        Add your own custom JavaScript/CSS files
        say $h->head_js_css('/url/to/app/Template.css'); 

        say $h->end_head(); 
        say $h->begin_body();

        say qq{<h1>My New App/Website</h1>};

        say qq{<main class="container">}; 

                # output file content as menu
                say $h->body_accordion( $h->open_file("/home/user/path/to/app/open_file_example.txt", 'menu', 'Menu') ); 

                # as a HTML5 table 
                say $h->body_accordion( $h->open_file("$sys{cgibase}/open_file_example.txt", 'table', 'Table Header') );
                
                # Simple mathematics 
                say $h->body_article( header => "Simple Mathematics", content => $h->math1("2", "4") );

                # Times Table  
                say $h->body_article( header => "Times Table", content => $h->timestable("2") );

        say qq{</main>};

        Required/Default JavaScript libraries.
                say $h->body_js_css(); 
        
        Add your own JavaScript libraries:
                say $h->body_js_css("complete-url_or_path-to-js-css-libraries") 

        say $h->end_body();
        say $h->end_html();

NAME

        Fast and Easy Web Apps

        "A1z::HTML5::Template" provides customizable HTML5 tags for creating "Fast and Easy Web Apps."

VERSION

        0.22

Installation

        cpan install A1z::HTML5::Template 
        or
        cpanm A1z::HTML5::Template

METHODS

        header start_html head_title head_meta head_js_css end_head begin_body body_js_css body_topnavbar body_accordion end_body end_html

new

   use A1z::HTML5::Template;
   my $h = A1z::HTML5::Template->new();

math1

        $h->math1(num1, num2);
        
        $h->body_article( header => "Math", content => $h->math1(num1, num2) );

timestable

        $h->timestable("Number");

        Provides HTML Content-Header 
        
        $h->header("");

start_html

        Provides doctype html
        
        Default includes utf-8

                $h->start_html();
        
        Or, add your own charset to your app:

                $h->start_html('DifferentCharset');

body_js_css

        Add/include javascript and css files just above </body> section 
        
        Typically, CSS files should/are not be used here. 
        
        Default behavior: 
        
                $h->body_js_css();
                
                Includes 
                        jquery 1.12.4, jquery ui 1.11.4, bootstrap 3.3.0, 
                        javascript for #dialog function, #menu, #accordion, #tabs 
        
        Add your own .js file: 
                
                use $h->body_js_css("/path/to/js/file.js");
                
        You can use both to include default .js files and your own custom .js file.

end_html

        Provides </html>

head_title

        Provides <title></title>
        
        $h->head_title("App/Page Title");

head_meta

        Provides <meta ... >. Includes the following by default:
                IE=Edge
                HandheldFriendly
                viewport
        
        $h->head_meta();
        
        Just like body_js_css, you can use both to add default values and your own meta

body_topnavbar

        Provides top nav bar optionally.
        
        By default it is loaded from www.a1z.us which probably be removed in a future version.
        So, get a copy from bootstrap 3 and store it on your server.

head_js_css

        provides the ability to add/include .js/.css files in the </head> tag.
        
        $h->head_js_css();
        
                Default includes the following:
                
                        bootstrap 3.3.0 .css from maxcdn 
                        navbar-fixed-top.css from www.a1z.us
                        jquery 1.12.1 smoothness theme from code.jquery.com 
                        Shim and Respond.js from maxcdn 
        
        $h->head_js_css("/path/to/.js")
        $h->head_js_css("/path/to/.css")

end_head

        Provides </head>
        
        $h->end_head();

begin_body

        provides <body> tag.
        
        $h->begin_body();

body_accordion

        The accordion in 'body_accordion' is misleading. It is not limited to just an accordion but all kinds of content.

        C<say $h->body_accordion( $h->open_file("/path/to/app/open_file_example.txt", 'Type', 'Heading') );>

        C<say $h->body_accordion( $h->open_file("/path/to/app/open_file_example.txt", "table", "Name and Price");

        C<say $h->body_accordion( $h->open_file("/path/to/app/open_file_example.txt", "tabs", "Space Saving Tabs");

body_article

        provides the ability to add content into <main> tags. 
        
        $h->body_article( header => "", content => "");

end_body

        provides </body> tag.
        
        $h->end_body();

body_form

        Form, lists items from a directory in a neat drop-down list with each item's file size in KB!

        Should be in the exact format like below: 
        
        $h->body_form("vars;METHOD;Action.cgi;select,NameForSelectTag,DefaultOptionSelected,AbsPathToDir,TextForSelectLabel;hidN1---hidV1,hidN2---hidV2,hidN3---hidV3");

defaults_begin

        Internal Use Only

        Provides defaults for very lightweight template for those in a hurry; Can be used for apps/sites that are under construction! 
        
        $h->defaults_begin();

defaults_end

        Internal Use Only.

        provides defaults for lightweight or under construction app/website. 
        
        $h->defaults_end();

HTML Hash

        For Internal/Future Use

        Hash contains -defaultjquery which is used in body.

        -defaultjquery includes 
                
                jquery                1.12.4       from code.jquery
                jquery ui             1.11.4       
                bootstrap             3.3.0        from maxcdn
                blueimp-gallery
                ie-10 workaround                   from a1z.us
                
                functions
                
                        tabs, dialog, menu, accordion

html_bootstrap_css

        For Internal/Future Use

        Used in $h->head and $h->body internally.

        All methods starting with 'html_' are used internally!

        Include bootstrap.min.css, #3.3.0 from maxcdn and navbar-fixed-top.css from a1z.us
                
                $h->html_bootstrap_css()

html_jqueryui_css

        For Internal/Future Use

        Includes jquery ui theme jquery-ui.css #1.12.0

html_shim_respond

        For Internal/Future Use

        html5shiv.min.js   #3.7.2
        respond.min.js     #1.4.2

html_navbar

        For Internal/Future Use

        Customizations for top-nav-bar.js from a1z.us

        $h->html_navbar(
                -nbMenuName => "menuName", 
                -nbPageName => "pageName", 
                -nbServer => "serverName", 
                -nbLinks => "dropDownLinks: URLs separated by a dash, mostly relative URLs. E.g., blog-support-help-contact-sale"
        );

html_bootstrap_js

        For Internal/Future Use

        bootstrap.min.js, #3.3.0, from maxcdn

html_setTitle

        For Internal/Future Use

        setTitle javascript function 

        Used in body

        Includes the C<script> tag pair

        C<$h->html_set_title( ta => "Text001", tb => "TExt002", tc => "TeXt003" );>

html_humanejs_css

        For Internal/Future Use

        humane-js #3.2.2 cdnjs.cloudflare
        fonts.googleapis.com

html_bootstrap_bluimp

        For Internal/Future Use

        bootstrap gallery lightbox controls for use immediately after C<body> tag

        C<&html_bootstrap_bluimp;>

        Used internally in C<$h->body()>

head

        $h->head();

        $h-head (
                -type   => "Content-Type: text/html;charset=utf-8\n\n", 
                -bootstrap      => html_bootstrap_css, 
                -jqueryui       => html_jqueryui_css, 
                -htmlshim       => html_shim_respond, 
                -humanejs  => html_humanejs_css, 
                -title          => "$ENV{SERVER_NAME}", 
                -cssLinks => "https://code.jquery.com/ui/1.11.4/themes/ui-lightness/jquery-ui.css,https://blueimp.github.io/Gallery/css/blueimp-gallery.min.css,https://www.a1z.us/A1z/HTML5/Template.css", 
                -cssCode => "", 
                -mobilemeta => qq{<meta name="HandheldFriendly" content="true">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
}, 
                -charsetmeta => qq{<meta charset="utf-8">}, 
                -usermeta => "",
                -titleRotatingText => qq{text1,text2,text3}     
        );

body

        $h->body();

        $h->body(
                -h1     => qq{$ENV{SERVER_NAME}},
                -onload => qq{setTitle();},  
                -nbhead => qq{},
                -nbpage => qq{}, 
                -nbmenu => qq{More}, 
                -defaultjquery => qq{$HTML{-defaultjquery}}, 
                -humanejs => qq{<script src="https://cdnjs.cloudflare.com/ajax/libs/humane-js/3.2.2/humane.min.js">},
                -userjquery => qq{}, 
                -navbar => html_navbar( $in{-nbmenu}, $in{-nbpage}, "", ""), 
                -content => qq{<div class="content">Content</div>}, 
                -footer => qq{All rights reserved &copy; $ENV{SERVER_NAME}},    
                -bootstrapbluimp => html_bootstrap_bluimp,
                -nbLinks => qq{contact-help-feedback}           
        );

open_file

        Used for loading all kinds of custom elements for different output formats stored in simple text files.

        $h->open_file("/path/to/file", "outputFormat", "outputHeader");

        $h->open_file("C:/Inetpub/wwwroot/MyApp/menu.txt", "menu", "Menu");

        This is the heart of the App.

OUTPUT FORMAT OPTIONS:

        table, accordion, menu, as is; where "as is" is the default

        $h->open_file( file => "abs/path/to/file", output_format => "table", output_header => "Heading" );

edit_file

        Edit your app/page/site. Customize HTML produced by A1z::HTML5::Template. 

        Creates a form to edit contents of a file. 

        The contents of this file should be in a special format. See open_file_example.txt. 

        Data is stored in simple text files in the app's home dir.  

        We recommend creating a separate file for editing/writing purposes, e.g., "TemplateAdmin.cgi"

        use lib '/path/to/app';

        use A1z::HTML5::Template;
        my $h = A1z::HTML5::Template->new();

        say $h->header('utf8');
        say $h->start_html(); 
        say $h->head_title("Edit App"); 
        say $h->head_meta();
        say $h->head_js_css();  
        say $h->end_head(); 
        say $h->begin_body();

        # Show edit form

        say $h->body_article( 

                header => "Edit page items", 

                action => "TemplateAdmin.cgi",

                content => $h->edit_file( file => "/absolute/path/to/app/open_file_example.txt") 
        );

        # Save Customizations back to the same file.

        # include write_file if you submit form to the same file ( TemplateAdmin.cgi )

        say $h->body_article( 

                header => "<a href='$sys{cgiurl}/TemplateAdmin.cgi' title='Refresh to get the latest/saved content'>Refresh</a> ", 

                content => $h->write_file( file => "/absolute/path/to/app/open_file_example.txt")
         
        );

        say $h->body_js_css(); 
        say $h->end_body();
        say $h->end_html();

write_file

        See documentation for 'edit_file.'

display_gallery_thumbnails

        my $images = $h->display_gallery_thumbnails(

                images_dir => "{images_dir}",
                thumbs_dir => "{thumbs_dir}",
                
                images_url => "{images_url}",
                thumbs_url => "{thumbs_url}",

                width => "100",
                height => "100"
        );

BUGS

Please report any bugs or feature requests to bug-a1z-html5-template at rt.cpan.org, or through the web interface at https://rt.cpan.org/NoAuth/ReportBug.html?Queue=A1z-HTML5-Template. I will be notified, and then you'll automatically be notified of progress on your bug as I make changes.

SUPPORT

You can find documentation for this module with the perldoc command.

    perldoc A1z::HTML5::Template

You can also look for information at:

RT: CPAN's request tracker (report bugs here)

https://rt.cpan.org/NoAuth/Bugs.html?Dist=A1z-HTML5-Template
AnnoCPAN: Annotated CPAN documentation

http://annocpan.org/dist/A1z-HTML5-Template
CPAN Ratings

https://cpanratings.perl.org/d/A1z-HTML5-Template
Search CPAN

https://metacpan.org/release/A1z-HTML5-Template

ACKNOWLEDGEMENTS

        I am greatly indebted to my family for letting me be 'addicted' and 'married' to my computers.

LICENSE AND COPYRIGHT

This program is free software; you can redistribute it and/or modify it under the terms of the the Artistic License (2.0). You may obtain a copy of the full license at:

http://www.perlfoundation.org/artistic_license_2_0

Any use, modification, and distribution of the Standard or Modified Versions is governed by this Artistic License. By using, modifying or distributing the Package, you accept this license. Do not use, modify, or distribute the Package, if you do not accept this license.

If your Modified Version has been derived from a Modified Version made by someone other than you, you are nevertheless required to ensure that your Modified Version complies with the requirements of this license.

This license does not grant you the right to use any trademark, service mark, tradename, or logo of the Copyright Holder.

This license includes the non-exclusive, worldwide, free-of-charge patent license to make, have made, use, offer to sell, sell, import and otherwise transfer the Package with respect to any patent claims licensable by the Copyright Holder that are necessarily infringed by the Package. If you institute patent litigation (including a cross-claim or counterclaim) against any party alleging that the Package constitutes direct or contributory patent infringement, then this Artistic License to you shall terminate on the date that such litigation is filed.

Disclaimer of Warranty: THE PACKAGE IS PROVIDED BY THE COPYRIGHT HOLDER AND CONTRIBUTORS "AS IS' AND WITHOUT ANY EXPRESS OR IMPLIED WARRANTIES. THE IMPLIED WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE, OR NON-INFRINGEMENT ARE DISCLAIMED TO THE EXTENT PERMITTED BY YOUR LOCAL LAW. UNLESS REQUIRED BY LAW, NO COPYRIGHT HOLDER OR CONTRIBUTOR WILL BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL DAMAGES ARISING IN ANY WAY OUT OF THE USE OF THE PACKAGE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.

AUTHOR

Sudheer Murthy <pause@a1z.us>

COPYRIGHT AND LICENSE

This is free software; you can redistribute it and/or modify it under the same terms as the Perl 5 programming language system itself.

To install A1z::HTML5::Template, copy and paste the appropriate command in to your terminal.

cpanm

cpanm A1z::HTML5::Template

CPAN shell

perl -MCPAN -e shell
install A1z::HTML5::Template

For more information on module installation, please visit the detailed CPAN module installation guide.

	Global
`s`	Focus search bar
`?`	Bring up this help dialog

	GitHub
`g` `p`	Go to pull requests
`g` `i`	go to github issues (only if github is preferred repository)

	POD
`g` `a`	Go to author
`g` `c`	Go to changes
`g` `i`	Go to issues
`g` `d`	Go to dist
`g` `r`	Go to repository/SCM
`g` `s`	Go to source
`g` `b`	Go to file browse

	Search terms
module: (e.g. module:Plugin)
distribution: (e.g. distribution:Dancer auth)
author: (e.g. author:SONGMU Redis)
version: (e.g. version:1.00)

NAME

VERSION

SYNOPSIS

NAME

VERSION

Installation

METHODS

new

math1

timestable

header

start_html

body_js_css

end_html

head_title

head_meta

body_topnavbar

head_js_css

end_head

begin_body

body_accordion

body_article

end_body

body_form

defaults_begin

defaults_end

HTML Hash

html_bootstrap_css

html_jqueryui_css

html_shim_respond

html_navbar

html_bootstrap_js

html_setTitle

html_humanejs_css

html_bootstrap_bluimp

head

body

open_file

OUTPUT FORMAT OPTIONS:

edit_file

write_file

display_gallery_thumbnails

BUGS

SUPPORT

ACKNOWLEDGEMENTS

LICENSE AND COPYRIGHT

AUTHOR

COPYRIGHT AND LICENSE

Module Install Instructions