Changeset 741424

Timestamp:

07/16/2013 03:51:02 AM (13 years ago)

Author:

setzer

Message:

1.0 to trunk

Location:

side-matter

Files:

• assets/screenshot-1.png (modified) (previous)
• assets/screenshot-2.png (modified) (previous)
• trunk/css2 (added)
• trunk/css2/side-matter-admin.css (added)
• trunk/css2/side-matter.css (added)
• trunk/js2 (added)
• trunk/js2/side-matter-admin.js (added)
• trunk/js2/side-matter.js (added)
• trunk/languages (added)
• trunk/readme.txt (modified) (12 diffs)
• trunk/side-matter.php (modified) (24 diffs)
• trunk/uninstall.php (modified) (1 diff)

side-matter/trunk/readme.txt

@@ -1 +1 @@
 === Side Matter ===
 Contributors: setzer
-Tags: footnote, footnotes, endnote, endnotes, sidenote, sidenotes, annotation, annotations, citation, citations, shortcode, widget
+Tags: academic, annotation, annotations, bibliography, bibliographic, citation, citations, cite, commentary, endnote, endnotes, footnote, footnotes, note, notes, reference, references, scholar, shortcode, side, sidebar, sidenote, sidenotes, widget
 Requires at least: 3.0
 Tested up to: 3.6
@@ -12 +12 @@
 == Description ==
 
-Side Matter turns your footnotes into sidenotes, magically aligning each note in the sidebar next to its corresponding reference in the text. The plugin's easy-to-use shortcode and widget make it a lightweight, visually elegant tool for annotating your posts and pages.
-
-Like margin notes in a printed text, sidenotes are well-suited for citations, digressions, cross-references, and commentary. The visual effect is similar to that used for annotations by Grantland and other websites.
+Side Matter turns your footnotes into sidenotes, magically aligning each note in the sidebar next to its corresponding reference in the text. The plugin's easy-to-use shortcode and widget make it a lightweight,  visually distinctive tool for scholars, editors, and writers of all kinds.
+
+Sidenotes have long been used in printed works to incorporate citations, digressions, and remarks into the flow of a text. They work equally well on the Web; unlike hyperlinked footnotes, sidenotes don't require the user to click away from the main content of an page to follow up on a particular reference.
 
 Side Matter includes an options menu for toggling settings, as well as a set of built-in classes for [styling with CSS](http://wordpress.org/extend/plugins/side-matter/other_notes/). It works well with many popular base themes, including Twenty Twelve, Twenty Ten, Responsive, and Toolbox.
@@ -39 +39 @@
 = Where is Side Matter's options menu? =
 
-The options menu can be found on your Reading Settings screen.
+You can find the options menu on your Reading Settings screen.
 
 = Does Side Matter work with responsive layouts? =
 
-Yes. The plugin includes an option, turned off by default, to enable sidenote re-positioning upon resize/zoom in responsive themes. Enable this feature using the Responsive Positioning control in Side Matter's options menu. (It's best to leave this feature disabled if your theme is not responsive.)
+Yes. The plugin includes an option, turned off by default, to responsively re-position sidenotes upon window resize or zoom. Enable this function using the Responsive Positioning control in Side Matter's options menu.
 
 = My notes just sit at the top of the sidebar. =
 
