phazr

Merge lp:~rockstar/phazr/phazr-overlay into lp:phazr

  1. phazr-overlay
  2. Merge into phazr
Proposed by Paul Hummer
Status: Merged
Approved by: Paul Hummer
Approved revision: 18
Merged at revision: 7
Proposed branch: lp:~rockstar/phazr/phazr-overlay
Merge into: lp:phazr
Prerequisite: lp:~rockstar/phazr/modal-plugin-to-extension
Diff against target: 156 lines (+63/-6)
7 files modified
examples/overlay/index.html (+6/-2)
src/css/phazr.css (+4/-0)
src/js/modaloverlay/modaloverlay.js (+14/-2)
src/js/phazroverlay/phazroverlay.js (+6/-0)
tests/index.html (+4/-0)
tests/modaloverlay.js (+5/-2)
tests/phazroverlay.js (+24/-0)
To merge this branch: bzr merge lp:~rockstar/phazr/phazr-overlay
Reviewer Review Type Date Requested Status
Martin Albisetti (community) Approve
Deryck Hodge Pending
Review via email: mp+56695@code.launchpad.net

Description of the change

This branch adds more testing to the modaloverlay extension.

It also creates an abstracted PhazrOverlay that provides all the features we want. It's really small, just like Overlay it (Overlay actually has no code, it's a culmination of extensions blended together).

While I was here, I also made ModalOverlay modal by making it draggable by its header. Now you can move it around, etc.

To post a comment you must log in.
Revision history for this message
Martin Albisetti (beuno) wrote :

Works as advertised, code looks good!

review: Approve

Preview Diff

