Skip to content

Commit ffc63c6

Browse files
author
rob1n
committed
Widgets for 2.3. fixes WordPress#4186
git-svn-id: https://develop.svn.wordpress.org/trunk@5297 602fd350-edb4-49c9-b593-d223f7449a82
1 parent 01dad34 commit ffc63c6

7 files changed

Lines changed: 2413 additions & 1 deletion

File tree

‎wp-admin/menu.php‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -67,6 +67,7 @@
6767
$submenu['plugins.php'][10] = array(__('Plugin Editor'), 'edit_plugins', 'plugin-editor.php');
6868

6969
$submenu['themes.php'][5] = array(__('Themes'), 'switch_themes', 'themes.php');
70+
$submenu['themes.php'][7] = array( __( 'Widgets' ), 'edit_themes', 'widgets.php' );
7071
$submenu['themes.php'][10] = array(__('Theme Editor'), 'edit_themes', 'theme-editor.php');
7172

7273
// Create list of page plugin hook names.

‎wp-admin/widgets.css‎

Lines changed: 215 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,215 @@
1+
body {
2+
height: 100%;
3+
}
4+
5+
#sbadmin #zones {
6+
width: <?php echo constant( 'WP_WIDGETS_WIDTH' ); ?>px;
7+
-moz-user-select: none;
8+
-khtml-user-select: none;
9+
user-select: none;
10+
}
11+
12+
#sbreset {
13+
float: left;
14+
margin: 1px 0;
15+
}
16+
17+
.dropzone {
18+
float: left;
19+
margin-right: 10px;
20+
padding: 5px;
21+
border: 1px solid #bbb;
22+
background-color: #f0f8ff;
23+
}
24+
25+
.dropzone h3 {
26+
text-align: center;
27+
color: #333;
28+
}
29+
30+
.dropzone ul {
31+
list-style-type: none;
32+
width: 240px;
33+
height: <?php echo constant( 'WP_WIDGETS_HEIGHT' ); ?>px;
34+
float: left;
35+
margin: 0;
36+
padding: 0;
37+
}
38+
39+
* .module, #lastmodule {
40+
width: 238px;
41+
padding: 0;
42+
margin: 5px 0;
43+
cursor: move;
44+
display: block;
45+
border: 1px solid #ccc;
46+
background-color: #fbfbfb;
47+
text-align: left;
48+
line-height: 25px;
49+
}
50+
51+
* .handle, #lastmodule span {
52+
display: block;
53+
width: 216px;
54+
padding: 0 10px;
55+
border-top: 1px solid #f2f2f2;
56+
border-right: 1px solid #e8e8e8;
57+
border-bottom: 1px solid #e8e8e8;
58+
border-left: 1px solid #f2f2f2;
59+
}
60+
61+
* .popper {
62+
margin: 0;
63+
display: inline;
64+
position: absolute;
65+
top: 3px;
66+
right: 3px;
67+
overflow: hidden;
68+
text-align: center;
69+
height: 16px;
70+
font-size: 18px;
71+
line-height: 14px;
72+
cursor: pointer;
73+
padding: 0 3px 1px;
74+
border-top: 4px solid #6da6d1;
75+
background: url( images/fade-butt.png ) -5px 0px;
76+
}
77+
78+
* html .popper {
79+
padding: 1px 6px 0;
80+
font-size: 16px;
81+
}
82+
83+
#sbadmin p.submit {
84+
padding-right: 10px;
85+
clear: left;
86+
}
87+
88+
.placematt {
89+
position: absolute;
90+
cursor: default;
91+
margin: 10px 0 0;
92+
padding: 0;
93+
width: 238px;
94+
background-color: #ffe;
95+
}
96+
97+
* html .placematt {
98+
margin-top: 5px;
99+
}
100+
101+
.placematt h4 {
102+
text-align: center;
103+
margin-bottom: 5px;
104+
}
105+
106+
.placematt span {
107+
padding: 0 10px 10px;
108+
text-align: justify;
109+
}
110+
111+
#palettediv {
112+
border: 1px solid #bbb;
113+
background-color: #f0f8ff;
114+
height: 180px;
115+
margin-top: 10px;
116+
}
117+
118+
#palettediv h3 {
119+
text-align: center;
120+
color: #333;
121+
}
122+
123+
#palettediv ul {
124+
padding: 0 0 0 10px;
125+
}
126+
127+
#palettediv .module, #lastmodule {
128+
margin-right: 10px;
129+
float: left;
130+
width: 120px;
131+
}
132+
133+
#palettediv .handle, #lastmodule span {
134+
height: 40px;
135+
font-size: 90%;
136+
width: 110px;
137+
padding: 0 5px;
138+
}
139+
140+
#palettediv .popper {
141+
visibility: hidden;
142+
}
143+
144+
#lastmodule {
145+
visibility: hidden;
146+
}
147+
148+
* html #palettediv ul {
149+
margin: 0;
150+
padding: 0 0 0 10px;
151+
}
152+
153+
* html #palettediv .module {
154+
float: none;
155+
display: inline;
156+
}
157+
158+
#controls {
159+
height: 0px;
160+
}
161+
162+
.control {
163+
position: absolute;
164+
display: block;
165+
background: #f9fcfe;
166+
padding: 0;
167+
}
168+
169+
.controlhandle {
170+
cursor: move;
171+
background-color: #6da6d1;
172+
border-bottom: 2px solid #448abd;
173+
color: #333;
174+
display: block;
175+
margin: 0 0 5px;
176+
padding: 4px;
177+
font-size: 120%;
178+
}
179+
180+
.controlcloser {
181+
cursor: pointer;
182+
font-size: 120%;
183+
display: block;
184+
position: absolute;
185+
top: 2px;
186+
right: 8px;
187+
padding: 0 3px;
188+
font-weight: bold;
189+
}
190+
191+
.controlform {
192+
margin: 20px 30px;
193+
}
194+
195+
.controlform p {
196+
text-align: center;
197+
}
198+
199+
.control .checkbox {
200+
border: none;
201+
background: transparent;
202+
}
203+
204+
.hidden {
205+
display: none;
206+
}
207+
208+
#shadow {
209+
background: black;
210+
display: none;
211+
position: absolute;
212+
top: 0px;
213+
left: 0px;
214+
width: 100%;
215+
}

