🌍
English
This shows you the differences between two versions of the page.
dev:changes_in_2.2 [2011/03/09 14:20] plg add combine_css in the change list |
— (current) | ||
---|---|---|---|
Line 1: | Line 1: | ||
- | ====== Technical changes in Piwigo 2.2 ====== | ||
- | FIXME (2011-03-09) this page is under preparation | ||
- | |||
- | This page lists the technical changes that may be useful for plugin and theme developpers to make their extension compatible with Piwigo 2.2. | ||
- | |||
- | ===== cleaner URL for plugin administration ===== | ||
- | |||
- | If the adminstration main page of your plugin is plugins/plugin_directory/admin.php, then you can simplify the URL of your plugin in the main.inc.php from this: | ||
- | |||
- | <code php> | ||
- | add_event_handler('get_admin_plugin_menu_links', 'localfiles_admin_menu'); | ||
- | function localfiles_admin_menu($menu) | ||
- | { | ||
- | array_push( | ||
- | $menu, | ||
- | array( | ||
- | 'NAME' => 'LocalFiles Editor', | ||
- | 'URL' => get_admin_plugin_menu_link(LOCALEDIT_PATH . 'admin.php') | ||
- | ) | ||
- | ); | ||
- | |||
- | return $menu; | ||
- | } | ||
- | </code> | ||
- | |||
- | into this: | ||
- | |||
- | <code php> | ||
- | add_event_handler('get_admin_plugin_menu_links', 'localfiles_admin_menu'); | ||
- | function localfiles_admin_menu($menu) | ||
- | { | ||
- | array_push( | ||
- | $menu, | ||
- | array( | ||
- | 'NAME' => 'LocalFiles Editor', | ||
- | 'URL' => get_root_url().'admin.php?page=plugin-'.basename(dirname(__FILE__)) | ||
- | ) | ||
- | ); | ||
- | |||
- | return $menu; | ||
- | } | ||
- | </code> | ||
- | |||
- | * admin.php?page=plugin§ion=LocalFilesEditor%2Fadmin.php (ugly) in Piwigo 2.1 | ||
- | * admin.php?page=plugin-LocalFilesEditor (nice) in Piwigo 2.2 | ||
- | |||
- | Even better, if you have several tabs on your plugin administration screen, you can append -tabName in the "page" URL parameter. | ||
- | |||
- | * admin.php?page=plugin§ion=LocalFilesEditor%2Fadmin.php&tab=css (ugly) in Piwigo 2.1 | ||
- | * admin.php?page=plugin-LocalFilesEditor-css (nice) in Piwigo 2.2 | ||
- | |||
- | ===== No longer hard code the ./local/ directory ===== | ||
- | |||
- | If you use the ./local directory to store your theme/plugin configuration, I suggest to move configuration to the "config" table which does a very good job. If you want to keep configuration in a separate file, don't hard code the ./local/ directory, user $conf['local_dir'] instead. | ||
- | |||
- | Starting from Piwigo 2.2, it is possible to run several photo galleries with the same installation of Piwigo, this is a basic multisite feature and each site has its own $conf['local_dir'] | ||
- | |||
- | ===== Adviser mode was removed ===== | ||
- | |||
- | Because it was not that useful and had impact on many files, we've decided to remove the Adviser mode. In your PHP files, remove the: | ||
- | |||
- | <code php> | ||
- | if (is_adviser()) | ||
- | </code> | ||
- | |||
- | and in the TPL files, remove the: | ||
- | |||
- | <code html> | ||
- | {$TAG_INPUT_ENABLED} | ||
- | </code> | ||
- | |||
- | The function is_adviser() is deprecated but not removed : it will always return //false//. | ||
- | |||
- | ===== combine_css ===== | ||
- | |||
- | To reduce the number of HTTP requests from the visitor web browser to the web server, we use the new "combine_css" method, which merge several CSS files into a single one, minified. | ||
- | |||
- | Piwigo 2.1 | ||
- | <code html> | ||
- | {html_head}<link rel="stylesheet" type="text/css" href="{$LOCALEDIT_PATH}locfiledit.css">{/html_head} | ||
- | </code> | ||
- | |||
- | Piwigo 2.2 | ||
- | <code html> | ||
- | {combine_css path="plugins/LocalFilesEditor/locfiledit.css"} | ||
- | </code> | ||
- | |||
- | For coding steps, before releasing your theme/plugin, you can deactivate the combine_css feature : | ||
- | |||
- | <code php> | ||
- | $conf['template_combine_files'] = false; | ||
- | </code> | ||
- | |||
- | ===== combine_script + footer_script replaces known_script ===== | ||
- | |||
- | To reduce the number of HTTP requests from the visitor web browser to the web server, we use the new "combine script" method, which merge several javascript files into a single one, minified. | ||
- | |||
- | <code html> | ||
- | {combine_script id="jquery" load="header" path=...} | ||
- | {combine_script id="jquery.anything" load="footer" require="jquery" path=...} | ||
- | {combine_script id="jquery.ui" load="footer" require="jquery" path=...} | ||
- | {combine_script id="jquery.ui.datepicker" load="footer" require="jquery.ui" path=...} | ||
- | {combine_script id="core.scripts" load="async" path=scripts.js} | ||
- | {combine_script id="rating" load="async" require="core.scripts" path=rating.js} | ||
- | |||
- | {combine_script id="jquery" load="async"} | ||
- | {combine_script id="jquery.ui" load="async"} | ||
- | {combine_script id="jquery.ui.draggable" load="async"} | ||
- | |||
- | {footer_script require='jquery.ui.xxxx'} | ||
- | </code> | ||
- | |||
- | * **id** : a string that make the javascript file unique | ||
- | * **load** : header/footer/async. header and footer values means the javascript file doesn't need to be loaded by the web browser to display the page. For example Google Analytics javascript could be "async". | ||
- | * **require** : the id of the parent javascript file. | ||
- | * **path** : relative to the "root url" of your gallery | ||
- | |||
- | ==== Example 1, jquery.fcbkcomplete ==== | ||
- | |||
- | <code html> | ||
- | {known_script id="jquery.fcbkcomplete" src=$ROOT_URL|@cat:"themes/default/js/plugins/jquery.fcbkcomplete.js"} | ||
- | {literal} | ||
- | <script type="text/javascript"> | ||
- | $(document).ready(function() { | ||
- | $("#tags").fcbkcomplete({ | ||
- | json_url: "admin.php?fckb_tags=1", | ||
- | cache: false, | ||
- | filter_case: false, | ||
- | filter_hide: true, | ||
- | firstselected: true, | ||
- | filter_selected: true, | ||
- | maxitems: 100, | ||
- | newel: true | ||
- | }); | ||
- | }); | ||
- | </script> | ||
- | {/literal} | ||
- | </code> | ||
- | |||
- | becomes: | ||
- | |||
- | <code html> | ||
- | {combine_script id='jquery.fcbkcomplete' load='footer' require='jquery' path='themes/default/js/plugins/jquery.fcbkcomplete.js'} | ||
- | |||
- | {footer_script require='jquery.fcbkcomplete'}{literal} | ||
- | jQuery(document).ready(function() { | ||
- | jQuery("#tags").fcbkcomplete({ | ||
- | json_url: "admin.php?fckb_tags=1", | ||
- | cache: false, | ||
- | filter_case: false, | ||
- | filter_hide: true, | ||
- | firstselected: true, | ||
- | filter_selected: true, | ||
- | maxitems: 100, | ||
- | newel: true | ||
- | }); | ||
- | }); | ||
- | {/literal}{/footer_script} | ||
- | </code> | ||
- | |||
- | ==== Example 2, jquery.ui.sortable ==== | ||
- | |||
- | <code html> | ||
- | {known_script id="jquery" src=$ROOT_URL|@cat:"themes/default/js/jquery.packed.js"} | ||
- | {known_script id="jquery.ui" src=$ROOT_URL|@cat:"themes/default/js/ui/packed/ui.core.packed.js" } | ||
- | {known_script id="jquery.ui.sortable" src=$ROOT_URL|@cat:"themes/default/js/ui/packed/ui.sortable.packed.js" } | ||
- | |||
- | {literal} | ||
- | <script type="text/javascript"> | ||
- | jQuery().ready(function(){ | ||
- | jQuery(".catPos").hide(); | ||
- | jQuery(".drag_button").show(); | ||
- | jQuery(".categoryLi").css("cursor","move"); | ||
- | jQuery(".categoryUl").sortable({ | ||
- | axis: "y", | ||
- | opacity: 0.8 | ||
- | }); | ||
- | }); | ||
- | </script> | ||
- | {/literal} | ||
- | </code> | ||
- | |||
- | becomes: | ||
- | |||
- | <code html> | ||
- | {footer_script require='jquery.ui.sortable'}{literal} | ||
- | jQuery(document).ready(function() { | ||
- | jQuery(".catPos").hide(); | ||
- | jQuery(".drag_button").show(); | ||
- | jQuery(".categoryLi").css("cursor","move"); | ||
- | jQuery(".categoryUl").sortable({ | ||
- | axis: "y", | ||
- | opacity: 0.8 | ||
- | }); | ||
- | }); | ||
- | {/literal}{/footer_script} | ||
- | </code> | ||
- | |||
- | No need to use combined_script, because Piwigo will automatically load jquery.ui.sortable, which automatically requires jquery.ui which automatically requires jquery. It works because jquery.ui.sortable is available in themes/default/js |