NetTalk Central

Author Topic: Creating custom "All" files  (Read 14232 times)

Bruce

  • Global Moderator
  • Hero Member
  • *****
  • Posts: 11176
    • View Profile
Creating custom "All" files
« on: May 19, 2009, 10:33:55 PM »
If you haven't already done so make sure you read the thread on editing your own styles.

http://www.nettalkcentral.com/index.php?option=com_smf&Itemid=36&topic=116.0

In this thread I'll assume you've created your own styles, or scripts. The goal of this thread is to show you how to make a custom all.js and all.css file to suit your particular app.

Background

NetTalk contains a bunch of client-side functionality which is written in JavaScript. These JS files are amalgamated together into All.Js (and All.Js.Gz) because "fewer files" is faster in the browser.

Many people however do not make use of all the possible client-side options. For example you may use the Chrome menu (Windows style menu) or the XP-Task Panel menu, but seldom both. Thus the shipping All.Js file is larger than it needs to be _for your site_.

In addition, if you add your custom.css files, and custom.js files to the WeBServer procedure, these are additional files that need to be fetched by the browser. Ideally this custom stuff should be included inside all.js and all.css.

Note

There's absolutely nothing wrong with using the files "out the box". There's also nothing wrong with adding extra styles, and script files. Your site will work perfectly. This topic discusses making this process slightly more efficient.

Editing shipping JS and CSS files is not recommended. Any edits you make will be overwritten with the next NetTalk build. However since the ALL files are constructed from the shipping JS and CSS files, all you need to do is remember to re-run your batch after each update of your web folder.

How it's done

1) Download Gzip.exe from the web (google for it) and put it into your application folder.

2) REMOVE any custom JS or CSS file names you've added to the WebServer procedure.

3) Create a batch file, I call mine GzipAll.Bat, in your application folder.
The Batch file I use looks like this;

type web\scripts\prototype.js   > web\scripts\all.js
type web\scripts\rico.js        >> web\scripts\all.js
type web\scripts\chrome.js      >> web\scripts\all.js
type web\scripts\netweb.js      >> web\scripts\all.js
type web\scripts\tabs.js        >> web\scripts\all.js
type web\scripts\tabsxp.js      >> web\scripts\all.js
type web\scripts\xptaskpanel.js >> web\scripts\all.js
type web\scripts\calendar2.js   >> web\scripts\all.js
type web\scripts\calendar6.js   >> web\scripts\all.js
type web\scripts\sorttable.js   >> web\scripts\all.js

gzip -9 -n -f -c web\scripts\prototype.js   > "web\scripts\prototype.js.gz"
gzip -9 -n -f -c web\scripts\rico.js        > "web\scripts\rico.js.gz"
gzip -9 -n -f -c web\scripts\chrome.js      > "web\scripts\chrome.js.gz"
gzip -9 -n -f -c web\scripts\netweb.js      > "web\scripts\netweb.js.gz"
gzip -9 -n -f -c web\scripts\tabs.js        > "web\scripts\tabs.js.gz"
gzip -9 -n -f -c web\scripts\tabsxp.js      > "web\scripts\tabsxp.js.gz"
gzip -9 -n -f -c web\scripts\xptaskpanel.js > "web\scripts\xptaskpanel.js.gz"
gzip -9 -n -f -c web\scripts\calendar2.js   > "web\scripts\calendar2.js.gz"
gzip -9 -n -f -c web\scripts\calendar6.js   > "web\scripts\calendar6.js.gz"
gzip -9 -n -f -c web\scripts\sorttable.js   > "web\scripts\sorttable.js.gz"
gzip -9 -n -f -c web\scripts\msie.js        > "web\scripts\msie.js.gz"
gzip -9 -n -f -c web\scripts\msie6.js       > "web\scripts\msie6.js.gz"
gzip -9 -n -f -c web\scripts\tiny_mce.js       > "web\scripts\tiny_mce.js.gz"
gzip -9 -n -f -c web\scripts\tiny_mce_popup.js > "web\scripts\tiny_mce_popup.js.gz"
gzip -9 -n -f -c web\scripts\all.js       > "web\scripts\all.js.gz"

type web\styles\accordion.css   >  web\styles\all.css
type web\styles\chromemenu.css  >> web\styles\all.css
type web\styles\netweb.css      >> web\styles\all.css
type web\styles\sorttable.css   >> web\styles\all.css
type web\styles\tabs.css        >> web\styles\all.css
type web\styles\xptabs.css      >> web\styles\all.css
type web\styles\xptaskpanel.css >> web\styles\all.css

gzip -9 -n -f -c web\styles\accordion.css   > "web\styles\accordion.css.gz"
gzip -9 -n -f -c web\styles\chromemenu.css  > "web\styles\chromemenu.css.gz"
gzip -9 -n -f -c web\styles\firefox.css     > "web\styles\firefox.css.gz"
gzip -9 -n -f -c web\styles\msie6.css       > "web\styles\msie6.css.gz"
gzip -9 -n -f -c web\styles\msie.css        > "web\styles\msie.css.gz"
gzip -9 -n -f -c web\styles\netweb.css      > "web\styles\netweb.css.gz"
gzip -9 -n -f -c web\styles\sorttable.css   > "web\styles\sorttable.css.gz"
gzip -9 -n -f -c web\styles\tabs.css        > "web\styles\tabs.css.gz"
gzip -9 -n -f -c web\styles\xptabs.css      > "web\styles\xptabs.css.gz"
gzip -9 -n -f -c web\styles\xptaskpanel.css > "web\styles\xptaskpanel.css.gz"
gzip -9 -n -f -c web\styles\all.css         > "web\styles\all.css.gz"
gzip -9 -n -f -c web\styles\error.css       > "web\styles\error.css.gz"

TIP : In a batch file > means "write as file", >> means "append to file".
TYPE lists the text inside the file, GZIP is the command to make the compressed file.

4) Edit the above batch file to add extra files, or remove files. Most of the names above are reasonably self explanatory. You MUST include the Prototype, Rico and NetWeb files. However the other JS and CSS files you use depends on your application.

Note

After a NetTalk update you are accustomed to refresh your app's web folder with the updated NetTalk web folder.
If you follow the above process you must also remember to re-run your Gzipall.Bat file. If you fail to do this your custom scripts, and styles will not be served since they won't be inside the shipping All.Css and All.Js files.