Changeset 5778
- Timestamp:
- 10/31/07 14:09:43 (1 year ago)
- Files:
-
- plugins/sfExtjsThemePlugin/HowTo Sandbox.txt (modified) (9 diffs)
- plugins/sfExtjsThemePlugin/README (modified) (19 diffs)
Legend:
- Unmodified
- Added
- Removed
- Modified
- Copied
- Moved
plugins/sfExtjsThemePlugin/HowTo Sandbox.txt
r5534 r5778 1 Setup the default symfony sandbox: (for the extjs part skip this part) 1 Setup the default symfony sandbox: (for the extjs part skip this part) 2 2 3 3 Start a new project (if you have symfony already installed) or download the sandbox from http://www.symfony-project.com/get/sf_sandbox.tgz … … 22 22 param: 23 23 dsn: mysql://username:password@localhost/username 24 [/code] 24 [/code] 25 25 26 26 And setup config/propel.ini: (don't be scared, it is almost default, only changed propel.project and database) … … 88 88 [/code] 89 89 90 run "symfony propel-build-all" to generate the model and create the tables in your database 90 run "symfony propel-build-all" to generate the model and create the tables in your database 91 91 TIP: if you are running linux, look for the bash completion script, and place it in /etc/bash_completion.d if you now (again) login into a terminal, you have symfony arguments completion. So type "symfony <tab><tab>" and enjoy! 92 92 93 93 94 94 Create the modules: 95 symfony propel-init-admin frontend assignment Assignment 95 symfony propel-init-admin frontend assignment Assignment 96 96 symfony propel-init-admin frontend parcel Parcel 97 97 … … 112 112 113 113 For now, you have to do a svn checkout to add the plugin to your project, 114 go to your plugin folder and type: 114 go to your plugin folder and type: 115 115 svn co http://svn.symfony-project.com/plugins/sfExtjsThemePlugin/ 116 Or use a gui tool like rapidsvn, tortoise, subclipse, what ever makes you happy 116 Or use a gui tool like rapidsvn, tortoise, subclipse, what ever makes you happy 117 117 118 118 Copy the content of the sf_sandbox/plugin/sfExtjsThemePlugin/web folder to your sf_sandbox/web/sfExtjsThemePlugin folder, or in linux, make a symlink: … … 134 134 135 135 ?> 136 [/code] 136 [/code] 137 137 138 138 Now go to your the generator of your module, for example the one from assignment and change the theme from default to extjs. 139 139 140 If you now browse to http://localhost/sf_sandbox/web/frontend_dev.php/assignment you should see a list of assignments (with their id) in the Extjs theme 140 If you now browse to http://localhost/sf_sandbox/web/frontend_dev.php/assignment you should see a list of assignments (with their id) in the Extjs theme 141 141 142 142 (Hmmm. For some reason I don't seem to have all css properties. The Add-new button is a square, also the pager buttons look strange, and the column-headers seem to mis a background image, until you hover over them. I haven't firgured out what causes this, yet.) … … 147 147 [code] 148 148 generator: 149 class: sf PropelAdminGenerator149 class: sfExtjsPropelAdminGenerator 150 150 param: 151 151 model_class: Assignment … … 170 170 You can click on a parcel-name field, to change it name. (Saving the changes still have to be implemented) 171 171 172 In the generator.yml file, place a '=' before the diplay name under the sub_class, to make the field a hyperlink to the sub_class edit page. (display: [=name]) 173 174 To give an other example I will use the parcel class. 172 In the generator.yml file, place a '=' before the diplay name under the sub_class, to make the field a hyperlink to the sub_class edit page. (display: [=name]) 173 174 To give an other example I will use the parcel class. 175 175 176 176 First add the folowing code to the lib/model/Assignment.php file: … … 183 183 } 184 184 } 185 [/code] 185 [/code] 186 186 187 187 Change the generator.yml file of parcel to: 188 188 [code] 189 189 generator: 190 class: sf PropelAdminGenerator190 class: sfExtjsPropelAdminGenerator 191 191 param: 192 192 model_class: Parcel … … 208 208 I have to change some things over here. Most obvious: I want the disabled flag placed under the list, not under the edit tag. Besides I also want to have a general fields-tag where you can define this. This way you can distinguish if you can edit a field in your list and/or your edit-view. 209 209 210 The result looks the same in this case, but in this case you cannot see assignment2, because there is no parcel related to it, which makes a huge difference. 210 The result looks the same in this case, but in this case you cannot see assignment2, because there is no parcel related to it, which makes a huge difference. 211 211 212 212 Please also try to add group-totals (with the plugin, feature) and also check the Readme. plugins/sfExtjsThemePlugin/README
r5616 r5778 8 8 I've also used Silk-Icons from Mark James, but I don't know anymore if I still use it (it now still is included). 9 9 10 This is a very alpha-alpha release ;) Based on the initial work of Wolfgang Kubens. 10 This is a very alpha-alpha release ;) Based on the initial work of Wolfgang Kubens. Improved by Jérôme. 11 11 12 12 Have fun, … … 16 16 17 17 * Install the plugin 18 18 19 19 {{{ 20 20 TODO: (does not work yet) $ symfony plugin-install http://plugins.symfony-project.com/sfExtjsThemePlugin … … 33 33 or by simply copying the contents of the plugins/sfExtjsThemePlugin/web/ folder to /web/sfExtjsThemePlugin 34 34 35 * Change your class in the generator.yml file from sfExtjsPropelAdminGenerator to: sfExtjsPropelAdminGenerator 35 36 * Change your theme in the generator.yml file from default to: extjs 36 37 … … 52 53 53 54 <script type="text/javascript" src="/sfExtjsThemePlugin/js/extGridGroupSummary.js"></script> 54 55 55 56 <link rel="stylesheet" type="text/css" href="/sfExtjsThemePlugin/extjs/resources/css/ext-all.css" /> 56 57 <link rel="stylesheet" type="text/css" href="/sfExtjsThemePlugin/extjs/resources/css/xtheme-default.css" /> … … 68 69 THERE IS ALSO A HOWTO IN THE SVN which tells you how to start from a standard sandbox: http://svn.symfony-project.com/plugins/sfExtjsThemePlugin/HowTo%20Sandbox.txt 69 70 70 71 71 72 == Features == 72 73 … … 103 104 Add multisort: true to your list options in your generator.yml 104 105 105 An example of how to sort cities first on country, then on city-name: 106 An example of how to sort cities first on country, then on city-name: 106 107 107 108 {{{ … … 121 122 }}} 122 123 123 Because ascending is the default value to sort on, 124 Because ascending is the default value to sort on, 124 125 125 126 {{{ … … 130 131 }}} 131 132 132 is valid as well. In these cases the user has the ability to sort on multiple columns at the same time. 133 134 Please note that in the first example I sort on country, and not on countryid, see new feature: Sort on foreign- and composite-columns. However new functionality in the list (grid) with drop-down combo-boxes reintroduces countryid. If you use country you will not have a drop-down combo-box! setting the sort-field for countryid remains useful in this case. 133 is valid as well. In these cases the user has the ability to sort on multiple columns at the same time. 134 135 Please note that in the first example I sort on country, and not on countryid, see new feature: Sort on foreign- and composite-columns. However new functionality in the list (grid) with drop-down combo-boxes reintroduces countryid. If you use country you will not have a drop-down combo-box! setting the sort-field for countryid remains useful in this case. 135 136 136 137 TODO: Currently the filter-reset button also resets the sort-order, but I think it would be nice to have a seperate reset button for it. And I also think the reset should reset the sort-order to the generator.yml file default settings, not to no-sort-order at all which is currently the case... 137 138 138 TODO2: The Extjs-grid does not support the visual feedback in its multi-sort-column-header. It does work because the sorting is done on the server, but your column-header shows only the sorting of the last column you sorted on. I think it should be possible to overwrite the default behavior of the extjs-column-header and make it behave like http://tablesorter.com/docs/ (holding shift to sort on multiple-columns). This does however requires some extra work on the php-code, to make it reset the sorting when you don't hold shift. 139 TODO2: The Extjs-grid does not support the visual feedback in its multi-sort-column-header. It does work because the sorting is done on the server, but your column-header shows only the sorting of the last column you sorted on. I think it should be possible to overwrite the default behavior of the extjs-column-header and make it behave like http://tablesorter.com/docs/ (holding shift to sort on multiple-columns). This does however requires some extra work on the php-code, to make it reset the sorting when you don't hold shift. 139 140 Multisorting isn't working with ajax set to true, because at the moment extjs cannot handle sorting on mulitple columns. It can only sort one column at a time. If you disable ajax (ajax: false) you can see how it should work. Someone first has to extend extjs with this functionality before this is possible. I very much like the implementation done with jquery: http://tablesorter.com/docs/ (holding the shift-key while pressing the column headers to sort on multiple columns) 140 141 It should be possible to extend extjs with this functionality, but it is not there (yet). At the moment I haven't got time for this yet. And to make it work like the jquery example, there should also be some extention for my plugin, to make the multi-sort reset when you don't hold shift. … … 142 143 === Sort on foreign- and composite-columns === 143 144 144 You can now also sort your columns on columns with foreign-values or composite values (from multiple/different columns, like full-names which are combined in a partial). You have to add some information to the generator.yml file to define the sort-order though, it can't do magic (yet)... 145 You can now also sort your columns on columns with foreign-values or composite values (from multiple/different columns, like full-names which are combined in a partial). You have to add some information to the generator.yml file to define the sort-order though, it can't do magic (yet)... 145 146 146 147 {{{ … … 157 158 If you use the ajax view, you can now also display countryid and see an inline combo-box in the list, when you edit it. 158 159 159 TODO: I think you don't have to define the join_fields. I think this could be automatically resolved by something like $subclassPeerName->translateFieldName(...) 160 TODO: I think you don't have to define the join_fields. I think this could be automatically resolved by something like $subclassPeerName->translateFieldName(...) 160 161 161 162 … … 164 165 165 166 With Ajax you have the option to group you list on columns, you do this by setting the group_field option in your generator.yml file under list. 166 When you have not set a sort column, the column which you define here will be used, which is recommended! 167 168 {{{ 169 generator: 170 class: sf PropelAdminGenerator167 When you have not set a sort column, the column which you define here will be used, which is recommended! 168 169 {{{ 170 generator: 171 class: sfExtjsPropelAdminGenerator 171 172 param: 172 173 model_class: City … … 182 183 field: country 183 184 plugins: summary 184 185 185 186 fields: 186 187 name: 187 188 summary_type: 'count' 188 summary_renderer_function: "return ((v === 0 || v > 1) ? '<b>' + v +' Countries</b>' : '<b>1 Country</b>');" 189 summary_renderer_function: "return ((v === 0 || v > 1) ? '<b>' + v +' Countries</b>' : '<b>1 Country</b>');" 189 190 country: 190 191 join_fields: [CityPeer::COUNTRYID, CountryPeer::COUNTRYID] 191 192 sort_column: CountryPeer::NAME 192 193 }}} 194 195 The summary plugin can be defined by a partial, in which you can write your javascript helper. In this case the total under every group (The number of cities under a country) will be count. 193 194 }}} 195 196 The summary plugin can be defined by a partial, in which you can write your javascript helper. In this case the total under every group (The number of cities under a country) will be count. 196 197 197 198 TODO: Sorting with a grouped grid is an issue, need testing! (groups can possibly show up multiple times on different pages) … … 210 211 model_class: Assignment 211 212 theme: extjs 212 213 213 214 sub_class: 214 215 model_class: Assignmentparcel … … 218 219 name: Parcel 219 220 summary_type: 'count' 220 summary_renderer_function: "return ((v === 0 || v > 1) ? '<b>' + v +' Parcels</b>' : '<b>1 Parcel</b>');" 221 summary_renderer_function: "return ((v === 0 || v > 1) ? '<b>' + v +' Parcels</b>' : '<b>1 Parcel</b>');" 221 222 222 223 fields: 223 224 sf_guard_user_related_by_created_by: 224 225 name: Created by 225 sf_guard_user_related_by_updated_by: 226 sf_guard_user_related_by_updated_by: 226 227 name: Updated by 227 228 228 229 list: 229 230 title: Assignments … … 237 238 join_fields: [AssignmentPeer::VESSELID, VesselPeer::VESSELID] 238 239 sort_column: VesselPeer::NAME 239 }}} 240 }}} 240 241 241 242 In this example you see the grouping field is defined, but it is optional. If you leave it out, the first field of your main-diplay-list is selected. … … 243 244 244 245 TODO0: At the moment I cannot get an instance of sub_class. I now have copied the code from several symfony methods and placed it in the plugin, this is far from optimal of course. I am also not able to find if fields of a sub-class are foreign-keys to other tables, which makes it impossible to let them appear as drop-down combo-boxes. 245 246 246 247 TODO1: I have to think about mixing the fields of the main_class and the sub_class. (although all fields in a main-column will be the same for a group) 247 248 TODO2: Maybe it is possible to define the generator.yml file of the sub_class in the master-generator.yml file, instead of this sub_class list. … … 251 252 if you have a field in your class which is a foreign-key to an other table, for example country_id the field in the list gets transformed in a drop-down combo-box. The foreign-table has to have a field called name! (this instead of the __toString() method) 252 253 253 TODO: Add a posibility to set the value-field from the foreign-table (which can also be a partial), now it is set to name, which should become the default column if nothing is set. 254 TODO: Add a posibility to set the value-field from the foreign-table (which can also be a partial), now it is set to name, which should become the default column if nothing is set. 254 255 255 256 … … 268 269 }}} 269 270 270 list_max_per_page is the other option, which can be set application-wide. 271 list_max_per_page is the other option, which can be set application-wide. 271 272 272 273 … … 291 292 * Multi-sort is not visible in column-header, limitation of Extjs library which can be extended (but has not been done) 292 293 * Some values can not be set (like column width, footer on/off, footer text, etc.) 293 * Refractoring. At the moment I've copy-pasted code from the symfony-base in my generator, because I cannot instantiate some objects (especially with regard to other(/sub) classes in a list. Besides I currently make no use of any helpers, everything is implemented in the list-partials, which is bad practice but was a lot easier to test the proof of concepts. 294 295 294 * Refractoring. At the moment Jérôme did a great job, but code still can use some cleanup.
