1 <project name=
"slice-impl">
3 Uses the compiler to generate a special theme-only scss file containing
4 rules for all framework / package / app components. This is then used
5 by the slicer example page to capture theme sprites
7 <target name=
"-compile-slicer-sass" depends=
"-init-compiler">
9 path=
"${build.dir}/resources"
10 property=
"image.search.path"/>
12 <x-compile refid=
"${compiler.ref.id}">
25 -variable=$image-search-path:'${image.search.path}'
26 -variable=$theme-name: '${app.theme}' !default
27 -output=${app.example.scss}
34 -output=${app.example.out.ruby}
38 <x-get-relative-path from=
"${app.example.dir}"
39 to=
"${app.example.css}"
40 property=
"app.example.css.path"/>
42 <!--update the app's example to point to the build output-->
43 <echo file=
"${app.example.css.file}">
46 * This file is generated by Sencha Cmd and should NOT be edited. It redirects
47 * to the most recently built CSS file for the application to allow theme.html
48 * to load properly for image slicing (required to support non-CSS3 browsers
49 * such as IE9 and below).
51 @import '${app.example.css.path}';
57 Compiles the scss file for the theme slicer page
59 <target name=
"-compass-compile-slicer-css" depends=
"-compile-slicer-sass">
61 dir=
"${app.example.build.dir}"
62 trace=
"${compass.compile.trace}"
63 boring=
"${compass.compile.boring}"
64 force=
"${compass.compile.force}"
65 sassdir=
"${app.example.build.dir}"
66 cssdir=
"${app.example.build.dir}"
67 config=
"${app.example.compass.config}"/>
71 Generates theme images for Ext JS 4.2+ apps using theme packages
72 '-detect-app-build-properties' is defined in js-impl.xml
74 <target name=
"-slice-app-theme" depends=
"-detect-app-build-properties">
75 <x-ant-call target=
"-compass-compile-slicer-css"/>
76 <x-run-bootstrap file=
"${bootstrap.example.js}"
77 basedir=
"${bootstrap.base.path}"/>
79 <echo>Capture theme image to ${build.capture.png}
</echo>
84 -page=${app.example.theme.html}
85 -image=${build.capture.png}
86 -manifest=${build.capture.json}
90 <echo>Slicing theme images to ${build.resources.dir}
</echo>
95 ${build.slice.options}
96 -image=${build.capture.png}
97 -manifest=${build.capture.json}
98 -out=${build.resources.dir}
103 <macrodef name=
"x-build-theme">
104 <attribute name=
"theme" description=
"the path of the theme folder"/>
105 <attribute name=
"buildsass" default=
"false"/>
106 <attribute name=
"basetheme" default=
"default"/>
108 <local name=
"theme.name"/>
110 <local name=
"framework.theme.dir"/>
111 <local name=
"tmp.theme.dir"/>
112 <local name=
"tmp.img.dir"/>
114 <basename property=
"theme.name" file=
"@{theme}"/>
115 <local name=
"theme.base.name"/>
116 <property name=
"theme.base.name" value=
"${theme.name}"/>
117 <property name=
"theme.images.dir" location=
"@{theme}/images"/>
118 <property name=
"theme.page.dir" location=
"@{theme}/${theme.page.name}"/>
120 <property name=
"tmp.res.dir" value=
"${app.resources.dir}"/>
121 <property name=
"tmp.theme.dir" value=
"${tmp.res.dir}/${theme.base.name}"/>
122 <property name=
"tmp.img.dir" value=
"${tmp.theme.dir}/images"/>
124 <property name=
"app.res.dir" location=
"${app.dir}/packages"/>
125 <property name=
"app.img.dir" location=
"${app.res.dir}/images"/>
127 <property name=
"framework.res.dir" location=
"${framework.dir}/resources"/>
128 <property name=
"framework.img.dir" location=
"${framework.res.dir}/themes/images"/>
129 <property name=
"framework.theme.dir" location=
"${framework.img.dir}/@{basetheme}"/>
131 <echo>Copying base framework images from ${framework.theme.dir} to ${tmp.img.dir}
</echo>
132 <copy todir=
"${tmp.img.dir}">
133 <fileset dir=
"${framework.theme.dir}" includes=
"**/*"/>
137 <equals arg1=
"@{buildsass}" arg2=
"true"/>
139 <echo>Building sass for theme ${theme.name}
</echo>
140 <!--x-build-sass is defined in sass-impl.xml-->
141 <x-build-sass theme=
"@{theme}"/>
145 <echo>Slicing images for theme ${theme.name} to ${tmp.img.dir}
</echo>
150 -data-file=${build.capture.json}
151 -image-file=${build.capture.png}
152 -page=${theme.page.dir}
158 <available file=
"${theme.images.dir}"/>
160 <echo>Copying user defined images from @{theme}/images to ${tmp.img.dir}
</echo>
161 <copy todir=
"${tmp.img.dir}">
162 <fileset dir=
"${theme.images.dir}" includes=
"**/*"/>
171 This is a legacy macrodef for copying resources in theme-directory based themes.
172 It is provided to support building Ext JS 4.1 app themes
174 <macrodef name=
"x-copy-resources">
176 <copy todir=
"${build.resources.dir}" includeEmptyDirs=
"false">
177 <fileset dir=
"${app.resources.dir}"
181 <x-get-relative-path from=
"${app.dir}"
182 to=
"${framework.dir}"
183 property=
"framework.rel.path"/>
185 <copy toDir=
"${build.dir}/${framework.rel.path}">
186 <fileset dir=
"${framework.dir}"
187 includes=
"src/ux/**/css/**/*"/>
193 Generates theme images for Ext JS 4.1 apps that use directory based
194 themes. These have been deprecated in favor of ExtJS 4.2 theme packages
196 <target name=
"-slice-theme-directories">
197 <echo>Processing theme directories from ${app.theme.dir}
</echo>
199 <dirset dir=
"${app.theme.dir}" includes=
"*"/>
201 <x-build-theme theme=
"@{theme}"/>
207 <target name=
"-slice-images">
208 <x-run-if-true value=
"${enable.ext42.themes}">
209 <x-ant-call target=
"-slice-app-theme"/>
211 <x-run-if-true value=
"${enable.ext41.themes}">
212 <x-ant-call target=
"-slice-theme-directories"/>
216 <target name=
"-before-slice"/>
217 <target name=
"-slice" depends=
"-slice-images"/>
218 <target name=
"-after-slice"/>
221 Refresh Individual Theme
223 <target name=
"-before-refresh-theme"/>
224 <target name=
"-refresh-theme">
226 <x-is-true value=
"${enable.ext41.themes}"/>
228 <local name=
"theme.dir"/>
229 <property name=
"theme.dir" location=
"${app.theme.dir}/${args.themeName}"/>
230 <x-build-theme theme=
"${theme.dir}" buildsass=
"true"/>
235 <target name=
"-after-refresh-theme"/>