<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <link rel="stylesheet" href="/static/css/semantic.min.css">
	<link rel="stylesheet" href="/static/css/util.css">
	<script src="/static/js/jquery.min.js"></script>
    <script src="/static/js/semantic.min.js"></script>
	<title>看日记 - 快乐的一天 - 记了</title>
  </head>
  <body>
    <div class="ui fluid container">
		<div class="wrap ui form  ">
		<a class="ui orange right ribbon label " style="left: calc(100% + 1.2em + 0.1em);top:28px; position: absolute;padding-left:8px;width:90px;z-index: 1000;" data-variation="inverted" >{{.day}}</a>

			<div class="body-input ui fluid container" style="margin-left:0!important;margin-right:0!important;" >
				<div class="body-input-body" >
					<div class="body-input-body-head" >
					{{if gt .info.WeatherIcon 0 }}<img class="ui image" height="48" style="position: absolute;left: 40px;top: 15px;" src="/static/img/weather/{{.info.WeatherIcon}}.png" >{{end}}
					</div>
					<div id="note" class="text" >{{str2html .info.Note}}</div>
				</div>
			</div>
			<div class="btn-body " >
				<button class="btn-cancel " hidefocus="true" onclick="location.href='/'" ></button>
			</div>
			
		</div>

		<div class="msg-body"  style="display:none" id="tipBox" >
			<div class="ui small message"  id="tipBoxBg" style="opacity:0.9" >
			  <i class="close icon"></i>
			  
			  <div class="header"><i class="notched circle loading icon" id="tipBoxIcon" ></i><span id="tipBoxTitle"></span> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div>
			</div>
		</div>

	</div>

	<div id="noteOrg" style="display:none">{{str2html .info.Note}}</div>

	<script src="/static/js/util.js"></script>
	<script src='/static/js/umeditor/umeditor.config.js'></script>
	<script src='/static/js/umeditor/umeditor.min.js'></script>
	<script>

		var myeditor = UM.getEditor('note', {
				toolbar:[ ],
				readonly : true,
				focus: true
		});

		myeditor.addListener( 'ready', function( editor ) {
			 myeditor.execCommand( 'focus' ); 
			 $('.edui-container').css('position','relative');
			 
			 var html = $('#noteOrg').html();
			 if (html){
				 myeditor.setContent($('#noteOrg').html());
			 }

		 } );
	</script>
	
	<link href="/static/lib/css/nanoscroller.css" rel="stylesheet">
	<link href="/static/lib/css/emoji.css" rel="stylesheet">
	<script src="/static/lib/js/nanoscroller.min.js"></script>
	<script src="/static/lib/js/tether.min.js"></script>
	<script src="/static/lib/js/config.js"></script>
	<script src="/static/lib/js/util.js"></script>
	<script src="/static/lib/js/jquery.emojiarea.js"></script>
	<script src="/static/lib/js/emoji-picker.js"></script>

	<script>
	$(function() {
	  window.emojiPicker = new EmojiPicker({
		icon_id : '#smilePicker',
        emojiable_selector: '#note',
		assetsPath: '/static/lib/img/',
		insertCall: function(msg){
			myeditor.execCommand('inserthtml', 	msg.outerHTML );
		}
	  });
	  window.emojiPicker.discover();

	});
	</script>

	
  </body>
</html>