Changes between Version 19 and Version 20 of EggCookingTutorial/AdvancedEggCooking2


Ignore:
Timestamp:
Jan 25, 2016, 8:26:16 PM (3 years ago)
Author:
figaro
Comment:

Cosmetic changes

Legend:

Unmodified
Added
Removed
Modified
  • EggCookingTutorial/AdvancedEggCooking2

    v19 v20  
    11[[TOC(heading=Egg Cooking Tutorial, EggCookingTutorial/BasicEggCooking, EggCookingTutorial/AdvancedEggCooking, EggCookingTutorial/AdvancedEggCooking2, EggCookingTutorial/publish)]]
    22
    3 = Cooking high-end eggs =
     3= Cooking high-end eggs
    44
    5 Now you have pretty neat plugin already but let's add final twist and serve some static content like stylesheet and image.
     5Now that you have a working version of a plugin already, let's add a final twist and serve some static content like a stylesheet and an image.
    66
    7 == Important thing to check ==
     7== Important thing to check
    88
    9 First step is to ensure that your ''trac.ini'' doesn't have ''htdocs_location'' set otherwise Trac can't serve static data.
     9First step is to ensure that your ''trac.ini'' doesn't have ''htdocs_location'' set, otherwise Trac can't serve static data.
    1010
    11 == More directories ==
     11== More directories
    1212
    13 Since we don't have enough directories in our simple plugin let's make few more:
    14 {{{
     13We will need a few more directories for the files that we will add:
     14{{{#!sh
    1515./helloworld-plugin/helloworld/htdocs/
    1616./helloworld-plugin/helloworld/htdocs/css/
     
    1818}}}
    1919
    20 == Style is everything ==
     20== Style is everything
    2121
    22 We want to use our own stylesheet to give some color to our fine content. For that we need cascaded stylesheet.
     22We want to use our own stylesheet to give some color to our content. For that we need [wikipedia:Cascading_Style_Sheets cascading stylesheets].
    2323
    2424Create ''helloworld.css'' in ''./helloworld-plugin/helloworld/htdocs/css/'':
    25 {{{
    26 #!text/css
     25{{{#!text/css
    2726div.helloworld h1 {
    2827        color: red;
     
    3029}}}
    3130
    32 == Image tells more than thousand words ==
     31== Image tells more than thousand words
    3332
    34 Images are always nice.
     33Images enhance the look and feel of your site. Put small image named ''helloworld.jpg'' in ''./helloworld-plugin/helloworld/htdocs/images/''.
    3534
    36 Put small image named ''helloworld.jpg'' in ''./helloworld-plugin/helloworld/htdocs/images/''.
    37 
    38 Note: Since it's not practical to show jpg contents here you should find one image by yourself somewhere.
    39 
    40 == Egg grows ==
     35== Egg grows
    4136
    4237Even natural eggs doesn't grow Python eggs does.
    4338
    4439Modify ''setup.py'' to include our static data:
    45 {{{
    46 #!python
     40{{{#!python
    4741from setuptools import setup
    4842
     
    5953}}}
    6054
    61 == Tell it to Trac too ==
     55== Tell it to Trac
    6256
    63 Trac doesn't know where our fine stylesheet and image is located. So you have to tell it to Trac.
     57Trac doesn't know where our stylesheet and image is located, so you have to tell it to Trac.
    6458
    65 Add the following code at the tail in file ''helloworld.py'' which
    66 implements {{{get_htdocs_dir()}}} to tell the static data path information for this plugin
    67 with identical prefix 'hw'.
    68 {{{
    69 #!python
     59Add the following code at the tail in file ''helloworld.py'', which implements {{{get_htdocs_dir()}}} to tell the static data path information for this plugin with identical prefix 'hw':
     60{{{#!python
    7061    def get_htdocs_dirs(self):
    7162        """Return a list of directories with static resources (such as style
     
    8374}}}
    8475
    85 == Remember to load stylesheet ==
     76== Remember to load stylesheet
    8677
    8778To make Trac to load our stylesheet you need to modify ''process_request'' method starting from line 23 to following:
    88 {{{
    89 #!python
     79{{{#!python
    9080    def process_request(self, req):
    9181        add_stylesheet(req, 'hw/css/helloworld.css')
    9282        return 'helloworld.cs', None
    9383}}}
     84
    9485Note that prefix path 'hw/' specified by {{{get_htdocs_dirs()}}} should be used.
    9586
    96 And also import {{{add_stylesheet()}}} at the beginning of ''helloworld.py''.
    97 {{{
    98 #!python
     87And also import {{{add_stylesheet()}}} at the beginning of ''helloworld.py'':
     88{{{#!python
    9989from trac.web.chrome import INavigationContributor, ITemplateProvider, \
    10090        add_stylesheet
    10191}}}
    10292
    103 == Complete version of code ==
    104 The whole of final code is here:
    105 {{{
    106 #!python
     93== Complete version of code
     94
     95The whole of the Python code is here:
     96{{{#!python
    10797# Helloworld plugin
    10898
     
    155145}}}
    156146
    157 == Back to images ==
     147== Back to images
    158148
    159 We need to add our image to template to see it.
     149We need to add our image to the template to see it.
    160150
    161151Our new ''helloworld.cs'':
    162 {{{
    163 #!text/html
     152{{{#!text/html
    164153<?cs include "header.cs" ?>
    165154<?cs include "macros.cs" ?>
     
    173162}}}
    174163
    175 == Compilation and deployment ==
     164== Compilation and deployment
    176165
    177166Now you should be familiar with both, so make an egg and deploy it.
    178167
    179 Click and see... Hello world! with your pretty own image.
     168Click and see "Hello world!" with your chosen image.
    180169
    181 == Aftermath ==
     170== Aftermath
    182171
    183 Now you have successfully completed nice simple plugin that uses its own template and serves some static data.
     172Now you have successfully completed a simple plugin that uses its own template and serves some static data.