MoinDropline Icon Set
Introduction
I have tried to create a new icon set for Moin. It was no easy task because the smaller the icons get, the harder they can be recognized especially when they use anti-aliasing. So that's the trade-off you have to decide: either icons are small, well to recognize and jagged using only a few 'extrem colours' or you have nice smooth icons - with all their drawbacks... It's up you to decide what you want and what you like...
The most common icons of Moin look in MoinDropline as follows:
The smileys look like this now:
Please note: I have added a new question marks smiley which can be called like this <?> . This could be quite usefull to mark certain text passages like "What's that??" "Really?" "We have to think about that"...
Sometimes people complain that in Moin's classic theme, the icons are too small. I have created some bigger ones:
I have also added new icons for adding/deleting quicklinks and file attachment:
Installation
MoinDropline needs at least Moin 1.6.
Download MoinDroplineIconSet.zip and extract the files to your theme folder, e.g. if you use modern theme, put them into htdocs/modern/img.
Change !MoinMoin/theme/_init_.py as follows or overwrite the standard theme/_init_.py setting in your theme's file:
1 icons = {
2 # key alt icon filename w h
3 # ------------------------------------------------------------------
4 # navibar
5 'help': ("%(page_help_contents)s", "moin-help.png", 16, 16),
6 'find': ("%(page_find_page)s", "moin-search.png", 16, 16),
7 'diff': (_("Diffs"), "moin-diff.png", 20, 16),
8 'info': (_("Info"), "moin-info.png", 16, 16),
9 'edit': (_("Edit"), "moin-edit.png", 16, 16),
10 'unsubscribe':(_("Unsubscribe"), "moin-unsubscribe.png", 16, 16),
11 'subscribe': (_("Subscribe"), "moin-subscribe.png", 16, 16),
12 'addquicklink': (_("Add quicklink"), "moin-addquicklink.png", 16, 16),
13 'delquicklink': (_("Delete quicklink"), "moin-delquicklink.png", 16, 16),
14
15 'raw': (_("Raw"), "moin-raw.png", 16, 16),
16 'xml': (_("XML"), "moin-xml.png", 20, 13),
17 'print': (_("Print"), "moin-print.png", 16, 16),
18 'view': (_("View"), "moin-show.png", 16, 16),
19 'home': (_("Home"), "moin-home.png", 16, 16),
20 'up': (_("Up"), "moin-parent.png", 16, 16),
21 # FileAttach
22 'attach': ("%(attach_count)s", "moin-attach.png", 12, 12),
23 'iconattach': ("Add/Manage files", "moin-iconattach.png", 16, 16),
24 # RecentChanges
25 'rss': (_("[RSS]"), "moin-rss.png", 39, 14),
26 'deleted': (_("[DELETED]"), "moin-deleted.png",80, 16),
27 'updated': (_("[UPDATED]"), "moin-updated.png",80, 16),
28 'renamed': (_("[RENAMED]"), "moin-renamed.png",80, 16),
29 'conflict': (_("[CONFLICT]"), "moin-conflict.png",23, 16),
30 'new': (_("[NEW]"), "moin-new.png", 80, 16),
31 'diffrc': (_("[DIFF]"), "moin-diff.png", 20, 16),
32 # General
33 'bottom': (_("[BOTTOM]"), "moin-bottom.png", 12, 12),
34 'top': (_("[TOP]"), "moin-top.png", 12, 12),
35 'www': ("[WWW]", "moin-www.png", 12, 12),
36 'mailto': ("[MAILTO]", "moin-email.png", 12, 12),
37 'news': ("[NEWS]", "moin-news.png", 12, 12),
38 'irc': ("[IRC]", "moin-irc.png", 15, 15),
39 'telnet': ("[TELNET]", "moin-telnet.png", 12, 12),
40 'ftp': ("[FTP]", "moin-ftp.png", 12, 12),
41 'file': ("[FILE]", "moin-ftp.png", 12, 12),
42 # search forms
43 'searchbutton': ("[?]", "moin-search.png", 16, 16),
44 'interwiki': ("[%(wikitag)s]", "moin-inter.png", 12, 12),
45 'badinterwiki': ("[%(wikitag)s]", "moin-badinter.png", 12, 12),
46
47 # smileys
48 'X-(': ("X-(", 'angry.png', 18, 18),
49 ':D': (":D", 'biggrin.png', 18, 18),
50 '<:(': ("<:(", 'frown.png', 18, 18),
51 ':o': (":o", 'redface.png', 18, 18),
52 ':(': (":(", 'sad.png', 18, 18),
53 ':)': (":)", 'smile.png', 18, 18),
54 'B)': ("B)", 'smile2.png', 18, 18),
55 ':))': (":))", 'smile3.png', 18, 18),
56 ';)': (";)", 'smile4.png', 18, 18),
57 '/!\\': ("/!\\", 'alert.png', 16, 16),
58 '<!>': ("<!>", 'attention.png', 16, 16),
59 '(!)': ("(!)", 'idea.png', 16, 16),
60 ':-?': (":-?", 'tongue.png', 18, 18),
61 ':\\': (":\\", 'ohwell.png', 18, 18),
62 '>:>': (">:>", 'devil.png', 18, 18),
63 '|)': ("|)", 'tired.png', 18, 18),
64
65 # some folks use noses in their emoticons
66 ':-(': (":-(", 'sad.png', 18, 18),
67 ':-)': (":-)", 'smile.png', 18, 18),
68 'B-)': ("B-)", 'smile2.png', 18, 18),
69 ':-))': (":-))", 'smile3.png', 18, 18),
70 ';-)': (";-)", 'smile4.png', 18, 18),
71 '|-)': ("|-)", 'tired.png', 18, 18),
72
73 # version 1.0
74 '(./)': ("(./)", 'checkmark.png', 16, 16),
75 '{OK}': ("{OK}", 'thumbs-up.png', 16, 16),
76 '{X}': ("{X}", 'icon-error.png', 16, 16),
77 '{i}': ("{i}", 'icon-info.png', 16, 16),
78 '{1}': ("{1}", 'prio1.png', 16, 16),
79 '{2}': ("{2}", 'prio2.png', 16, 16),
80 '{3}': ("{3}", 'prio3.png', 16, 16),
81
82 # version 1.3.4 (stars)
83 # try {*}{*}{o}
84 '{*}': ("{*}", 'star_on.png', 16, 16),
85 '{o}': ("{o}", 'star_off.png', 16, 16),
86
87 # new question mark smiley
88 '<?>': ("<?>", 'question.png', 16, 16),
89
90 # new big icons for classic theme
91 'diff-big': (_("Diffs"), "moin-diff-big.png", 31, 25),
92 'info-big': (_("Info"), "moin-info-big.png", 25, 25),
93 'edit-big': (_("Edit"), "moin-edit-big.png", 25, 25),
94 'unsubscribe-big': (_("Unsubscribe"), "moin-unsubscribe-big.png", 25, 25),
95 'subscribe-big': (_("Subscribe"), "moin-subscribe-big.png", 25, 25),
96 'raw-big': (_("Raw"), "moin-raw-big.png", 25, 25),
97 'print-big': (_("Print"), "moin-print-big.png", 25, 25),
98 'view-big': (_("View"), "moin-show-big.png", 25, 25),
99 'delquicklink-big': (_("Delete quicklink"), "moin-delquicklink-big.png", 25, 25),
100 'addquicklink-big': (_("Add quicklink"), "moin-addquicklink-big.png", 25, 25),
101 'attach-big': (_("Add/Manage files"), "moin-iconattach-big.png", 25, 25),
102
103 }
Add to !MoinMoin/config/_init_.py the new syntax <?> for the question mark smiley:
smileys = (r"X-( :D <:( :o :( :) B) :)) ;) /!\ <!> <?> (!) :-? :\ >:> |) " +
r":-( :-) B-) :-)) ;-) |-) (./) {OK} {X} {i} {1} {2} {3} {*} {o}").split()To get the big icons for classic theme work, you have to change your wikiconfig.py as follows:
1 # -*- coding: iso-8859-1 -*-
2 """
3
4 MoinMoin - Configuration
5
6
7 """
8 import sys, os
9 from MoinMoin.config.multiconfig import DefaultConfig
10
11 def _(text): return text
12
13 class Config(DefaultConfig):
14
15 # standard buttons in the iconbar for classic theme
16 page_iconbar = ["edit", "view", "diff", "info", "subscribe", "raw", "print", ]
17 page_icons_table = {
18 # key querystr dict, title, icon-key
19 'diff': ({'action': 'diff'}, _("Diffs"), "diff-big"),
20 'info': ({'action': 'info'}, _("Info"), "info-big"),
21 'edit': ({'action': 'edit'}, _("Edit"), "edit-big"),
22 'unsubscribe': ({'action': 'subscribe'}, _("UnSubscribe"), "unsubscribe-big"),
23 'subscribe': ({'action': 'subscribe'}, _("Subscribe"), "subscribe-big"),
24 'raw': ({'action': 'raw'}, _("Raw"), "raw-big"),
25 'print': ({'action': 'print'}, _("Print"), "print-big"),
26 'view': ({}, _("View"), "view-big"),
27 }
Don't forget the def _(text): return text!!. You can also add here the new add/delete quicklinks and attach file icons or provide more meaningfull alt/title texts for the icons:
1 # standard buttons in the iconbar for classic theme
2 page_iconbar = ["edit", "view", "diff", "info", "subscribe", "quicklink", "attach", "print", ]
3
4 # classic theme big icons
5 page_icons_table = {
6 # key querystr dict alt-text icon-key
7 'edit': ({'action': 'edit'}, _("Edit"), "edit-big"),
8 'view': ({'action': 'refresh'}, _("View / Refresh"), "view-big"),
9 'diff': ({'action': 'diff'}, _("Show latest changes"), "diff-big"),
10 'info': ({'action': 'info'}, _("History / Page properties"), "info-big"),
11 'unsubscribe': ({'action': 'subscribe'}, _("UnSubscribe"), "unsubscribe-big"),
12 'subscribe': ({'action': 'subscribe'}, _("Subscribe"), "subscribe-big"),
13 'delquicklink': ({'action': 'quicklink'}, _("Delete quicklink"), "delquicklink-big"),
14 'addquicklink': ({'action': 'quicklink'}, _("Add quicklink"), "addquicklink-big"),
15 'attach': ({'action': 'AttachFile'}, _("Add/Manage files"), "attach-big"),
16 'print': ({'action': 'print'}, _("Print"), "print-big"),
17 }
Please be aware: the alt/title texts will only work if you apply the patch provided at MoinMoinBugs/MakeIconLinkLosesAltTitle.
To get the new irc and badinterwiki link icons work, you have to change wiki/htdocs/theme_name/css/common.css and wiki/htdocs/theme_name/css/msie.css
1 --- common_old.css 2006-12-26 16:05:04.000000000 +0100
2 +++ common.css 2007-02-01 15:07:46.000000000 +0100
3 @@ -30,10 +30,10 @@
4 a.nntp:before {content: url(../img/moin-news.png); margin: 0 0.2em;}
5 a.news:before {content: url(../img/moin-news.png); margin: 0 0.2em;}
6 a.telnet:before {content: url(../img/moin-telnet.png); margin: 0 0.2em;}
7 -a.irc:before, a.ircs:before {content: url(../img/moin-telnet.png); margin: 0 0.2em;}
8 +a.irc:before, a.ircs:before {content: url(../img/moin-irc.png); margin: 0 0.2em;}
9 a.mailto:before {content: url(../img/moin-email.png); margin: 0 0.2em;}
10 a.attachment:before {content: url(../img/moin-attach.png); margin: 0 0.2em;}
11 -a.badinterwiki:before {content: url(../img/moin-inter.png); margin: 0 0.2em;}
12 +a.badinterwiki:before {content: url(../img/moin-badinter.png); margin: 0 0.2em;}
13 a.interwiki:before {content: url(../img/moin-inter.png); margin: 0 0.2em;}
1 --- msie_old.css 2007-02-01 16:43:38.000000000 +0100
2 +++ msie.css 2007-02-01 15:44:08.000000000 +0100
3 @@ -9,10 +9,10 @@
4 a.nntp { padding-left: 14px; background: url('../img/moin-news.png') no-repeat left center; }
5 a.news { padding-left: 14px; background: url('../img/moin-news.png') no-repeat left center; }
6 a.telnet { padding-left: 14px; background: url('../img/moin-telnet.png') no-repeat left center; }
7 -a.irc, a.ircs { padding-left: 14px; background: url('../img/moin-news.png') no-repeat left center; }
8 +a.irc, a.ircs { padding-left: 17px; background: url('../img/moin-irc.png') no-repeat left center; }
9 a.mailto { padding-left: 14px; background: url('../img/moin-email.png') no-repeat left center; }
10 a.attachment { padding-left: 14px; background: url('../img/moin-attach.png') no-repeat left center; }
11 -a.badinterwiki { padding-left: 14px; background: url('../img/moin-inter.png') no-repeat left center; }
12 +a.badinterwiki { padding-left: 14px; background: url('../img/moin-badinter.png') no-repeat left center; }
13 a.interwiki { padding-left: 14px; background: url('../img/moin-inter.png') no-repeat left center; }
14
15 #pagetrail li, #pagelocation li {
That's it.. Have fun!
P.S.: MoinDropline goes nicely together with TaskPlanner where you can also find a new macro AttachTable which displays in a expandable and collapsable table all the file attachments to a page. AttachTable has also some built in mime-type classes, so you will get also nice icons in front of your files. These icons are also in Dropline style..
Comments
Nice work! -- ThiloPfennig 2007-01-02 00:25:51
Thanks Thilo! Above I have no provided a new extended version of the icon set with a new, separate irc icon. -- OliverSiemoneit 2007-02-02 13:45:15
Thank you for your work, but I don't understand where I should put the _init_.py file. Could you explain this a bit more extensively for us newbies... Thanks -- Ithakos
In your installation you have to look for the folder !MoinMoin/theme. In this folder you can find a file _init_.py. Open it with a capable editor (best use the IDLE editor with is provided with your Python installation). Look in the file for the big icon dict icons = {...} (it's just at the beginning) and change/replace that dict with the new dict provided above (I called that _init_.py, which is in fact wrong. The file just shows how to change the dict in theme/_init_.py). Instead of changing the !MoinMoin/theme/_init_.py file you can also change the theme code which you can find in wiki/data/plugin/theme (You have to do that with the exe-Desktop-Edition to get icons work there). Open there the theme.py file (e.g. modern.py) of the theme for which you want to provide the new icon set. Paste into this file the dict icons= {...} as given above (You can have a look a the discussion at TaskPlanner especially TaskPlanner/TaskPlanner.zip to see exactly where to put the dict). But to make this clear: If you change !MoinMoin/theme/_init_.py all installed themes are affected by the changes, i.e. all themes do get new icons (don't forget to copy the new icons to all the wiki/htdocs/theme_name/img dirs). If you change e.g. wiki/data/plugin/theme/modern.py, only modern-theme is affected by the changes. Does this answer your question? Maybe do it step by step. Try first to change !MoinMoin/theme/_init_.py or wiki/plugin/theme/modern.py, restart the Moin server and look if it works (best check with page SyntaxReference). If that works you can go on to change !MoinMoin/config.py and add there the new question mark smiley (no easy way to do that in the exe-DesktopEdition). Restart Moin and check if the code <?> is recognized. If you want also a new irc icon and badinterwiki link icon you can go on to change wiki/htdocs/theme_name/css/common.css and wiki/htdocs/theme_name/css/msie.css in all the themes which should have that. Then maybe you can try - if you use classic theme - to get the big icons work by changing the wikiconig.py as described above. Ok? -- OliverSiemoneit 2007-02-02 13:45:15
- Thanks! I was looking in the htdocs first. Now I see I have to go to the /usr/share/python-support/python-moinmoin/!MoinMoin/theme on my Debian-machine -- Ithakos
Ah, ok. I'm a heavy user of DesktopEdition only. It's true in the normal Moin version, the code which needs to be changed is fragmented in different directory trees... But be aware: the instructions given above are for Moin1.6! In Moin versions prior than 1.6 the smiley definitions are located in !MoinMoin/config.py. You have to do also some changes there - but I haven't tested this.. -- OliverSiemoneit 2007-02-02 23:40:29