🌍
English
This shows you the differences between two versions of the page.
dev:changes_in_2.2 [2011/03/08 23:55] plg |
— (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. | ||
- | |||
- | * CSS and Javascript files are combined to reduce the number of HTTP requests | ||
- | * core themes use CSS sprites for icons to reduce the number of HTTP requests | ||
- | * cleaner URL for plugin administration page admin.php?page=plugin-community-pendings | ||
- | * $config['local_dir'] instead of "./local/" | ||
- | * adviser mode was removed | ||
- | |||
- | ===== combined_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/js4 | ||
- | |||
- | ===== 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'] |