caojiezi2003/Stackedit
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added effect on document title hover event

Browse Source
This commit is contained in:
Benoit Schweblin 2013-09-26 19:27:38 -04:00
parent b91e52530f
commit 9853f30563
2 changed files with 23 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
res/extensions/documentTitle.js
View File

@ -12,6 +12,7 @@ define([
}; };
var fileDesc = undefined; var fileDesc = undefined;
var $fileTitleNavbar = undefined;
var updateTitle = function(fileDescParameter) { var updateTitle = function(fileDescParameter) {
if(fileDescParameter !== fileDesc) { if(fileDescParameter !== fileDesc) {
return; return;
@ -19,7 +20,7 @@ define([
var title = fileDesc.title; var title = fileDesc.title;
document.title = "StackEdit - " + title; document.title = "StackEdit - " + title;
$(".file-title-navbar").html(fileDesc.composeTitle()); $fileTitleNavbar.html(fileDesc.composeTitle());
$(".file-title").text(title); $(".file-title").text(title);
$(".input-file-title").val(title); $(".input-file-title").val(title);
@ -39,6 +40,21 @@ define([
documentTitle.onSyncRemoved = updateTitle; documentTitle.onSyncRemoved = updateTitle;
documentTitle.onNewPublishSuccess = updateTitle; documentTitle.onNewPublishSuccess = updateTitle;
documentTitle.onPublishRemoved = updateTitle; documentTitle.onPublishRemoved = updateTitle;
documentTitle.onReady = function() {
$fileTitleNavbar = $(".file-title-navbar");
// Add a scrolling effect on hover
$fileTitleNavbar.hover(function() {
var scrollLeft = $fileTitleNavbar[0].scrollWidth - $fileTitleNavbar.outerWidth();
$fileTitleNavbar.stop(true, true).animate({
scrollLeft: scrollLeft
}, scrollLeft * 15, 'linear');
}, function() {
$fileTitleNavbar.stop(true, true).scrollLeft(0);
}).click(function() {
$fileTitleNavbar.stop(true, true).scrollLeft(0);
});
};
return documentTitle; return documentTitle;

7
res/styles/main.less
View File

@ -305,8 +305,9 @@ body {
font-size: 20px; font-size: 20px;
font-weight: 200; font-weight: 200;
color: @btn-success-color; color: @btn-success-color;
max-width: 320px; max-width: 280px;
overflow: hidden; overflow: hidden;
white-space: nowrap;
i { i {
margin-right: 6px; margin-right: 6px;
} }
@ -1262,6 +1263,10 @@ div.jGrowl {
.ui-layout-toggler { .ui-layout-toggler {
display: none !important; display: none !important;
} }
.navbar .file-title-navbar {
max-width: 500px;
}
} }
/******************* /*******************