yv01p/Umbraco-CMS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Implements 29339

Browse Source 
[TFS Changeset #79321]
This commit is contained in:
hartvig
2010-11-03 09:33:40 +00:00
parent 4d76c17b02
commit 9adff7e4a9
11 changed files with 652 additions and 206 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
umbraco/presentation/umbraco.presentation.csproj
View File

@@ -1154,13 +1154,6 @@
<Compile Include="umbraco\js\language.aspx.designer.cs">
<DependentUpon>language.aspx</DependentUpon>
</Compile>
<Compile Include="umbraco\keepalive.aspx.cs">
<DependentUpon>keepalive.aspx</DependentUpon>
<SubType>ASPXCodeBehind</SubType>
</Compile>
<Compile Include="umbraco\keepalive.aspx.designer.cs">
<DependentUpon>keepalive.aspx</DependentUpon>
</Compile>
<Compile Include="umbraco\LiveEditing\Controls\Communicator.cs" />
<Compile Include="umbraco\LiveEditing\Modules\BaseModule.cs" />
<Compile Include="umbraco\LiveEditing\Modules\Separator.cs" />
@@ -2535,9 +2528,6 @@
<Content Include="umbraco\js\umbracoCheckKeys.js" />
<Content Include="umbraco\js\xmlextras.js" />
<Content Include="umbraco\js\xmlRequest.js" />
<Content Include="umbraco\keepalive.aspx">
<SubType>Form</SubType>
</Content>
<Content Include="umbraco\login.aspx" />
<Content Include="umbraco\logout.aspx" />
<Content Include="umbraco\macroResultWrapper.aspx">

464
umbraco/presentation/umbraco/css/umbracoGui.css
View File

@@ -1,191 +1,391 @@
html,body{width: 100%; height: 100%; padding: 0px; margin: 0px; border: none; overflow: hidden;}
body{
outline: none;
padding: 0px; margin: 0px; background: #fff url(../../umbraco_client/images/progressbar.gif) center 300px no-repeat; overflow: auto;
font-size: 11px;
}
#appLoading
html, body
{
background: #fff url(../../umbraco_client/images/progressbar.gif) center center no-repeat; overflow: auto;
width:300px; height:100px;
width: 100%;
height: 100%;
padding: 0px;
margin: 0px;
border: none;
overflow: hidden;
}
/*TOP*/
.topBar
body
{
padding: 10px 0px 10px 10px;
margin-bottom: 3px;
height: 22px;
background: url(../images/topGradient.gif) repeat-x top;
outline: none;
padding: 0px;
margin: 0px;
background: #fff url(../../umbraco_client/images/progressbar.gif) center 300px no-repeat;
overflow: auto;
font-size: 11px;
}
.topBarButtons{float: right; padding-right: 10px;}
.topBarButtons button, button.topBarButton{height: 26px; margin-top: -1px; padding: 3px; margin-left: 10px; vertical-align: middle; font-size: 9px;}
.topBarButtons button span, button.topBarButton span{font-size: 9px; vertical-align: middle;}
.topBarButtons button img, button.topBarButton img{margin-right: 5px; vertical-align: middle;}
#buttonCreate{margin-left: 0px;}
#appLoading
{
background: #fff url(../../umbraco_client/images/progressbar.gif) center center no-repeat;
overflow: auto;
width: 300px;
height: 100px;
}
/*TOP*/
.topBar
{
padding: 10px 0px 10px 10px;
margin-bottom: 3px;
height: 22px;
background: url(../images/topGradient.gif) repeat-x top;
}
.topBarButtons
{
float: right;
padding-right: 10px;
}
.topBarButtons button, button.topBarButton
{
height: 26px;
margin-top: -1px;
padding: 3px;
margin-left: 10px;
vertical-align: middle;
font-size: 9px;
}
.topBarButtons button span, button.topBarButton span
{
font-size: 9px;
vertical-align: middle;
}
.topBarButtons button img, button.topBarButton img
{
margin-right: 5px;
vertical-align: middle;
}
#buttonCreate
{
margin-left: 0px;
}
/* MAIN UI AREA */
#treeWindow_content{padding-top: 5px; padding-right: 0px;}
#PlaceHolderAppIcons_content{overflow: hidden;}
#treeWindow_content
{
padding-top: 5px;
padding-right: 0px;
}
#PlaceHolderAppIcons_content
{
overflow: hidden;
}
#control_overlay {background-color:#000;}
#treeToggle{display: none; position: absolute; top: 45px; left: 2px; width: 7px; height: 120px; background: url(../images/toggleTreeOff.png) no-repeat center center; outline: none; text-decoration: none; overflow: hidden;}
#treeToggle:hover{background-color: #F4F5F4;}
#treeToggle.on{background-image: url(../images/toggleTreeOn.png) !Important;}
#control_overlay
{
background-color: #000;
}
#treeToggle
{
display: none;
position: absolute;
top: 45px;
left: 2px;
width: 7px;
height: 120px;
background: url(../images/toggleTreeOff.png) no-repeat center center;
outline: none;
text-decoration: none;
overflow: hidden;
}
#treeToggle:hover
{
background-color: #F4F5F4;
}
#treeToggle.on
{
background-image: url(../images/toggleTreeOn.png) !important;
}
#leftDIV{width: 20%; position: absolute; top: 0px; left: 0px;}
#rightDIV{width: 70%; position: absolute; top: 0px; right: 0px;}
#uiArea{position: relative; margin: 0px 10px 0px 10px; display: none;}
#leftDIV
{
width: 20%;
position: absolute;
top: 0px;
left: 0px;
}
#rightDIV
{
width: 70%;
position: absolute;
top: 0px;
right: 0px;
}
#uiArea
{
position: relative;
margin: 0px 10px 0px 10px;
display: none;
}
#defaultSpeechbubble{z-index: 10; display: none; width: 231px; position: absolute; right: 30px; bottom: 20px; margin: 0px; padding:0;}
.speechClose {float: right; width: 18px; height: 18px; margin-right: 18px; display: none;}
.speechBubbleTop {background: url('../images/speechbubble/speechbubble_top.png') no-repeat; width: 235px; height: 6px; margin: 0px 0px 0px 3px; padding:0;}
.speechBubbleContent {background: url('../images/speechbubble/speechbubble_body.png') no-repeat; width: 235px; margin:0;padding: 10px 20px 10px 10px;}
.speechBubbleBottom {background: url('../images/speechbubble/speechbubble_bottom.png') no-repeat; width: 235px; height: 30px; margin:0px 0px 0px 1px;padding:0;}
.speechBubbleContent h3
#defaultSpeechbubble
{
z-index: 10;
display: none;
width: 231px;
position: absolute;
right: 30px;
bottom: 20px;
margin: 0px;
padding: 0;
}
.speechClose
{
float: right;
width: 18px;
height: 18px;
margin-right: 18px;
display: none;
}
.speechBubbleTop
{
background: url('../images/speechbubble/speechbubble_top.png') no-repeat;
width: 235px;
height: 6px;
margin: 0px 0px 0px 3px;
padding: 0;
}
.speechBubbleContent
{
background: url('../images/speechbubble/speechbubble_body.png') no-repeat;
width: 235px;
margin: 0;
padding: 10px 20px 10px 10px;
}
.speechBubbleBottom
{
background: url('../images/speechbubble/speechbubble_bottom.png') no-repeat;
width: 235px;
height: 30px;
margin: 0px 0px 0px 1px;
padding: 0;
}
.speechBubbleContent h3
{
font-size: 14px;
font-weight: bold;
font-family: Trebuchet MS, Lucida Grande, verdana, arial;
font-family: Trebuchet MS, Lucida Grande, verdana, arial;
margin: 0;
padding: 0;
display: block;
width: 220px;
width: 220px;
}
.speechBubbleContent p
.speechBubbleContent p
{
font-size: 11px;
font-family: Trebuchet MS, Lucida Grande, verdana, arial;
margin: 0;
width: 220px;
font-family: Trebuchet MS, Lucida Grande, verdana, arial;
margin: 0;
width: 220px;
}
#tray
{
margin: 0px;
padding: 7px 0;
margin: 0px;
padding: 7px 0;
}
#tray li
{
list-style-type: none;
font-size: 37px;
width: 49px;
height: 36px;
display: block;
float: left;
padding: 0;
margin: 0;
padding-bottom: 7px;
list-style-type: none;
font-size: 37px;
width: 49px;
height: 36px;
display: block;
float: left;
padding: 0;
margin: 0;
padding-bottom: 7px;
}
#tray li a
{
background-image: url('../images/tray/traySprites.png');
background-repeat: no-repeat;
text-decoration: none;
padding: 0;
margin: 0;
color: #fff;
font-size: 1px;
width: 49px;
height: 36px;
display: block;
background-image: url('../images/tray/traySprites.png');
background-repeat: no-repeat;
text-decoration: none;
padding: 0;
margin: 0;
color: #fff;
font-size: 1px;
width: 49px;
height: 36px;
display: block;
}
.trayHolder, .trayIcon
{
border: 0px;
width: 49px;
height: 36px;
border: 0px;
width: 49px;
height: 36px;
}
/* tray sprites */
.traycontent{background-position: -18px -18px;}
.traymedia{ background-position: -18px -90px;}
.trayusers{ background-position: -18px -162px;}
.traysettings{ background-position: -18px -234px;}
.traydeveloper{ background-position: -18px -306px;}
.traymember{background-position: -18px -378px;}
.traystats{background-position: -18px -450px;}
.traytranslation{background-position: -18px -522px;}
.traycontent
{
background-position: -18px -18px;
}
.traymedia
{
background-position: -18px -90px;
}
.trayusers
{
background-position: -18px -162px;
}
.traysettings
{
background-position: -18px -234px;
}
.traydeveloper
{
background-position: -18px -306px;
}
.traymember
{
background-position: -18px -378px;
}
.traystats
{
background-position: -18px -450px;
}
.traytranslation
{
background-position: -18px -522px;
}
/* end tray sprites */
a
{
color: Black;
color: Black;
}
a:hover
{
text-decoration: underline;
text-decoration: underline;
}
img
{
border: none;
border: none;
}
/* AUTOCOMPLETE */
.umbracoSearchHolder #umbSearchField{width: 250px; color: #999; padding: 2px;}
.ac_results {
padding: 3px;
border: 1px solid #979797;
background-color: #f0f0f0;
border-top: none;
overflow: hidden;
z-index: 99999;
}
.ac_results ul {
width: 100%;
list-style-position: outside;
list-style: none;
padding: 0;
margin: 0;
}
.ac_results li {
display: block;
padding: 2px;
padding-left: 5px;
/*
it is very important, if line-height not setted or setted
in relative units scroll will be broken in firefox
*/
line-height: 20px;
overflow: hidden;
font-family:Arial,Lucida Grande;
font-size:11px;
height:20px;
color: #1a1818;
cursor:pointer;
}
.ac_results .ac_odd {
}
.ac_results .ac_over {
background-color: #D5EFFC;
border: 1px solid #a8d8eb;
padding: 1px !Important;
padding-left: 4px !Important;
}
.ac_results span.nodeId
.umbracoSearchHolder #umbSearchField
{
font-size:smaller;
width: 250px;
color: #999;
padding: 2px;
}
.ac_loading
.ac_results
{
background-image: url('../images/throbber.gif');
background-position:right;
background-repeat:no-repeat;
padding: 3px;
border: 1px solid #979797;
background-color: #f0f0f0;
border-top: none;
overflow: hidden;
z-index: 99999;
}
.ac_results ul
{
width: 100%;
list-style-position: outside;
list-style: none;
padding: 0;
margin: 0;
}
.ac_results li
{
display: block;
padding: 2px;
padding-left: 5px; /* it is very important, if line-height not setted or setted in relative units scroll will be broken in firefox */
line-height: 20px;
overflow: hidden;
font-family: Arial,Lucida Grande;
font-size: 11px;
height: 20px;
color: #1a1818;
cursor: pointer;
}
.ac_results .ac_odd
{
}
.ac_results .ac_over
{
background-color: #D5EFFC;
border: 1px solid #a8d8eb;
padding: 1px !important;
padding-left: 4px !important;
}
.ac_results span.nodeId
{
font-size: smaller;
}
.ac_loading
{
background-image: url('../images/throbber.gif');
background-position: right;
background-repeat: no-repeat;
}
.error, .notice, .success
{
padding: .8em;
padding-top: 0em;
padding-bottom: 0em;
margin-bottom: .5em;
border: 2px solid #ddd;
}
.error
{
background: #FBE3E4;
color: #8a1f11;
border-color: #FBC2C4;
}
.notice
{
background: #FFF6BF;
color: #514721;
border-color: #FFD324;
}
.success
{
background: #E6EFC2;
color: #264409;
border-color: #C6D880;
}
.error a
{
color: #8a1f11;
}
.notice a
{
color: #514721;
}
.success a
{
color: #264409;
}
.errormessage
{
color: #8a1f11;
}
p
{
font-family: Trebuchet MS, Lucida Grande, verdana, arial;
font-size: 11px;
}
h3
{
font-family: Trebuchet MS, Lucida Grande, verdana, arial;
font-size: 14px;
}

2
umbraco/presentation/umbraco/masterpages/umbracoDialog.Master
View File

@@ -16,8 +16,6 @@
<umb:JsInclude ID="JsInclude3" runat="server" FilePath="ui/jquery.js" PathNameAlias="UmbracoClient" Priority="1" />
<umb:JsInclude ID="JsInclude4" runat="server" FilePath="Application/UmbracoClientManager.js" PathNameAlias="UmbracoClient" Priority="2" />
<umb:JsInclude ID="JsInclude2" runat="server" FilePath="ui/default.js" PathNameAlias="UmbracoClient" Priority="5" />
<umb:JsInclude ID="JsInclude5" runat="server" FilePath="Application/jQuery/jquery.idle-timer.js"
PathNameAlias="UmbracoClient" Priority="1" />
<asp:ContentPlaceHolder ID="head" runat="server"></asp:ContentPlaceHolder>
</head>

9
umbraco/presentation/umbraco/masterpages/umbracoDialog.Master.designer.cs generated
View File

@@ -75,15 +75,6 @@ namespace umbraco.presentation.masterpages {
/// </remarks>
protected global::ClientDependency.Core.Controls.JsInclude JsInclude2;
/// <summary>
/// JsInclude5 control.
/// </summary>
/// <remarks>
/// Auto-generated field.
/// To modify move field declaration from designer file to code-behind file.
/// </remarks>
protected global::ClientDependency.Core.Controls.JsInclude JsInclude5;
/// <summary>
/// head control.
/// </summary>

16
umbraco/presentation/umbraco/masterpages/umbracoPage.Master
View File

@@ -28,8 +28,6 @@
Priority="10" />
<umb:JsInclude ID="JsInclude3" runat="server" FilePath="ui/default.js" PathNameAlias="UmbracoClient"
Priority="10" />
<umb:JsInclude ID="JsInclude10" runat="server" FilePath="Application/jQuery/jquery.idle-timer.js"
PathNameAlias="UmbracoClient" Priority="1" />
<asp:ContentPlaceHolder ID="head" runat="server">
</asp:ContentPlaceHolder>
</head>
@@ -42,19 +40,5 @@
</form>
<asp:ContentPlaceHolder ID="footer" runat="server">
</asp:ContentPlaceHolder>
<script type="text/javascript">
// add idle timer
var stimeout = 60000;
jQuery('.umbracoPage').bind("idle.idleTimer", function () {
UmbClientMgr.mainWindow().jQuery('#umbracoMainPageBody').trigger('idle.idleTimer');
});
jQuery('.umbracoPage').bind("active.idleTimer", function () {
UmbClientMgr.mainWindow().jQuery('#umbracoMainPageBody').trigger('active.idleTimer');
});
jQuery('.umbracoPage').idleTimer(stimeout);
</script>
</body>
</html>

9
umbraco/presentation/umbraco/masterpages/umbracoPage.Master.designer.cs generated
View File

@@ -120,15 +120,6 @@ namespace umbraco.presentation.masterpages {
/// </remarks>
protected global::ClientDependency.Core.Controls.JsInclude JsInclude3;
/// <summary>
/// JsInclude10 control.
/// </summary>
/// <remarks>
/// Auto-generated field.
/// To modify move field declaration from designer file to code-behind file.
/// </remarks>
protected global::ClientDependency.Core.Controls.JsInclude JsInclude10;
/// <summary>
/// head control.
/// </summary>

81
umbraco/presentation/umbraco/umbraco.aspx
View File

@@ -42,8 +42,6 @@
PathNameAlias="UmbracoRoot" />
<umb:JsInclude ID="JsInclude16" runat="server" FilePath="Application/jQuery/jquery.cookie.js"
PathNameAlias="UmbracoClient" Priority="1" />
<umb:JsInclude ID="JsInclude17" runat="server" FilePath="Application/jQuery/jquery.idle-timer.js"
PathNameAlias="UmbracoClient" Priority="1" />
<script type="text/javascript">
this.name = 'umbracoMain';
</script>
@@ -63,6 +61,12 @@
</asp:ScriptManager>
</form>
<div style="position: relative;">
<div id="logout-warning" class="notice" style="display: none; text-align: center">
<h3 style="margin-bottom: 3px;">
You've been idle and logout will automatically occur in <span id="logout-warning-counter">
</span> <a href="#" onclick="umbracoRenewSession();">Renew now to save your work</a>.</h3>
<p style="margin:0 0 10px 0;">(message above is 'Work In Progress' and needs translation too)</p>
</div>
<div class="topBar" id="topBar">
<div style="float: left">
<button id="buttonCreate" onclick="UmbClientMgr.appActions().launchCreateWizard();"
@@ -76,7 +80,6 @@
</div>
</asp:Panel>
<div class="topBarButtons">
<span id="logout-warning" style="display:none;">You're idle. Logout will happen in <span id="logout-warning-counter"></span>.</span>
<button onclick="UmbClientMgr.appActions().launchAbout();" class="topBarButton">
<img src="images/aboutNew.png" alt="about" /><span><%=umbraco.ui.Text("general", "about")%></span></button>
<button onclick="UmbClientMgr.appActions().launchHelp('<%=this.getUser().Language%>', '<%=this.getUser().UserType.Name%>');"
@@ -112,8 +115,6 @@
<script type="text/javascript">
<asp:PlaceHolder ID="bubbleText" Runat="server"/>
</script>
<iframe src="keepalive.aspx" style="border: none; width: 1px; height: 1px; position: absolute;">
</iframe>
<div id="defaultSpeechbubble">
</div>
<div id="umbModalBox">
@@ -166,25 +167,69 @@
}
// add idle timer
var stimeout = 60000;
jQuery('#umbracoMainPageBody').bind("idle.idleTimer", function () {
jQuery("#logout-warning").show();
});
jQuery('#umbracoMainPageBody').bind("active.idleTimer", function () {
jQuery("#logout-warning").hide();
});
jQuery('#umbracoMainPageBody').idleTimer(stimeout);
jQuery("#right").show();
});
// Handles single vs double click on application item icon buttons...
// *** NEW KEEP ALIVE - Should be moved to app manager *** */
window.setInterval(keepAlive, 10000);
function keepAlive() {
umbraco.presentation.webservices.legacyAjaxCalls.GetSecondsBeforeUserLogout(validateUserTimeout, umbracoSessionLogout);
}
function validateUserTimeout(secondsBeforeTimeout) {
var logoutElement = jQuery("#logout-warning");
// when five minutes left, show warning
if (secondsBeforeTimeout < 300) {
if (secondsBeforeTimeout <= 0) {
umbracoSessionLogout();
} else {
logoutElement.fadeIn();
jQuery("#logout-warning-counter").html(secondsBeforeTimeout + ' seconds...');
// when two mintutes left make warning RED
if (secondsBeforeTimeout <= 120) {
logoutElement.addClass('error');
logoutElement.removeClass('notice');
}
}
} else {
logoutElement.fadeOut().removeClass('error').addClass('notice');
}
}
function umbracoRenewSession() {
umbraco.presentation.webservices.legacyAjaxCalls.RenewUmbracoSession(
function () { jQuery("#logout-warning").fadeOut().removeClass('error').addClass('notice'); },
umbracoSessionLogout);
}
function umbracoSessionLogout() {
alert('Session has expired on server - can\'t renew. Logging out!');
top.document.location.href = 'logout.aspx';
}
function blink($target) {
// Set the color the field should blink in
var backgroundColor = '#FBC2C4';
var existingBgColor;
// Load the current background color
existingBgColor = $target.css('background-color');
// Set the new background color
$target.css('background-color', backgroundColor);
// Set it back to old color after 500 ms
setTimeout(function () { $target.css('background-color', existingBgColor); }, 500);
}
// *** END *** */
// Handles single vs double click on application item icon buttons...
function appItemSingleClick(itemName) {
UmbClientMgr.historyManager().addHistory(itemName);
return false;

2
umbraco/presentation/umbraco/umbraco.aspx.cs
View File

@@ -53,7 +53,7 @@ namespace umbraco.cms.presentation
JSEvents.Append(@"jQuery('." + appClass + "').click(function() { appClick.call(this, '" + a.alias + "'); } );");
JSEvents.Append(@"jQuery('." + appClass + "').dblclick(function() { appDblClick.call(this, '" + a.alias + "'); } );");
string iconElement = String.Format("<li><a class=\"{0}\" title=\"" + ui.Text("sections", a.alias, base.getUser()) + "\" href=\"#" + a.alias.ToLower() + "\">", appClass);
string iconElement = String.Format("<li><a class=\"{0}\" title=\"" + ui.Text("sections", a.alias, base.getUser()) + "\" href=\"javascript:void(0);\">", appClass);
if (a.icon.StartsWith("."))
iconElement +=
"<img src=\"images/nada.gif\" class=\"trayHolder\" alt=\"\" /></a></li>";

9
umbraco/presentation/umbraco/umbraco.aspx.designer.cs generated
View File

@@ -183,15 +183,6 @@ namespace umbraco.cms.presentation {
/// </remarks>
protected global::ClientDependency.Core.Controls.JsInclude JsInclude16;
/// <summary>
/// JsInclude17 control.
/// </summary>
/// <remarks>
/// Auto-generated field.
/// To modify move field declaration from designer file to code-behind file.
/// </remarks>
protected global::ClientDependency.Core.Controls.JsInclude JsInclude17;
/// <summary>
/// Form1 control.
/// </summary>

24
umbraco/presentation/umbraco/webservices/legacyAjaxCalls.asmx.cs
View File

@@ -19,6 +19,7 @@ using System.Web.UI;
using umbraco.IO;
using umbraco.cms.businesslogic.web;
using umbraco.cms.businesslogic.media;
using umbraco.BasePages;
namespace umbraco.presentation.webservices
@@ -127,6 +128,29 @@ namespace umbraco.presentation.webservices
return Application[helper.Request("key")].ToString();
}
[WebMethod]
[ScriptMethod]
public void RenewUmbracoSession()
{
Authorize();
BasePage.RenewLoginTimeout();
}
[WebMethod]
[ScriptMethod]
public int GetSecondsBeforeUserLogout()
{
Authorize();
long timeout = BasePage.GetTimeout(true);
DateTime timeoutDate = new DateTime(timeout);
DateTime currentDate = DateTime.Now;
return (int) timeoutDate.Subtract(currentDate).TotalSeconds;
}
[WebMethod]
[ScriptMethod]
public string TemplateMasterPageContentContainer(int templateId, int masterTemplateId)

232
umbraco/presentation/umbraco_client/Application/JQuery/jquery.idle-timer.js Normal file
View File

@@ -0,0 +1,232 @@
/*!
* jQuery idleTimer plugin
* version 0.9.100511
* by Paul Irish.
* http://github.com/paulirish/yui-misc/tree/
* MIT license
* adapted from YUI idle timer by nzakas:
* http://github.com/nzakas/yui-misc/
*/
/*
* Copyright (c) 2009 Nicholas C. Zakas
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in
* all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
* THE SOFTWARE.
*/
// API available in <= v0.8
/*******************************
// idleTimer() takes an optional argument that defines the idle timeout
// timeout is in milliseconds; defaults to 30000
$.idleTimer(10000);
$(document).bind("idle.idleTimer", function(){
// function you want to fire when the user goes idle
});
$(document).bind("active.idleTimer", function(){
// function you want to fire when the user becomes active again
});
// pass the string 'destroy' to stop the timer
$.idleTimer('destroy');
// you can query if the user is idle or not with data()
$.data(document,'idleTimer'); // 'idle' or 'active'
// you can get time elapsed since user when idle/active
$.idleTimer('getElapsedTime'); // time since state change in ms
********/
// API available in >= v0.9
/*************************
// bind to specific elements, allows for multiple timer instances
$(elem).idleTimer(timeout|'destroy'|'getElapsedTime');
$.data(elem,'idleTimer'); // 'idle' or 'active'
// if you're using the old $.idleTimer api, you should not do $(document).idleTimer(...)
// element bound timers will only watch for events inside of them.
// you may just want page-level activity, in which case you may set up
// your timers on document, document.documentElement, and document.body
********/
(function ($) {
$.idleTimer = function (newTimeout, elem) {
// defaults that are to be stored as instance props on the elem
var idle = false, //indicates if the user is idle
enabled = true, //indicates if the idle timer is enabled
timeout = 30000, //the amount of time (ms) before the user is considered idle
events = 'mousemove keydown DOMMouseScroll mousewheel mousedown'; // activity is one of these events
elem = elem || document;
/* (intentionally not documented)
* Toggles the idle state and fires an appropriate event.
* @return {void}
*/
var toggleIdleState = function (myelem) {
// curse you, mozilla setTimeout lateness bug!
if (typeof myelem == 'number') myelem = undefined;
var obj = $.data(myelem || elem, 'idleTimerObj');
//toggle the state
obj.idle = !obj.idle;
// reset timeout counter
obj.olddate = +new Date;
//fire appropriate event
// create a custom event, but first, store the new state on the element
// and then append that string to a namespace
var event = jQuery.Event($.data(elem, 'idleTimer', obj.idle ? "idle" : "active") + '.idleTimer');
// we dont want this to bubble
event.stopPropagation();
$(elem).trigger(event);
},
/**
* Stops the idle timer. This removes appropriate event handlers
* and cancels any pending timeouts.
* @return {void}
* @method stop
* @static
*/
stop = function (elem) {
var obj = $.data(elem, 'idleTimerObj');
//set to disabled
obj.enabled = false;
//clear any pending timeouts
clearTimeout(obj.tId);
//detach the event handlers
$(elem).unbind('.idleTimer');
},
/* (intentionally not documented)
* Handles a user event indicating that the user isn't idle.
* @param {Event} event A DOM2-normalized event object.
* @return {void}
*/
handleUserEvent = function () {
var obj = $.data(this, 'idleTimerObj');
//clear any existing timeout
clearTimeout(obj.tId);
//if the idle timer is enabled
if (obj.enabled) {
//if it's idle, that means the user is no longer idle
if (obj.idle) {
toggleIdleState(this);
}
//set a new timeout
obj.tId = setTimeout(toggleIdleState, obj.timeout);
}
};
/**
* Starts the idle timer. This adds appropriate event handlers
* and starts the first timeout.
* @param {int} newTimeout (Optional) A new value for the timeout period in ms.
* @return {void}
* @method $.idleTimer
* @static
*/
var obj = $.data(elem, 'idleTimerObj') || new function () { };
obj.olddate = obj.olddate || +new Date;
//assign a new timeout if necessary
if (typeof newTimeout == "number") {
timeout = newTimeout;
} else if (newTimeout === 'destroy') {
stop(elem);
return this;
} else if (newTimeout === 'getElapsedTime') {
return (+new Date) - obj.olddate;
}
//assign appropriate event handlers
$(elem).bind($.trim((events + ' ').split(' ').join('.idleTimer ')), handleUserEvent);
obj.idle = idle;
obj.enabled = enabled;
obj.timeout = timeout;
//set a timeout to toggle state
obj.tId = setTimeout(toggleIdleState, obj.timeout);
// assume the user is active for the first x seconds.
$.data(elem, 'idleTimer', "active");
// store our instance on the object
$.data(elem, 'idleTimerObj', obj);
}; // end of $.idleTimer()
// v0.9 API for defining multiple timers.
$.fn.idleTimer = function (newTimeout) {
this[0] && $.idleTimer(newTimeout, this[0]);
return this;
}
})(jQuery);