Responsive Select Menu

Version Description

Improves compatibility with latest versions of UberMenu

Release Info

Developer	sevenspark
Plugin	Responsive Select Menu
Version	1.5
Comparing to
See all releases

Code changes from version 1.4 to 1.5

Files changed (21) hide show

readme.md +106 -0
readme.txt +6 -4
responsive-select-menu.php +46 -10
sparkoptions/sparkoptions.css +1 -0
trunk/readme.md +106 -0
trunk/readme.txt +107 -0
trunk/responsive-select-menu.php +637 -0
trunk/screenshot-1.png +0 -0
trunk/screenshot-2.png +0 -0
trunk/sparkoptions/SparkOptions.class.php +815 -0
trunk/sparkoptions/images/cross.png +0 -0
trunk/sparkoptions/images/nav_bkg.jpg +0 -0
trunk/sparkoptions/images/panel_bkg.jpg +0 -0
trunk/sparkoptions/images/social_media_icons/dribbble.png +0 -0
trunk/sparkoptions/images/social_media_icons/facebook.png +0 -0
trunk/sparkoptions/images/social_media_icons/twitter_2.png +0 -0
trunk/sparkoptions/images/sslogo.png +0 -0
trunk/sparkoptions/images/sslogo_favicon.png +0 -0
trunk/sparkoptions/images/toolbox.png +0 -0
trunk/sparkoptions/sparkoptions.css +683 -0
trunk/sparkoptions/sparkoptions.js +123 -0

readme.md ADDED Viewed

	@@ -0,0 +1,106 @@


1	+ # Responsive Select Menu - WordPress Plugin #
2	+
3	+ Author URI: http://sevenspark.com
4	+
5	+ Contributors: sevenspark
6	+
7	+ Donate link: http://bit.ly/DonateResponsiveSelect
8	+
9	+ Tags: responsive, menu, select, drop down,
10	+
11	+ Requires at least: 3.3
12	+
13	+ Tested up to: 3.6
14	+
15	+ Stable tag: trunk
16	+
17	+ License: GPLv2 or later
18	+
19	+ License URI: http://www.gnu.org/licenses/gpl-2.0.html
20	+
21	+ The Responsive Select Menu plugin automatically turns any WordPress 3 Menu into a select box / dropdown on mobile devices.
22	+
23	+ ## Description ##
24	+
25	+ [View Demo 1](http://wpmegamenu.com/responsive-select-menu/)
26	+
27	+ [View Demo 2 in a Responsive WordPress Theme](http://agility.sevenspark.com/responsive-select-menu)
28	+
29	+ One common UI paradigm for navigation menus with responsive design is to display a select box (form element)
30	+ for mobile devices. This plugin allows you to turn your WordPress 3 menu into a select box below a width of your choice.
31	+
32	+ Features
33	+
34	+ * Takes up less screen real estate on mobile devices
35	+ * Easier navigation for touch screens
36	+ * Works automatically - no need to add extra PHP code
37	+
38	+
39	+ Highly Configurable
40	+
41	+ Through the Responsive Select Menu Control Panel you can:
42	+
43	+ * New in 1.2 - select which theme locations to apply the menu to
44	+ * Set your width breakpoint (where your menu switches from your standard menu to a select box)
45	+ * Configure how many levels you wish to include in the select menu. Set it to 1 to include only the top-level menu items.
46	+ * Choose the character used to indent your submenu items within the select box
47	+ * Choose whether or not to exclude “dummy” items that don’t have links
48	+ * Set the text of the first menu item
49	+
50	+ The demo is built with [UberMenu - Wordpress Mega Menu Plugin](http://wpmegamenu.com/) , but it is designed to work with any UL-based WordPress 3 menu.
51	+
52	+ Based on the excellent tutorial from [Chris Coyier and CSS Tricks](http://css-tricks.com/convert-menu-to-dropdown/) - thanks!
53	+
54	+ ## Installation ##
55	+
56	+ This section describes how to install the plugin and get it working.
57	+
58	+ 1. Upload the plugin zip through your WordPress admin
59	+ 1. Activate the plugin through the 'Plugins' menu in WordPress
60	+ 1. Navigate to Appearance > Responsive Select to configure your menu
61	+
62	+
63	+ ## Frequently Asked Questions ##
64	+
65	+ Do I have to have a "Navigate" item as my first item
66	+
67	+ You can change the name of this item, but it has to exist. Otherwise, you won't be able to navigate to the first item in the menu
68	+ if you're not using the "Show currently selected item" - even if you have that option enabled, the issue would still exist on pages not
69	+ in the menu.
70	+
71	+ It doesn't work
72	+
73	+ If your theme creates a menu the standard way with wp_nav_menu, it should work. If not, make sure you're using 1.3+, as this resolves the most common "it doesn't work" issue.
74	+
75	+
76	+
77	+ ## Screenshots ##
78	+
79	+ 1. Responsive select menu on the iPhone/iPod Touch
80	+ 2. Responsive select menu Control Panel
81	+
82	+ ## Changelog ##
83	+
84	+ 1.5
85	+
86	+ * Improves compatibility with latest version of UberMenu
87	+
88	+ 1.4
89	+
90	+ * Handles blank menu items better
91	+
92	+ 1.3
93	+
94	+ * Better compatibility with themes that remove the wp_nav_menu 'container' parameter.
95	+
96	+ 1.2
97	+
98	+ * Added option to select specific theme locations to apply the responsive select menu to.
99	+
100	+ 1.1
101	+
102	+ * Fixed option closing tag order for valid HTML markup
103	+
104	+ 1.0
105	+
106	+ * Initial version

readme.txt CHANGED Viewed

	@@ -3,8 +3,8 @@ Contributors: sevenspark
3	Donate link: http://bit.ly/DonateResponsiveSelect
4	Tags: responsive, menu, select, drop down,
5	Requires at least: 3.3
6	- Tested up to: 3.~~5.1~~
7	- Stable tag: ~~trunk~~
8	License: GPLv2 or later
9	License URI: http://www.gnu.org/licenses/gpl-2.0.html
10
	@@ -71,9 +71,11 @@ If your theme creates a menu the standard way with wp_nav_menu, it should work.
71
72	== Changelog ==
73



74	= 1.4 =
75	* Handles blank menu items better
76	- * Improves compatibility with latest version of UberMenu
77
78	= 1.3 =
79	* Better compatibility with themes that remove the wp_nav_menu 'container' parameter.
	@@ -90,7 +92,7 @@ If your theme creates a menu the standard way with wp_nav_menu, it should work.
90
91	== Upgrade Notice ==
92
93	- = 1.4 =
94	* Recommended for UberMenu users
95	* Recommended for anyone who uses "dummy" menu items with URL set to '#' or ''
96


3	Donate link: http://bit.ly/DonateResponsiveSelect
4	Tags: responsive, menu, select, drop down,
5	Requires at least: 3.3
6	+ Tested up to: 3.6
7	+ Stable tag: 1.5
8	License: GPLv2 or later
9	License URI: http://www.gnu.org/licenses/gpl-2.0.html
10

71
72	== Changelog ==
73
74	+ = 1.5 =
75	+ * Improves compatibility with latest versions of UberMenu
76	+
77	= 1.4 =
78	* Handles blank menu items better

79
80	= 1.3 =
81	* Better compatibility with themes that remove the wp_nav_menu 'container' parameter.

92
93	== Upgrade Notice ==
94
95	+ = 1.3.1 =
96	* Recommended for UberMenu users
97	* Recommended for anyone who uses "dummy" menu items with URL set to '#' or ''
98

responsive-select-menu.php CHANGED Viewed

	@@ -4,13 +4,13 @@
4	Plugin Name: Responsive Select Menu
5	Plugin URI: http://wpmegamenu.com/responsive-select-menu
6	Description: Turn your menu into a select box at small viewport sizes
7	- Version: 1.4
8	Author: Chris Mavricos, SevenSpark
9	Author URI: http://sevenspark.com
10	- Copyright 2011-~~2012~~ Chris Mavricos, SevenSpark http://sevenspark.com (email : chris@sevenspark.com)
11	*/
12
13	- define( 'RESPONSIVE_SELECT_MENU_VERSION', '1.4' );
14	define( 'RESPONSIVE_SELECT_MENU_SETTINGS', 'responsive-select-menu' );
15
16	require_once( 'sparkoptions/SparkOptions.class.php' ); //SevenSpark Options Panel
	@@ -142,6 +142,7 @@ jQuery(document).ready( function($){
142	var loc = $(this).find( 'option:selected' ).val();
143	if( loc != '' && loc != '#' ) window.location = loc;
144	});

145	});
146	</script>
147	<!-- end Responsive Select JS -->
	@@ -482,6 +483,8 @@ $responsiveMenuSelect = new ResponsiveMenuSelect();
482	class ResponsiveSelectWalker extends Walker_Nav_Menu{
483
484	private $index = 0;


485
486	function start_lvl( &$output, $depth ) {
487	$indent = str_repeat( "\t", $depth );
	@@ -522,16 +525,16 @@ class ResponsiveSelectWalker extends Walker_Nav_Menu{
522	$settings = $uberMenu->getSettings();
523
524	//Test override settings
525	- $override = ~~get_post_meta~~( $item->ID, '~~_menu_item_shortcode~~', ~~true~~);
526	$overrideOn = /$depth > 0 && / $settings->op( 'wpmega-shortcodes' ) && !empty( $override ) ? true : false;
527
528	//Test sidebar settings
529	- $sidebar = ~~get_post_meta~~( $item->ID, '~~_menu_item_sidebars~~', ~~true~~);
530	$sidebarOn = ( $settings->op( 'wpmega-top-level-widgets' ) \|\| $depth > 0 ) && $settings->op( 'wpmega-sidebars' ) && !empty( $sidebar ) ? true : false;
531
532	- $notext = ~~get_post_meta~~( $item->ID, '~~_menu_item_notext~~', ~~true~~ ) == 'on' \|\| $item->title == UBERMENU_NOTEXT ? true : false;
533	- $nolink = ~~get_post_meta~~( $item->ID, '~~_menu_item_nolink~~', ~~true~~ ) == 'on' ? true : false;
534	-
535	if( $nolink && $responsiveMenuSelect->getSettings()->op( 'uber-exclude-nonlinks' ) ){
536	return;
537	}
	@@ -560,12 +563,45 @@ class ResponsiveSelectWalker extends Walker_Nav_Menu{
560	$item_output .= $dashes . $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after;
561	$item_output .= $args->after;
562
563	- $output.= $item_output;
564
565	- $output .= "</option>\n";
566	}
567
568	function end_el(&$output, $item, $depth) {
569	return;
570	}

































571	}


4	Plugin Name: Responsive Select Menu
5	Plugin URI: http://wpmegamenu.com/responsive-select-menu
6	Description: Turn your menu into a select box at small viewport sizes
7	+ Version: 1.5
8	Author: Chris Mavricos, SevenSpark
9	Author URI: http://sevenspark.com
10	+ Copyright 2011-2013 Chris Mavricos, SevenSpark http://sevenspark.com (email : chris@sevenspark.com)
11	*/
12
13	+ define( 'RESPONSIVE_SELECT_MENU_VERSION', '1.5' );
14	define( 'RESPONSIVE_SELECT_MENU_SETTINGS', 'responsive-select-menu' );
15
16	require_once( 'sparkoptions/SparkOptions.class.php' ); //SevenSpark Options Panel

142	var loc = $(this).find( 'option:selected' ).val();
143	if( loc != '' && loc != '#' ) window.location = loc;
144	});
145	+ //$( '.responsiveMenuSelect' ).val('');
146	});
147	</script>
148	<!-- end Responsive Select JS -->

483	class ResponsiveSelectWalker extends Walker_Nav_Menu{
484
485	private $index = 0;
486	+ protected $menuItemOptions;
487	+ protected $noUberOps;
488
489	function start_lvl( &$output, $depth ) {
490	$indent = str_repeat( "\t", $depth );

525	$settings = $uberMenu->getSettings();
526
527	//Test override settings
528	+ $override = $this->getUberOption( $item->ID, 'shortcode' );
529	$overrideOn = /$depth > 0 && / $settings->op( 'wpmega-shortcodes' ) && !empty( $override ) ? true : false;
530
531	//Test sidebar settings
532	+ $sidebar = $this->getUberOption( $item->ID, 'sidebars' );
533	$sidebarOn = ( $settings->op( 'wpmega-top-level-widgets' ) \|\| $depth > 0 ) && $settings->op( 'wpmega-sidebars' ) && !empty( $sidebar ) ? true : false;
534
535	+ $notext = $this->getUberOption( $item->ID, 'notext' ) == 'on' \|\| $item->title == UBERMENU_NOTEXT ? true : false;
536	+ $nolink = $this->getUberOption( $item->ID, 'nolink' ) == 'on' ? true : false;
537	+
538	if( $nolink && $responsiveMenuSelect->getSettings()->op( 'uber-exclude-nonlinks' ) ){
539	return;
540	}

563	$item_output .= $dashes . $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after;
564	$item_output .= $args->after;
565
566	+ $output.= str_replace( '%', '%%', $item_output );
567
568	+ $output.= "</option>\n";
569	}
570
571	function end_el(&$output, $item, $depth) {
572	return;
573	}
574	+
575	+ function getUberOption( $item_id , $id ){
576	+ //get_post_meta or from uber_options, depending on whether uber_options is set
577	+
578	+ $option_id = 'menu-item-'.$id;
579	+
580	+ //Initialize array
581	+ if( !is_array( $this->menuItemOptions ) ){
582	+ $this->menuItemOptions = array();
583	+ $this->noUberOps = array();
584	+ }
585	+
586	+ //We haven't investigated this item yet
587	+ if( !isset( $this->menuItemOptions[ $item_id ] ) ){
588	+
589	+ $uber_options = false;
590	+ if( empty( $this->noUberOps[ $item_id ] ) ) {
591	+ $uber_options = get_post_meta( $item_id , '_uber_options', true );
592	+ if( !$uber_options ) $this->noUberOps[ $item_id ] = true; //don't check again for this menu item
593	+ }
594	+
595	+ //If $uber_options are set, use them
596	+ if( $uber_options ){
597	+ $this->menuItemOptions[ $item_id ] = $uber_options;
598	+ }
599	+ //Otherwise get the old meta
600	+ else{
601	+ $option_id = '_menu_item_'.$id; //UberMenu::convertToOldParameter( $id );
602	+ return get_post_meta( $item_id, $option_id , true );
603	+ }
604	+ }
605	+ return isset( $this->menuItemOptions[ $item_id ][ $option_id ] ) ? stripslashes( $this->menuItemOptions[ $item_id ][ $option_id ] ) : '';
606	+ }
607	}

