You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@tapestry.apache.org by hl...@apache.org on 2013/07/22 01:49:31 UTC
[2/6] git commit: Floating console improvements - Allow both floating
console and standard console (useful for testing) - Move the console to the
bottom of the viewport - Add a "clear console" button
Floating console improvements
- Allow both floating console and standard console (useful for testing)
- Move the console to the bottom of the viewport
- Add a "clear console" button
Project: http://git-wip-us.apache.org/repos/asf/tapestry-5/repo
Commit: http://git-wip-us.apache.org/repos/asf/tapestry-5/commit/9689b262
Tree: http://git-wip-us.apache.org/repos/asf/tapestry-5/tree/9689b262
Diff: http://git-wip-us.apache.org/repos/asf/tapestry-5/diff/9689b262
Branch: refs/heads/master
Commit: 9689b2624aee5feb670fc0f18107e5d77c1cb7b6
Parents: 6e0f4b3
Author: Howard M. Lewis Ship <hl...@apache.org>
Authored: Sun Jul 21 15:08:06 2013 -0700
Committer: Howard M. Lewis Ship <hl...@apache.org>
Committed: Sun Jul 21 15:08:06 2013 -0700
----------------------------------------------------------------------
.../META-INF/modules/t5/core/console.coffee | 58 ++++++++++++++------
.../assets/tapestry5/tapestry-console.css | 31 +++++++----
.../integration/app1/components/Border.tml | 2 +-
3 files changed, 62 insertions(+), 29 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/tapestry-5/blob/9689b262/tapestry-core/src/main/coffeescript/META-INF/modules/t5/core/console.coffee
----------------------------------------------------------------------
diff --git a/tapestry-core/src/main/coffeescript/META-INF/modules/t5/core/console.coffee b/tapestry-core/src/main/coffeescript/META-INF/modules/t5/core/console.coffee
index 2d530df..1e2de33 100644
--- a/tapestry-core/src/main/coffeescript/META-INF/modules/t5/core/console.coffee
+++ b/tapestry-core/src/main/coffeescript/META-INF/modules/t5/core/console.coffee
@@ -17,15 +17,18 @@
# A wrapper around the native console, when it exists.
define ["./dom", "underscore"],
(dom, _) ->
+
nativeConsole = {}
floatingConsole = null
+ forceFloating = (dom.body.attribute "data-floating-console") == "true"
+
FADE_DURATION = 0.25
# module exports are mutable; someone else could
# require this module to change the default DURATION
exports =
- # Default duration for floating console is 10 seconds.
+ # Default duration for floating console in seconds.
DURATION: 10
try
@@ -38,42 +41,59 @@ define ["./dom", "underscore"],
# console as needed.
display = (className, message) ->
unless floatingConsole
- floatingConsole = dom.create class: "tapestry-console"
+ floatingConsole = dom.create
+ class: "tapestry-console",
+ """
+ <div class="console-backdrop"></div>
+ <div data-content="alerts"></div>
+ <button class="btn btn-mini"><i class="icon-remove"></i> Clear Console</button>
+ """
+
dom.body.prepend floatingConsole
+ floatingConsole.on "click", ".btn-mini", ->
+ floatingConsole.hide().findFirst("[data-content=alerts]").update ""
+
div = dom.create
- class: "entry"
+ class: "alert #{className}"
"""
- <div class="#{className}">
- <button class="close">×</button>
- #{_.escape message}
- </div>
+ <button class="close">×</button>
+ #{_.escape message}
"""
- floatingConsole.append div.hide().fadeIn FADE_DURATION
+ floatingConsole.show().findFirst("[data-content=alerts]").append div.hide().fadeIn FADE_DURATION
+ animating = false
removed = false
runFadeout = ->
+ return if animating
+
+ animating = true
+
div.fadeOut FADE_DURATION, ->
div.remove() unless removed
+ # Hide the console after the last one is removed.
+ unless floatingConsole.findFirst(".alert")
+ floatingConsole.hide()
+
window.setTimeout runFadeout, exports.DURATION * 1000
- div.on "click", ->
- div.remove()
- removed = true
+ div.on "click", -> runFadeout()
level = (className, consolefn) ->
(message) ->
# consolefn may be null if there's no console; under IE it may be non-null, but not a function.
+ # For some testing, it is nice to force the floating console to always display.
- unless consolefn
+ if forceFloating or (not consolefn)
# Display it floating. If there's a real problem, such as a failed Ajax request, then the
# client-side code should be alerting the user in some other way, and not rely on them
# being able to see the logged console output.
display className, message
- return
+
+ return unless forceFloating
if _.isFunction consolefn
# Use the available native console, calling it like an instance method
@@ -94,13 +114,17 @@ define ["./dom", "underscore"],
exports.debug =
if exports.debugEnabled
# If native console available, go for it. IE doesn't have debug, so we use log instead.
- level "alert", (nativeConsole.debug or nativeConsole.log)
+ level "", (nativeConsole.debug or nativeConsole.log)
else
->
- exports.info = level "alert.alert-info", nativeConsole.info
- exports.warn = level "alert", nativeConsole.warn
- exports.error = level "alert.alert-error", nativeConsole.error
+ exports.info = level "alert-info", nativeConsole.info
+ exports.warn = level "", nativeConsole.warn
+ exports.error = level "alert-error", nativeConsole.error
+
+ # This is also an aid to debugging; it allows arbitrary scripts to present on the console; when using Geb
+ # and/or Selenium, it is very useful to present debugging data right on the page.
+ window.t5console = exports
# Return the exports; we keep a reference to it, so we can see exports.DURATION, even
# if some other module imports this one and modifies that property.
http://git-wip-us.apache.org/repos/asf/tapestry-5/blob/9689b262/tapestry-core/src/main/resources/META-INF/assets/tapestry5/tapestry-console.css
----------------------------------------------------------------------
diff --git a/tapestry-core/src/main/resources/META-INF/assets/tapestry5/tapestry-console.css b/tapestry-core/src/main/resources/META-INF/assets/tapestry5/tapestry-console.css
index f475a76..4f9d62f 100644
--- a/tapestry-core/src/main/resources/META-INF/assets/tapestry5/tapestry-console.css
+++ b/tapestry-core/src/main/resources/META-INF/assets/tapestry5/tapestry-console.css
@@ -1,18 +1,27 @@
/* The console is used to show debugging messages. */
-DIV.tapestry-console {
+.tapestry-console {
position: fixed;
- z-index: 1;
- top: 2px;
- left: 2px;
+ z-index: 2000;
+ bottom: 0px;
+ left: 0px;
+ right: 0px;
+ border-radius: 4px;
+ padding: 5px;
}
-DIV.tapestry-console > DIV.entry {
- font-weight: bold;
- padding: 0px 2px;
+.tapestry-console > .console-backdrop {
+ position: absolute;
+ background-color: black;
+ opacity: .5;
+ top: 0;
+ left: 0;
+ bottom: 0;
+ right: 0;
+ z-index: -1;
+}
+
+/** Unlike a normal alert, a console message can be dismissed by a click anywhere. */
+.tapestry-console .alert{
cursor: pointer;
- border-radius: 5px;
- -moz-border-radius: 5px;
- -webkit-border-radius: 5px;
margin-bottom: 5px;
- padding-left: 22px;
}
\ No newline at end of file
http://git-wip-us.apache.org/repos/asf/tapestry-5/blob/9689b262/tapestry-core/src/test/resources/org/apache/tapestry5/integration/app1/components/Border.tml
----------------------------------------------------------------------
diff --git a/tapestry-core/src/test/resources/org/apache/tapestry5/integration/app1/components/Border.tml b/tapestry-core/src/test/resources/org/apache/tapestry5/integration/app1/components/Border.tml
index 473eecc..af75055 100644
--- a/tapestry-core/src/test/resources/org/apache/tapestry5/integration/app1/components/Border.tml
+++ b/tapestry-core/src/test/resources/org/apache/tapestry5/integration/app1/components/Border.tml
@@ -3,7 +3,7 @@
<head>
<title>Tapestry Integration Test Application</title>
</head>
-<body>
+<body data-floating-console="true">
<div class="navbar navbar-inverse navbar-fixed-top">