‎wp-admin/widgets.js.php‎

Lines changed: 138 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,138 @@
1+
<?php
2+
@require( '../wp-config.php' );
3+
cache_javascript_headers();
4+
5+
$cols = array();
6+
foreach ( $wp_registered_sidebars as $index => $sidebar ) {
7+
$cols[] = '\'' . $index . '\'';
8+
}
9+
$cols = implode( ', ', $cols );
10+
11+
$widgets = array();
12+
foreach ( $wp_registered_widgets as $name => $widget ) {
13+
$widgets[] = '\'' . $widget['id'] . '\'';
14+
}
15+
$widgets = implode( ', ', $widgets );
16+
?>
17+
var cols = [<?php echo $cols; ?>];
18+
var widgets = [<?php echo $widgets; ?>];
19+
var controldims = new Array;
20+
<?php foreach ( $wp_registered_widget_controls as $name => $widget ) : ?>
21+
controldims['<?php echo $widget['id']; ?>control'] = new Array;
22+
controldims['<?php echo $widget['id']; ?>control']['width'] = <?php echo (int) $widget['width']; ?>;
23+
controldims['<?php echo $widget['id']; ?>control']['height'] = <?php echo (int) $widget['height']; ?>;
24+
<?php endforeach; ?>
25+
function initWidgets() {
26+
<?php foreach ( $wp_registered_widget_controls as $name => $widget ) : ?>
27+
$('<?php echo $widget['id']; ?>popper').onclick = function() {popControl('<?php echo $widget['id']; ?>control');};
28+
$('<?php echo $widget['id']; ?>closer').onclick = function() {unpopControl('<?php echo $widget['id']; ?>control');};
29+
new Draggable('<?php echo $widget['id']; ?>control', {revert:false,handle:'controlhandle',starteffect:function(){},endeffect:function(){},change:function(o){dragChange(o);}});
30+
if ( true && window.opera )
31+
$('<?php echo $widget['id']; ?>control').style.border = '1px solid #bbb';
32+
<?php endforeach; ?>
33+
if ( true && window.opera )
34+
$('shadow').style.background = 'transparent';
35+
new Effect.Opacity('shadow', {to:0.0});
36+
widgets.map(function(o) {o='widgetprefix-'+o; Position.absolutize(o); Position.relativize(o);} );
37+
$A(Draggables.drags).map(function(o) {o.startDrag(null); o.finishDrag(null);});
38+
for ( var n in Draggables.drags ) {
39+
if ( Draggables.drags[n].element.id == 'lastmodule' ) {
40+
Draggables.drags[n].destroy();
41+
break;
42+
}
43+
}
44+
resetPaletteHeight();
45+
}
46+
function resetDroppableHeights() {
47+
var max = 6;
48+
cols.map(function(o) {var c = $(o).childNodes.length; if ( c > max ) max = c;} );
49+
var height = 35 * ( max + 1);
50+
cols.map(function(o) {h = (($(o).childNodes.length + 1) * 35); $(o).style.height = (h > 280 ? h : 280) + 'px';} );
51+
}
52+
function resetPaletteHeight() {
53+
var p = $('palette'), pd = $('palettediv'), last = $('lastmodule');
54+
p.appendChild(last);
55+
if ( Draggables.activeDraggable && last.id == Draggables.activeDraggable.element.id )
56+
last = last.previousSibling;
57+
var y1 = Position.cumulativeOffset(last)[1] + last.offsetHeight;
58+
var y2 = Position.cumulativeOffset(pd)[1] + pd.offsetHeight;
59+
var dy = y1 - y2;
60+
pd.style.height = (pd.offsetHeight + dy + 9) + "px";
61+
}
62+
function maxHeight(elm) {
63+
htmlheight = document.body.parentNode.clientHeight;
64+
bodyheight = document.body.clientHeight;
65+
var height = htmlheight > bodyheight ? htmlheight : bodyheight;
66+
$(elm).style.height = height + 'px';
67+
}
68+
function dragChange(o) {
69+
el = o.element ? o.element : $(o);
70+
var p = Position.page(el);
71+
var right = p[0];
72+
var top = p[1];
73+
var left = $('shadow').offsetWidth - (el.offsetWidth + left);
74+
var bottom = $('shadow').offsetHeight - (el.offsetHeight + top);
75+
if ( right < 1 ) el.style.left = 0;
76+
if ( top < 1 ) el.style.top = 0;
77+
if ( left < 1 ) el.style.left = (left + right) + 'px';
78+
if ( bottom < 1 ) el.style.top = (top + bottom) + 'px';
79+
}
80+
function popControl(elm) {
81+
el = $(elm);
82+
el.style.width = controldims[elm]['width'] + 'px';
83+
el.style.height = controldims[elm]['height'] + 'px';
84+
var x = ( document.body.clientWidth - controldims[elm]['width'] ) / 2;
85+
var y = ( document.body.parentNode.clientHeight - controldims[elm]['height'] ) / 2;
86+
el.style.position = 'absolute';
87+
el.style.right = '' + x + 'px';
88+
el.style.top = '' + y + 'px';
89+
el.style.zIndex = 1000;
90+
el.className='control';
91+
$('shadow').onclick = function() {unpopControl(elm);};
92+
window.onresize = function(){maxHeight('shadow');dragChange(elm);};
93+
popShadow();
94+
}
95+
function popShadow() {
96+
maxHeight('shadow');
97+
var shadow = $('shadow');
98+
shadow.style.zIndex = 999;
99+
shadow.style.display = 'block';
100+
new Effect.Opacity('shadow', {duration:0.5, from:0.0, to:0.2});
101+
}
102+
function unpopShadow() {
103+
new Effect.Opacity('shadow', {to:0.0});
104+
$('shadow').style.display = 'none';
105+
}
106+
function unpopControl(el) {
107+
$(el).className='hidden';
108+
unpopShadow();
109+
}
110+
function serializeAll() {
111+
<?php foreach ( $wp_registered_sidebars as $index => $sidebar ) : ?>
112+
$('<?php echo $index; ?>order').value = Sortable.serialize('<?php echo $index; ?>');
113+
<?php endforeach; ?>
114+
}
115+
function updateAll() {
116+
resetDroppableHeights();
117+
resetPaletteHeight();
118+
cols.map(function(o){
119+
var pm = $(o+'placematt');
120+
if ( $(o).childNodes.length == 0 ) {
121+
pm.style.display = 'block';
122+
Position.absolutize(o+'placematt');
123+
} else {
124+
pm.style.display = 'none';
125+
}
126+
});
127+
}
128+
function noSelection(event) {
129+
if ( document.selection ) {
130+
var range = document.selection.createRange();
131+
range.collapse(false);
132+
range.select();
133+
return false;
134+
}
135+
}
136+
addLoadEvent(updateAll);
137+
addLoadEvent(initWidgets);
138+
Event.observe(window, 'resize', resetPaletteHeight);

0 commit comments

Comments
 (0)