How to put and include CSS and Javascript libraries in Zend Layout - javascript

I have a big project and many css/less/JQuery files. and i need to include some of them in the layout and other I have to call it in action.
What is the best way to put libraries in zend layout Plus i have to minify scripts ?
shall i create a class or library for that ?

In layout (phtml) you put css/js files that u need in all views (views which used this layout). In view files you include js which will be used only in this view.
In production code u should minify your css/js files.
If your project is big you can create in main js/css folder subfolders for each controller or even action.

I add files using view helper. First i add files when needed:
$this->headScript()
->prependFile($this->baseUrl() . '/js/jquery-1.7.2.min.js');
and:
$this->inlineScript()
->appendFile($this->baseUrl() . '/js/fancybox/jquery.easing-1.3.pack.js')
Then i add <?=$this->headScript()?> in header and <?= $this->inlineScript() ?> before closing body tag.
This will not connect or/and minify your CSS/JS, and i think there is no standard ZF classes which can help you.
If you need something more than you need some work. I haven't tried myself, but friend mentioned Minify is good and easy to implement .
You can also install Google Page Speed addon for your server and it has options to minify those files (here and here).
Last option is to use YUI Compressor as shell script, but i think it's too much work.

Related

Jquery UI file inclusion

I just downloaded the pack for jquery UI, and when I extract it I get these files:
My question is that what files should I include? There're a lot of files there I'm not sure which one I'll need to put into my folders for full functionality. I know for sure I need to include jquery-ui.js or jquery-ui.min.js but I also want the themes that come with it and use them on my webpage. SHould I include the css and files inside external and images too?
It looks like you just need the minified css and js files.
http://learn.jquery.com/jquery-ui/getting-started/

dynamic loading of JavaScript files in Karma

How can I include a set of JS files in my Karma Config that are dynamically loaded in my code?
I'm not sure how I can load those files dynamically. We are trying to avoid having to download them and maintain them separately.
Google hasn't helped much so some help would be great.
Create a js file that loads them and add this to the list of files in the karma conf somewhere near the top.
I think there are two ways to do this kind of thing:
Include the files in the files array, specifying a pattern and setting include to false.
Have a look to the RequireJS page on the Karma website for an
idea on how this works.
Use proxies. Have a look on the Karma configuration page.

Defer loading JavaScript in Symfony 1.4

I'm trying to optimize a Symfony 1.4 project and one thing that I would like to do is to defer JavaScript loading. I'm using the use_javascript() function to include files from inside templates.
Does use_javascript() have an options parameter (...or any documentation whatsoever?)
Alternatively, is there an alternative method for adding a tag to the collection for include_javascripts()?
Thanks for any help!
you use use_javascript('scriptname') to specify a javascript file to load - this doesn't add the JS file to the page it just allows symfony to build a list of files to include .. then to include the files you use include_javascripts() so to be "efficient" just place the include_javascripts() at the bottom of the page ...
As suggested here (jQuery example)-> http://www.symfony-project.org/jobeet/1_4/Doctrine/en/18
I am using append_to_slot('javascript') inside template. With require.js implemented
Once development is finished and I want to deploy code for end users, require.js optimizer can combine the JavaScript files together and minify it for me.
I end up with single .js file included to the page.

Way to link multiple javascript files without minifying or combing into one document?

Is there a way to link multiple javascript files without making them one file?
What I would like is to have one file (javascript or otherwise) which houses links to my other javascript files.
For example, the webpage has one file called allmyscirpts.js, and inside this file is a list of links to my actual individual, separataed javascript files.
Is this possible?
Tod
JS can't simply import more JS, but you could easily write a simple server-side script that concatenates your files together. If you can't/won't work on the server, scriptloader libraries are very plentiful out there these days. Check out require.js, lab.js, yepnope.js, etc. and see if one of them suits you well.
The only way I can think of is to load Javascript files through ajax. The YUI Loader you to not only load all your js files (and those from YUI) within javascript, but it also allows you to configure dependencies between your js files. So For instance, if widget1.js requires global.js, you can configure that dependency, then you can tell the loader to load "widget1" and the loader will also load global.js when it loads widget.js.
Unlike css, I do not believe there is built in syntax in javascript that automatically includes another javascript file. But there are javascript utilities out there that allow this.
For a simpler solution than the YUI Loader, check out the YUI get utility. For my projects I have setup the YUI loader, and as a result my HTML pages only have about 2 or 3 javascript files included, and the rest of what I need is loaded on demand by the Javacript controller for that page.

jquery ui css and image files are in a different folder, how to configure?

I am using the jquery ui, I downloaded the entire toolset.
I put the css and images into a folder like:
/images/jquery/base/
/images/jquery/ui-lightness/
How can I configure this so it works?
(if that's possible)
That is normal virtual pathing, meaning you'll have to reconfigure your .js and css files inside the plugins to look for the new path. IMO just use the default way, create an extra 'plugins' or 'extras' folder or something and avoid the trouble.

Categories

Resources