| 1 |
<!doctype html> |
| 2 |
<html lang="en"> |
| 3 |
<head> |
| 4 |
<meta charset="utf-8"> |
| 5 |
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| 6 |
<title>swtr - the canonical sweet web app</title> |
| 7 |
|
| 8 |
<meta name="description" content="Sweet Maker, Social, Semantic, Web, Decentralized, Makes Sweet, Sweet Swagger"> |
| 9 |
<link href="{{ url_for('static', filename='css/bootstrap.min.css') }}" rel="stylesheet"> |
| 10 |
<link href="{{ url_for('static', filename='css/bootstrap-theme.min.css') }}" rel="stylesheet"> |
| 11 |
<link href="{{ url_for('static', filename='css/annotorious.css') }}" rel="stylesheet"> |
| 12 |
<link href="{{ url_for('static', filename='css/swtmaker.css') }}" rel="stylesheet"> |
| 13 |
<link rel="stylesheet" href="{{ url_for('static', filename='css/bootstrap-tags.css') }}" type="text/css" media="screen" /> |
| 14 |
</head> |
| 15 |
|
| 16 |
<body> |
| 17 |
<div id="swt-maker" class="container"> |
| 18 |
<!-- first row: helpview and sign in button --> |
| 19 |
<div class="row"> |
| 20 |
<!-- helpview column of width md-8 --> |
| 21 |
<div class="col-md-8"> |
| 22 |
<div id="helpview" class="alert alert-info"></div> |
| 23 |
</div> |
| 24 |
<!-- signin view column of width md-4 --> |
| 25 |
<div class="col-md-4"> |
| 26 |
<div id="signinview"> |
| 27 |
<span id="signin-msg">You are not signed in.</span> |
| 28 |
<button class="btn btn-sm btn-primary" id="sign-in"> |
| 29 |
Sign In |
| 30 |
</button> |
| 31 |
</div> |
| 32 |
</div> |
| 33 |
</div> <!-- end first row --> |
| 34 |
<!-- second row: image URL input box and Load button --> |
| 35 |
<div class="row"> |
| 36 |
<div class="col-md-8"> |
| 37 |
<form class="form-inline" role="form"> |
| 38 |
<div class="form-group col-md-11"> |
| 39 |
<label class="sr-only" for="img-url-input">Enter URL of the image</label> |
| 40 |
<input class="form-control" type="text" |
| 41 |
placeholder="Enter URL of the image or web page" id="img-url-input"> |
| 42 |
</div> |
| 43 |
<button type="submit" class="btn btn-primary" id="img-url-load">Load</button> |
| 44 |
</form> |
| 45 |
</div> |
| 46 |
<div class="col-md-4"> |
| 47 |
</div> |
| 48 |
</div> <!-- end second row --> |
| 49 |
<!-- third row - control panel? --> |
| 50 |
<div class="row"> |
| 51 |
<div class="col-md-3"> |
| 52 |
<input id="setbox" type="checkbox"/> |
| 53 |
<label id="setcontrol" for="setbox">Show annotated areas</label> |
| 54 |
</div> |
| 55 |
<div class="col-md-1"> |
| 56 |
<button class="btn btn-default" id="sweet">Sweet</button> |
| 57 |
</div> |
| 58 |
</div> <!-- end third row -- > |
| 59 |
<!-- fourth row: the image annotation window --> |
| 60 |
<div class="row"> |
| 61 |
<div id="img-annotation-wrapper" class="col-md-12 col-xs-12 col-lg-12 col-sm-12 well"> |
| 62 |
{% if url %} |
| 63 |
<img src="{{ url }}" id="annotatable-img" class="img-responsive"> |
| 64 |
{% else %} |
| 65 |
<img src="" id="annotatable-img" class="img-responsive"> |
| 66 |
{% endif %} |
| 67 |
</div> |
| 68 |
</div> <!-- end fourth row --> |
| 69 |
|
| 70 |
<div id="sweet-list-wrapper"> |
| 71 |
<ul id="sweet-list"></ul> |
| 72 |
<div class="btn-grp"> |
| 73 |
<button class="btn btn-default" id="sweet-cancel">Cancel</button> |
| 74 |
<button class="btn btn-primary" id="post-sweet">Sweet</button> |
| 75 |
</div> |
| 76 |
</div> |
| 77 |
</div> |
| 78 |
<div id="app-overlay"></div> |
| 79 |
|
| 80 |
<script> |
| 81 |
window.swtr = window.swtr || {}; |
| 82 |
swtr.swtstoreURL = function() { return '{{ config.swtstoreURL }}'; } |
| 83 |
swtr.endpoints = { |
| 84 |
'get': '/api/sweets/q', |
| 85 |
'post': '/api/sweets', |
| 86 |
'auth': '/oauth/authorize', |
| 87 |
'login': '/auth/login', |
| 88 |
'logout': '/auth/logout' |
| 89 |
}; |
| 90 |
swtr.access_token = '{{ access_token }}'; |
| 91 |
swtr.refresh_token = '{{ refresh_token }}'; |
| 92 |
swtr.app_id = '{{ config.app_id }}'; |
| 93 |
swtr.app_secret = '{{ config.app_secret }}'; |
| 94 |
swtr.oauth_redirect_uri = '{{ config.redirect_uri }}'; |
| 95 |
window.onload = function() { |
| 96 |
swtr.init(); |
| 97 |
}; |
| 98 |
</script> |
| 99 |
<script src="{{ url_for('static', filename='js/lib/jquery-1.10.2.min.js') }}"></script> |
| 100 |
<script src="{{ url_for('static', filename='js/lib/bootstrap.min.js') }}"></script> |
| 101 |
<script src="{{ url_for('static', filename='js/lib/underscore-1.5.2.min.js') }}"></script> |
| 102 |
<script src="{{ url_for('static', filename='js/lib/backbone-1.0.0.min.js') }}"></script> |
| 103 |
<script src="{{ url_for('static', filename='js/lib/annotorious.debug.js') }}"></script> |
| 104 |
<script src="{{ url_for('static', filename='js/lib/custom-fields-plugin.js') }}"></script> |
| 105 |
<script src="{{ url_for('static', filename='js/oauth.js') }}"></script> |
| 106 |
<script type="text/javascript" src="{{ url_for('static', filename='js/lib/bootstrap-tags.min.js') }}"></script> |
| 107 |
<script src="{{ url_for('static', filename='js/swtmaker.js') }}"></script> |
| 108 |
|
| 109 |
<script type="text/template" id="sweet-template"> |
| 110 |
<li class="sweet"> |
| 111 |
<a href="#">@<%= who %></a> <strong>#<%= what %></strong> |
| 112 |
/<a href="<%= where %>"><%= where.substr(0, 30) + '...' %></a> |
| 113 |
<p><%= how %></p> |
| 114 |
</li> |
| 115 |
</script> |
| 116 |
<script type="text/template" id="dropdown-template"> |
| 117 |
<div id="tags-input"></div> |
| 118 |
<select class="form-control" id="custom-dropdown"> |
| 119 |
<option value="comment" selected>Comment</option> |
| 120 |
<option value="title" >Title</option> |
| 121 |
<option value="tags">Tags</option> |
| 122 |
<option value="link">Link</option> |
| 123 |
</select> |
| 124 |
</script> |
| 125 |
<!-- script type="text/template" id="dropdown-template"> |
| 126 |
<form class="form-control" id="custom-dropdown"> |
| 127 |
<textarea class="annotorious-editor-text goog-textarea" |
| 128 |
placeholder="Add Label" id="label"></textarea> |
| 129 |
<textarea class="annotorious-editor-text goog-textarea" |
| 130 |
placeholder="Add Tags" id="tags"></textarea> |
| 131 |
<textarea class="annotorious-editor-text goog-textarea" |
| 132 |
placeholder="Add Links" id="links"></textarea> |
| 133 |
</form> |
| 134 |
</script--> |
| 135 |
<script type="text/template" id="popup-template"> |
| 136 |
<span class="annotorious-popup-text"> |
| 137 |
<ul class="custom-style-popup"> |
| 138 |
<li class="custom-popup-line" ><span>Title: </span><%= Label %></li> |
| 139 |
<li class="custom-popup-line"><span>Comment: </span><%= Comment %></li> |
| 140 |
<li class="custom-popup-line"><span>Tags: </span><%= Tags %></li> |
| 141 |
<li class="custom-popup-line"><span>Related Links: </span><%= Links %></li> |
| 142 |
</ul> |
| 143 |
</span> |
| 144 |
</script> |
| 145 |
</body> |
| 146 |
</html> |