sparkoptions/sparkoptions.css CHANGED Viewed

	@@ -415,6 +415,7 @@ label.spark-admin-op-title{
415	font-weight:bold;
416	box-shadow:0px 3px 0px #e2e2e2;
417	border:1px solid #ddd;

418	}
419	.button.save-button:hover,
420	.button.reset-button:hover{


415	font-weight:bold;
416	box-shadow:0px 3px 0px #e2e2e2;
417	border:1px solid #ddd;
418	+ height:auto;
419	}
420	.button.save-button:hover,
421	.button.reset-button:hover{

trunk/readme.md ADDED Viewed

	@@ -0,0 +1,106 @@


1	+ # Responsive Select Menu - WordPress Plugin #
2	+
3	+ Author URI: http://sevenspark.com
4	+
5	+ Contributors: sevenspark
6	+
7	+ Donate link: http://bit.ly/DonateResponsiveSelect
8	+
9	+ Tags: responsive, menu, select, drop down,
10	+
11	+ Requires at least: 3.3
12	+
13	+ Tested up to: 3.6
14	+
15	+ Stable tag: trunk
16	+
17	+ License: GPLv2 or later
18	+
19	+ License URI: http://www.gnu.org/licenses/gpl-2.0.html
20	+
21	+ The Responsive Select Menu plugin automatically turns any WordPress 3 Menu into a select box / dropdown on mobile devices.
22	+
23	+ ## Description ##
24	+
25	+ [View Demo 1](http://wpmegamenu.com/responsive-select-menu/)
26	+
27	+ [View Demo 2 in a Responsive WordPress Theme](http://agility.sevenspark.com/responsive-select-menu)
28	+
29	+ One common UI paradigm for navigation menus with responsive design is to display a select box (form element)
30	+ for mobile devices. This plugin allows you to turn your WordPress 3 menu into a select box below a width of your choice.
31	+
32	+ Features
33	+
34	+ * Takes up less screen real estate on mobile devices
35	+ * Easier navigation for touch screens
36	+ * Works automatically - no need to add extra PHP code
37	+
38	+
39	+ Highly Configurable
40	+
41	+ Through the Responsive Select Menu Control Panel you can:
42	+
43	+ * New in 1.2 - select which theme locations to apply the menu to
44	+ * Set your width breakpoint (where your menu switches from your standard menu to a select box)
45	+ * Configure how many levels you wish to include in the select menu. Set it to 1 to include only the top-level menu items.
46	+ * Choose the character used to indent your submenu items within the select box
47	+ * Choose whether or not to exclude “dummy” items that don’t have links
48	+ * Set the text of the first menu item
49	+
50	+ The demo is built with [UberMenu - Wordpress Mega Menu Plugin](http://wpmegamenu.com/) , but it is designed to work with any UL-based WordPress 3 menu.
51	+
52	+ Based on the excellent tutorial from [Chris Coyier and CSS Tricks](http://css-tricks.com/convert-menu-to-dropdown/) - thanks!
53	+
54	+ ## Installation ##
55	+
56	+ This section describes how to install the plugin and get it working.
57	+
58	+ 1. Upload the plugin zip through your WordPress admin
59	+ 1. Activate the plugin through the 'Plugins' menu in WordPress
60	+ 1. Navigate to Appearance > Responsive Select to configure your menu
61	+
62	+
63	+ ## Frequently Asked Questions ##
64	+
65	+ Do I have to have a "Navigate" item as my first item
66	+
67	+ You can change the name of this item, but it has to exist. Otherwise, you won't be able to navigate to the first item in the menu
68	+ if you're not using the "Show currently selected item" - even if you have that option enabled, the issue would still exist on pages not
69	+ in the menu.
70	+
71	+ It doesn't work
72	+
73	+ If your theme creates a menu the standard way with wp_nav_menu, it should work. If not, make sure you're using 1.3+, as this resolves the most common "it doesn't work" issue.
74	+
75	+
76	+
77	+ ## Screenshots ##
78	+
79	+ 1. Responsive select menu on the iPhone/iPod Touch
80	+ 2. Responsive select menu Control Panel
81	+
82	+ ## Changelog ##
83	+
84	+ 1.5
85	+
86	+ * Improves compatibility with latest version of UberMenu
87	+
88	+ 1.4
89	+
90	+ * Handles blank menu items better
91	+
92	+ 1.3
93	+
94	+ * Better compatibility with themes that remove the wp_nav_menu 'container' parameter.
95	+
96	+ 1.2
97	+
98	+ * Added option to select specific theme locations to apply the responsive select menu to.
99	+
100	+ 1.1
101	+
102	+ * Fixed option closing tag order for valid HTML markup
103	+
104	+ 1.0
105	+
106	+ * Initial version

trunk/readme.txt ADDED Viewed

	@@ -0,0 +1,107 @@


1	+ === Responsive Select Menu ===
2	+ Contributors: sevenspark
3	+ Donate link: http://bit.ly/DonateResponsiveSelect
4	+ Tags: responsive, menu, select, drop down,
5	+ Requires at least: 3.3
6	+ Tested up to: 3.6
7	+ Stable tag: 1.5
8	+ License: GPLv2 or later
9	+ License URI: http://www.gnu.org/licenses/gpl-2.0.html
10	+
11	+ The Responsive Select Menu plugin automatically turns any WordPress 3 Menu into a select box / dropdown on mobile devices.
12	+
13	+ == Description ==
14	+
15	+ [View Demo 1](http://wpmegamenu.com/responsive-select-menu/)
16	+
17	+ [View Demo 2 in a Responsive WordPress Theme](http://agility.sevenspark.com/responsive-select-menu)
18	+
19	+ One common UI paradigm for navigation menus with responsive design is to display a select box (form element)
20	+ for mobile devices. This plugin allows you to turn your WordPress 3 menu into a select box below a width of your choice.
21	+
22	+ = Features =
23	+
24	+ * Takes up less screen real estate on mobile devices
25	+ * Easier navigation for touch screens
26	+ * Works automatically - no need to add extra PHP code
27	+
28	+
29	+ = Highly Configurable =
30	+
31	+ Through the Responsive Select Menu Control Panel you can:
32	+
33	+ * New in 1.2 - select which theme locations to apply the menu to
34	+ * Set your width breakpoint (where your menu switches from your standard menu to a select box)
35	+ * Configure how many levels you wish to include in the select menu. Set it to 1 to include only the top-level menu items.
36	+ * Choose the character used to indent your submenu items within the select box
37	+ * Choose whether or not to exclude “dummy” items that don’t have links
38	+ * Set the text of the first menu item
39	+
40	+ The demo is built with [UberMenu - Wordpress Mega Menu Plugin](http://wpmegamenu.com/) , but it is designed to work with any UL-based WordPress 3 menu.
41	+
42	+ Based on the excellent tutorial from [Chris Coyier and CSS Tricks](http://css-tricks.com/convert-menu-to-dropdown/) - thanks!
43	+
44	+ == Installation ==
45	+
46	+ This section describes how to install the plugin and get it working.
47	+
48	+ 1. Upload the plugin zip through your WordPress admin
49	+ 1. Activate the plugin through the 'Plugins' menu in WordPress
50	+ 1. Navigate to Appearance > Responsive Select to configure your menu
51	+
52	+
53	+ == Frequently Asked Questions ==
54	+
55	+ = Do I have to have a "Navigate" item as my first item =
56	+
57	+ You can change the name of this item, but it has to exist. Otherwise, you won't be able to navigate to the first item in the menu
58	+ if you're not using the "Show currently selected item" - even if you have that option enabled, the issue would still exist on pages not
59	+ in the menu.
60	+
61	+ = It doesn't work =
62	+
63	+ If your theme creates a menu the standard way with wp_nav_menu, it should work. If not, make sure you're using 1.3+, as this resolves the most common "it doesn't work" issue.
64	+
65	+
66	+
67	+ == Screenshots ==
68	+
69	+ 1. Responsive select menu on the iPhone/iPod Touch
70	+ 2. Responsive select menu Control Panel
71	+
72	+ == Changelog ==
73	+
74	+ = 1.5 =
75	+ * Improves compatibility with latest versions of UberMenu
76	+
77	+ = 1.4 =
78	+ * Handles blank menu items better
79	+
80	+ = 1.3 =
81	+ * Better compatibility with themes that remove the wp_nav_menu 'container' parameter.
82	+
83	+ = 1.2 =
84	+ * Added option to select specific theme locations to apply the responsive select menu to.
85	+
86	+ = 1.1 =
87	+ * Fixed option closing tag order for valid HTML markup
88	+
89	+ = 1.0 =
90	+ * Initial version
91	+
92	+
93	+ == Upgrade Notice ==
94	+
95	+ = 1.3.1 =
96	+ * Recommended for UberMenu users
97	+ * Recommended for anyone who uses "dummy" menu items with URL set to '#' or ''
98	+
99	+ = 1.3 =
100	+ * Solves the most common "it doesn't work" scenario. Merry Christmas! :)
101	+
102	+ = 1.2 =
103	+ * Allows you to apply the menu selectively to registered theme locations.
104	+
105	+ = 1.1 =
106	+ * Upgrade to ensure valid markup - won't change your settings.
107	+

trunk/responsive-select-menu.php ADDED Viewed

	@@ -0,0 +1,637 @@


1	+ <?php
2	+
3	+ /*
4	+ Plugin Name: Responsive Select Menu
5	+ Plugin URI: http://wpmegamenu.com/responsive-select-menu
6	+ Description: Turn your menu into a select box at small viewport sizes
7	+ Version: 1.5
8	+ Author: Chris Mavricos, SevenSpark
9	+ Author URI: http://sevenspark.com
10	+ Copyright 2011-2013 Chris Mavricos, SevenSpark http://sevenspark.com (email : chris@sevenspark.com)
11	+ */
12	+
13	+ define( 'RESPONSIVE_SELECT_MENU_VERSION', '1.5' );
14	+ define( 'RESPONSIVE_SELECT_MENU_SETTINGS', 'responsive-select-menu' );
15	+
16	+ require_once( 'sparkoptions/SparkOptions.class.php' ); //SevenSpark Options Panel
17	+
18	+ class ResponsiveMenuSelect{
19	+
20	+ private $enabled;
21	+ private $enabled_determined;
22	+
23	+ function __construct(){
24	+
25	+ $this->settings = $this->optionsMenu();
26	+ $this->enabled_determined = false;
27	+
28	+ if( is_admin() ){
29	+
30	+ }
31	+ else{
32	+ add_action( 'plugins_loaded' , array( $this , 'init' ) );
33	+ }
34	+ }
35	+
36	+ function init(){
37	+
38	+ $this->loadAssets();
39	+
40	+ //Filters
41	+ add_filter( 'wp_nav_menu_args' , array( $this , 'responsiveSelectAddFilter' ), 2100 ); //filters arguments passed to wp_nav_menu
42	+
43	+ add_filter( 'wp_nav_menu_args' , array( $this , 'responsiveSelectFilter' ), 2200 ); //second call, to print select menu
44	+
45	+ }
46	+
47	+ /**
48	+ * Determine whether we should load the responsive select on these pages
49	+ * and cache the result.
50	+ */
51	+ function isEnabled(){
52	+
53	+ if( $this->enabled_determined ) return $this->enabled;
54	+
55	+ $this->enabled_determined = true;
56	+ $this->enabled = false;
57	+
58	+ if( !$this->settings->op( 'display_only' ) ){
59	+ $this->enabled = true;
60	+ }
61	+ else{
62	+ $list = $this->settings->op( 'display_only' );
63	+ $list = str_replace( ' ', '', $list );
64	+ $ids = explode( ',' , $list );
65	+
66	+ global $post;
67	+ if( $post && in_array( $post->ID , $ids ) ) $this->enabled = true;
68	+ else $this->enabled = false;
69	+ }
70	+ return $this->enabled;
71	+ }
72	+
73	+ /**
74	+ * Determine whether this particular menu location should be activated
75	+ */
76	+ function isActivated( $args ){
77	+
78	+ //Activate All?
79	+ if( $this->settings->op( 'activate_theme_locations_all' ) ){
80	+ return true;
81	+ }
82	+
83	+ //Activate this theme_location specifically?
84	+ if( isset( $args['theme_location'] ) ){
85	+ $location = $args['theme_location'];
86	+ $active_theme_locations = $this->settings->op( 'active_theme_locations' );
87	+
88	+ if( is_array( $active_theme_locations ) && in_array( $location, $active_theme_locations ) ){
89	+ return true;
90	+ }
91	+ }
92	+ return false;
93	+ }
94	+
95	+
96	+ function loadAssets(){
97	+
98	+ if( !is_admin() ){
99	+ add_action( 'wp_print_styles' , array( $this , 'loadCSS' ) );
100	+ add_action( 'wp_head', array( $this , 'insertHeaderCode' ), 110 );
101	+ }
102	+
103	+ }
104	+
105	+ function loadCSS(){
106	+ if( $this->isEnabled() ) wp_enqueue_script( 'jquery' );
107	+ }
108	+
109	+ function insertHeaderCode(){
110	+ if( $this->isEnabled() ){
111	+ ?>
112	+
113	+ <!-- Responsive Select CSS
114	+ ================================================================ -->
115	+ <style type="text/css" id="responsive-select-css">
116	+ .responsiveSelectContainer select.responsiveMenuSelect, select.responsiveMenuSelect{
117	+ display:none;
118	+ }
119	+
120	+ @media (max-width: <?php echo $this->settings->op( 'max-menu-width' ); ?>px) {
121	+ .responsiveSelectContainer{
122	+ border:none !important;
123	+ background:none !important;
124	+ box-shadow:none !important;
125	+ }
126	+ .responsiveSelectContainer ul, ul.responsiveSelectFullMenu, #megaMenu ul.megaMenu.responsiveSelectFullMenu{
127	+ display: none !important;
128	+ }
129	+ .responsiveSelectContainer select.responsiveMenuSelect, select.responsiveMenuSelect {
130	+ display: inline-block;
131	+ width:100%;
132	+ }
133	+ }
134	+ </style>
135	+ <!-- end Responsive Select CSS -->
136	+
137	+ <!-- Responsive Select JS
138	+ ================================================================ -->
139	+ <script type="text/javascript">
140	+ jQuery(document).ready( function($){
141	+ $( '.responsiveMenuSelect' ).change(function() {
142	+ var loc = $(this).find( 'option:selected' ).val();
143	+ if( loc != '' && loc != '#' ) window.location = loc;
144	+ });
145	+ //$( '.responsiveMenuSelect' ).val('');
146	+ });
147	+ </script>
148	+ <!-- end Responsive Select JS -->
149	+
150	+ <?php
151	+ }
152	+ }
153	+
154	+
155	+ function responsiveSelectAddFilter( $args ){
156	+
157	+ if( $this->isEnabled() && $this->isActivated( $args ) ){
158	+
159	+ //Don't add it twice (when it gets called again by selectNavMenu() )
160	+ if( isset( $args['responsiveMenuSelect'] ) && $args['responsiveMenuSelect'] == true ) {
161	+ return $args;
162	+ }
163	+
164	+ $selectNav = $this->selectNavMenu( $args );
165	+
166	+ $args['container_class'].= ' responsiveSelectContainer';
167	+ $args['menu_class'].= ' responsiveSelectFullMenu';
168	+
169	+ //This line would add a container if it doesn't exist, but has the potential to break certain theme menus
170	+ //if( $args['container'] != 'nav' ) $args['container'] = 'div'; //make sure there's a container to add class to
171	+
172	+ $args['items_wrap'] = '<ul id="%1$s" class="%2$s">%3$s</ul>'.$selectNav;
173	+
174	+ }
175	+
176	+ return $args;
177	+
178	+ }
179	+
180	+ function selectNavMenu( $args ){
181	+
182	+ $args['responsiveMenuSelect'] = true;
183	+
184	+ $select = wp_nav_menu( $args );
185	+
186	+ return $select;
187	+ }
188	+
189	+ function responsiveSelectFilter( $args ){
190	+
191	+ if( $this->isEnabled() ){
192	+
193	+ if( !isset( $args['responsiveMenuSelect'] ) ) return $args;
194	+
195	+ $itemName = $this->settings->op( 'first_item' );
196	+ $selected = $this->settings->op( 'current_selected' ) ? '' : 'selected="selected"';
197	+ $firstOp = '<option value="" '.$selected.'>'.$itemName.'</option>';
198	+
199	+ $args['container'] = false;
200	+ $args['menu_class'] = 'responsiveMenuSelect';
201	+ $args['menu_id'] = '';
202	+ $args['walker'] = new ResponsiveSelectWalker();
203	+ $args['echo'] = false;
204	+ $args['items_wrap'] = '<select class="%2$s">'.$firstOp.'%3$s</select>';
205	+
206	+ $args['depth'] = $this->settings->op( 'max-menu-depth' );
207	+
208	+ }
209	+
210	+ return $args;
211	+
212	+ }
213	+
214	+ /*
215	+ * Create the UberMenu SparkOptions Panel and Settings object
216	+ */
217	+ function optionsMenu(){
218	+
219	+ $sparkOps = new ResponsiveMenuSelectOptions(
220	+ RESPONSIVE_SELECT_MENU_SETTINGS,
221	+
222	+ //Menu Page
223	+ array(
224	+ 'parent_slug' => 'themes.php',
225	+ 'page_title' => 'Responsive Select Menu',
226	+ 'menu_title' => 'Responsive Select',
227	+ 'menu_slug' => 'responsive-select',
228	+ ),
229	+
230	+ //Links
231	+ array()
232	+
233	+ );
234	+
235	+
236	+
237	+ /*
238	+ * Basic Config Panel
239	+ */
240	+ $basic = 'basic-config';
241	+ $sparkOps->registerPanel( $basic, 'Basic Configuration' );
242	+
243	+ $sparkOps->addHidden( $basic , 'current-panel-id' , $basic );
244	+
245	+
246	+ $sparkOps->addTextInput( $basic,
247	+ 'max-menu-width',
248	+ 'Maximum Menu Width',
249	+ 'Show the select box when the viewport is less than this width',
250	+ 960,
251	+ 'spark-minitext',
252	+ 'px'
253	+ );
254	+
255	+ $sparkOps->addTextInput( $basic,
256	+ 'max-menu-depth',
257	+ 'Menu Depth Limit',
258	+ 'The maximum number of levels of menu items to include in the select menu. Set to 0 for no limit.',
259	+ 0,
260	+ 'spark-minitext',
261	+ ''
262	+ );
263	+
264	+ $sparkOps->addTextInput( $basic,
265	+ 'spacer',
266	+ 'Sub Item Spacer',
267	+ 'The character to use to indent sub items.',
268	+ '– ',
269	+ 'spark-minitext',
270	+ ''
271	+ );
272	+
273	+ $sparkOps->addCheckbox( $basic,
274	+ 'exclude-hashes',
275	+ 'Exclude Items Without Links',
276	+ 'Exclude any items where the URL is set to "#" or blank',
277	+ 'on'
278	+ );
279	+
280	+ $sparkOps->addTextInput( $basic,
281	+ 'first_item',
282	+ 'First Item Name',
283	+ 'Text to display for the first "dummy" item.',
284	+ '⇒ Navigate',
285	+ '',
286	+ ''
287	+ );
288	+
289	+ $sparkOps->addCheckbox( $basic,
290	+ 'current_selected',
291	+ 'Show currently selected item',
292	+ 'Enable to show the currently selected item, rather than the first "dummy" item, when the page loads.',
293	+ 'off'
294	+ );
295	+
296	+ $sparkOps->addSubHeader( $basic,
297	+ 'activate_theme_locations_header',
298	+ 'Activate Theme Locations'
299	+ );
300	+
301	+ $sparkOps->addCheckbox( $basic,
302	+ 'activate_theme_locations_all',
303	+ 'Activate All Theme Locations',
304	+ 'Apply the responsive select menu to all menus',
305	+ 'on'
306	+ );
307	+
308	+ $sparkOps->addChecklist( $basic,
309	+ 'active_theme_locations',
310	+ 'Selectively Activate Theme Locations',
311	+ 'Disable the above and activate only the theme locations you want. These theme locations correspond to the Theme Locations Meta Box in Appearance > Menus',
312	+ 'get_registered_nav_menus'
313	+ );
314	+
315	+
316	+
317	+ $advanced = 'advanced-config';
318	+ $sparkOps->registerPanel( $advanced, 'Advanced Settings' );
319	+
320	+ $sparkOps->addTextInput( $advanced,
321	+ 'display_only',
322	+ 'Enable only on',
323	+ 'IDs of pages to enable responsive select menu on. Other pages will use the standard theme menu. Enter as a comma-separated list.',
324	+ '',
325	+ '',
326	+ ''
327	+ );
328	+
329	+
330	+
331	+ $uber = 'uber-config';
332	+ $sparkOps->registerPanel( $uber, 'UberMenu Configuration' );
333	+
334	+ $sparkOps->addInfobox( $uber,
335	+ 'uber-info',
336	+ 'UberMenu is NOT required in order to use this plugin',
337	+
338	+ '<p class="cf">UberMenu is a user-friendly, highly customizable responsive Mega Menu WordPress plugin. '.
339	+ 'It works out of the box with the WordPress 3 Menu System, making it simple to get started '.
340	+ 'but powerful enough to create highly customized and creative mega menu configurations.<br/><br/>' .
341	+ 'If you are not using UberMenu, you can ignore these settings. '.
342	+ '<a href="http://wpmegamenu.com" class="button save-button" target="_blank">More about UberMenu →</a></p>'
343	+
344	+ );
345	+
346	+ $sparkOps->addCheckbox( $uber,
347	+ 'uber-enabled',
348	+ 'Activate UberMenu Options',
349	+ 'If you are using UberMenu, enable this setting to make use of the UberMenu-specific options.',
350	+ 'off'
351	+ );
352	+
353	+ $sparkOps->addCheckbox( $uber,
354	+ 'uber-exclude-nonlinks',
355	+ 'Exclude Non-links',
356	+ 'Exclude any items where the link is disabled',
357	+ 'on'
358	+ );
359	+
360	+ $sparkOps->addCheckbox( $uber,
361	+ 'uber-exclude-notext',
362	+ 'Exclude No-text',
363	+ 'Exclude any items where the text is disabled',
364	+ 'on'
365	+ );
366	+
367	+ $sparkOps->addCheckbox( $uber,
368	+ 'uber-exclude-sidebar',
369	+ 'Exclude Widgets',
370	+ 'Exclude any items with attached widgets',
371	+ 'on'
372	+ );
373	+
374	+ $sparkOps->addCheckbox( $uber,
375	+ 'uber-exclude-content-overrides',
376	+ 'Exclude Content Overrides',
377	+ 'Exclude any items with content overrides',
378	+ 'on'
379	+ );
380	+
381	+ $ss = 'ss-config';
382	+ $sparkOps->registerPanel( $ss, 'More from SevenSpark' );
383	+
384	+ $sparkOps->addCustom( $ss, 'ss_products' , 'ResponsiveMenuSelect::sevenspark_showcase' );
385	+
386	+
387	+ return $sparkOps;
388	+ }
389	+
390	+
391	+ function getSettings(){
392	+ return $this->settings;
393	+ }
394	+
395	+ static function sevenspark_showcase(){
396	+
397	+ $html = '
398	+ <div class="social_media">
399	+ <a target="_blank" href="https://twitter.com/#!/sevenspark" class="ss-twitter"></a>
400	+ <a target="_blank" href="http://www.facebook.com/sevensparklabs" class="ss-facebook"></a>
401	+ <a target="_blank" href="http://dribbble.com/sevenspark" class="ss-dribbble"></a>
402	+ </div>
403	+
404	+ <div class="ss-infobox spark-infobox">
405	+ Like this plugin? Check out even more from SevenSpark
406	+ </div>
407	+
408	+ <div class="cf">
409	+ <h4>Menu Swapper</h4>
410	+
411	+ <a href="http://wordpress.org/plugins/menu-swapper/" target="_blank"><img src="http://i.imgur.com/HtzdwfQ.png" /></a>
412	+
413	+ <p>The Menu Swapper allows you to register custom theme locations and easily swap menus on individual Pages or Posts, all through the WordPress Admin Panel</p>
414	+
415	+ <a href="http://wordpress.org/plugins/menu-swapper/" target="_blank" class="button save-button">Download
416	+ Menu Swapper for Free →</a>
417	+ </div>
418	+
419	+ <div class="cf">
420	+ <h4>Contact Form 7 - Dynamic Text Extension</h4>
421	+
422	+ <a href="http://wordpress.org/extend/plugins/contact-form-7-dynamic-text-extension/" target="_blank"><img src="http://i.imgur.com/wJNTISL.png" /></a>
423	+
424	+ <p>Contact Form 7 DTX allows you to pre-populate your Contact Form 7 fields with dynamic values</p>
425	+
426	+ <a href="http://wordpress.org/extend/plugins/contact-form-7-dynamic-text-extension/" target="_blank" class="button save-button">Download
427	+ CF7 DTX for Free →</a>
428	+ </div>
429	+
430	+
431	+ <div class="cf">
432	+ <h4>UberMenu - Responsive WordPress Mega Menu Plugin</h4>
433	+
434	+ <a href="http://goo.gl/Gx39p"><img src="http://2.s3.envato.com/files/53559492/UberMenu_CodeCanyon_Preview.png" alt="UberMenu" /></a>
435	+
436	+ <p>UberMenu is a user-friendly, highly customizable responsive Mega Menu WordPress plugin.
437	+ It works out of the box with the WordPress 3 Menu System, making it simple to get started
438	+ but powerful enough to create highly customized and creative mega menu configurations.</p>
439	+
440	+ <a href="http://goo.gl/Gx39p" class="button save-button" target="_blank">Check out the UberMenu demo →</a>
441	+
442	+ </div>
443	+
444	+
445	+
446	+ <div class="cf">
447	+ <h4>UberMenu - Sticky Menu Extension</h4>
448	+
449	+ <a href="http://goo.gl/mMQYs"><img src="http://i.imgur.com/VX3uX5U.png" alt="UberMenu Sticky Menu" /></a>
450	+
451	+ <p>Turn your UberMenu into a Sticky Menu as your users scroll.</p>
452	+
453	+ <a href="http://goo.gl/mMQYs" class="button save-button" target="_blank">Check out the UberMenu Sticky demo →</a>
454	+
455	+ </div>
456	+
457	+ <div class="cf">
458	+ <h4>UberMenu - Flat Skin Pack</h4>
459	+
460	+ <a href="http://goo.gl/RCTdO"><img src="http://2.s3.envato.com/files/56692616/FlatSkinPack_CodeCanyonPackaging.png" alt="UberMenu" /></a>
461	+
462	+ <p>UberMenu is a user-friendly, highly customizable responsive Mega Menu WordPress plugin.
463	+ It works out of the box with the WordPress 3 Menu System, making it simple to get started
464	+ but powerful enough to create highly customized and creative mega menu configurations.</p>
465	+
466	+ <a href="http://goo.gl/RCTdO" class="button save-button" target="_blank">Check out the UberMenu Flat Skin Pack demo →</a>
467	+
468	+ </div>
469	+
470	+
471	+ <div class="cf">
472	+ <h4>UberMenu - Conditionals Extension</h4>
473	+
474	+ <a href="http://goo.gl/ehTEf"><img src="http://i.imgur.com/y2X234g.png" alt="UberMenu Conditionals" /></a>
475	+
476	+ <p>Display or hide your menu items based on preset conditions.</p>
477	+
478	+ <a href="http://goo.gl/ehTEf" class="button save-button" target="_blank">Check out the UberMenu Conditionals demo →</a>
479	+
480	+ </div>
481	+
482	+ <div class="cf">
483	+ <h4>Agility - Responsive HTML5 WordPress Theme</h4>
484	+
485	+ <a href="http://goo.gl/yYDlH"><img src="http://i.imgur.com/OgOqRhK.png" alt="Agility" /></a>
486	+
487	+ <a href="http://goo.gl/yYDlH" class="button save-button" target="_blank">View the demo →</a>
488	+ </div>
489	+
490	+ <div class="cf">
491	+ <h4>WordPress Menu Management Enhancer</h4>
492	+
493	+ <img src="http://i.imgur.com/DNcqlYh.png" alt="Agility" />
494	+
495	+ <a href="http://codecanyon.net/item/menu-management-enhancer-for-wordpress/529353?ref=sevenspark" class="button save-button" target="_blank">View the demo →</a>
496	+ </div>
497	+
498	+ ';
499	+
500	+ return $html;
501	+
502	+ }
503	+
504	+
505	+ }
506	+
507	+ $responsiveMenuSelect = new ResponsiveMenuSelect();
508	+
509	+
510	+
511	+
512	+
513	+ class ResponsiveSelectWalker extends Walker_Nav_Menu{
514	+
515	+ private $index = 0;
516	+ protected $menuItemOptions;
517	+ protected $noUberOps;
518	+
519	+ function start_lvl( &$output, $depth ) {
520	+ $indent = str_repeat( "\t", $depth );
521	+ //$output .= "\n$indent<ul class=\"sub-menu sub-menu-".($depth+1)."\">\n";
522	+ }
523	+
524	+ function end_lvl(&$output, $depth) {
525	+ $indent = str_repeat("\t", $depth);
526	+ //$output .= "$indent</ul>\n";
527	+ }
528	+
529	+ function start_el( &$output, $item, $depth, $args ){
530	+
531	+ global $responsiveMenuSelect;
532	+ global $wp_query;
533	+ $indent = ( $depth ) ? str_repeat( "\t", $depth ) : '';
534	+ $dashes = ( $depth ) ? str_repeat( $responsiveMenuSelect->getSettings()->op( 'spacer' ), $depth ) : ''; //"– "
535	+
536	+ $class_names = $value = '';
537	+
538	+ $classes = empty( $item->classes ) ? array() : (array) $item->classes;
539	+ $classes[] = 'menu-item-' . $item->ID;
540	+
541	+ $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) );
542	+ $class_names = ' class="' . esc_attr( $class_names ) . '"';
543	+
544	+ $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args );
545	+ $id = strlen( $id ) ? ' id="' . esc_attr( $id ) . '"' : '';
546	+
547	+ if( ( $item->url == '#' \|\| $item->url == '' ) && $responsiveMenuSelect->getSettings()->op( 'exclude-hashes' ) ){
548	+ return;
549	+ }
550	+
551	+ //IF UBERMENU
552	+ if( $responsiveMenuSelect->getSettings()->op( 'uber-enabled' ) ){
553	+
554	+ global $uberMenu;
555	+ $settings = $uberMenu->getSettings();
556	+
557	+ //Test override settings
558	+ $override = $this->getUberOption( $item->ID, 'shortcode' );
559	+ $overrideOn = /$depth > 0 && / $settings->op( 'wpmega-shortcodes' ) && !empty( $override ) ? true : false;
560	+
561	+ //Test sidebar settings
562	+ $sidebar = $this->getUberOption( $item->ID, 'sidebars' );
563	+ $sidebarOn = ( $settings->op( 'wpmega-top-level-widgets' ) \|\| $depth > 0 ) && $settings->op( 'wpmega-sidebars' ) && !empty( $sidebar ) ? true : false;
564	+
565	+ $notext = $this->getUberOption( $item->ID, 'notext' ) == 'on' \|\| $item->title == UBERMENU_NOTEXT ? true : false;
566	+ $nolink = $this->getUberOption( $item->ID, 'nolink' ) == 'on' ? true : false;
567	+
568	+ if( $nolink && $responsiveMenuSelect->getSettings()->op( 'uber-exclude-nonlinks' ) ){
569	+ return;
570	+ }
571	+ if( $notext && $responsiveMenuSelect->getSettings()->op( 'uber-exclude-notext' ) ){
572	+ return;
573	+ }
574	+ if( $sidebarOn && $responsiveMenuSelect->getSettings()->op( 'uber-exclude-sidebar' ) ){
575	+ return;
576	+ }
577	+ if( $overrideOn && $responsiveMenuSelect->getSettings()->op( 'uber-exclude-content-overrides' ) ){
578	+ return;
579	+ }
580	+
581	+ }
582	+
583	+ //$attributes = ! empty( $item->url ) ? ' value="' . esc_attr( $item->url ) .'"' : '';
584	+ $attributes = ' value="' . esc_attr( $item->url ) .'"';
585	+
586	+ if( $responsiveMenuSelect->getSettings()->op( 'current_selected' ) && strpos( $class_names , 'current-menu-item' ) > 0 ){
587	+ $attributes.= ' selected="selected"';
588	+ }
589	+
590	+ $output .= $indent . '<option ' . $id . $attributes . '>';
591	+
592	+ $item_output = $args->before;
593	+ $item_output .= $dashes . $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after;
594	+ $item_output .= $args->after;
595	+
596	+ $output.= str_replace( '%', '%%', $item_output );
597	+
598	+ $output.= "</option>\n";
599	+ }
600	+
601	+ function end_el(&$output, $item, $depth) {
602	+ return;
603	+ }
604	+
605	+ function getUberOption( $item_id , $id ){
606	+ //get_post_meta or from uber_options, depending on whether uber_options is set
607	+
608	+ $option_id = 'menu-item-'.$id;
609	+
610	+ //Initialize array
611	+ if( !is_array( $this->menuItemOptions ) ){
612	+ $this->menuItemOptions = array();
613	+ $this->noUberOps = array();
614	+ }
615	+
616	+ //We haven't investigated this item yet
617	+ if( !isset( $this->menuItemOptions[ $item_id ] ) ){
618	+
619	+ $uber_options = false;
620	+ if( empty( $this->noUberOps[ $item_id ] ) ) {
621	+ $uber_options = get_post_meta( $item_id , '_uber_options', true );
622	+ if( !$uber_options ) $this->noUberOps[ $item_id ] = true; //don't check again for this menu item
623	+ }
624	+
625	+ //If $uber_options are set, use them
626	+ if( $uber_options ){
627	+ $this->menuItemOptions[ $item_id ] = $uber_options;
628	+ }
629	+ //Otherwise get the old meta
630	+ else{
631	+ $option_id = '_menu_item_'.$id; //UberMenu::convertToOldParameter( $id );
632	+ return get_post_meta( $item_id, $option_id , true );
633	+ }
634	+ }
635	+ return isset( $this->menuItemOptions[ $item_id ][ $option_id ] ) ? stripslashes( $this->menuItemOptions[ $item_id ][ $option_id ] ) : '';
636	+ }
637	+ }

trunk/screenshot-1.png ADDED Viewed

Binary file

trunk/screenshot-2.png ADDED Viewed

Binary file

trunk/sparkoptions/SparkOptions.class.php ADDED Viewed

	@@ -0,0 +1,815 @@


1	+ <?php
2	+ /*
3	+ * SevenSpark Options Framework
4	+ *
5	+ * Copyright Chris Mavricos, SevenSpark
6	+ * http://sevenspark.com
7	+ *
8	+ * Version 1.0.1
9	+ */
10	+ class ResponsiveMenuSelectOptions{
11	+
12	+ public $id;
13	+ public $title;
14	+ public $menu_page;
15	+ public $menu_type;
16	+ public $parent_slug;
17	+ public $page_title;
18	+ public $menu_title;
19	+ public $capability;
20	+ public $menu_slug;
21	+
22	+ public $panels; //array
23	+ public $ops; //array
24	+
25	+
26	+ public $settings;
27	+ public $updated;
28	+ public $options_key;
29	+
30	+ public $notification;
31	+ public $warning;
32	+
33	+ public $config;
34	+
35	+ public $tour;
36	+
37	+
38	+ function __construct( $id, $config = array() , $links = array() ){
39	+
40	+ $this->id = $id;
41	+ $this->config = $config;
42	+
43	+ if( is_admin() ){
44	+ //$this->initializeMenuPage( $id, $config );
45	+ add_action( 'admin_menu' , array( $this , 'updateSettings' ) , 100 );
46	+ add_action( 'admin_menu' , array( $this , 'initializeMenuPage' ) , 101 );
47	+
48	+ }
49	+
50	+ $this->panels = array();
51	+ $this->ops = array();
52	+
53	+ $this->options_key = self::generateOptionsKey( $this->id );
54	+
55	+ $this->links = $links;
56	+
57	+ }
58	+
59	+ function initializeMenuPage(){
60	+
61	+ extract( wp_parse_args( $this->config, array(
62	+
63	+ 'type' => 'submenu_page',
64	+ 'parent_slug' => 'options-general.php',
65	+ 'page_title' => 'Spark Panel Options',
66	+ 'menu_title' => 'Spark Panel',
67	+ 'capability' => 'manage_options',
68	+ 'menu_slug' => $this->id,
69	+
70	+ )));
71	+
72	+ $this->title = $menu_title;
73	+ $this->menu_type = $type;
74	+ $this->parent_slug = $parent_slug;
75	+ $this->page_title = $page_title;
76	+ $this->menu_title = $menu_title;
77	+ $this->menu_slug = $menu_slug;
78	+ $this->capability = $capability;
79	+
80	+ switch( $this->menu_type ){
81	+
82	+ case 'submenu_page':
83	+
84	+ $this->menu_page = add_submenu_page(
85	+ $this->parent_slug,
86	+ $this->page_title , //'sparkoptions',
87	+ $this->menu_title , //'sparkoptions',
88	+ $this->capability,
89	+ $this->menu_slug,
90	+ array( $this, 'show' ) );
91	+
92	+ break;
93	+
94	+ }
95	+
96	+ $this->loadAssets();
97	+
98	+ }
99	+
100	+ function loadAssets(){
101	+ add_action("admin_print_styles-{$this->menu_page}", array( $this , 'loadCSS' ) );
102	+ add_action("admin_print_styles-{$this->menu_page}", array( $this , 'loadJS' ) );
103	+ }
104	+
105	+ function loadCSS(){
106	+ $tmp = plugins_url().'/'.str_replace( basename( __FILE__ ),"",plugin_basename( __FILE__ ));
107	+ wp_enqueue_style('sparkoptions-css', $tmp.'/sparkoptions.css', false, '1.1', 'all');
108	+
109	+ do_action( 'sparkoptions_load_css_'.$this->id );
110	+
111	+ }
112	+ function loadJS(){
113	+ $tmp = plugins_url().'/'.str_replace( basename( __FILE__ ),"",plugin_basename( __FILE__ ));
114	+ wp_enqueue_script( 'jquery' ); // Load jQuery
115	+ wp_enqueue_script( 'sparkoptions-js', $tmp.'/sparkoptions.js', false, '1.1', 'all');
116	+
117	+ do_action( 'sparkoptions_load_js_'.$this->id );
118	+ }
119	+
120	+
121	+ function show(){
122	+
123	+ if ( !current_user_can( $this->capability ) ) {
124	+ wp_die( __('You do not have sufficient permissions to access this page.') );
125	+ }
126	+
127	+ ?>
128	+ <div class="wrap spark-controlPanel">
129	+
130	+ <?php do_action( 'sparkoptions_before_settings_panel_'.$this->id ); ?>
131	+
132	+ <div class="spark-settings-panel">
133	+ <div class="spark-nav">
134	+
135	+ <h2><?php echo $this->title; ?></h2>
136	+ <h5>Control Panel</h5>
137	+
138	+ <ul>
139	+ <?php
140	+ foreach($this->panels as $panel_id => $config){
141	+ ?>
142	+ <li><a href="#spark-<?php echo $panel_id; ?>"><?php echo $config['name']; ?></a></li>
143	+ <?php
144	+ }
145	+ ?>
146	+ </ul>
147	+
148	+ <br/>
149	+ <div class="spark-nav-footer">
150	+
151	+ <?php
152	+ foreach( $this->links as $l ):?>
153	+
154	+ <a href="<?php echo $l['href']; ?>"
155	+ class="<?php echo $l['class']; ?>"
156	+ title="<?php echo $l['title']; ?>"
157	+ target="_blank" ><?php echo $l['text']; ?></a>
158	+
159	+ <?php
160	+ endforeach;
161	+ if( $this->tour ){
162	+ echo $this->tour->resetTourButton();
163	+ }
164	+ ?>
165	+
166	+ <a href="http://sevenspark.com" class="spark-attribution" target="_blank">by SevenSpark</a>
167	+ </div>
168	+
169	+ </div>
170	+ <div class="spark-panels">
171	+ <form method="post" id="spark-options">
172	+ <?php
173	+
174	+ $class = '';
175	+ $start_panel = isset( $this->settings['current-panel-id'] ) ? $this->op('current-panel-id') : 'basic-config';
176	+
177	+ foreach($this->panels as $panel_id => $config){
178	+ ?>
179	+
180	+ <div id="spark-<?php echo $panel_id; ?>" class="spark-panel">
181	+
182	+ <?php if( $this->notification && $panel_id == $start_panel ): ?>
183	+ <div class="spark-infobox"><?php echo $this->notification; ?></div>
184	+ <?php endif; ?>
185	+
186	+ <?php if( $this->warning && $panel_id == $start_panel ): ?>
187	+ <br/>
188	+ <div class="spark-infobox spark-infobox-warning"><?php echo $this->warning; ?></div>
189	+ <?php endif; ?>
190	+
191	+ <h3><?php echo $config['name']; ?></h3>
192	+
193	+ <?php
194	+ $reset = false;
195	+ foreach( $config['ops'] as $id ){
196	+
197	+ $op = $this->ops[$id];
198	+
199	+ if( $op['type'] == 'reset' ){
200	+ $reset = array( 'id' => $id, 'op' => $op );
201	+ continue;
202	+ }
203	+
204	+ if($op['type'] == 'header-2') $class = 'wpmega-config-section'; //TODO
205	+ echo $this->showAdminOption( $id, $op, $class );
206	+ if($op['type'] == 'header-2') $class = 'sub-container sub-container-'.$id;
207	+ }
208	+ ?>
209	+
210	+ <input type="submit" name="<?php echo $this->id; ?>-sparkops_submit" value="Save All Settings" class="button save-button"/>
211	+
212	+ <?php
213	+ if( $reset ){
214	+ echo $this->showAdminOption( $reset['id'], $reset['op'], '' );
215	+ }
216	+ ?>
217	+ </div>
218	+ <?php
219	+ }
220	+
221	+ ?>
222	+
223	+ <?php wp_nonce_field( $this->options_key , '_sparkoptions-nonce' ); ?>
224	+
225	+ </form>
226	+
227	+ </div>
228	+
229	+
230	+ </div> <!-- end spark-settings-panel -->
231	+ </div> <!-- end spark-controlPanel -->
232	+
233	+ <?php
234	+
235	+
236	+ }
237	+
238	+ function showAdminOption($id, $config, $class=''){
239	+
240	+ extract( wp_parse_args( $config, array(
241	+ 'title' => '',
242	+ 'type' => 'text',
243	+ 'desc' => '',
244	+ 'units' => '',
245	+ 'ops' => null,
246	+ 'default'=> '',
247	+ 'special_class' => '',
248	+ 'gradient' => false,
249	+ 'default_all' => 'off',
250	+ )));
251	+
252	+ $settings = $this->getSettings();
253	+
254	+ $class.= ' '.$special_class;
255	+
256	+ $html = '<div id="container-'.$id.'" class="spark-admin-op container-type-'.$type.' '.$class.'">';
257	+ if(!empty($before)) $html.= $before;
258	+
259	+ $val = isset( $settings[$id] ) ? $settings[$id] : '';
260	+ if(!is_numeric($val) && empty($val)) $val = $default; //must check numeric otherwise we can't use 0
261	+
262	+ $title = '<label class="spark-admin-op-title" for="'.$id.'">'.$title.'</label>';
263	+ $desc = empty($desc) ? '' : '<span class="spark-admin-op-desc">'.$desc.'</span>';
264	+ $units = '<span class="spark-admin-op-units">'.$units.'</span>';
265	+
266	+ switch($type){
267	+
268	+ case 'text':
269	+ $html.= $title;
270	+ $html.= '<input type="text" id="'.$id.'" name="'.$id.'" value="'.stripslashes( $val ).'"/>';
271	+ $html.= $units;
272	+ $html.= $desc;
273	+
274	+ break;
275	+
276	+ case 'textarea':
277	+ $html.= $title;
278	+ $html.= $desc;
279	+ $html.= '<textarea type="text" id="'.$id.'" name="'.$id.'" >'.stripslashes( $val ).'</textarea>';
280	+
281	+
282	+ break;
283	+
284	+ case 'checkbox':
285	+
286	+ if(empty($val)) $ischecked = $default == 'on' ? true : false;
287	+ else $ischecked = $val == 'on' ? true : false;
288	+
289	+ $html.= $title;
290	+ $html.= '<input type="checkbox" id="'.$id.'" name="'.$id.'" '.checked($ischecked, true, false).'/>';
291	+ $html.= $desc;
292	+ $html.= '<div class="clear"></div>';
293	+
294	+ break;
295	+
296	+ case 'checklist':
297	+
298	+ $html.= '<label class="spark-admin-op-title">'.$config['title'].'</label>'; //$title;
299	+ $html.= $desc;
300	+ $html.= '<div class="spark-admin-checklist">';
301	+
302	+ if(!is_array($ops)) $ops = $ops(); //if it's not an array it's a function that produces an array
303	+
304	+ if(is_array($ops)){
305	+
306	+ $val = '';
307	+ $multi = false;
308	+
309	+ if( isset( $settings[$id] ) ){
310	+ $val = $settings[$id];
311	+ if( is_array( $val ) ){
312	+ $multi = true;
313	+ }
314	+ }
315	+ //print_r( $val );
316	+
317	+ $k = 0;
318	+ foreach($ops as $opVal => $op){
319	+ //echo "val = $val";
320	+ $checked = '';
321	+ if( $multi ){
322	+ $checked = in_array( $opVal, $val ) ? 'checked="checked"' : '';
323	+ }
324	+ else $checked = $opVal == $val ? 'checked="checked"' : '';
325	+ $input_id = $id.'-'.$k;
326	+ $html.= '<label class="spark-admin-op-title" for="'.$input_id.'">'.$op.'</label> <input type="checkbox" value="'.$opVal.'" '.$checked.' name="'.$id.'[]" id="'.$input_id.'" />';
327	+ $k++;
328	+ }
329	+ }
330	+
331	+ $html.= '</div>';
332	+
333	+ break;
334	+
335	+
336	+ case 'select':
337	+
338	+ $html.= '<label class="spark-admin-op-title">'.$config['title'].'</label>'; //$title;
339	+
340	+ $html.= '<select id="'.$id.'" name="'.$id.'" >';
341	+
342	+ if(!is_array($ops)) $ops = $ops(); //if it's not an array it's a function that produces an array
343	+
344	+ if(is_array($ops)){
345	+ foreach($ops as $opVal => $op){
346	+ $selected = $opVal == $val ? 'selected="selected"' : '';
347	+
348	+ $html.= '<option value="'.$opVal.'" '.$selected.' >'.$op.'</option>';
349	+ }
350	+ }
351	+
352	+ $html.= '</select>';
353	+
354	+ break;
355	+
356	+ case 'radio':
357	+
358	+ $html.= $title;
359	+ if(is_array($ops)){
360	+ foreach($ops as $opVal => $op){
361	+
362	+ $ischecked = $val == $opVal ? true : false;
363	+
364	+ $html.= '<div class="spark-admin-op-radio">';
365	+ $html.= '<input type="radio" id="'.$id.'_'.$opVal.'" name="'.$id.'" value="'.$opVal.'" '.checked($ischecked, true, false).' />';
366	+ $html.= '<label for="'.$id.'_'.$opVal.'">'.$op.'</label>';
367	+ $html.= '</div>';
368	+ }
369	+ }
370	+ break;
371	+
372	+ case 'color':
373	+ $html.= $title;
374	+ $html.= '<input class="colorPicker-color" type="text" id="'.$id.'" name="'.$id.'" value="'.$val.'" />';
375	+
376	+ if( $gradient ){
377	+ $c2 = isset( $settings[$id.'-color2'] ) ? $settings[$id.'-color2'] : '';
378	+ $html.= '<input class="colorPicker-color colorPicker-color2" type="text" id="'.$id.'-color2" name="'.$id.'-color2" value="'.$c2.'" />';
379	+ }
380	+
381	+ $html.= '<span class="clearColor" title="Clear" > </span>';
382	+
383	+ $html.= '<span class="ss-admin-op-desc">'.$desc.'</span>';
384	+ break;
385	+
386	+ case 'header':
387	+ $html.= '<h3>'.$title.'</h3>';
388	+ break;
389	+
390	+ case 'header-2':
391	+ $html.= '<h4>'.$title.'</h4>';
392	+ break;
393	+
394	+ case 'infobox':
395	+ $html.= '<div class="spark-infobox '.$special_class.'">';
396	+ if($config['title'] != '') $html.= '<h4>'.$title.'</h4>';
397	+ $html.= $desc.'</div>';
398	+
399	+ break;
400	+
401	+ case 'reset':
402	+ $html.= $title;
403	+ $html.= '<input type="submit" id="'.$id.'" name="'.$this->id.'-reset-options" value="Reset" class="button reset-button"
404	+ onClick="return confirm(\'WARNING: Are you sure you want to reset all UberMenu options?\');" />';
405	+ $html.= $desc;
406	+
407	+ break;
408	+
409	+ case 'flush-rewrite':
410	+ $html.= $title;
411	+ $html.= '<input type="submit" id="'.$id.'" name="'.$this->id.'-flush-rewrite" value="Flush Rewrite Rules" class="button reset-button"
412	+ />';
413	+ $html.= $desc;
414	+
415	+ break;
416	+
417	+ case 'custom':
418	+ $html.= call_user_func( array( $this, $config['func'] ) );
419	+ break;
420	+
421	+ case '_custom':
422	+ $html.= call_user_func( $config['func'] );
423	+ break;
424	+
425	+ case 'hidden':
426	+ $html.= '<input type="hidden" id="'.$id.'" name="'.$id.'" value="'.stripslashes( $val ).'"/>';
427	+ break;
428	+
429	+
430	+
431	+ }
432	+ $html.= '</div>';
433	+
434	+ return $html;
435	+ }
436	+
437	+
438	+
439	+ /* INPUT TYPES */
440	+
441	+ /**
442	+ * Add a text input
443	+ *
444	+ * @param panel_id String - the ID of the panel to add the option to
445	+ * @param id String - the ID of this option
446	+ * @param title String - the label for the text input
447	+ * @param desc String - the description of the option
448	+ * @param special_class String - the class to add to the dialog, like 'spark-infobox-warning'
449	+ */
450	+ function addTextInput( $panel_id, $id, $title , $desc = '' , $default = '' , $special_class = '' , $units = '' ){
451	+
452	+ $this->ops[$id] = array(
453	+ 'title' => $title,
454	+ 'desc' => $desc,
455	+ 'default' => $default,
456	+ 'special_class' => $special_class,
457	+ 'units' => $units,
458	+
459	+ 'type' => 'text',
460	+ );
461	+
462	+ $this->addToPanel( $panel_id , $id );
463	+ }
464	+
465	+ function addTextArea( $panel_id, $id, $title , $desc = '' , $default = '' , $special_class = '' ){
466	+
467	+ $this->ops[$id] = array(
468	+ 'title' => $title,
469	+ 'desc' => $desc,
470	+ 'default' => $default,
471	+ 'special_class' => $special_class,
472	+
473	+ 'type' => 'textarea',
474	+ );
475	+
476	+ $this->addToPanel( $panel_id , $id );
477	+ }
478	+
479	+ function addCheckbox( $panel_id , $id , $title , $desc = '' , $default = 'off' , $special_class = '' ){
480	+
481	+ $this->ops[$id] = array(
482	+ 'title' => $title,
483	+ 'desc' => $desc,
484	+ 'default' => $default,
485	+ 'special_class' => $special_class,
486	+
487	+ 'type' => 'checkbox',
488	+ );
489	+
490	+ $this->addToPanel( $panel_id , $id );
491	+
492	+ }
493	+
494	+ function addChecklist( $panel_id , $id , $title , $desc = '' , $ops = array(), $default = '' , $default_all='off', $special_class = '' ){
495	+ $this->ops[$id] = array(
496	+ 'title' => $title,
497	+ 'desc' => $desc,
498	+ 'ops' => $ops,
499	+ 'default' => $default,
500	+ 'default_all' => $default_all,
501	+ 'special_class' => $special_class,
502	+
503	+ 'type' => 'checklist',
504	+ );
505	+
506	+ $this->addToPanel( $panel_id , $id );
507	+ }
508	+
509	+ function addRadio( $panel_id , $id , $title , $desc = '' , $ops = array() , $default = '' , $special_class = '' ){
510	+
511	+ $this->ops[$id] = array(
512	+ 'title' => $title,
513	+ 'desc' => $desc,
514	+ 'ops' => $ops,
515	+ 'default' => $default,
516	+ 'special_class' => $special_class,
517	+
518	+ 'type' => 'radio',
519	+ );
520	+
521	+ $this->addToPanel( $panel_id , $id );
522	+
523	+ }
524	+
525	+ function addSelect( $panel_id , $id , $title , $desc = '' , $ops = array() , $default = '' , $special_class = '' ){
526	+
527	+ $this->ops[$id] = array(
528	+ 'title' => $title,
529	+ 'desc' => $desc,
530	+ 'ops' => $ops,
531	+ 'default' => $default,
532	+ 'special_class' => $special_class,
533	+
534	+ 'type' => 'select',
535	+ );
536	+
537	+ $this->addToPanel( $panel_id , $id );
538	+
539	+ }
540	+
541	+ function addColorPicker( $panel_id , $id , $title , $desc = '' , $gradient = true ){
542	+
543	+ $this->ops[$id] = array(
544	+ 'title' => $title,
545	+ 'desc' => $desc,
546	+ 'gradient' => $gradient,
547	+
548	+ 'type' => 'color',
549	+ );
550	+
551	+ $this->addToPanel( $panel_id , $id );
552	+
553	+ }
554	+
555	+ function addSubHeader( $panel_id, $id, $title, $desc = '', $special_class = '' ){
556	+
557	+ $this->ops[$id] = array(
558	+ 'title' => $title,
559	+ 'desc' => $desc,
560	+ 'special_class' => $special_class,
561	+
562	+ 'type' => 'header-2',
563	+ );
564	+
565	+ $this->addToPanel( $panel_id , $id );
566	+ }
567	+
568	+ /**
569	+ * Add an information box
570	+ *
571	+ * @param panel_id string - the ID of the panel to add the option to
572	+ * @param id string - the ID of this option
573	+ * @param title string - the title of the dialog
574	+ * @param desc string - the text of the dialog
575	+ * @param special_class - the class to add to the dialog, like 'spark-infobox-warning'
576	+ */
577	+ function addInfobox( $panel_id , $id , $title , $desc = '' , $special_class = '' ){
578	+
579	+ $this->ops[$id] = array(
580	+ 'title' => $title,
581	+ 'desc' => $desc,
582	+ 'special_class' => $special_class,
583	+
584	+ 'type' => 'infobox',
585	+ );
586	+
587	+ $this->addToPanel( $panel_id , $id );
588	+
589	+ }
590	+
591	+ function addResetButton( $panel_id , $id , $title , $desc = '' , $special_class = '' ){
592	+
593	+ $this->ops[$id] = array(
594	+ 'title' => $title,
595	+ 'desc' => $desc,
596	+ 'special_class' => $special_class,
597	+
598	+ 'type' => 'reset',
599	+ );
600	+
601	+ $this->addToPanel( $panel_id , $id );
602	+
603	+ }
604	+
605	+ function addFlushRewriteButton( $panel_id , $id , $title , $desc = '' , $special_class = '' ){
606	+
607	+ $this->ops[$id] = array(
608	+ 'title' => $title,
609	+ 'desc' => $desc,
610	+ 'special_class' => $special_class,
611	+
612	+ 'type' => 'flush-rewrite',
613	+ );
614	+
615	+ $this->addToPanel( $panel_id , $id );
616	+
617	+ }
618	+
619	+ function addCustomField( $panel_id , $id , $func ){
620	+
621	+ $this->ops[$id] = array(
622	+ 'func' => $func,
623	+ 'type' => 'custom',
624	+ );
625	+
626	+ $this->addToPanel( $panel_id , $id );
627	+
628	+ }
629	+
630	+ function addCustom( $panel_id , $id , $func ){
631	+
632	+ $this->ops[$id] = array(
633	+ 'func' => $func,
634	+ 'type' => '_custom',
635	+ );
636	+
637	+ $this->addToPanel( $panel_id , $id );
638	+
639	+ }
640	+
641	+ function addHidden( $panel_id , $id , $value ){
642	+
643	+ $this->ops[$id] = array(
644	+ 'type' => 'hidden',
645	+ 'default' => $value
646	+ );
647	+
648	+ $this->addToPanel( $panel_id , $id );
649	+ }
650	+
651	+
652	+ function addToPanel( $panel_id , $option_id ){
653	+
654	+ if( !isset( $this->panels[$panel_id] ) ){
655	+ //echo "panel $panel_id not registered";
656	+ return;
657	+ }
658	+
659	+ $this->panels[$panel_id]['ops'][] = $option_id;
660	+
661	+ }
662	+
663	+ function registerPanel( $panel_id , $name ){
664	+
665	+ $this->panels[$panel_id] = array();
666	+ $this->panels[$panel_id]['name'] = $name;
667	+ $this->panels[$panel_id]['ops'] = array();
668	+
669	+ }
670	+
671	+ function getSettings(){
672	+
673	+ if( !$this->settings ){
674	+ $this->settings = get_option( $this->options_key );
675	+ $this->settings = apply_filters( $this->id.'_settings_filter' , $this->settings );
676	+ }
677	+
678	+ return $this->settings;
679	+ }
680	+
681	+ function op( $id ){
682	+
683	+ $this->getSettings();
684	+
685	+ //return the value or the default
686	+ $val;
687	+ if( isset( $this->settings[$id] ) ){
688	+ $val = $this->settings[$id];
689	+ }
690	+ else if( isset( $this->ops[$id]['default'] ) ){
691	+ $val = $this->ops[$id]['default'];
692	+ }
693	+ //this option doesn't exist, or doesn't have a default
694	+ else{
695	+ return '';
696	+ }
697	+
698	+ //translate to true/false for checkboxes
699	+
700	+ switch( $this->ops[$id]['type'] ){
701	+ case 'checkbox':
702	+ return $val == 'on' ? true : false;
703	+ break;
704	+
705	+ case 'hidden':
706	+ if( $val == 'on') return true;
707	+ else if( $val == 'off' ) return false;
708	+ return $val;
709	+
710	+ case 'textarea':
711	+ return stripslashes( $val );
712	+ break;
713	+
714	+ case 'text':
715	+ return stripslashes( $val );
716	+ break;
717	+ }
718	+
719	+ return $val;
720	+
721	+ }
722	+
723	+
724	+
725	+
726	+ function updateSettings(){
727	+
728	+ //Resetting Options
729	+ if( isset( $_POST[$this->id.'-reset-options'] ) ){
730	+
731	+ if( check_admin_referer( $this->options_key , '_sparkoptions-nonce' ) ){
732	+
733	+ delete_option( $this->options_key );
734	+ $this->settings = array(); //reset the local settings
735	+ $this->notification = "Settings reset to factory defaults!";
736	+
737	+ }
738	+
739	+ }
740	+
741	+ //Flush rewrite rules
742	+ if( isset( $_POST[$this->id.'-flush-rewrite'] ) ){
743	+
744	+ if( check_admin_referer( $this->options_key , '_sparkoptions-nonce' ) ){
745	+
746	+ flush_rewrite_rules( true );
747	+ $this->notification = "Rewrite rules flushed!";
748	+
749	+ }
750	+
751	+ }
752	+
753	+
754	+ //Only do this on form submission
755	+ if( !isset( $_POST[$this->id.'-sparkops_submit'] ) ) return false;
756	+
757	+ if( !check_admin_referer( $this->options_key , '_sparkoptions-nonce' ) ){
758	+ //Can't ever actually reach here, as function will die above if nonce is invalid
759	+ die( 'No can dosville, baby' );
760	+ return false;
761	+ }
762	+
763	+
764	+ // go through settings, if checkbox and not set, set to 'off'
765	+ $saveOps = array();
766	+
767	+ foreach( $this->ops as $key => $o ){
768	+
769	+ $val = isset( $_POST[$key] ) ? $_POST[$key] : '';
770	+
771	+ switch( $o['type'] ){
772	+ case 'checkbox':
773	+ if(empty($val)) $val = 'off'; // empty($o['default']) ? 'off' : $o['default']; Don't set to default or we can never have 'off'
774	+ break;
775	+ case 'header':
776	+ case 'header-2':
777	+ case 'infobox':
778	+ continue;
779	+ break;
780	+ case 'color':
781	+ if( isset( $_POST[$key.'-color2'] ) ){
782	+ $saveOps[$key.'-color2'] = $_POST[$key.'-color2'];
783	+ }
784	+ break;
785	+ }
786	+
787	+ $saveOps[$key] = $val;
788	+
789	+ }
790	+
791	+
792	+ $this->settings = $saveOps; //setup new settings, in case getSettings() has already been run
793	+
794	+ //Give the plugin a go to do something extra special
795	+ do_action( 'sparkoptions_update_settings_'.$this->id , $saveOps );
796	+
797	+ //Here is where we actually update all the Settings
798	+ update_option( $this->options_key , $this->settings );
799	+
800	+ //Notify user of great success!
801	+ $this->notification = "Settings saved!";
802	+
803	+ return true;
804	+
805	+ }
806	+
807	+ public static function generateOptionsKey( $id ){
808	+ return 'sparkops_'.$id;
809	+ }
810	+
811	+ function addTour( $tour ){
812	+ $this->tour = $tour;
813	+ }
814	+
815	+ }

trunk/sparkoptions/images/cross.png ADDED Viewed

Binary file

trunk/sparkoptions/images/nav_bkg.jpg ADDED Viewed

Binary file

trunk/sparkoptions/images/panel_bkg.jpg ADDED Viewed

Binary file

trunk/sparkoptions/images/social_media_icons/dribbble.png ADDED Viewed

Binary file

trunk/sparkoptions/images/social_media_icons/facebook.png ADDED Viewed

Binary file

trunk/sparkoptions/images/social_media_icons/twitter_2.png ADDED Viewed

Binary file

trunk/sparkoptions/images/sslogo.png ADDED Viewed

Binary file

trunk/sparkoptions/images/sslogo_favicon.png ADDED Viewed

Binary file

trunk/sparkoptions/images/toolbox.png ADDED Viewed

Binary file

trunk/sparkoptions/sparkoptions.css ADDED Viewed

	@@ -0,0 +1,683 @@


1	+ /* SPARK OPTIONS PANEL */
2	+ .spark-controlPanel{
3	+ font-family:Arial, Helvetica, sans-serif;
4	+ }
5	+
6	+ .spark-settings-panel{
7	+ width:800px;
8	+ background:#444 url(images/nav_bkg.jpg) top left repeat;
9	+ margin:2em 0;
10	+
11	+ border-radius:3px;
12	+ border-left:1px solid #222;
13	+ overflow:hidden;
14	+ position:relative;
15	+ }
16	+
17	+ .spark-nav{
18	+ float:left;
19	+ width:180px;
20	+ height:100%;
21	+ min-height:350px;
22	+
23	+ border-top:1px solid #222;
24	+ box-shadow:inset 0px 1px 1px rgba(255,255,255,.2);
25	+ /position:fixed;/
26	+ }
27	+ .spark-nav h2{
28	+ color:#fefefe;
29	+ text-shadow:0px 1px 1px #000;
30	+ padding:10px 10px 0px 10px;
31	+ /*background:transparent url(images/sslogo.png) 140px 8px no-repeat;
32	+ background:transparent url(images/sslogo_favicon.png) 10px 16px no-repeat;*/
33	+ background:transparent url(images/toolbox.png) 150px 16px no-repeat;
34	+ margin:0;
35	+ font-size:20px;
36	+ font-weight:bold;
37	+ }
38	+ .spark-nav h5{
39	+ color:#4D90FE;
40	+ padding:0 10px;
41	+ margin:0 0 20px 0;
42	+ text-shadow:0px -1px 0px #000; /rgba(255,255,255,.2);/
43	+ font-size:12px;
44	+ font-weight:bold;
45	+ font-style:italic;
46	+ }
47	+ .spark-nav ul{
48	+ margin-top:.4em;
49	+ border-top:1px solid #333;
50	+ }
51	+ .spark-nav ul li{
52	+ margin:0;
53	+ }
54	+ .spark-nav ul li a,
55	+ .spark-nav a{
56	+ display:block;
57	+ font-weight:bold;
58	+ color:#efefef;
59	+ font-size:13px;
60	+ padding:8px 10px;
61	+ text-decoration:none;
62	+
63	+ border-bottom:1px solid #333;
64	+ border-top:1px solid #555;
65	+
66	+ text-shadow:0px -1px 1px #111;
67	+ position:relative;
68	+ }
69	+ .spark-nav ul li a:hover{
70	+ color:#fff;
71	+
72	+ }
73	+ .spark-nav ul li a.current{
74	+ color:#D83F28;
75	+ }
76	+ .spark-nav ul li a:after{
77	+ content: ' ';
78	+ position:absolute;
79	+
80	+ top:50%;
81	+ margin-top:-6px;
82	+
83	+ display:none;
84	+ left:100%;
85	+
86	+ width: 0;
87	+ height: 0;
88	+ border-top: 7px solid transparent;
89	+ border-bottom: 7px solid transparent;
90	+
91	+ border-left: 7px solid #333;
92	+
93	+ -webkit-transition:all 1s ease-in-out;
94	+
95	+ }
96	+
97	+ .spark-nav ul li a.current:after,
98	+ .spark-nav ul li a:hover:after{
99	+
100	+ display:block;
101	+
102	+ }
103	+
104	+ .spark-nav-footer{
105	+ position:absolute;
106	+ bottom:0;
107	+ width:180px;
108	+ }
109	+ a.spark-attribution {
110	+ padding-left: 33px;
111	+ background: transparent url(images/sslogo_favicon.png) 10px 10px no-repeat;
112	+ font-weight: normal;
113	+ }
114	+ a.spark-outlink-hl{
115	+ background: #eee; /* Old browsers */
116	+ background: #eee -moz-linear-gradient(top, rgba(255,255,255,.1) 0%, rgba(0,0,0,.1) 100%); /* FF3.6+ */
117	+ background: #eee -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,.2)), color-stop(100%,rgba(0,0,0,.1))); /* Chrome,Safari4+ */
118	+ background: #eee -webkit-linear-gradient(top, rgba(255,255,255,.1) 0%,rgba(0,0,0,.1) 100%); /* Chrome10+,Safari5.1+ */
119	+ background: #eee -o-linear-gradient(top, rgba(255,255,255,.1) 0%,rgba(0,0,0,.1) 100%); /* Opera11.10+ */
120	+ background: #eee -ms-linear-gradient(top, rgba(255,255,255,.1) 0%,rgba(0,0,0,.1) 100%); /* IE10+ */
121	+ background: #eee linear-gradient(top, rgba(255,255,255,.1) 0%,rgba(0,0,0,.1) 100%); /* W3C */
122	+
123	+ border: 1px solid #aaa;
124	+ border-top: 1px solid #ccc;
125	+ border-left: 1px solid #ccc;
126	+
127	+ color: #444;
128	+ display: inline-block;
129	+ font-size: 11px;
130	+ font-weight: bold;
131	+ text-decoration: none;
132	+ text-shadow: 0 1px rgba(255, 255, 255, .75);
133	+ cursor: pointer;
134	+
135	+
136	+ font-family: "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
137	+
138	+
139	+ display:block;
140	+ clear:both;
141	+ position:relative;
142	+
143	+ background-color:#ef452c;
144	+ color:#f9f9f9 !important;
145	+ text-shadow:0px -1px 1px rgba(0,0,0,.3) !important;
146	+ border:1px solid #901B09;
147	+ border-top-color:#B23D2B;
148	+ border-left-color:#B23D2B;
149	+ border-width:1px 0px;
150	+
151	+ text-shadow: 0 1px rgba(255, 255, 255, .2);
152	+ box-shadow:inset 0px 1px 1px rgba(255,255,255,.3);
153	+
154	+ }
155	+
156	+ .reset-tour input,
157	+ a.spark-outlink{
158	+ background: #eee; /* Old browsers */
159	+ background: #eee -moz-linear-gradient(top, rgba(255,255,255,.1) 0%, rgba(0,0,0,.1) 100%); /* FF3.6+ */
160	+ background: #eee -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,.1)), color-stop(100%,rgba(0,0,0,.1))); /* Chrome,Safari4+ */
161	+ background: #eee -webkit-linear-gradient(top, rgba(255,255,255,.1) 0%,rgba(0,0,0,.1) 100%); /* Chrome10+,Safari5.1+ */
162	+ background: #eee -o-linear-gradient(top, rgba(255,255,255,.1) 0%,rgba(0,0,0,.1) 100%); /* Opera11.10+ */
163	+ background: #eee -ms-linear-gradient(top, rgba(255,255,255,.1) 0%,rgba(0,0,0,.1) 100%); /* IE10+ */
164	+ background: #eee linear-gradient(top, rgba(255,255,255,.1) 0%,rgba(0,0,0,.1) 100%); /* W3C */
165	+
166	+ border: 1px solid #aaa;
167	+ border-top: 1px solid #ccc;
168	+ border-left: 1px solid #ccc;
169	+
170	+ color: #444;
171	+ display: inline-block;
172	+ font-size: 11px;
173	+ font-weight: bold;
174	+ text-decoration: none;
175	+ text-shadow: 0 1px rgba(255, 255, 255, .75);
176	+ cursor: pointer;
177	+
178	+
179	+ font-family: "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
180	+
181	+
182	+ display:block;
183	+ clear:both;
184	+ position:relative;
185	+
186	+ background-color:#4D90FE; /#2B70DC;/
187	+ color:#f9f9f9 !important;
188	+ text-shadow:0px -1px 1px rgba(0,0,0,.3) !important;
189	+ border:none;
190	+
191	+ text-shadow: 0 1px rgba(255, 255, 255, .2);
192	+ box-shadow:inset 0px 1px 1px rgba(255,255,255,.3);
193	+
194	+ }
195	+
196	+ .reset-tour input[type="submit"]{
197	+ background-color:#333;
198	+ border-radius:0;
199	+ display:block;
200	+ float:none;
201	+ width:178px;
202	+ }
203	+
204	+ .spark-panels{
205	+ padding-left:180px;
206	+ border-radius:3px;
207	+
208	+ }
209	+
210	+ .spark-panels form{
211	+ margin:0;
212	+ }
213	+
214	+ .spark-panel{
215	+ padding:10px 20px 20px 20px;
216	+ float:left;
217	+ width:578px;
218	+
219	+ background:#f5f5f5 url(images/panel_bkg.jpg) top left repeat;
220	+ border:1px solid #e9e9e9;
221	+ border-left:1px solid #fcfcfc;
222	+
223	+
224	+ box-shadow:-5px 0px 12px #333, inset 0px 1px 1px #fefefe;
225	+
226	+ min-height:320px;
227	+ }
228	+
229	+ .spark-panel h3{
230	+ font-size:18px;
231	+ }
232	+ .spark-panel h3 + .container-type-header-2 h4{
233	+ margin-top:0;
234	+ }
235	+
236	+ .spark-panel h4{
237	+ margin:2.5em 0 .5em 0;
238	+ color:#2B70DC;
239	+ color:#D83F28;
240	+ font-size:14px;
241	+ }
242	+
243	+
244	+
245	+
246	+ .spark-admin-op{
247	+ display:block;
248	+ padding:10px 0;
249	+ clear:both;
250	+ }
251	+
252	+ .spark-admin-op.container-type-hidden{
253	+ padding:0;
254	+ }
255	+
256	+ label.spark-admin-op-title{
257	+ font-weight:bold;
258	+ padding-top:4px;
259	+ }
260	+
261	+ .spark-admin-op-desc{
262	+ display:block;
263	+ color:#999;
264	+ clear: both;
265	+ margin-top: .2em;
266	+ }
267	+
268	+ .spark-admin-op-units{
269	+ color:#999;
270	+ vertical-align:text-bottom;
271	+ }
272	+
273	+
274	+ /* Text */
275	+ .spark-admin-op.container-type-text label.spark-admin-op-title{
276	+ float:left;
277	+ width:200px;
278	+ }
279	+ .spark-admin-op.container-type-text input{
280	+ border-radius:0;
281	+ width:200px;
282	+ padding:5px 8px;
283	+ }
284	+
285	+ .spark-minitext input[type="text"]{
286	+ width:60px;
287	+ }
288	+
289	+ /* Textarea */
290	+
291	+ .container-type-textarea label.spark-admin-op-title{
292	+ display:block;
293	+ }
294	+ #wpmega-style-cspark textarea,
295	+ .container-type-textarea textarea{
296	+ clear:both;
297	+ width:100%;
298	+ padding:10px;
299	+ margin-top:10px;
300	+ border-radius:0;
301	+
302	+ -webkit-transition: height .2s ease-in-out;
303	+ -moz-transition: height .2s ease-in-out;
304	+ transition: height .2s ease-in-out;
305	+
306	+ font-family:monospace;
307	+ }
308	+ .container-type-textarea textarea:focus{
309	+ height:200px;
310	+ }
311	+ #wpmega-style-css textarea[readonly]{
312	+ height:200px;
313	+ opacity:.6;
314	+ }
315	+
316	+ /* Radio */
317	+ .spark-admin-op-radio label{
318	+ padding-left:5px;
319	+ }
320	+ .spark-admin-op.container-type-radio label.spark-admin-op-title{
321	+ float:left;
322	+ width:200px;
323	+ }
324	+ .spark-admin-op-radio{
325	+ padding-left:200px;
326	+ }
327	+
328	+ /* Checkbox */
329	+ .spark-admin-op.container-type-checkbox label.spark-admin-op-title,
330	+ .spark-admin-op.container-type-checklist .spark-admin-checklist label.spark-admin-op-title{
331	+ float:left;
332	+ width:200px;
333	+ clear:both;
334	+ }
335	+ .spark-admin-op.container-type-checklist .spark-admin-checklist{
336	+ margin-top:10px;
337	+ }
338	+ .spark-admin-op.container-type-checklist .spark-admin-checklist label{
339	+ margin-bottom:10px;
340	+ font-weight:normal;
341	+ font-style:italic;
342	+ }
343	+
344	+ /* Select */
345	+ .spark-admin-op.container-type-select label.spark-admin-op-title{
346	+ float:left;
347	+ width:200px;
348	+ }
349	+
350	+ .spark-admin-op.container-type-select select{
351	+ background: #eee; /* Old browsers */
352	+ background: #eee -moz-linear-gradient(top, rgba(255,255,255,.1) 0%, rgba(0,0,0,.1) 100%); /* FF3.6+ */
353	+ background: #eee -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,.1)), color-stop(100%,rgba(0,0,0,.1))); /* Chrome,Safari4+ */
354	+ background: #eee -webkit-linear-gradient(top, rgba(255,255,255,.1) 0%,rgba(0,0,0,.1) 100%); /* Chrome10+,Safari5.1+ */
355	+ background: #eee -o-linear-gradient(top, rgba(255,255,255,.1) 0%,rgba(0,0,0,.1) 100%); /* Opera11.10+ */
356	+ background: #eee -ms-linear-gradient(top, rgba(255,255,255,.1) 0%,rgba(0,0,0,.1) 100%); /* IE10+ */
357	+ background: #eee linear-gradient(top, rgba(255,255,255,.1) 0%,rgba(0,0,0,.1) 100%); /* W3C */
358	+
359	+ box-shadow:0px 1px 1px #fff;
360	+ text-shadow:0px 1px 1px #fff;
361	+ border-radius:0;
362	+ border:1px solid #DDDDDD;
363	+
364	+ }
365	+
366	+ /* Radio */
367	+ #container-wpmega-style .spark-admin-op-radio label{
368	+ font-weight:bold;
369	+ padding-left:5px;
370	+ }
371	+ #container-wpmega-style .spark-admin-op-radio label .spark-admin-op-radio-desc{
372	+ font-weight:normal;
373	+ clear:both;
374	+ display:block;
375	+ color:#999;
376	+ padding-left:20px;
377	+ }
378	+
379	+ /* Color */
380	+ .spark-admin-op.container-type-color label.spark-admin-op-title{
381	+ float:left;
382	+ width:200px;
383	+ }
384	+ .spark-admin-op.container-type-color input[type="text"].colorPicker-color{
385	+ width:55px;
386	+ height:35px;
387	+ padding:10px 5px;
388	+ display:inline-block;
389	+ border:1px solid #ddd;
390	+ border-radius:0;
391	+ cursor:pointer;
392	+ position:relative;
393	+ }
394	+ .spark-admin-op.container-type-color .spark-admin-op-color{
395	+ position:relative;
396	+ }
397	+
398	+ .spark-admin-op.container-type-color .clearColor{
399	+ display:inline-block;
400	+ background: transparent url(images/cross.png) top left no-repeat;
401	+ height:16px;
402	+ width:16px;
403	+ margin-left:6px;
404	+ cursor:pointer;
405	+ }
406	+
407	+ /* Buttons */
408	+ .button.save-button,
409	+ .button.reset-button{
410	+ margin-top:2em;
411	+ margin-right:1em;
412	+ float:right;
413	+ padding:6px 22px;
414	+ border-radius:2px;
415	+ font-weight:bold;
416	+ box-shadow:0px 3px 0px #e2e2e2;
417	+ border:1px solid #ddd;
418	+ height:auto;
419	+ }
420	+ .button.save-button:hover,
421	+ .button.reset-button:hover{
422	+ border:1px solid #aaa;
423	+ box-shadow:0px 3px 0px #ccc;
424	+ }
425	+
426	+ .button.reset-button{
427	+ margin-left:0;
428	+ margin-top:0;
429	+ float:none;
430	+ }
431	+
432	+
433	+ /* Reset Button */
434	+ .spark-admin-op.container-type-reset label.spark-admin-op-title,
435	+ .spark-admin-op.container-type-flush-rewrite label.spark-admin-op-title{
436	+ float:left;
437	+ width:200px;
438	+ }
439	+ .spark-admin-op.container-type-reset .spark-admin-op-desc{
440	+ clear:both;
441	+ }
442	+
443	+
444	+ /* Infobox */
445	+ .spark-infobox{
446	+ padding:15px;
447	+ color: #4F8A10;
448	+ background: #DFF2BF;
449	+ border: 1px solid #4F8A10;
450	+ }
451	+ .spark-infobox h4{
452	+ color:inherit;
453	+ margin:0 0 0px 0;
454	+ font-weight:bold;
455	+ text-transform: uppercase;
456	+ font-size:12px;
457	+ }
458	+ .spark-infobox .spark-admin-op-desc{
459	+ color: #4F8A10;
460	+ }
461	+ .spark-infobox h4 + .spark-admin-op-desc{
462	+ margin-top:10px;
463	+ }
464	+
465	+ .spark-infobox.spark-infobox-warning{
466	+ border:1px solid #DDB723;
467	+ background: #FFEA73;
468	+ color: #A63C00;
469	+ }
470	+ .spark-infobox.spark-infobox-warning .spark-admin-op-desc{
471	+ color: #A63C00;
472	+ }
473	+
474	+ .spark-admin-op-desc .spark-infobox{
475	+ display:block;
476	+ padding:5px;
477	+ opacity:.8;
478	+ }
479	+
480	+
481	+ / SS-TOGGLE /
482	+ .spark-toggle-onoff{
483	+ /*float:left;
484	+ clear:left;*/
485	+
486	+ font-size:10px;
487	+
488	+ width:79px; /81px;/
489	+ height:20px;
490	+ box-shadow: inset 1px 1px 3px #666;
491	+ -moz-box-shadow: inset 1px 1px 3px #666;
492	+ -webkit-box-shadow: inset 1px 1px 3px #666;
493	+
494	+ border-radius: 2px;
495	+ -moz-border-radius: 2px;
496	+ -webkit-border-radius: 2px;
497	+
498	+ border:1px solid #ddd;
499	+ border-color:#ddd #aaa #ddd #ddd;
500	+ overflow:hidden;
501	+ display:block;
502	+ position:relative;
503	+ }
504	+ .spark-toggle-onoff span.spark-toggle-inner{
505	+ width:130px;
506	+ height:20px;
507	+ position:relative;
508	+ display:block;
509	+ }
510	+ .spark-toggle-onoff.off span.spark-toggle-inner{
511	+ margin-left:-51px;
512	+ }
513	+ .spark-toggle-onoff span{
514	+ height:20px;
515	+ line-height:20px;
516	+ position:absolute;
517	+ top:0px;
518	+ display:inline-block;
519	+ text-align:center;
520	+ color:#fff;
521	+ text-shadow:0px -1px 1px #222;
522	+ text-transform:uppercase;
523	+ font-weight:bold;
524	+ float:left; /* important for RTL */
525	+ }
526	+ .spark-toggle-onoff span.spark-toggle-on{
527	+ width:45px;
528	+ left:0px;
529	+ padding-right:5px;
530	+
531	+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4D90FE', endColorstr='#2B70DC'); /* for IE */
532	+ -ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorstr='#4D90FE', endColorstr='#2B70DC')"; /* for IE */
533	+ background: -webkit-gradient(linear, left top, left bottom, from(#6FB2FF), to(#4D90FE)); /* for webkit browsers */
534	+ background: -moz-linear-gradient(top, #4D90FE, #2B70DC);
535	+
536	+
537	+ box-shadow: inset 1px 1px 3px #2B70DC;
538	+ -moz-box-shadow: inset 1px 1px 3px #2B70DC;
539	+ -webkit-box-shadow: inset 1px 1px 3px #2B70DC; /3061a8;/
540	+
541	+ border-radius: 2px 0px 0px 2px;
542	+ -moz-border-radius: 2px 0px 0px 2px;
543	+ -webkit-border-radius: 2px 0px 0px 2px;
544	+
545	+ text-shadow:0px -1px 1px #2B70DC;
546	+
547	+ padding-right:5px;
548	+ }
549	+ .spark-toggle-mid{
550	+ width:30px;
551	+ height:18px;
552	+ left:50px;
553	+ top:-1px;
554	+ border:1px solid #999;
555	+ border-color:#eee #aaa;
556	+ border-width:1px 1px 1px 1px;
557	+ z-index:20;
558	+
559	+
560	+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e4e4e4', endColorstr='#f9f9f9'); /* for IE */
561	+ -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#e4e4e4', endColorstr='#f9f9f9')"; /* for IE */
562	+ background: -webkit-gradient(linear, left top, left bottom, from(#e4e4e4), to(#f9f9f9)); /* for webkit browsers */
563	+ background: -moz-linear-gradient(top, #e4e4e4, #f9f9f9);
564	+
565	+ border-radius:2px;
566	+ -moz-border-radius:2px;
567	+ -webkit-border-radius:2px;
568	+
569	+ -moz-box-shadow:0px 0px 3px rgba(0,0,0,.5);
570	+ -webkit-box-shadow:0px 0px 3px rgba(0,0,0,.5);
571	+ box-shadow:0px 0px 3px rgba(0,0,0,.5);
572	+
573	+ position:relative;
574	+ }
575	+ .spark-toggle-mid:after{
576	+ content:' ';
577	+ position:absolute;
578	+ width:12px;
579	+ height:8px;
580	+ display:block;
581	+ top:5px;
582	+ left:9px;
583	+ border: 1px #ccc;
584	+
585	+ background:
586	+ -webkit-repeating-linear-gradient(
587	+ left,
588	+ #ddd 1px,
589	+ #ddd 2px,
590	+ transparent 2px,
591	+ transparent 5px
592	+ );
593	+ background:
594	+ -moz-repeating-linear-gradient(
595	+ left,
596	+ #ddd 1px,
597	+ #ddd 2px,
598	+ transparent 2px,
599	+ transparent 5px
600	+ );
601	+ background:
602	+ repeating-linear-gradient(
603	+ left,
604	+ #ddd 1px,
605	+ #ddd 2px,
606	+ transparent 2px,
607	+ transparent 5px
608	+ );
609	+ }
610	+ .spark-toggle-onoff span.spark-toggle-off{
611	+ width:50px;
612	+ padding-left:5px;
613	+ left:75px;
614	+ z-index:10;
615	+ color:#666;
616	+ text-shadow:0px 1px 1px #fff;
617	+
618	+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#eeeeee', endColorstr='#fcfcfc'); /* for IE */
619	+ -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#eeeeee', endColorstr='#fcfcfc')"; /* for IE */
620	+ background: -webkit-gradient(linear, left top, left bottom, from(#eee), to(#fcfcfc)); /* for webkit browsers */
621	+ background: -moz-linear-gradient(top, #eee, #fcfcfc);
622	+ }
623	+
624	+ .spark-tog-label{
625	+ line-height:20px;
626	+ padding-left:90px;
627	+ display:block;
628	+ font-weight:bold;
629	+ font-size:11px;
630	+
631	+ margin-bottom:5px;
632	+ }
633	+
634	+ .spark-nav #message{
635	+ display:none;
636	+ }
637	+
638	+ .cf:before,
639	+ .cf:after {
640	+ content:"";
641	+ display:table;
642	+ }
643	+ .cf:after {
644	+ clear:both;
645	+ }
646	+ .cf {
647	+ zoom:1; /* For IE 6/7 (trigger hasLayout) */
648	+ }
649	+
650	+ #spark-ss-config input[type="submit"]{
651	+ display:none;
652	+ }
653	+
654	+ .social_media{
655	+ position:absolute;
656	+ top:20px;
657	+ right:20px;
658	+ }
659	+
660	+ .ss-twitter,
661	+ .ss-facebook,
662	+ .ss-dribbble{
663	+ display:inline-block;
664	+ height:16px;
665	+ width:16px;
666	+ float:left;
667	+ margin-right:10px;
668	+ opacity:.7;
669	+ }
670	+ .ss-twitter:hover,
671	+ .ss-facebook:hover,
672	+ .ss-dribbble:hover{
673	+ opacity:1;
674	+ }
675	+ .ss-twitter{
676	+ background:transparent url(images/social_media_icons/twitter_2.png) top left no-repeat;
677	+ }
678	+ .ss-facebook{
679	+ background:transparent url(images/social_media_icons/facebook.png) top left no-repeat;
680	+ }
681	+ .ss-dribbble{
682	+ background:transparent url(images/social_media_icons/dribbble.png) top left no-repeat;
683	+ }

trunk/sparkoptions/sparkoptions.js ADDED Viewed

	@@ -0,0 +1,123 @@


1	+ /***********************************************
2	+ * SparkOptions Javascript
3	+ *
4	+ * @author Chris Mavricos, Sevenspark http://sevenspark.com
5	+ * @version 1.0
6	+ * Last modified 2012-02-08
7	+ *
8	+ ***********************************************/
9	+
10	+ jQuery(document).ready(function($){
11	+
12	+ var DEBUG = false;
13	+
14	+ $('.spark-panel').hide().first().show();
15	+
16	+ $('.spark-nav ul li a').click(function(e){
17	+ e.preventDefault();
18	+
19	+ $('#current-panel-id').val( $(this).attr('href').substr(7) ); //chop off #spark-
20	+
21	+ $('.spark-nav ul li a.current').removeClass('current');
22	+ $(this).addClass('current');
23	+
24	+ var $target = $( $(this).attr('href') );
25	+ $('.spark-panel').css('minHeight', 0).stop().slideUp(function(){
26	+ $(this).css('minHeight', '');
27	+ });
28	+ $target.stop().css('minHeight', 0).slideDown(function(){
29	+ $(this).css( { height : '', padding: '', minHeight : '' } );
30	+ });
31	+
32	+ });
33	+ $('.spark-nav ul li a[href="#spark-'+$('#current-panel-id').val()+'"]').click();
34	+
35	+ /* Input Sliding Interface */
36	+ $('.spark-admin-op input[type="checkbox"], #wpmega-demo .spark-admin-op input[type="radio"]')
37	+ .each(function(k, el){
38	+ var tog = $(el).is(':checked') ? 'on' : 'off';
39	+ var $toggle = $('<label class="spark-toggle-onoff '+tog+'" for="'+$(el).attr('id')+
40	+ '"><span class="spark-toggle-inner"><span class="spark-toggle-on">On</span><span class="spark-toggle-mid"></span><span class="spark-toggle-off">Off</span></span></label>');
41	+
42	+ switch($(el).attr('type')){
43	+
44	+ case 'checkbox':
45	+
46	+ $(el).after($toggle);
47	+ $(el).hide();
48	+
49	+ $toggle.click(function(){
50	+
51	+ //console.log($(el).is(':checked') ? 'checked' : 'not checked');
52	+
53	+ if($(el).is(':checked')){
54	+ //console.log('checked');
55	+ var $this = $(this);
56	+ $this.find('.spark-toggle-inner').animate({
57	+ 'margin-left' : '-51px'
58	+ }, 'normal', function(){
59	+ $this.removeClass('on').addClass('off');
60	+ });
61	+ $(el).attr('checked', false);
62	+ }
63	+ else{
64	+ //console.log('not checked');
65	+ var $this = $(this);
66	+ $this.find('.spark-toggle-inner').animate({
67	+ 'margin-left' : '0px'
68	+ }, 'normal', function(){
69	+ $this.removeClass('off').addClass('on');
70	+ });
71	+ $(el).attr('checked', true);
72	+ }
73	+
74	+ return false; //stops the label click from reversing the check, which is necessary in IE
75	+ });
76	+ break;
77	+
78	+ case 'radio' :
79	+ var $label = $(el).next('label');
80	+ var labelText = $label.text();
81	+ $label.hide();
82	+ //console.log(labelText);
83	+
84	+ $(el).after('<span class="spark-tog-label">'+labelText+'</span>');
85	+ $(el).after($toggle);
86	+ $(el).hide();
87	+
88	+ $toggle.click(function(){
89	+ if($(this).prev().is(':checked')){
90	+ //Do nothing, it's double clicking a radio button
91	+ }
92	+ else{
93	+
94	+ var oldID = $('input[name="'+$(el).attr('name')+'"]:checked').attr('id');
95	+
96	+ //turn on
97	+ var $this = $(this);
98	+ $this.find('.spark-toggle-inner').animate({
99	+ 'margin-left' : '0px'
100	+ }, 'normal', function(){
101	+ $this.removeClass('off').addClass('on');
102	+ });
103	+ //$this.prev().attr('checked', true);
104	+ $(el).attr('checked', true);
105	+
106	+ //turn off the old
107	+ $('label[for="'+oldID+'"] .spark-toggle-inner').animate({
108	+ 'margin-left' : '-51px'
109	+ }, 'normal', function(){
110	+ $(this).parent('label').removeClass('on').addClass('off');
111	+ })
112	+ .siblings('input[type="radio"]').attr('checked', false);
113	+ }
114	+ return false;
115	+ });
116	+ break;
117	+ }
118	+ });
119	+
120	+
121	+ });
122	+
123	+

Responsive Select Menu - Version 1.5

Version Description

Release Info

Code changes from version 1.4 to 1.5