[H/L] Next/Prev Comment, [J/K] Next/Prev File, [N/P] Next/Prev Hunk
1=== modified file 'examples/overlay/index.html'
2--- examples/overlay/index.html 2011-03-18 03:06:25 +0000
3+++ examples/overlay/index.html 2011-04-07 05:58:26 +0000
4@@ -5,6 +5,10 @@
5 <title>Overlay</title>
6 <script type="text/javascript"
7 src="http://yui.yahooapis.com/3.3.0/build/yui/yui-min.js"></script>
8+ <script type="text/javascript"
9+ src="../../src/js/modaloverlay/modaloverlay.js"></script>
10+ <script type="text/javascript"
11+ src="../../src/js/phazroverlay/phazroverlay.js"></script>
12 <link rel="stylesheet" href="../../src/css/phazr.css" />
13 </head>
14 <body>
15@@ -14,8 +18,8 @@
16 overlay. We skin it with CSS, so that it looks consistent with the
17 previous lazr-js PrettyOverlay.</p>
18 <script type="text/javascript">
19- YUI().use('overlay', function(Y) {
20- var overlay = new Y.Overlay({
21+ YUI().use('phazroverlay', function(Y) {
22+ var overlay = new Y.PhazrOverlay({
23 centered: true,
24 zIndex: 10,
25 headerContent: 'This is a header',
26
27=== modified file 'src/css/phazr.css'
28--- src/css/phazr.css 2011-03-23 02:29:46 +0000
29+++ src/css/phazr.css 2011-04-07 05:58:26 +0000
30@@ -57,3 +57,7 @@
31 height: 20px;
32 width: 20px;
33 }
34+
35+div.yui3-dd-draggable div.yui3-widget-hd {
36+ cursor: pointer;
37+}
38
39=== modified file 'src/js/modaloverlay/modaloverlay.js'
40--- src/js/modaloverlay/modaloverlay.js 2011-04-07 05:58:26 +0000
41+++ src/js/modaloverlay/modaloverlay.js 2011-04-07 05:58:26 +0000
42@@ -5,7 +5,8 @@
43 Y.Do.after(this.afterBindUI, this, 'bindUI');
44 };
45 ModalOverlay.ATTRS = {
46- closeButton: { value: null }
47+ closeButton: { value: null },
48+ dragDelegate: { value: null }
49 };
50 ModalOverlay.prototype = {
51 afterRenderUI: function() {
52@@ -29,8 +30,19 @@
53 }
54 }, window, this);
55
56+ var box = this.get('boundingBox'),
57+ header = box.one('.' + className + '-hd'),
58+ className = this.getClassName(),
59+ dd = new Y.DD.Drag({
60+ node: box,
61+ handle: header
62+ });
63+ this.set('dragDelegate', dd);
64+
65 }
66 };
67 Y.ModalOverlay = ModalOverlay;
68
69-}, '0.1', {requires: ['base', 'node', 'plugin', 'substitute']});
70+}, '0.1', {requires: [
71+ 'base', 'dd-delegate', 'node', 'plugin', 'substitute'
72+]});
73
74=== added directory 'src/js/phazroverlay'
75=== added file 'src/js/phazroverlay/phazroverlay.js'
76--- src/js/phazroverlay/phazroverlay.js 1970-01-01 00:00:00 +0000
77+++ src/js/phazroverlay/phazroverlay.js 2011-04-07 05:58:26 +0000
78@@ -0,0 +1,6 @@
79+YUI.add('phazroverlay', function(Y) {
80+
81+ Y.PhazrOverlay = Y.Base.create('overlay', Y.Overlay, [
82+ Y.ModalOverlay]);
83+
84+}, '1.0', { requires: ['base', 'modaloverlay', 'overlay']})
85
86=== modified file 'tests/index.html'
87--- tests/index.html 2011-04-07 05:58:26 +0000
88+++ tests/index.html 2011-04-07 05:58:26 +0000
89@@ -9,6 +9,8 @@
90 src="../src/js/formplugin/formplugin.js"></script>
91 <script type="text/javascript"
92 src="../src/js/modaloverlay/modaloverlay.js"></script>
93+ <script type="text/javascript"
94+ src="../src/js/phazroverlay/phazroverlay.js"></script>
95 <link rel="stylesheet" href="../src/css/phazr.css" />
96
97 <!-- Test files -->
98@@ -16,6 +18,8 @@
99 src="formplugin.js"></script>
100 <script type="text/javascript"
101 src="modaloverlay.js"></script>
102+ <script type="text/javascript"
103+ src="phazroverlay.js"></script>
104 </head>
105 <body>
106 </body>
107
108=== modified file 'tests/modaloverlay.js'
109--- tests/modaloverlay.js 2011-04-07 05:58:26 +0000
110+++ tests/modaloverlay.js 2011-04-07 05:58:26 +0000
111@@ -10,11 +10,14 @@
112
113 var overlay = new Overlay();
114 overlay.render();
115+
116 var closeContainer = overlay.get('contentBox').one(
117- '.yui3-overlay-close');
118+ '.yui3-overlay-close'),
119+ closeButton = closeContainer.one('a');
120
121 Y.Assert.isNotUndefined(closeContainer);
122- closeContainer.one('a').simulate('click');
123+ Y.Assert.areEqual(overlay.get('closeButton'), closeButton);
124+ closeButton.simulate('click');
125 Y.Assert.isFalse(overlay.get('visible'));
126 }
127 }));
128
129=== added file 'tests/phazroverlay.js'
130--- tests/phazroverlay.js 1970-01-01 00:00:00 +0000
131+++ tests/phazroverlay.js 2011-04-07 05:58:26 +0000
132@@ -0,0 +1,24 @@
133+YUI().use('phazroverlay', 'node-event-simulate', 'test', function(Y) {
134+
135+ var suite = new Y.Test.Suite('PhazrOverlay tests');
136+ suite.add(new Y.Test.Case({
137+ name: 'PhazrOverlay Tests',
138+
139+ "PhazrOverlay should have a close button": function() {
140+ var overlay = new Y.PhazrOverlay();
141+ overlay.render();
142+
143+ var closeContainer = overlay.get('contentBox').one(
144+ '.yui3-overlay-close'),
145+ closeButton = closeContainer.one('a');
146+
147+ Y.Assert.isNotUndefined(closeContainer);
148+ Y.Assert.areEqual(overlay.get('closeButton'), closeButton);
149+ closeButton.simulate('click');
150+ Y.Assert.isFalse(overlay.get('visible'));
151+ }
152+ }));
153+
154+ Y.Test.Runner.add(suite);
155+ Y.Test.Runner.run();
156+});

Subscribers

People subscribed via source and target branches

to all changes: