OPAC JS combation and compression enhancements
authorerickson <erickson@dcc99617-32d9-48b4-a31d-7c20da2025e4>
Thu, 2 Dec 2010 22:16:24 +0000 (22:16 +0000)
committererickson <erickson@dcc99617-32d9-48b4-a31d-7c20da2025e4>
Thu, 2 Dec 2010 22:16:24 +0000 (22:16 +0000)
Added ability to combine locale-independent common JS files
(opac/common/js/) into a single JS file to reduce http back/forth from
the browser.  In the default skin, this combines 10 scripts into 1.  The
scripts to combine are parsed from js_common.xml (enclosed by START/END
COMPRESSION comments).  The combined file is created by autogen.  Use of
the combined file is enabled via new Apache configuration (off by
default).  When a JS compressor is configured in autogen, the JS file
will be subsequently compressed.

Also includes better IDL2js loader for My Account, which loads
additional fieldmapper classes.

TODO:
Add ./configure param for setting a JS compressor at build time
Options for providing compressed versions of other JS files

git-svn-id: svn://svn.open-ils.org/ILS/trunk@18905 dcc99617-32d9-48b4-a31d-7c20da2025e4

Open-ILS/examples/apache/eg_vhost.conf
Open-ILS/src/extras/autogen.sh
Open-ILS/web/opac/skin/default/xml/common/js_common.xml

index 89ae416..033504f 100644 (file)
@@ -123,6 +123,10 @@ RewriteRule . - [E=locale:%1]
     # authentication tokens.  Left commented out for backwards compat for now.
     #SetEnv OILS_OPAC_FORCE_LOGIN_SSL 1
 
+
+    # If set, the skin uses the combined JS file at $SKINDIR/js/combined.js
+    #SetEnv OILS_OPAC_COMBINED_JS 1
+
 </LocationMatch>
 
 <Location /opac/>
index 7a81711..e35eedd 100755 (executable)
@@ -88,6 +88,10 @@ fi;
 JSDIR="LOCALSTATEDIR/web/opac/common/js/";
 FMDOJODIR="LOCALSTATEDIR/web/js/dojo/fieldmapper/";
 SLIMPACDIR="LOCALSTATEDIR/web/opac/extras/slimpac/";
+SKINDIR='LOCALSTATEDIR/web/opac/skin';
+
+COMPRESSOR="" # TODO: set via ./configure
+#COMPRESSOR="java -jar /opt/yuicompressor-2.4.2/build/yuicompressor-2.4.2.jar"
 
 echo "Updating Evergreen organization tree and IDL using '$CONFIG'"
 echo ""
@@ -123,7 +127,32 @@ then
        perl org_tree_proximity.pl "$CONFIG";
 fi
 
-echo "";
+echo "Creating combined JS..."
+cd $JSDIR;
+
+for skin in $(ls $SKINDIR); do
+
+    files=$(sed -n -e "/<\!--START COMPRESSION-->/,/<\!--END COMPRESSION-->/  s/.*\?\/\([^']*\.js\)'.*/\1/p" $SKINDIR/$skin/xml/common/js_common.xml);
+
+    if [ -n "$files" ]; then
+
+        # add the selected files to one combined file
+        COMPRESS_FILE="$SKINDIR/$skin/js/combined.js"
+        cat $files > $COMPRESS_FILE
+
+        # if a compressor is configured, compress and report the size savings
+        if [ -n "$COMPRESSOR" ]; then
+
+            echo -n "before: "; du -h $COMPRESS_FILE;
+
+            $COMPRESSOR $COMPRESS_FILE > $COMPRESS_FILE.t;
+            mv $COMPRESS_FILE.t $COMPRESS_FILE;
+
+            echo -n "after:  "; du -h $COMPRESS_FILE;
+        fi;
+    fi;
+done;
+
 echo "Done";
 
 )
index a2fe07b..fd7d5ad 100644 (file)
@@ -1,71 +1,76 @@
-
-    <!-- Initial list of classes cover home, results, and advanced search.  -->
-       <script language='javascript'  
-        src='/IDL2js?mvr,bre,aou,aout,pgt,lasso,cmf,cmc,cmsa,cam,cifm,clfm,citm,cblvl' 
-        type='text/javascript'></script>
-
-       <script language='javascript' src='<!--#echo var="OILS_JS_BASE"-->/utils.js' type='text/javascript'></script>
-       <script language='javascript' src='<!--#echo var="OILS_JS_BASE"-->/config.js' type='text/javascript'></script>
-       <script language='javascript' src='<!--#echo var="OILS_JS_BASE"-->/CGI.js' type='text/javascript'></script>
-       <script language='javascript' src='<!--#echo var="OILS_JS_BASE"-->/md5.js' type='text/javascript'></script>
-
-       <script language='javascript' src='<!--#echo var="OILS_JS_BASE"-->/slimtree.js' type='text/javascript'></script>
-
-       <script language='javascript' src='<!--#echo var="OILS_JS_BASE"-->/JSON_v1.js' type='text/javascript'></script>
-
-       <!-- Some global js -->
-       <script language='javascript' type='text/javascript'>
-
-               config.css.color_1 = "color_1";
-               config.css.color_2 = "color_2";
-               config.css.color_3 = "color_3";
-
-
-               <!-- set up some global JS config variables, read from the Apache config -->
-               var OILS_OPAC_IMAGES_HOST = null;
-               <!--#if expr="$OILS_OPAC_IMAGES_HOST"-->
-                       OILS_OPAC_IMAGES_HOST = '<!--#echo var="OILS_OPAC_IMAGES_HOST"-->extras/ac/jacket/';
-               <!--#endif -->
-               var OILS_OPAC_STATIC_PROTOCOL = null;
-               <!--#if expr="$OILS_OPAC_STATIC_PROTOCOL"-->
-                       OILS_OPAC_STATIC_PROTOCOL = '<!--#echo var="OILS_OPAC_STATIC_PROTOCOL"-->';
-               <!--#endif -->
-
-               <!-- builds the "Now searching: <org_unit>" text on the home page -->
-               function home_init() {
-                       getId("home_adv_search_link").setAttribute("href", buildOPACLink({page:ADVANCED})); 
-                       getId("home_myopac_link").setAttribute("href", buildOPACLink({page:MYOPAC}, false, true));
-               }
-
-               <!--#if expr="$OILS_OPAC_FORCE_LOGIN_SSL"-->
-                       forceLoginSSL = true;
-               <!--#endif -->
-       </script>
-
-       <!-- enable Dojo date picker -->
-       <script language='javascript' type="text/javascript">
-
-               var locale = location.href.replace( /.+opac\/([^\/]+)\/skin.+/, '$1' );
-               if (!locale) locale = '<!--#echo var="locale"-->';
-
-                var djConfig = {
-                        locale: locale.toLowerCase(),
-                        parseOnLoad: true,
-                        isDebug: false 
-                }, lang, bidi;
-
-       </script>
-
-       <script type="text/javascript" src='/js/dojo/dojo/dojo.js'></script>
-       <script type="text/javascript" src='/js/dojo/dojo/openils_dojo.js'></script>
-       <script type="text/javascript" src='/js/dojo/opensrf/opensrf.js'></script>
-       <script type="text/javascript" src='/js/dojo/fieldmapper/AutoIDL.js'></script>
-
-       <script language='javascript' src='<!--#echo var="OILS_JS_BASE"-->/opac_utils.js' type='text/javascript'></script>
-       <script language='javascript' src='<!--#echo var="OILS_JS_BASE"-->/<!--#echo var="locale"-->/OrgTree.js' type='text/javascript'></script>
-       <script language='javascript' src='<!--#echo var="OILS_JS_BASE"-->/<!--#echo var="locale"-->/FacetDefs.js' type='text/javascript'></script>
-       <script language='javascript' src='<!--#echo var="OILS_JS_BASE"-->/OrgLasso.js' type='text/javascript'></script>
-       <script language='javascript' src='<!--#echo var="OILS_JS_BASE"-->/org_utils.js' type='text/javascript'></script>
-       <script language='javascript' src='<!--#echo var="OILS_JS_BASE"-->/RemoteRequest.js' type='text/javascript'></script>
-       <script language='javascript' src='<!--#echo var="OILS_JS_BASE"-->/init.js' type='text/javascript'></script>
-       <script language='javascript' src='<!--#echo var="OILS_JS_BASE"-->/added_content.js' type='text/javascript'></script>
+<!--#if expr="$OILS_PAGE='myopac.xml'"-->
+<!-- my acccount uses a lot more classes -->
+<script language='javascript'  
+    src='/IDL2js?mvr,bre,aou,aout,pgt,lasso,cmf,cmc,cmsa,cam,cifm,clfm,citm,cblvl,ccs,accs,au,ahr,ahrn,acn,actscecm,cbreb,cbreb,cbrebi,acp,cust,ac,aua,mous,circ,mbts,mb,ausp,csp'
+    type='text/javascript'></script>
+<!--#else-->
+<script language='javascript'  
+    src='/IDL2js?mvr,bre,aou,aout,pgt,lasso,cmf,cmc,cmsa,cam,cifm,clfm,citm,cblvl,ccs'
+    type='text/javascript'></script>
+<!--#endif-->
+
+<script language='javascript' type="text/javascript">
+    var locale = location.href.replace( /.+opac\/([^\/]+)\/skin.+/, '$1' );
+    if (!locale) locale = '<!--#echo var="locale"-->';
+     var djConfig = {
+         locale: locale.toLowerCase(),
+         parseOnLoad: true,
+         isDebug: false
+     }, lang, bidi;
+</script>
+
+<script language='javascript' src='/js/dojo/dojo/dojo.js'></script>
+<script language='javascript' type='text/javascript' src='<!--#echo var="OILS_JS_BASE"-->/JSON_v1.js'></script>
+<script language='javascript' type="text/javascript" src='/js/dojo/opensrf/opensrf.js'></script>
+<script language='javascript' type="text/javascript" src='/js/dojo/dojo/openils_dojo.js'></script>
+<script language='javascript' type="text/javascript" src='/js/dojo/fieldmapper/AutoIDL.js'></script>
+
+<script language='javascript' type="text/javascript" src='<!--#echo var="OILS_JS_BASE"-->/<!--#echo var="locale"-->/OrgTree.js'></script>
+<script language='javascript' type="text/javascript" src='<!--#echo var="OILS_JS_BASE"-->/<!--#echo var="locale"-->/FacetDefs.js'></script>
+<script language='javascript' type="text/javascript" src='<!--#echo var="OILS_JS_BASE"-->/OrgLasso.js'></script>
+
+<!--#if expr="$OILS_OPAC_COMBINED_JS"-->
+<script language='javascript' type='text/javascript' src='<!--#echo var="OILS_OPAC_JS_HOST"-->/skin/default/js/combined.js'></script>
+<!--#else --> 
+<!-- 
+    When combined JS is enabled in the Apache config, the block 
+    below defines which files are added to the final combined JS file. 
+    Currently, only files in $OPAC/common/js/ are eligible for automatic combination.
+-->
+<!--START COMPRESSION-->
+<script language='javascript' type='text/javascript' src='<!--#echo var="OILS_JS_BASE"-->/utils.js'></script>
+<script language='javascript' type='text/javascript' src='<!--#echo var="OILS_JS_BASE"-->/config.js'></script>
+<script language='javascript' type='text/javascript' src='<!--#echo var="OILS_JS_BASE"-->/CGI.js'></script>
+<script language='javascript' type='text/javascript' src='<!--#echo var="OILS_JS_BASE"-->/md5.js'></script>
+<script language='javascript' type='text/javascript' src='<!--#echo var="OILS_JS_BASE"-->/slimtree.js'></script>
+<script language='javascript' type='text/javascript' src='<!--#echo var="OILS_JS_BASE"-->/opac_utils.js'></script>
+<script language='javascript' type='text/javascript' src='<!--#echo var="OILS_JS_BASE"-->/org_utils.js'></script>
+<script language='javascript' type='text/javascript' src='<!--#echo var="OILS_JS_BASE"-->/RemoteRequest.js'></script>
+<script language='javascript' type='text/javascript' src='<!--#echo var="OILS_JS_BASE"-->/init.js'></script>
+<script language='javascript' type='text/javascript' src='<!--#echo var="OILS_JS_BASE"-->/added_content.js'></script>
+<!--END COMPRESSION--> 
+<!--#endif -->
+
+<!-- Some global js -->
+<script language='javascript' type='text/javascript'>
+    config.css.color_1 = "color_1";
+    config.css.color_2 = "color_2";
+    config.css.color_3 = "color_3";
+    <!-- set up some global JS config variables, read from the Apache config -->
+    var OILS_OPAC_IMAGES_HOST = null;
+    <!--#if expr="$OILS_OPAC_IMAGES_HOST"-->
+        OILS_OPAC_IMAGES_HOST = '<!--#echo var="OILS_OPAC_IMAGES_HOST"-->extras/ac/jacket/';
+    <!--#endif -->
+    var OILS_OPAC_STATIC_PROTOCOL = null;
+    <!--#if expr="$OILS_OPAC_STATIC_PROTOCOL"-->
+        OILS_OPAC_STATIC_PROTOCOL = '<!--#echo var="OILS_OPAC_STATIC_PROTOCOL"-->';
+    <!--#endif -->
+    <!-- builds the "Now searching: <org_unit>" text on the home page -->
+    function home_init() {
+        getId("home_adv_search_link").setAttribute("href", buildOPACLink({page:ADVANCED})); 
+        getId("home_myopac_link").setAttribute("href", buildOPACLink({page:MYOPAC}, false, true));
+    }
+    <!--#if expr="$OILS_OPAC_FORCE_LOGIN_SSL"-->
+        forceLoginSSL = true;
+    <!--#endif -->
+</script>