Skip to content

Commit d147327

Browse files
committed
Added theme-switcher to demo
1 parent e411b8e commit d147327

33 files changed

+583
-2
lines changed

demo/index.html

Lines changed: 21 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,9 @@
33
<head>
44
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
55
<title>jquery.ui-contextmenu.js - Demo</title>
6-
<link type="text/css" rel="stylesheet" href="http://code.jquery.com/ui/1.10.1/themes/base/jquery-ui.css" />
6+
<link type="text/css" rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/start/jquery-ui.css" />
77
<!-- min requirements:
8+
<link type="text/css" rel="stylesheet" href="http://code.jquery.com/ui/1.10.1/themes/base/jquery-ui.css" />
89
<script src="http://code.jquery.com/jquery-1.7.js" type="text/javascript"></script>
910
<script src="http://code.jquery.com/ui/1.9.0/jquery-ui.js" type="text/javascript"></script>
1011
-->
@@ -14,6 +15,9 @@
1415
<!-- Some custom library to enable 'taphold' events -->
1516
<script src="jquery-taphold/taphold.js" type="text/javascript"></script>
1617

18+
<!-- Custom library to add a dynamic themeroller switcher -->
19+
<script type="text/javascript" src="../lib/Super-Theme-Switcher/jquery.themeswitcher.js"></script>
20+
1721
<script src="../jquery.ui-contextmenu.js" type="text/javascript"></script>
1822

1923
<style type="text/css">
@@ -63,6 +67,13 @@
6367
<script type="text/javascript">
6468
var CLIPBOARD = "";
6569
$(function(){
70+
/* Enable a themeroller theme-switching using a combobox. */
71+
$("#switcher").themeswitcher({
72+
jqueryuiversion: "1",
73+
imgpath: "../lib/Super-Theme-Switcher/images/",
74+
loadTheme: "Smoothness"
75+
});
76+
6677
/* Menu 1: init by passing an array of entries. */
6778

6879
$(document).contextmenu({
@@ -79,6 +90,7 @@
7990
{title: "Sub 2", cmd: "sub1"}
8091
]}
8192
],
93+
// Handle menu selection to implement a fake-clipboard
8294
select: function(event, ui) {
8395
var $target = ui.target;
8496
switch(ui.cmd){
@@ -92,6 +104,7 @@
92104
alert("select " + ui.cmd + " on " + $target.text());
93105
// Optionally return false, to prevent closing the menu now
94106
},
107+
// Implement the beforeOpen callback to dynamically change the entries
95108
beforeOpen: function(event, ui) {
96109
var $menu = ui.menu,
97110
$target = ui.target;
@@ -159,6 +172,13 @@ <h1>jquery.ui-contextmenu.js</h1>
159172

160173
<p><a href="https://github.com/mar10/jquery-ui-contextmenu">View project on GitHub</a></p>
161174

175+
<div>
176+
<label for="switcher">Theme:</label> <div id="switcher"></div>
177+
<!--
178+
<label for="skinswitcher">Skin:</label> <select id="skinswitcher"></select>
179+
-->
180+
</div>
181+
162182
<h3>Sample 1</h3>
163183
<ul>
164184
<li>Initialized using a command-array.

jquery.ui-contextmenu.min.js

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

lib/Super-Theme-Switcher/README.md

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
Super Theme Switcher is a jQuery plugin based on the original jQuery theme switcher that is no longer hosted or supported by the jQuery UI project.
2+
3+
### Example:
4+
$('#switcher').themeswitcher({
5+
imgpath: "images/",
6+
loadTheme: "dot-luv"
7+
});
8+
9+
But since all parameters are optional you can just use it like this:
10+
$('#switcher').themeswitcher();
11+
12+
### Options
13+
14+
* **imgPath**: String, path to image directory where theme icons are located
15+
* **rounded**: Boolean, rounded corners on themeswitcher link and dropdown
16+
* **themes**: An array of theme objects that will override the default themes.
17+
[{title:"My theme",name:"my-theme",icon:"my-icon.png",url:"http://url-to-my-css-file.css"}]
18+
* **additionalThemes**: An array of theme objects that will be INCLUDED along with the default themes.
19+
[{title:"My theme",name:"my-theme",icon:"my-icon.png",url:"http://url-to-my-css-file.css"}]
20+
* **jqueryUiVersion**: String, jQuery UI version of themes (Default themes are linked from Google CDN)
21+
* **themePath**: String, Base path to where the jQuery UI CSS themes are located (Default is Google CDN)
22+
23+
Demo located [here](http://dl.dropbox.com/u/188460/themeswitcher/sample.htm).
24+
25+
This plugin includes the awesome jQuery cookie plugin by Klaus Hartl found [here](https://github.com/carhartl/jquery-cookie)
26+
27+
Contact
28+
----
29+
[@davehoff](http://www.twitter.com/davehoff)
4.08 KB
Loading
Loading
546 Bytes
Loading
Loading
Loading
Loading
Loading
Loading
Loading
Loading
Loading
Loading
Loading
Loading
Loading
Loading
Loading
Loading
Loading
Loading
Loading
Loading
Loading
Loading
Loading
Loading
Loading

0 commit comments

Comments
 (0)