Trying to tighten up the design. More functionality implemented.
This commit is contained in:
122
www/index.yaws
122
www/index.yaws
@ -20,67 +20,100 @@
|
||||
<script type="text/javascript" src="/js/ICanHaz.js"></script>
|
||||
<script type="text/javascript" src="/js/backbone.js"></script>
|
||||
<script type="text/javascript" src="/js/ts.js"></script>
|
||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
|
||||
<script type="text/javascript">
|
||||
<erl>
|
||||
out(YArg) ->
|
||||
Session = ts_api_session:get_session(YArg),
|
||||
case Session of not_logged_in -> {html, "//not logged in"}; session_expired -> {html, "//session expired"};
|
||||
_S ->
|
||||
Username = element(2, Session),
|
||||
|
||||
<script id="timelineLink" type="text/html">
|
||||
<li class="timeline-link"><a href="#">{{id}}</a></li>
|
||||
% get the user
|
||||
{content, _, UserJSON} = ts_api:get_user(YArg, Username),
|
||||
UserRecord = ts_user:lookup(Username),
|
||||
|
||||
% get the timelines
|
||||
{content, _, TimelineListJSON} = ts_api:list_timelines(YArg, Username),
|
||||
|
||||
% get the selected timeline
|
||||
SelectedTimeline = case lists:keyfind(
|
||||
selected_timeline, 1, element(8, UserRecord)) of
|
||||
false -> ts_timeline:list(Username, 0, 1);
|
||||
T -> T
|
||||
end,
|
||||
|
||||
% get entries for this timeline
|
||||
{content, _, EntryListJSON} =
|
||||
ts_api:list_entries(YArg, Username, SelectedTimeline),
|
||||
|
||||
{html, f(
|
||||
"function bootstrap() {~n"
|
||||
" var data = {};~n"
|
||||
" data.user = ~p;~n"
|
||||
" data.timelines = ~p;~n"
|
||||
" data.initialTimelineId = ~p;~n"
|
||||
" data.entries = ~p;~n"
|
||||
" return data;~n"
|
||||
"};",
|
||||
[UserJSON, TimelineListJSON, SelectedTimeline, EntryListJSON])}
|
||||
end.
|
||||
</erl>
|
||||
</script>
|
||||
<script id="entry" type="text/html">
|
||||
<div class="entry">
|
||||
<div class="mark">{{mark}}</div>
|
||||
<input class="mark-input" type="text">{{mark}}</input>
|
||||
<div class="timestamp">{{timestamp}}</div>
|
||||
<input class="timestamp-input" type="text">{{timestamp}}</input>
|
||||
<div class="duration">4<span class="tick-tock">:</span>03<span class="tick-tock">:</span>57</div>
|
||||
<div class="notes">{{notes}}</div>
|
||||
</div>
|
||||
</script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<div id="top">
|
||||
<div id="timeline">
|
||||
<span class="timeline-desc">No timeline loaded.</span>
|
||||
<input class="timeline-desc-input" type="text"/>
|
||||
<div class="drop-menu">
|
||||
<div class="timeline-id">( none )</div>
|
||||
<input class="timeline-id-input" type="text"/>
|
||||
<ul class="drop-menu-items">
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="user">
|
||||
<div class="fullname">Not Logged In</div>
|
||||
<input class='fullname-input' type='text'/>
|
||||
<script type="text/html" id="userTemplate">
|
||||
<div class="fullname">{{name}}</div>
|
||||
<input class='fullname-input' type='text' value='{{name}}'/></div>
|
||||
<div class='drop-menu'>
|
||||
<div class="username"> - not_logged_in</div>
|
||||
<div class="username"> - {{id}}</div>
|
||||
<ul class="drop-menu-items">
|
||||
<li><a href="#">logout</a></li>
|
||||
<li><a href="#">user info</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</script>
|
||||
<script type="text/html" id="timelineTemplate">
|
||||
<span class="timeline-desc">{{description}}</span>
|
||||
<input class="timeline-desc-input" type="text" value='{{description}}'/>
|
||||
<div class="drop-menu">
|
||||
<div class="timeline-id">( {{id}} )</div>
|
||||
<input class="timeline-id-input" type="text" value='{{id}}'/>
|
||||
<ul class="drop-menu-items">
|
||||
</ul>
|
||||
</div>
|
||||
</script>
|
||||
<script type="text/html" id="timelineLinkTemplate">
|
||||
<li class="timeline-link"><a href="#">{{id}}</a></li>
|
||||
</script>
|
||||
<script type="text/html" id="entryTemplate">
|
||||
<div class="mark">{{mark}}</div>
|
||||
<input class="mark-input" type="text" value="{{mark}}"/>
|
||||
<div class="timestamp">{{timestamp}}</div>
|
||||
<input class="timestamp-input" type="text" value="{{timestamp}}"/>
|
||||
<!-- TODO <div class="duration">4<span class="tick-tock">:</span>03<span class="tick-tock">:</span>57</div>-->
|
||||
<div class="notes">{{notes}}</div>
|
||||
</script>
|
||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<div id="top">
|
||||
|
||||
<!-- == TIMELINE == -->
|
||||
<div id="timeline"><!-- rendered by app --></div>
|
||||
|
||||
<!-- == USER == -->
|
||||
<div id="user"><!-- rendered by app --></div>
|
||||
|
||||
</div>
|
||||
|
||||
<div id="entry-list">
|
||||
<div class="day-seperator">Today</div>
|
||||
<div id="new-entry">
|
||||
<input id="new-entry-input" class="mark-input"
|
||||
placeholder="Start a new task..." type="text" />
|
||||
</div>
|
||||
|
||||
<div id="entries">
|
||||
<div class="entry">
|
||||
<div class="mark">ITHelp: Entering tickets.</div>
|
||||
<input class="mark-input" type="text"/>
|
||||
<div class="timestamp">12:32</div>
|
||||
<input class="timestamp-input" type="text"/>
|
||||
<div class="duration">4<span class="tick-tock">:</span>03<span class="tick-tock">:</span>57</div>
|
||||
<div class="notes">Some notes should go here, but they should be hidden by default</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="entries"></div>
|
||||
</div>
|
||||
|
||||
<div class="footer">
|
||||
@ -100,6 +133,7 @@
|
||||
</form>
|
||||
<p class="validate-tips"></p>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
Reference in New Issue
Block a user