-Your theme may not be linking `side-matter.js`, the script that aligns Side Matter notes. Check the page source to see if `side-matter.js` has been linked; if not, the problem may lie with your theme. In order to properly enqueue the script and other Side Matter assets, theme templates must include calls to [`wp_head`](http://codex.wordpress.org/Function_Reference/wp_head) and [`wp_footer`](http://codex.wordpress.org/Function_Reference/wp_footer).
+Your theme may not be linking `side-matter.js`, the script that aligns sidenotes. Check the page source to see if `side-matter.js` has been linked; if not, the plugin may not be compatible with your theme.
 
 = My notes appear at a regular vertical offset from their proper position. =
 
-Some themes idiosyncratically display notes at an offset from their corresponding references in the text. Side Matter's options menu, on the Reading Settings screen, includes a field for arbitrarily adjusting your notes' vertical position.
+Some themes idiosyncratically display notes at an offset from their corresponding references in the text. As a workaround for this problem, Side Matter's options menu includes a field for arbitrarily adjusting your notes' vertical offset.
 
 = Why doesn't the plugin work with some themes? =
 
-Not all themes are built to support the grafting-on of a substantial layout component like Side Matter. While the plugin works well with most base themes featuring a sidebar (including Twenty Twelve, Twenty Ten, Responsive, and Toolbox), it isn't guaranteed to display notes perfectly within all layouts. In many cases, a little tinkering with note offset or CSS will fix the problem. If you have ongoing questions about implementing sidenotes within a particular theme, though, your best resource may be the theme author.
+Not all themes are built to readily absorb a new layout component like Side Matter. The plugin works well with most base themes that incorporate a conventional sidebar, but it isn't guaranteed to display notes perfectly within all layouts. Tinkering with note offset or CSS will fix most problems; in other cases, it's best to consult the theme author.
 
 = Can sidenotes be displayed without using the widget? =
 
-Yes. Use the custom action `side_matter_list_notes` in your sidebar template:
+Yes. Use the custom action `side_matter_list_notes` in your sidebar template, as seen below:
 
     <?php
@@ -65 +65 @@
     ?>
 
-This action generates a list of Side Matter notes without wrapping them in the widget `div`. If incorporating Side Matter into a custom theme, note that your templates must include calls to [`wp_head`](http://codex.wordpress.org/Function_Reference/wp_head) and [`wp_footer`](http://codex.wordpress.org/Function_Reference/wp_footer) to properly enable the plugin.
+= Some numeral formats (such as Armenian or Greek) don't display properly in my browser. =
+
+Browser support for the CSS `armenian`, `georgian`, `hebrew`, and `lower-greek` list styles varies. ([See Web Platform Docs](http://docs.webplatform.org/wiki/css/properties/list-style-type) for a list.) Decimal, Latin, and Roman numerals enjoy broader support.
 
 == Screenshots ==
@@ -74 +76 @@
 
 == Changelog ==
+
+= 1.0 =
+* Added support for Armenian, Georgian, Greek, and Hebrew numeral formats.
+* Fixed two IE-specific bugs related to list numeral and `title` attribute display.
+* Numbered classes have been removed.
+* Plugin is now localization-ready.
 
 = 0.9 =
 * Added a preview field to the options menu.
-* Added an option to display reference figures in alphabet and Roman numeral formats.
+* Added an option to display reference figures in Latin alphabet and Roman numeral formats.
 * Added an option to set inline colors for Side Matter elements.
-* Reference numeral link tags have been given a `title` attribute for accessibility.
+* Reference numeral `a` tags have been given a `title` attribute for accessibility.
 * Removed deprecated element classes `side-matter-ol` and `side-matter-li`. Numbered classes, e.g. `side-matter-sup-6`, are now deprecated.
-* Responsive positioning and fade effects are now turned off by default.
+* Responsive positioning and fade effects are now turned off by default to spare inexperienced users the script load.
 * Side Matter's options menu is now linked from its entry on the Installed Plugins screen.
 
@@ -114 +122 @@
 == Upgrade Notice ==
 
+= 1.0 =
+This update fixes a few IE-specific bugs and also features several important additions, including new numeral formats and localization support.
+
 = 0.9 =
 This update adds a number of features, including alternate numeral formats and a color picker for Side Matter elements. Users who have modified `side-matter.css` are advised to make a backup copy before updating.
@@ -131 +142 @@
 == Styling Side Matter with CSS ==
 
-As of version 0.9, Side Matter's options menu includes a color picker for rendering notes and figures in custom colors. Altering the appearance of Side Matter elements beyond this requires some tinkering with Cascading Style Sheets (CSS). This guide assumes some basic familiarity with CSS; beginning users may wish to start with a [CSS tutorial](http://www.htmldog.com/guides/css/beginner/).
-
- The easiest way to add custom styles to your site is to use a plugin that houses your custom CSS in the WordPress database, preserving it even when Side Matter (or your theme) is updated. [Jetpack Custom CSS](http://wordpress.org/extend/plugins/jetpack/) is a good example.
-
-Side Matter comes with a set of built-in classes that make it easy to customize the appearance of sidenote and reference elements using [class selectors](http://www.htmldog.com/guides/css/intermediate/classid/). For example, all Side Matter elements may be styled at once using the class `side-matter`. The following rule will instruct browsers to render all Side Matter content (reference numerals, sidenote numerals, and sidenote text) in blue:
+As of version 0.9, Side Matter's options menu includes a color picker for rendering notes and figures in custom colors. Altering the appearance of Side Matter elements beyond this requires some tinkering with Cascading Style Sheets (CSS). This guide assumes some familiarity with CSS; if you're a beginner, start with a [tutorial](http://www.htmldog.com/guides/css/beginner/).
+
+ The simplest way to add custom styles to your site is to employ a plugin that houses your custom CSS in the WordPress database, thus preserving it even if Side Matter (or your theme) is updated. [Jetpack Custom CSS](http://wordpress.org/extend/plugins/jetpack/) is a good example.
+
+(Note that inline color styles set in the Side Matter options menu will generally override any custom styles you set elsewhere. If you're planning to use a custom stylesheet as described here, be sure to disable custom colors in the options menu.)
+
+Side Matter comes with a set of built-in classes that make it easy to customize the appearance of sidenote and reference elements using [class selectors](http://www.htmldog.com/guides/css/intermediate/classid/). For example, all Side Matter elements may be styled at once using the class `side-matter`. The following rule will render all Side Matter content (reference numerals, sidenote numerals, and sidenote text) in blue:
 
     .side-matter {
@@ -141 +154 @@
     }
 
-Notes and references may be styled with greater precision using element-specific class selectors. The following rules will render reference and list numerals in red while leaving sidenote text black:
+Notes and references may be styled with greater precision using element-specific class selectors. The following rules will render reference and list numerals in red while leaving sidenote text black (see [Screenshots](http://wordpress.org/extend/plugins/side-matter/screenshots/) for a similar example):
 
     a.side-matter-ref, ol.side-matter-list {
@@ -151 +164 @@
     }
 
-In some cases, your custom CSS may fail to take effect because the theme CSS carries greater [specificity](http://www.htmldog.com/guides/css/intermediate/specificity/). There are ways around this. For example, if you can't modify the color of superscript reference links because your theme's rules have greater specificity, try overriding the theme stylesheet via nesting or an ID selector:
+In some cases, your custom CSS may fail to take effect because the theme CSS has a greater [specificity](http://www.htmldog.com/guides/css/intermediate/specificity/). There are ways around this. For example, if you can't modify the color of superscript reference links because your theme's rules have greater specificity, try overriding the theme stylesheet via nesting or an ID selector:
 
     .entry-content > p > a.side-matter.side-matter-ref {
@@ -169 +182 @@
 A full list of included class and ID selectors may be found below.
 
+= List of Class Selectors =
+Here is a complete list of Side Matter element class selectors and their uses:
+
+* `a.side-matter-ref` selects the `a` link tags that enclose in-text reference numerals. Use this class to modify the links' colors, underline, etc. Target a specific reference link using its ID selector (e.g. `#ref-5`).
+* `sup.side-matter-sup` selects the `sup` (superscript) tags that enclose in-text reference numerals. Use this class to modify the numerals' typographic properties, such as size, offset, and font.
+* `div.side-matter-widget` selects the `div` element that encloses the Side Matter widget.
+* `ol.side-matter-list` selects the `ol` (ordered list) element that encloses notes in the sidebar, including note numeral figures.
+* `li.side-matter-note` selects individual sidenote `li` (list item) elements. Target a specific note using the note's ID selector (e.g. `#note-6`).
+* `div.side-matter-text` selects the `div` elements that enclose sidenote text, but not sidenote list numerals. Use this to style sidenote text separately from sidenote numerals.
+* WordPress further wraps each note paragraph in a `p` tag. Because they are generated outside Side Matter, these `p` elements cannot be selected directly using the `side-matter` class. Instead, target them using a [child selector](http://www.htmldog.com/guides/css/advanced/selectors/), e.g. `div.side-matter-text > p`.
+
 = Default CSS =
-Note that inline color styles set in the Side Matter options menu will generally override any style rules you set in a custom CSS plugin or elsewhere. If modifying an element's `color` property with CSS, make sure to first disable custom colors in the options menu.
-
-Side Matter also sets a few rules by default in the stylesheet `side-matter.css`. These may be readily superseded by your theme stylesheet or custom CSS.
+Side Matter sets a few default rules by way of the stylesheet `side-matter.css`. These may be readily superseded by your theme stylesheet or custom CSS.
+
+The first rule removes underlines from reference numeral links:
 
     a.side-matter-ref:link,
@@ -180 +204 @@
         text-decoration: none;
     }
+
+The second rule specifies a consistent cross-theme appearance for superscript figures:
     
     sup.side-matter-sup {
@@ -188 +214 @@
         line-height: 0;
     }
-
-The above rules remove underlines from reference links (`text-decoration: none`) and specify a consistent, cross-theme appearance for superscript figures.
-
-= List of Class Selectors =
-Here is a complete list of Side Matter element class selectors and their uses:
-
-* `a.side-matter-ref` selects the `a` link tags that enclose in-text reference numerals. Use this class to modify the links' colors, underline, etc. Target a specific reference link using its ID selector (e.g. `#ref-5`).
-* `sup.side-matter-sup` selects the `sup` (superscript) tags that enclose in-text reference numerals. Use this class to modify the numeral figures' typographic properties, such as size, offset, and typeface.
-* `div.side-matter-widget` selects the `div` element that encloses the Side Matter widget.
-* `ol.side-matter-list` selects the `ol` (ordered list) element that encloses notes in the sidebar, including note numeral figures.
-* `li.side-matter-note` selects individual sidenote `li` (list item) elements. Target a specific note using the note's ID selector (e.g. `#note-6`).
-* `div.side-matter-text` selects the `div` elements that enclose sidenote text, but not sidenote list numerals. Use this to style sidenote text separately from sidenote numerals.
-* WordPress further wraps each note paragraph in a `p` tag. Because they are generated outside Side Matter, these `p` elements cannot be selected directly using the `side-matter` class. Instead, target them using a [child selector](http://www.htmldog.com/guides/css/advanced/selectors/), e.g. `div.side-matter-text > p`.

side-matter/trunk/side-matter.php

@@ -4 +4 @@
 Plugin URI: http://wordpress.org/extend/plugins/side-matter/
 Description: Turns your footnotes into sidenotes, magically positioning each note in the sidebar next to its corresponding reference in the text.
-Version: 0.9
+Text Domain: side-matter
+Version: 1.0
 Author: Christopher Setzer
 Author URI: http://christophersetzer.com
-License: GPLv2
+License: GPLv2 or later
 */
 
@@ -39 +40 @@
     public function __construct() { // Set up defaults, register actions
 
+        add_action( 'admin_init', array( &$this, 'load_textdomain' ) );
         add_action( 'admin_init', array( &$this, 'build_settings_section' ) ); // Assemble settings section
         add_action( 'admin_enqueue_scripts', array( &$this, 'admin_enqueue' ) ); // Load script and CSS for options menu
@@ -45 +47 @@
         add_shortcode( 'ref', array( &$this, 'shortcode' ) ); // Register shortcode
         add_action( 'wp_enqueue_scripts', array( &$this, 'enqueue' ) ); // Load script and CSS; embed variables in script
+
         add_action( 'widgets_init', array( &$this, 'add_widget' ) ); // Register widget-loading function
 
@@ -68 +71 @@
             );
         $this->options = wp_parse_args( get_option( 'side_matter_options' ), $this->defaults ); // Get options from database and apply defaults in place of any that are not set
-        $this->version = 0.9; // Current version of plugin
-
-    }
-
-    public function admin_enqueue( $hook ) { // Enqueue script and stylesheet for Side Matter options menu
-
-        if ( 'options-reading.php' != $hook ) return;
-
-        global $wp_version;
-
-        wp_enqueue_style( 'side-matter-admin', plugins_url( 'css/side-matter-admin.css', __FILE__ ), null, $this->version, 'screen' );
-
-        if ( version_compare( $wp_version, 3.5, 'gt' ) ) { // Only enqueue color picker style and dependency if WP version is 3.5 or higher
-            wp_enqueue_style( 'wp-color-picker' );
-            wp_enqueue_script( 'side-matter-admin-js', plugins_url( 'js/side-matter-admin.js', __FILE__ ), array( 'wp-color-picker' ), $this->version, true );
-        } else {
-            wp_enqueue_script( 'side-matter-admin-js', plugins_url( 'js/side-matter-admin.js', __FILE__ ), false, $this->version, true );
-        }
-
+        $this->version = '1.0'; // Current version of plugin
+
+    }
+
+    public function load_textdomain() {
+        $dir = dirname( plugin_basename( __FILE__ ) ) . '/languages/';
+        load_plugin_textdomain( 'side-matter', false, $dir );
     }
 
@@ -97 +88 @@
             'preview_field' => array(
                 'id' => 'preview_field',
-                'title' => 'Preview',
-                'description' => "The preview field incorporates only styles set below, and does not reflect your site's theme.",
+                'title' => __( 'Preview', 'side-matter' ),
                 'label_for' => 'preview_field'
                 ),
             'user_colors' => array(
                 'id' => 'user_colors',
-                'title' => 'Colors',
-                'label' => 'Use custom colors for Side Matter elements',
+                'title' => __( 'Colors', 'side-matter' ),
+                'label' => __( 'Use custom colors for Side Matter elements', 'side-matter' ),
                 'label_for' => 'colors_enabled',
                 'colors' => array(
-                    'figure_color' => 'Numeral figures',
-                    'text_color' => 'Note text'
+                    'figure_color' => __( 'Reference numerals', 'side-matter' ),
+                    'text_color' => __( 'Note text', 'side-matter' )
                     )
                 ),
             'figure_style' => array(
                 'id' => 'figure_style',
-                'title' => 'Display reference numerals as',
+                'title' => __( 'Display numeral figures as', 'side-matter' ),
                 'styles' => array(
-                    'decimal' => 'Decimal: 1, 2, 3, 4, 5, 6, …',
-                    'lower-alpha' => 'Latin: a, b, c, d, e, f, …',
-                    'lower-roman' => 'Roman: i, ii, iii, iv, v, vi, …'
+                    'decimal' => __( 'Decimal: 1, 2, 3, 4, 5, 6, …', 'side-matter' ),
+                    'lower-alpha' => __( 'Latin: a, b, c, d, e, f, …', 'side-matter' ),
+                    'lower-roman' => __( 'Roman: i, ii, iii, iv, v, vi, …', 'side-matter' ),
+                    'armenian' => __( 'Armenian: Ա, Բ, Գ, Դ, Ե, Զ, …', 'side-matter' ),
+                    'georgian' => __( 'Georgian: ა, ბ, გ, დ, ე, ვ, …', 'side-matter' ),
+                    'lower-greek' => __( 'Greek: α, β, γ, δ, ε, ζ, …', 'side-matter' ),
+                    'hebrew' => __( 'Hebrew: ו ,ה ,ד ,ג ,ב ,א, …', 'side-matter' ), // Comma weirdness is due to RTL text reversal
+                    'none' => __( 'None', 'side-matter' )
                     )
                 ),
             'is_responsive' => array(
                 'id' => 'is_responsive',
-                'title' => 'Responsive Positioning',
-                'label' => 'Responsively position notes when window is resized or zoomed',
+                'title' => __( 'Responsive Positioning', 'side-matter' ),
+                'label' => __( 'Responsively position notes when window is resized or zoomed', 'side-matter' ),
                 'label_for' => 'is_responsive',
                 ),
             'use_effects' => array(
                 'id' => 'use_effects',
-                'title' => 'Fade Effects',
-                'label' => 'Use smoothing fade effects when displaying or positioning notes',
+                'title' => __( 'Fade Effects', 'side-matter' ),
+                'label' => __( 'Use fade effects when displaying notes', 'side-matter' ),
                 'label_for' => 'use_effects'
                 ),
             'note_adjust' => array(
                 'id' => 'note_adjust',
-                'title' => 'Adjust vertical offset of notes by',
-                'description' => 'A positive value will push notes up; a negative value will push them down.',
-                'label' => 'px',
+                'title' => __( 'Adjust vertical offset of notes by', 'side-matter' ),
+                'label' => __( 'px', 'side-matter' ),
+                'description' => __( 'A positive offset will push notes up; a negative offset will push them down.', 'side-matter' ),
                 'label_for' => 'note_adjust',
                 'max' => '9999',
@@ -143 +138 @@
             'pages_active' => array(
                 'id' => 'pages_active',
-                'title' => 'Display Side Matter notes on',
-                'description' => 'These conditions may override one another in some cases, as when a static page is set as your front page.',
+                'title' => __( 'Display Side Matter notes on', 'side-matter' ),
                 'pages' => array(
-                    'front' => 'Front page',
-                    'home' => 'Posts page',
-                    'post' => 'Single posts',
-                    'page' => 'Single pages'
+                    'front' => __( 'Front page', 'side-matter' ),
+                    'home' => __( 'Posts page', 'side-matter' ),
+                    'post' => __(  'Posts', 'side-matter' ),
+                    'page' => __( 'Pages', 'side-matter' )
                     )
                 )
             );
 
-        add_settings_section( $section, 'Side Matter', array( &$this, 'build_section_heading'), $page );
+        add_settings_section( $section, __( 'Side Matter', 'side-matter' ), array( &$this, 'build_section_heading' ), $page );
         foreach ( $fields as $option => $param ) { // Loop through settings field values and send them, one at a time, to build_field()
             extract ( $fields[ $option ] );
@@ -164 +158 @@
 
     public function build_section_heading() {
-        echo '<p>Use the following options to change the appearance and functionality of Side Matter references and notes.</p>';
+        return;
     }
 
@@ -172 +166 @@
 
         $options = $this->options;
+        $figure_style = $options['figure_style'];
         $options['preview_field'] = null;
         $state = $options[ $id ];
@@ -178 +173 @@
             case 'preview_field':
                 global $side_matter;
-                $figure = $side_matter->get_figure( 1 );
-                $type = $side_matter->get_attr( 'type' );
+                $figure = $side_matter->get_figure( 1, $options['figure_style'] );
                 ?>
                 <div class='side-matter-field' tabindex='0'>
                     <div class='side-matter-content'>
                         <div class='side-matter-main'>
-                            Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.<sup class='side-matter-ref'><?php echo $side_matter->get_figure( 1 ) ?></sup> Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
+                            Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.<sup class='side-matter-ref'><?php echo $side_matter->get_figure( 1, $figure_style ) ?></sup> Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
                         </div>
                         <div class='side-matter-side'>
                             <ol class='side-matter-list'>
-                                <li class='side-matter-note'<?php echo $type ?>>
+                                <li class='side-matter-note' style='list-style-type: <?php echo $figure_style ?>;'>
                                     <div class='side-matter-text'>
                                         Velit esse cillum dolore eu fugiat nulla pariatur.
@@ -197 +191 @@
                     </div>
                 </div>
-                <p class='description'>
-                    <?php echo wptexturize( $description ) ?>
-                </p>
                 <?php
                 break;
@@ -205 +196 @@
                 ?>
                 <fieldset>
-                <label><input id='colors_enabled' type='checkbox' name='side_matter_options[<?php echo $id ?>][colors_enabled]' value='1' <?php checked( 1, $state['colors_enabled'] ) ?> /> <?php echo $label ?></label>
-                <ul class='user_colors'>
-                <?php
-                foreach ( $colors as $color => $color_label ) {
+                    <label><input id='colors_enabled' type='checkbox' name='side_matter_options[<?php echo $id ?>][colors_enabled]' value='1' <?php checked( 1, $state['colors_enabled'] ) ?> /> <?php echo $label ?></label>
+                    <ul class='user_colors'>
+                    <?php
+                    foreach ( $colors as $color => $color_label ) {
+                        ?>
+                        <li>
+                            <label><?php echo $color_label ?>:<br>
+                            <input class='color-input <?php echo $color ?>' type='text' name='side_matter_options[<?php echo $id ?>][colors][<?php echo $color ?>]' maxlength='7' data-default-color='<?php echo $this->defaults['user_colors']['colors'][ $color ] ?>' value='<?php echo $state['colors'][ $color ] ?>' /></label>
+                        </li>
+                        <?php
+                    }
                     ?>
-                    <li>
-                        <label><?php echo $color_label ?>:<br>
-                        <input class='color-input <?php echo $color ?>' type='text' name='side_matter_options[<?php echo $id ?>][colors][<?php echo $color ?>]' maxlength='7' data-default-color='<?php echo $this->defaults['user_colors']['colors'][ $color ] ?>' value='<?php echo $state['colors'][ $color ] ?>' /></label>
-                    </li>
+                    </ul>
+                </fieldset>
+                <?php
+                break;
+            case 'figure_style':
+                ?>
+                <select name='side_matter_options[<?php echo $id ?>]' id='<?php echo $id ?>'>
+                <?php
+                foreach ( $styles as $style => $style_title ) {
+                    ?>
+                    <option value='<?php echo $style ?>' <?php selected( $style, $state ) ?>><?php echo $style_title ?></option>
                     <?php
                 }
                 ?>
-                </ul>
-                </fieldset>
-                <?php
-                break;
-            case 'figure_style':
-                foreach ( $styles as $style => $style_label ) {
-                    ?>
-                    <label><input id='<?php echo $style ?>' type='radio' name='side_matter_options[<?php echo $id ?>]' value='<?php echo $style ?>' <?php checked( $style, $state ) ?>/> <?php echo $style_label ?></label><br>
-                    <?php
-                }
+                </select>
+                <?php
                 break;
             case 'note_adjust':
                 ?>
                 <label><input id='<?php echo $id ?>' type='number' name='side_matter_options[<?php echo $id ?>]' value='<?php echo $state ?>' step='1' max='<?php echo $max ?>' min='<?php echo $min ?>' class='small-text' /> <?php echo $label ?></label>
-                <p class='description'><?php echo $description ?></p>
+                <p class='description'>
+                    <?php echo $description ?>
+                </p>
                 <?php
                 break;
@@ -246 +245 @@
                     <?php
                 }
-                ?>
-                <p class='description'><?php echo $description ?></p>
-                <?php
                 break;
         }
@@ -259 +255 @@
         $options = $this->options;
 
-        $options['user_colors']['colors_enabled'] = ( ! isset( $input['user_colors']['colors_enabled'] ) ) ? 0 : $input['user_colors']['colors_enabled'];
+        $options['user_colors']['colors_enabled'] = ( ! isset( $input['user_colors']['colors_enabled'] ) ) ? (int) 0 : (int) $input['user_colors']['colors_enabled'];
         foreach ( $defaults['user_colors']['colors'] as $color => $code ) { // Validate 3- or 6-character hex color code input
             $input_code = $input['user_colors']['colors'][ $color ];
@@ -267 +263 @@
         }
         $options['figure_style'] = ( ! isset( $input['figure_style'] ) ) ? $defaults['figure_style'] : $input['figure_style'];
-        $options['is_responsive'] = ( ! isset( $input['is_responsive'] ) ) ? 0 : $input['is_responsive'];
-        $options['use_effects'] = ( ! isset( $input['use_effects'] ) ) ? 0 : $input['use_effects'];
-        $options['note_adjust'] = ( ! isset( $input['note_adjust'] ) ) ? $defaults['note_adjust'] : intval( $input['note_adjust'] );
+        $options['is_responsive'] = ( ! isset( $input['is_responsive'] ) ) ? (int) 0 : (int) $input['is_responsive'];
+        $options['use_effects'] = ( ! isset( $input['use_effects'] ) ) ? (int) 0 : (int) $input['use_effects'];
+        $options['note_adjust'] = ( ! isset( $input['note_adjust'] ) ) ? (int) $defaults['note_adjust'] : (int) intval( $input['note_adjust'] );
         foreach ( $defaults['pages_active'] as $page => $setting ) {
-            $options['pages_active'][ $page ] = ( ! isset( $input['pages_active'][ $page ] ) ) ? 0 : $input['pages_active'][ $page ];
-        }
+            $options['pages_active'][ $page ] = ( ! isset( $input['pages_active'][ $page ] ) ) ? (int) 0 : (int) $input['pages_active'][ $page ];
+        }
+
+        if ( isset( $options['note_buffer'] ) ) unset( $options['note_buffer'] ); // Remove deprecated 'note_buffer'
+        if ( isset( $options['html_class'] ) ) unset( $options['html_class'] ); // Don't write 'html_class' to DB
+
         return $options;
+
+    }
+
+    public function admin_enqueue( $hook ) { // Enqueue script and stylesheet for Side Matter options menu
+
+        if ( 'options-reading.php' != $hook ) return;
+
+        global $wp_version;
+
+        wp_enqueue_style( 'side-matter-admin', plugins_url( 'css/side-matter-admin.css', __FILE__ ), null, $this->version, 'screen' );
+
+        if ( version_compare( $wp_version, 3.5, 'ge' ) ) { // Only enqueue color picker style and dependency if WP version is 3.5 or higher
+            wp_enqueue_style( 'wp-color-picker' );
+            wp_enqueue_script( 'side-matter-admin-js', plugins_url( 'js/side-matter-admin.js', __FILE__ ), array( 'wp-color-picker' ), $this->version, true );
+        } else {
+            wp_enqueue_script( 'side-matter-admin-js', plugins_url( 'js/side-matter-admin.js', __FILE__ ), false, $this->version, true );
+        }
 
     }
@@ -279 +296 @@
     public function add_plugins_link( $actions ) { // Link to Side Matter's options menu from Plugins screen
         $url = admin_url( 'options-reading.php' );
-        $array = array( 'settings' => "<a href='{$url}'>Settings</a>" );
+        $settings_string = __( 'Settings', 'side-matter' );
+        $array = array( 'settings' => "<a href='{$url}'>{$settings_string}</a>" );
         return array_merge( $array, $actions );
     }
 
-    public function shortcode( $atts, $content = null ) { // Send shortcode content to add_note(), and return formatted reference figure via print_ref()
+    public function shortcode( $atts, $content = null ) { // Send shortcode content to add_note(), and return formatted reference figure via format_ref()
         global $side_matter;
         if ( ! $side_matter->check_page() ) { // Only return figure on this page if permitted by user settings
@@ -289 +307 @@
         } else {
             $note_id = $side_matter->add_note( $content ); // add_note() returns number of this note
-            $ref = $side_matter->print_ref( $note_id ); // Get formatted reference figure from print_ref()
+            $ref = $side_matter->format_ref( $note_id ); // Get formatted reference figure from format_ref()
             return $ref;
         }
@@ -306 +324 @@
                 'html_class' => __( $this->options['html_class'] )
                 ) );
-            wp_enqueue_style( 'side-matter', plugins_url( 'css/side-matter.css', __FILE__ ), null, $this->version, 'screen' );
+            wp_enqueue_style( 'side-matter', plugins_url( 'css/side-matter.css', __FILE__ ), null, $this->version );
         }
     }
@@ -318 +336 @@
 class Side_Matter {
 
+    public $options = array();
     public $notes = array();
+    public $figures = array();
 
     public function __construct() { // Register custom action 'side_matter_list_notes' for use in widget or elsewhere
+        global $side_matter_admin;
         add_action( 'side_matter_list_notes', array( &$this, 'list_notes' ) );
+        $this->options = $side_matter_admin->options;
+        $this->figures = array(
+            'armenian' => array( 'Ք' => 9000, 'Փ' => 8000, 'Ւ' => 7000, 'Ց' => 6000, 'Ր' => 5000, 'Տ' => 4000, 'Վ' => 3000, 'Ս' => 2000, 'Ռ' => 1000, 'Ջ' => 900, 'Պ' => 800, 'Չ' => 700, 'Ո' => 600, 'Շ' => 500, 'Ն' => 400, 'Յ' => 300, 'Մ' => 200, 'Ճ' => 100, 'Ղ' => 90, 'Ձ' => 80, 'Հ' => 70, 'Կ' => 60, 'Ծ' => 50, 'Խ' => 40, 'Լ' => 30, 'Ի' => 20, 'Ժ' => 10, 'Թ' => 9, 'Ը' => 8, 'Է' => 7, 'Զ' => 6, 'Ե' => 5, 'Դ' => 4, 'Գ' => 3, 'Բ' => 2, 'Ա' => 1 ),
+            'georgian' => array( 'ჵ' => 10000, 'ჰ' => 9000, 'ჯ' => 8000, 'ჴ' => 7000, 'ხ' => 6000, 'ჭ' => 5000, 'წ' => 4000, 'ძ' => 3000, 'ც' => 2000, 'ჩ' => 1000, 'შ' => 900, 'ყ' => 800, 'ღ' => 700, 'ქ' => 600, 'ფ' => 500, 'ჳ' => 400, 'ტ' => 300, 'ს' => 200, 'რ' => 100, 'ჟ' => 90, 'პ' => 80, 'ო' => 70, 'ჲ' => 60, 'ნ' => 50, 'მ' => 40, 'ლ' => 30, 'კ' => 20, 'ი' => 10, 'თ' => 9, 'ჱ' => 8, 'ზ' => 7, 'ვ' => 6, 'ე' => 5, 'დ' => 4, 'გ' => 3, 'ბ' => 2, 'ა' => 1 ),
+            'hebrew' => array( 'ת' => 400, 'ש' => 300, 'ר' => 200, 'ק' => 100, 'צ' => 90, 'פ' => 80, 'ע' => 70, 'ס' => 60, 'נ' => 50, 'מ' => 40, 'ל' => 30, 'כ' => 20, 'יט' => 19, 'יח' => 18, 'יז' => 17, 'טז' => 16, 'טו' => 15, 'י' => 10, 'ט' => 9, 'ח' => 8, 'ז' => 7, 'ו' => 6, 'ה' => 5, 'ד' => 4, 'ג' => 3, 'ב' => 2, 'א' => 1 ),
+            'lower-alpha' => array( 'a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z' ),
+            'lower-greek' => array( 'α', 'β', 'γ', 'δ', 'ε', 'ζ', 'η', 'θ', 'ι', 'κ', 'λ', 'μ', 'ν', 'ξ', 'ο', 'π', 'ρ', 'σ', 'τ', 'υ', 'φ', 'χ', 'ψ', 'ω' ),
+            'lower-roman' => array( 'm' => 1000, 'cm' => 900, 'd' => 500, 'cd' => 400, 'c' => 100, 'xc' => 90, 'l' => 50, 'xl' => 40, 'x' => 10, 'ix' => 9, 'v' => 5, 'iv' => 4, 'i' => 1 )
+            );
     }
 
     public function check_page() { // Check whether to display Side Matter elements on current page based on user settings
-        global $side_matter_admin;
-        extract( $side_matter_admin->options['pages_active'], EXTR_SKIP );
+        extract( $this->options['pages_active'], EXTR_SKIP );
         $check_pages = array(
             ( is_front_page() && $front ),
@@ -340 +369 @@
     }
 
-    public function get_attr( $attr ) { // Generate inline style and type attributes for HTML tags
-        global $side_matter_admin;
-        $options = $side_matter_admin->options;
-        switch ( $attr ) {
-            case 'figure_color':
-            case 'text_color':
-                if ( ! $options['user_colors']['colors_enabled'] ) {
-                    return;
-                } else {
-                    $output = ' style="color: ' . $options['user_colors']['colors'][ $attr ] . '"';
-                    return $output;
-                }
-                break;
-            case 'type':
-                $type = array(
-                    'decimal' => '1',
-                    'lower-alpha' => 'a',
-                    'lower-roman' => 'i'
-                    );
-                $value = $type[ $options['figure_style'] ];
-                return " type='{$value}'";
-                break;
-            default:
-                return;
-                break;
-        }
-    }
-
-    public function add_note( $content ) { // Add current note's content to array $notes and return its number
-        if ( count( $this->notes ) == 0 ) {
-            $this->notes[1] = $content;
-        } else {
-            $this->notes[] = $content;
-        }
-        $note_id = count( $this->notes );
-        return $note_id;
-    }
-
-    public function print_ref( $note_id ) { // Obtain reference figure from get_figure() and add HTML markup
-
-        global $side_matter_admin;
-
-        $options = $side_matter_admin->options;
-        $class = $options['html_class'];
-        $figure_color = $options['user_colors']['colors']['figure_color'];
-        $ref_figure = $this->get_figure( $note_id );
-        $note_text = $this->notes[ $note_id ];
-        $title_text = esc_attr( strip_tags( str_replace( "\n", '&nbsp;', $note_text ) ) ); // Strip note of tags and line breaks for use in title attribute
-        $title_attr = " title='Note {$note_id}. {$title_text}'";
-        $style_attr = $this->get_attr( 'figure_color' );
-
-        $ref_output = "<a id='ref-{$note_id}' class='{$class} {$class}-ref {$class}-ref-{$note_id}' href='#note-{$note_id}'{$title_attr}{$style_attr}><sup class='{$class} {$class}-sup {$class}-sup-{$note_id}'>{$ref_figure}</sup></a>";
-        return $ref_output;
-
-    }
-
-    public function get_figure( $note_id ) { // Convert note number to alternate figure format based on user settings
-        global $side_matter_admin;
-        switch ( $side_matter_admin->options['figure_style'] ) {
+    public function get_figure( $note_id, $style ) { // Convert numeral to alternate format
+
+        $figures = $this->figures;
+
+        switch ( $style ) {
+            case 'armenian':
+            case 'georgian':
+            case 'hebrew':
+            case 'lower-roman':
+                return $this->get_additive( $note_id, $figures[ $style ] );
+                break;
+            case 'lower-greek':
             case 'lower-alpha':
-                return $this->get_latin( $note_id );
-                break;
-            case 'lower-roman':
-                return $this->get_roman( $note_id );
+                return $this->get_alpha( $note_id, $figures[ $style ] );
+                break;
+            case 'none':
+                return '';
                 break;
             case 'decimal':
@@ -410 +392 @@
                 break;
         }
-    }
-
-    public function get_latin( $note_id ) { // Convert number to Latin alphabetical figure
-        $latin = array( 'a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z' );
-        $count = count( $latin );
+
+    }
+
+    public function get_alpha( $note_id, $set ) { // Convert note number to alphabetic numeral
+        $count = count( $set );
         $value = $note_id--;
         $figure = '';
@@ -420 +402 @@
             $value--;
             $index = ( $value % $count );
-            $figure = $latin[ $index ] . $figure;
+            $figure = $set[ $index ] . $figure;
             $value = floor( $value / $count );
         }
@@ -426 +408 @@
     }
 
-    public function get_roman( $note_id ) { // Convert number to Roman numeral figure
-        $roman = array(
-            'm' => 1000,
-            'cm' => 900,
-            'd' => 500,
-            'cd' => 400,
-            'c' => 100,
-            'xc' => 90,
-            'l' => 50,
-            'xl' => 40,
-            'x' => 10,
-            'ix' => 9,
-            'v' => 5,
-            'iv' => 4,
-            'i' => 1
-            );
+    public function get_additive( $note_id, $set ) { // Convert note number to additive numeral
         $value = $note_id--;
         $figure = '';
         while ( $value > 0 ) {
-            $weight = reset( $roman );
-            $key = key( $roman );
-            unset( $roman[ $key ] );
+            $weight = reset( $set );
+            $key = key( $set );
+            unset( $set[ $key ] );
             $length = floor( $value / $weight );
             $figure .= str_repeat( $key, $length );
-            $value = $value - ( $weight * $length );
+            $value -= ( $weight * $length );
         }
         return $figure;
     }
 
-    public function list_notes() { // Generate HTML-formatted ordered list of Side Matter notes
-
+    public function add_note( $content ) { // Add current note's content to array $notes and return its number
+        if ( count( $this->notes ) == 0 ) {
+            $this->notes[1] = $content;
+        } else {
+            $this->notes[] = $content;
+        }
+        $note_id = count( $this->notes );
+        return $note_id;
+    }
+
+    public function format_ref( $note_id ) { // Obtain reference figure from get_figure() and add HTML markup
+
+        global $is_IE;
+
+        $options = $this->options;
+        extract( $options );
+
+        $ref_figure = ( $figure_style != 'decimal' ) ? $this->get_figure( $note_id, $figure_style ) : $note_id;
+
+        $note_text = $this->notes[ $note_id ];
+
+        $title_text = esc_attr( strip_tags( str_replace( array( "\n", "\r" ), '&nbsp;', $note_text ) ) ); // Strip note of tags and line breaks for use in title attribute
+
+        $a_title = ( ! $is_IE ) ? " title='{$title_text}'" : '';
+        $sup_title = ( ! $is_IE ) ? '' : "title='{$title_text}'"; // Workaround for IE bug wherein links containing an inline child element do not display title attribute on hover (uses sup tag instead)
+
+        $figure_color_style = ( $user_colors['colors_enabled'] ) ? ' style="color: ' . $user_colors['colors']['figure_color'] . '"' : '';
+
+        $open_sup = "<sup class='{$html_class} {$html_class}-sup'{$sup_title}>";
+        $close_sup = '</sup>';
+        if ( $options['figure_style'] == 'none' ) { // Don't print sup tag if figure_style setting is 'none'
+            $open_sup = $close_sup = $ref_figure = '';
+        }
+
+        $ref_output = "<a id='ref-{$note_id}' class='{$html_class} {$html_class}-ref' href='#note-{$note_id}'{$a_title}{$figure_color_style}>{$open_sup}{$ref_figure}{$close_sup}</a>";
+        return $ref_output;
+
+    }
+
+    public function list_notes() { // Print HTML-formatted list of Side Matter notes
         if ( ! $this->check_page() ) {
             return;
         } else {
 
-            global $side_matter_admin;
-            $options = $side_matter_admin->options;
-
+            $options = $this->options;
+            $figures = $this->figures;
+
+            extract( $options );
             extract( $options['user_colors']['colors'] );
 
-            $class = $options['html_class'];
-            $style = $options['figure_style'];
-            $figure_color_attr = $this->get_attr( 'figure_color' );
-            $text_color_attr = $this->get_attr( 'text_color' );
-            $type_attr = $this->get_attr( 'type' );
+            $list_style_type = "list-style-type: {$figure_style};";
+            $figure_color_style = "color: {$figure_color};";
+            $text_color_style = "color: {$text_color};";
 
             ?>
-            <ol class='<?php echo $class ?> <?php echo $class ?>-list'<?php echo $figure_color_attr ?>>
+            <ol class='<?php echo $html_class ?> <?php echo $html_class ?>-list' style='<?php echo $list_style_type ?><?php if ( $options['user_colors']['colors_enabled'] ) echo ' ' . $figure_color_style ?>'>
             <?php
             foreach ( $this->notes as $note_id => $note_text ) {
-                $note_text = wpautop( $note_text ); // Re-enclose notes in paragraph tags to fix any shortcode-caused weirdness
-                ?>
-                <li id='note-<?php echo $note_id ?>' class='<?php echo $class ?> <?php echo $class ?>-note <?php echo $class ?>-note-<?php echo $note_id ?>'<?php echo $type_attr ?>><div class='<?php echo $class ?> <?php echo $class ?>-text <?php echo $class ?>-text-<?php echo $note_id ?>'<?php echo $text_color_attr ?>><?php echo $note_text ?></div></li>
+                $note_text = wpautop( $note_text ); // Re-enclose notes in paragraph tags to fix tags broken by shortcode
+                ?>
+                <li id='note-<?php echo $note_id ?>' class='<?php echo $html_class ?> <?php echo $html_class ?>-note'>
+                    <div class='<?php echo $html_class ?> <?php echo $html_class ?>-text'<?php if ( $options['user_colors']['colors_enabled'] ) echo " style='{$text_color_style}'" ?>>
+                        <?php echo $note_text ?>
+                    </div>
+                </li>
                 <?php
             }
@@ -494 +502 @@
 
     public function __construct() { // Register widget name and description
-        parent::__construct( 'side-matter', __( 'Side Matter' ), array( 'description' => __( 'Display Side Matter notes in an ordered list' ) ) );
+        parent::__construct( 'side-matter', __( 'Side Matter', 'side-matter' ), array( 'description' => __( 'Display Side Matter notes in an ordered list', 'side-matter' ) ) );
     }
 
@@ -511 +519 @@
 
     public function form( $instance ) { // Widget admin panel
-        ?>
-        Modify Side Matter's default settings using the options menu on your <a href='<?php echo admin_url( 'options-reading.php' ) ?>'>Reading Settings</a> screen.
-        <?php
+        $options_url = admin_url( 'options-reading.php' );
+        printf( __( 'Modify default settings using the options menu on your %1$sReading Settings%2$s screen.', 'side-matter' ), "<a href='{$options_url}'>", '</a>' );
     }
 

side-matter/trunk/uninstall.php

@@ -2 +2 @@
 /*
 uninstall.php
-Version 0.9
+Version 1.0
 
 Plugin: Side Matter