Daniel@0: /* Part of DML (Digital Music Laboratory)
Daniel@0: 	Copyright 2014-2015 Samer Abdallah, University of London
Daniel@0: 	 
Daniel@0: 	This program is free software; you can redistribute it and/or
Daniel@0: 	modify it under the terms of the GNU General Public License
Daniel@0: 	as published by the Free Software Foundation; either version 2
Daniel@0: 	of the License, or (at your option) any later version.
Daniel@0: 
Daniel@0: 	This program is distributed in the hope that it will be useful,
Daniel@0: 	but WITHOUT ANY WARRANTY; without even the implied warranty of
Daniel@0: 	MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
Daniel@0: 	GNU General Public License for more details.
Daniel@0: 
Daniel@0: 	You should have received a copy of the GNU General Public
Daniel@0: 	License along with this library; if not, write to the Free Software
Daniel@0: 	Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301  USA
Daniel@0: */
Daniel@0: 
Daniel@0: :- module(pure, []).
Daniel@0: 
Daniel@0: /** <module> Enables use of Pure CSS framework
Daniel@0: */
Daniel@0: 
Daniel@0: %  http://yui.github.io/skinbuilder/?mode=pureindex.html?opt=swi,457387,ffffff,1,1,20,1.5&h=0,-30,60&n=0,-30,75&l=0,-30,80&b=0,-30,90&mode=pure")
Daniel@0: %
Daniel@0: :- use_module(library(http/http_path)).
Daniel@0: :- use_module(library(http/html_write)).
Daniel@0: :- use_module(library(http/html_head)).
Daniel@0: :- use_module(library(http/js_write)).
Daniel@0: :- use_module(library(htmlutils)).
Daniel@0: 
Daniel@0: :- set_prolog_flag(double_quotes,string).
Daniel@0: 
Daniel@0: /*
Daniel@0:    YUI3 over HTTPS is just not going to work.
Daniel@0:    Google provide YUI2, but not YUI3.
Daniel@0:    
Daniel@0: */
Daniel@0: http:location(yuix,"http://yui.yahooapis.com",[]).
Daniel@0: http:location(pure,yuix('pure/0.5.0'),[]).
Daniel@0: http:location(purecss,"//purecss.io/combo/1.16.5?",[]).
Daniel@0: 
Daniel@0: :- html_resource(purecss("css/layouts/side-menu.css"), [requires(pure("pure.min.css"))]).
Daniel@0: :- html_resource(css("pure/pure-skin.css"), [requires(pure("pure-min.css"))]).
Daniel@0: 
Daniel@0: user:head(pure(_,_),Head) --> !,
Daniel@0:    html(head([ \style("//yui.yahooapis.com/pure/0.5.0/pure-min.css")
Daniel@0:              , \style("//yui.yahooapis.com/pure/0.5.0/grids-responsive-min.css")
Daniel@0:              , \style("/css/pure/pure-skin.css")
Daniel@0:              , meta([name(viewport), content("width-device-width,initial-scale=1")]) 
Daniel@0:              | Head ])).
Daniel@0: 
Daniel@0: activate_dropdowns(DivId,ULId) -->
Daniel@0:    {http_absolute_location(yuix('combo?'),ComboBase,[])},
Daniel@0:    html_requires(yuix('3.17.2/build/yui/yui-min.js')),
Daniel@0:    js_script({|javascript(ComboBase,DivId,ULId)||
Daniel@0:       YUI({ classNamePrefix: 'pure', combine: true, comboBase: ComboBase 
Daniel@0:           }).use('gallery-sm-menu', function (Y) {
Daniel@0:         var horizontalMenu = new Y.Menu({
Daniel@0:            container         : "#"+DivId,
Daniel@0:            sourceNode        : "#"+ULId,
Daniel@0:            orientation       : 'horizontal',
Daniel@0:            hideOnOutsideClick: false,
Daniel@0:            hideOnClick       : false,
Daniel@0:            showdelay         : 125,
Daniel@0:         });
Daniel@0:         horizontalMenu.render();
Daniel@0:         horizontalMenu.show();
Daniel@0:       });|}
Daniel@0:       ).
Daniel@0: 
Daniel@0: user:body(pure(1,Nav),Body) --> !,
Daniel@0:    { setting(htmlutils:appname, AppName) },
Daniel@0: 	html(body([ div([id("layout"),class("pure-g")]
Daniel@0:              , [ div(class("pure-u-1-4"), \vmenu(AppName,Nav))
Daniel@0:                , div(class("content pure-u-3-4"), [
Daniel@0:                    div(class(content),Body)
Daniel@0:                  , div(class(footer),\hmenu(AppName,Nav))
Daniel@0:                  ])
Daniel@0:                ])
Daniel@0:              ])).
Daniel@0: 
Daniel@0: user:body(pure(2,Nav),Body) --> !,
Daniel@0:    { setting(htmlutils:appname, AppName) },
Daniel@0: 
Daniel@0:    use_font("Source Sans Pro",sourcepro),
Daniel@0:    % use_font("Open Sans",opensans),
Daniel@0:    % use_font("Quattrocento Sans",quattrocento),
Daniel@0:    % html_requires(purecss("css/main-grid.css&/css/main.css&/css/menus.css&/css/rainbow/baby-blue.css")),
Daniel@0:    html_requires(purecss("css/layouts/side-menu.css")),
Daniel@0: 	html(body(div(id(layout), 
Daniel@0:              [ a([href="#menu", id="menuLink", class="menu-link"],span([]))
Daniel@0:              , div(id(menu),\vmenu(AppName,Nav))
Daniel@0:              , div(id(main),
Daniel@0:                [ div(class(header), h1("Header"))
Daniel@0:                , div(class(content), [div(Body),div(class=footer,\hmenu(AppName,Nav))])
Daniel@0:                ])
Daniel@0:              , \script(purecss("js/ui.js"))
Daniel@0:              ]))).
Daniel@0: 
Daniel@0: button_link(Ref,Content) --> 
Daniel@0:    html(a([class(['pure-button','pure-button-primary']),href(Ref)],Content)).
Daniel@0: 
Daniel@0: menu(Classes,Content) --> 
Daniel@0:    html(div(class(['pure-menu', 'pure-menu-open'|Classes]), Content)).
Daniel@0: % Add pure-menu-selected to active item
Daniel@0: hmenu(Heading,Items) --> 
Daniel@0:    menu(['pure-menu-horizontal'], [a([href='.',class="pure-menu-heading"],Heading), \Items]).
Daniel@0: 
Daniel@0: vmenu(Heading,Items) --> 
Daniel@0:    menu([], [a([href='.',class="pure-menu-heading"],Heading), \Items]).
Daniel@0: 
Daniel@0: hmenu_with_dropdowns(Items) --> 
Daniel@0:    % html_requires("//yui.yahooapis.com/3.17.2/build/yui/yui-min.js"),
Daniel@0:    html_requires(css("pure/pure-skin.css")),
Daniel@0:    {gensym(div,DivID), gensym(ul,ULID)},
Daniel@0:    html(div(id=DivID,ul(id=ULID,\Items))),
Daniel@0:    activate_dropdowns(DivID,ULID).