github/overleaf
1
0
Fork 0
mirror of https://github.com/overleaf/overleaf.git synced 2024-09-16 02:52:31 -04:00
Code Issues Projects Releases Packages Wiki Activity

Basic mark-up and styles. Change the controller to hold all notifications.

Browse source
This commit is contained in:
Paulo Reis 2016-11-29 17:12:53 +00:00
parent 4b59fdd453
commit 73e0a63689
3 changed files with 81 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
services/web/app/views/project/list.jade
View file

@ -22,9 +22,21 @@ block content
.content.content-alt(ng-controller="ProjectPageController")
.container
//- div(ng-controller="AnnouncementsController", ng-cloak)
//- .alert.alert-success(ng-show="dataRecived")
//- a(href, ng-click="openLink()") {{title}} and {{totalAnnouncements}} others
div(
ng-controller="AnnouncementsController"
ng-cloak
)
.announcements(ng-if="announcements.length")
span.announcements-badge {{ announcements.length }}
.announcements-body
.announcement(
ng-repeat="announcement in announcements"
)
a.announcement-title(href, ng-click="openLink()") {{ announcement.title }}
p.announcement-description {{ announcement.excerpt }}
//- .card.card-thin(ng-show="dataReceived")
//- a.announcement-title(href, ng-click="openLink()") {{ title }}
//- p.announcement-description {{ excerpt }}
.row(ng-cloak)
span(ng-if="projects.length > 0")

24
services/web/public/coffee/main/announcements.coffee
View file

@ -2,19 +2,19 @@ define [
"base"
], (App) ->
App.controller "AnnouncementsController", ($scope, $http, event_tracking, $window) ->
$scope.announcements = []
$scope.dataRecived = false
announcement = null
$http.get("/announcements").success (announcements) ->
if announcements?[0]?
announcement = announcements[0]
$scope.title = announcement.title
$scope.totalAnnouncements = announcements.length
$scope.dataRecived = true
refreshAnnouncements = ->
$http.get("/announcements").success (announcements) ->
$scope.announcements = announcements
dismissCurrentAnnouncement = ->
event_tracking.sendMB "announcement-alert-dismissed", { blogPostId:announcement.id }
dismissannouncement = ->
event_tracking.sendMB "announcement-alert-dismissed", {blogPostId:announcement.id}
refreshAnnouncements()
$scope.openLink = ->
dismissannouncement()
$window.location.href = announcement.url
dismissCurrentAnnouncement()
.then(refreshAnnouncements)
$window.open = announcement.url

54
services/web/public/stylesheets/app/project-list.less
View file

@ -1,3 +1,14 @@
@announcements-shadow: 0 2px 4px 1px rgba(0, 0, 0, 0.2);
@keyframes pulse {
0% {
opacity: .7;
}
100% {
opacity: .9;
}
}
.project-header {
.btn-group > .btn {
padding-left: @line-height-base / 2;
@ -293,3 +304,46 @@ ul.project-list {
margin-left:-100px;
}
}
.announcements {
position: absolute;
bottom: 100px;
right: 100px;
width: 80px;
height: 80px;
background: url(/img/lion-128.png) no-repeat center/80% white;
border-radius: 50%;
box-shadow: @announcements-shadow;
z-index: 1;
}
.announcements-badge {
display: inline-block;
position: absolute;
font-size: 11px;
height: 1.8em;
min-width: 1.8em;
border-radius: 0.9em;
line-height: 1.8;
padding: 0 2px;
top: 1px;
right: 1px;
font-weight: bold;
color: #FFF;
background-color: @red;
vertical-align: baseline;
white-space: nowrap;
text-align: center;
animation: pulse 1s alternate infinite;
}
.announcements-body {
position: absolute;
right: 0;
bottom: 80px;
width: 500px;
min-height: 100px;
background: #FFF;
box-shadow: @announcements-shadow;
border-radius: 10px;
}