001 package org.gwtbootstrap3.extras.notify.client.ui;
002
003 /*
004 * #%L
005 * GwtBootstrap3
006 * %%
007 * Copyright (C) 2013 - 2015 GwtBootstrap3
008 * %%
009 * Licensed under the Apache License, Version 2.0 (the "License");
010 * you may not use this file except in compliance with the License.
011 * You may obtain a copy of the License at
012 *
013 * http://www.apache.org/licenses/LICENSE-2.0
014 *
015 * Unless required by applicable law or agreed to in writing, software
016 * distributed under the License is distributed on an "AS IS" BASIS,
017 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
018 * See the License for the specific language governing permissions and
019 * limitations under the License.
020 * #L%
021 */
022
023 import org.gwtbootstrap3.extras.animate.client.ui.constants.Animation;
024 import org.gwtbootstrap3.extras.notify.client.constants.NotifyIconType;
025 import org.gwtbootstrap3.extras.notify.client.constants.NotifyPlacement;
026 import org.gwtbootstrap3.extras.notify.client.constants.NotifyPosition;
027 import org.gwtbootstrap3.extras.notify.client.constants.NotifyType;
028 import org.gwtbootstrap3.extras.notify.client.constants.NotifyUrlTarget;
029 import org.gwtbootstrap3.extras.notify.client.event.NotifyCloseHandler;
030 import org.gwtbootstrap3.extras.notify.client.event.NotifyClosedHandler;
031 import org.gwtbootstrap3.extras.notify.client.event.NotifyShowHandler;
032 import org.gwtbootstrap3.extras.notify.client.event.NotifyShownHandler;
033
034 import com.google.gwt.core.client.JavaScriptObject;
035
036 /**
037 * This class represent basic Notify's settings, that you can use to customize display of each Notify.
038 * <p/>
039 * You can also set current state as default for all new Notifies.
040 *
041 * @author jeffisenhart
042 * @author Sven Jacobs
043 * @author Joshua Godi
044 * @author Pavel Zlámal
045 * @author Xiaodong SUN
046 * @see #makeDefault()
047 */
048 public class NotifySettings extends JavaScriptObject {
049
050 /**
051 * Default constructor
052 */
053 protected NotifySettings() {}
054
055 /**
056 * Creates a new instance of {@link NotifySettings}.
057 *
058 * @return a new instance of {@link NotifySettings}.
059 */
060 public static NotifySettings newSettings() {
061 return JavaScriptObject.createObject().cast();
062 }
063
064 /**
065 * Set element name or class or ID to append Notify to. Default is 'body'.
066 *
067 * @param element Name, class or ID
068 */
069 public final native void setElement(String element) /*-{
070 this.element = element;
071 }-*/;
072
073 /**
074 * Set custom position to the Notify container element. Default is null.
075 *
076 * @param position one of STATIC, FIXED, RELATIVE, ABSOLUTE, or null
077 */
078 public final void setPosition(final NotifyPosition position) {
079 setPosition((position != null) ? position.getPosition() : null);
080 }
081
082 /**
083 * Set native property of Notify's position.
084 *
085 * @param position Notify's position to the container element
086 */
087 private final native void setPosition(String position) /*-{
088 this.position = position;
089 }-*/;
090
091 /**
092 * Set type of Notify (CSS style class name). Default is INFO.
093 *
094 * @param type one of INFO, WARNING, DANGER, SUCCESS
095 * @see NotifyType
096 */
097 public final void setType(final NotifyType type) {
098 setType((type != null) ? type.getCssName() : NotifyType.INFO.getCssName());
099 }
100
101 /**
102 * Set custom style name to Notify. Resulting class name is "alert-[customType]".
103 *
104 * @param customType Style name to set
105 */
106 public final native void setType(String customType) /*-{
107 this.type = customType;
108 }-*/;
109
110 /**
111 * Set placement of Notify on screen. Default placement is {@link NotifyPlacement#TOP_RIGHT}.
112 *
113 * @param placement Notify's placement on screen
114 * @see NotifyPlacement
115 */
116 public final void setPlacement(final NotifyPlacement placement) {
117 setNotifyPlacement((placement != null) ? placement : NotifyPlacement.TOP_RIGHT);
118 }
119
120 /**
121 * If <code>false</code>, the <code>data-notify="dismiss"</code> element in
122 * the template will be hidden. Default is <code>true</code>.
123 *
124 * @param allowDismiss if <code>false</code>, the close icon will be hidden
125 */
126 public final native void setAllowDismiss(boolean allowDismiss) /*-{
127 this.allow_dismiss = allowDismiss;
128 }-*/;
129
130 /**
131 * If <code>true</code>, newer notifications push down older ones. Default
132 * is <code>false</code>.<br>
133 * <br>
134 * <strong>WARNING: </strong> Be careful when setting
135 * <code>newestOnTop</code> to <code>true</code> when a placement that
136 * already contains a notification has <code>newest_on_top</code> to
137 * <code>false</code>. It may cause issues with the plug-ins ability to
138 * place the notification in the correct location.
139 *
140 * @param newestOnTop if <code>true</code>, newer notifications push down older ones
141 * @since 3.0.0
142 */
143 public final native void setNewestOnTop(boolean newestOnTop) /*-{
144 this.newest_on_top = newestOnTop;
145 }-*/;
146
147 /**
148 * Set native property of Notify's placement.
149 *
150 * @param placement Notify's placement on screen
151 */
152 private final native void setNotifyPlacement(final NotifyPlacement placement) /*-{
153 var from = placement.@org.gwtbootstrap3.extras.notify.client.constants.NotifyPlacement::getFrom()();
154 var align = placement.@org.gwtbootstrap3.extras.notify.client.constants.NotifyPlacement::getAlign()();
155 this.placement = { from: from, align: align };
156 }-*/;
157
158 /**
159 * Set offset (space between Notify and screen/browser edges) for each axis. Default is 20 PX for both.
160 *
161 * @param offX Offset for X axis in PX
162 * @param offY Offset for Y axis in PX
163 */
164 public final native void setOffset(int offX, int offY) /*-{
165 this.offset = { x: offX, y: offY };
166 }-*/;
167
168 /**
169 * Set custom spacing between two Notifies. Default is 10 PX.
170 *
171 * @param space Spacing in PX
172 */
173 public final native void setSpacing(int space) /*-{
174 this.spacing = space;
175 }-*/;
176
177 /**
178 * Set custom Z-index. Default is 1031.
179 *
180 * @param zIndex Z-index
181 */
182 public final native void setZIndex(int zIndex) /*-{
183 this.z_index = zIndex;
184 }-*/;
185
186 /**
187 * Set delay, how long Notify stays on screen. Default is 5000 ms.
188 * Set to zero for unlimited time.
189 *
190 * @param mDelay Delay in milliseconds or zero for unlimited
191 */
192 public final native void setDelay(int mDelay) /*-{
193 this.delay = mDelay;
194 }-*/;
195
196 /**
197 * Set timer. It's value is removed from remaining 'delay' on each 'timer' period.
198 * This way you can speed up hiding of Notify. If timer > remaining delay, Notify is
199 * hidden after delay runs out (ignoring timer).
200 *
201 * @param timer Time in milliseconds
202 * @see #setDelay(int)
203 */
204 public final native void setTimer(int timer) /*-{
205 this.timer = timer;
206 }-*/;
207
208 /**
209 * Set custom URL target.<br>
210 * <br>
211 * Defaults to {@link NotifyUrlTarget#BLANK}.
212 *
213 * @param urlTarget URL target
214 */
215 public final void setUrlTarget(NotifyUrlTarget urlTarget) {
216 setUrlTarget((urlTarget != null) ? urlTarget.getTarget() : NotifyUrlTarget.BLANK.getTarget());
217 }
218
219 /**
220 * Set custom URL target. Default is "_blank".
221 * <p/>
222 * See http://www.w3schools.com/tags/att_a_target.asp for possible values.
223 *
224 * @param customUrlTarget URL target
225 */
226 public final native void setUrlTarget(String customUrlTarget) /*-{
227 this.url_target = customUrlTarget;
228 }-*/;
229
230 /**
231 * Pause countdown of display timeout when mouse is hovering above the Notify.
232 * Countdown continues (not restarted) if mouse leaves the Notify.
233 *
234 * @param pauseOnMouseOver TRUE = pause / FALSE = not pause
235 */
236 public final native void setPauseOnMouseOver(boolean pauseOnMouseOver) /*-{
237 this.mouse_over = pauseOnMouseOver ? 'pause' : null;
238 }-*/;
239
240 /**
241 * Set Animation to Notify when it enters and exit the screen.
242 *
243 * Default is enter = Animation.FADE_IN_DOWN, exit = Animation.FADE_OUT_UP
244 *
245 * @see org.gwtbootstrap3.extras.animate.client.ui.constants.Animation
246 *
247 * @param enter animation style when Notify enters the screen
248 * @param exit animation style when Notify exists the screen
249 */
250 public final void setAnimation(Animation enter, Animation exit) {
251 setAnimation((enter != null) ? enter.getCssName() : Animation.NO_ANIMATION.getCssName(),
252 (exit != null) ? exit.getCssName() : Animation.NO_ANIMATION.getCssName());
253 }
254
255 /**
256 * Set custom CSS style for animations of Notify when it enters and exits the screen.
257 * You must write your own CSS animation definition.
258 *
259 * @param enter animation style when Notify enters the screen
260 * @param exit animation style when Notify exists the screen
261 */
262 public final native void setAnimation(String enter, String exit) /*-{
263 this.animate = { enter: enter, exit: exit };
264 }-*/;
265
266 /**
267 * Set the Notify's show event handler. The show event fires immediately when
268 * the show instance method is called.
269 *
270 * @param handler
271 */
272 public final void setShowHandler(final NotifyShowHandler handler) {
273 onShow((handler != null) ? handler : NotifyShowHandler.DEFAULT_SHOW_HANDLER);
274 }
275
276 private final native void onShow(NotifyShowHandler handler) /*-{
277 this.onShow = function() {
278 handler.@org.gwtbootstrap3.extras.notify.client.event.NotifyShowHandler::onShow()();
279 };
280 }-*/;
281
282 /**
283 * Set the Notify's shown event handler. This event is fired when the modal has
284 * been made visible to the user (will wait for CSS transitions to complete).
285 *
286 * @param handler
287 */
288 public final void setShownHandler(final NotifyShownHandler handler) {
289 onShown((handler != null) ? handler : NotifyShownHandler.DEFAULT_SHOWN_HANDLER);
290 }
291
292 private final native void onShown(NotifyShownHandler handler) /*-{
293 this.onShow = function() {
294 handler.@org.gwtbootstrap3.extras.notify.client.event.NotifyShownHandler::onShown()();
295 };
296 }-*/;
297
298 /**
299 * Set the Notify's close event handler. This event is fired immediately when
300 * the notification is closing.
301 *
302 * @param handler
303 */
304 public final void setCloseHandler(final NotifyCloseHandler handler) {
305 onClose((handler != null) ? handler : NotifyCloseHandler.DEFAULT_CLOSE_HANDLER);
306 }
307
308 private final native void onClose(NotifyCloseHandler handler) /*-{
309 this.onClose = function() {
310 handler.@org.gwtbootstrap3.extras.notify.client.event.NotifyCloseHandler::onClose()();
311 };
312 }-*/;
313
314 /**
315 * Set the Notify's closed event handler. This event is fired when the modal
316 * has finished closing and is removed from the document (will wait for CSS
317 * transitions to complete).
318 *
319 * @param handler
320 */
321 public final void setClosedHandler(final NotifyClosedHandler handler) {
322 onClosed((handler != null) ? handler : NotifyClosedHandler.DEFAULT_CLOSED_HANDLER);
323 }
324
325 private final native void onClosed(NotifyClosedHandler handler) /*-{
326 this.onClosed = function() {
327 handler.@org.gwtbootstrap3.extras.notify.client.event.NotifyClosedHandler::onClosed()();
328 };
329 }-*/;
330
331 /**
332 * Set icon type you will use for Notify. Default is 'class', which
333 * allows to use iconic fonts like FontAwesome.
334 * If you want to use images instead of class, set value to "image".<br>
335 * <br>
336 * Defaults to {@link NotifyIconType#CLASS}.
337 *
338 * @param iconType the icon type
339 * @see NotifyIconType
340 */
341 public final void setIconType(NotifyIconType iconType) {
342 setIconType((iconType != null) ? iconType.getType() : NotifyIconType.CLASS.getType());
343 }
344
345 /**
346 * Set native property of Notify's icon type.
347 *
348 * @param iconType Notify's icon type.
349 */
350 private final native void setIconType(String iconType) /*-{
351 this.icon_type = iconType;
352 }-*/;
353
354 /**
355 * Set custom HTML Template of Notify. Default value is:
356 * <p/>
357 *
358 * <div data-notify="container" class="col-xs-11 col-sm-3 alert alert-{0}" role="alert"><br/>
359 * <button type="button" aria-hidden="true" class="close" data-notify="dismiss">x</button><br/>
360 * <span data-notify="icon"></span><br/>
361 * <span data-notify="title">{1}</span><br/>
362 * <span data-notify="message">{2}</span><br/>
363 * <div class="progress" data-notify="progressbar"><br/>
364 * <div class="progress-bar progress-bar-{0}" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="width: 0%;"></div><br/>
365 * </div><br/>
366 * <a href="{3}" target="{4}" data-notify="url"></a><br/>
367 * </div>
368 *
369 * <p/>
370 * Where:
371 * <ul>
372 * <li>{0} = type</li>
373 * <li>{1} = title</li>
374 * <li>{2} = message</li>
375 * <li>{3} = url</li>
376 * <li>{4} = target</li>
377 * </ul>
378 *
379 * @param html Custom HTML template
380 * @see documentation at: http://bootstrap-notify.remabledesigns.com/
381 */
382 public final native void setTemplate(String html) /*-{
383 this.template = html;
384 }-*/;
385
386 /**
387 * Make this NotifySettings as default for all new Notifies.
388 * <p/>
389 * Values set to this NotifySettings overrides original default values.
390 * If value for some property is not set, original default value is kept.
391 */
392 public final native void makeDefault() /*-{
393 $wnd.jQuery.notifyDefaults();
394 }-*/;
395
396 }