Files
dss-mobile/.sencha/app/sass-impl.xml
Fergal Moran 8ac083a923 Initial Commit
2013-11-11 12:24:25 +00:00

222 lines
8.1 KiB
XML

<project name="sass-impl">
<!--
Uses the compiler to generate the top-level scss file for the app
by using the current set of js files to determine the Components
used by the app, then including the corresponding scss files into the
app's style
-->
<target name="-compile-sass" depends="-init-compiler">
<x-normalize-path
path="${build.dir}/resources"
property="image.search.path"/>
<x-compile refid="${compiler.ref.id}">
<![CDATA[
restore
page
and
#only set variables for used classes eg. $include-class-name
sass
+class-name-vars
-variable=$image-search-path:'${image.search.path}'
-variable=$theme-name: '${app.theme}' !default
-output=${app.out.scss}
and
include
-all
and
# include etc and vars from all classes
sass
+etc
+vars
+append
-output=${app.out.scss}
and
restore
page
and
#only include rules from used classes
sass
+rules
+append
-output=${app.out.scss}
and
sass
+ruby
-output=${app.out.ruby}
]]>
</x-compile>
<!--
app.out.css.path is relative to the app output index.html file
-->
<x-get-relative-path
from="${app.dir}"
to="${app.out.css}"
property="app.out.css.path"
/>
<!--update the application's bootstrap.css file to point to the build output-->
<echo file="${app.bootstrap.css}">
<![CDATA[
/*
* This file is generated by Sencha Cmd and should NOT be edited. It redirects
* to the most recently built CSS file for the application to allow index.html
* in the development directory to load properly (i.e., "dev mode").
*/
@import '${app.out.css.path}';
]]>
</echo>
</target>
<!--
This macrodef is used for post-processing Ext JS 4.2+ style theme css files
and will split based on selector thresholds, as well as run the css preprocessor
and compressor
-->
<macrodef name="x-compress-css-files">
<attribute name="dir"/>
<attribute name="prefix"/>
<attribute name="outprefix"/>
<attribute name="compress"/>
<attribute name="preprocess"/>
<sequential>
<x-split-css file="@{dir}/@{prefix}.css"
outdir="${build.resources.dir}"
limit="${build.css.selector.limit}"/>
<for param="cssfile">
<fileset dir="@{dir}" includes="@{prefix}*.css"/>
<sequential>
<local name="css.output.name"/>
<local name="pattern"/>
<property name="pattern" value="(.*?)(@{prefix})(_\d{1,2})*\.css"/>
<propertyregex property="css.output.name"
input="@{cssfile}"
regexp="${pattern}"
select="\1@{outprefix}\3.css"
override="true"/>
<if>
<equals arg1="@{preprocess}" arg2="true"/>
<then>
<echo>Preprocessing @{cssfile} to ${css.output.name}</echo>
<x-css-preprocess
file="@{cssfile}"
tofile="${css.output.name}"
options="${build.css.preprocessor.opts}"/>
</then>
</if>
<if>
<equals arg1="@{compress}" arg2="true"/>
<then>
<echo>Compressing @{cssfile} to ${css.output.name}</echo>
<x-compress-css srcfile="@{cssfile}"
outfile="${css.output.name}"/>
</then>
</if>
</sequential>
</for>
</sequential>
</macrodef>
<!--
This target builds Ext JS 4.2+ style themes, first generating the top-level
scss file, then running compass with the css, sass, and config options set
-->
<target name="-compass-compile-theme-package">
<x-run-if-true value="${enable.ext42.themes}">
<x-ant-call target="-compile-sass"/>
<x-compass-compile
dir="${build.dir}"
trace="${compass.comiple.trace}"
boring="${compass.compile.boring}"
force="${compass.compile.force}"
sassdir="${compass.sass.dir}"
cssdir="${compass.css.dir}"
config="${compass.config.file}"/>
<x-compress-css-files dir="${build.dir}/resources"
prefix="${app.out.base.debug}"
outprefix="${app.out.base}"
preprocess="${build.css.preprocess}"
compress="${build.css.compress}"/>
</x-run-if-true>
</target>
<!--
This is a legacy macrodef to support building Ext JS 4.1 themes, which have been
deprecated in favor of Ext JS 4.2 theme packages
-->
<macrodef name="x-build-sass">
<attribute name="theme"/>
<sequential>
<local name="sass.name"/>
<local name="use.shell"/>
<!--
convert abspath to just the leaf path name
-->
<basename property="sass.name" file="@{theme}"/>
<local name="sass.base.name"/>
<property name="sass.base.name" value="${sass.name}"/>
<echo>Compiling sass directory : @{theme}/sass</echo>
<x-compass-compile
boring="${compass.compile.boring}"
force="${compass.compile.force}"
trace="${compass.compile.trace}"
dir="@{theme}/sass"/>
<x-compress-css srcfile="${app.dir}/resources/${sass.base.name}/*.css"
outdir="${app.dir}/resources/${sass.base.name}"/>
</sequential>
</macrodef>
<!--
This target builds Ext JS 4.1 style themes, iterating over each directory
under the specified ${app.theme.dir} directory and compiling the sass
located there
-->
<target name="-compass-compile-theme-folders">
<x-run-if-true value="${enable.ext41.themes}">
<!-- run sass compilation over the various themes -->
<for param="sass">
<dirset dir="${app.theme.dir}" includes="*"/>
<sequential>
<x-build-sass theme="@{sass}"/>
</sequential>
</for>
</x-run-if-true>
</target>
<!--
This target builds Touch style themes, by running compass
over the directory containing the manually maintined scss files
-->
<target name="-compass-compile-sass-dir">
<x-run-if-true value="${enable.touch.themes}">
<x-compass-compile
trace="${compass.comiple.trace}"
boring="${compass.compile.boring}"
force="${compass.compile.force}"
dir="${compass.sass.dir}"/>
</x-run-if-true>
</target>
<!--
This is a summation target triggering the three different supported
sass modes (ext 41, ext 42+, and touch).
-->
<target name="-compass-compile"
depends="-compass-compile-theme-package,
-compass-compile-theme-folders,
-compass-compile-sass-dir"/>
<!--
Build SASS
-->
<target name="-before-sass"/>
<target name="-sass" depends="-compass-compile"/>
<target name="-after-sass"/>
</project>