ted/su-collab
ted
/
su-collab
1
0
Fork 0
Code Pull Requests Activity

remove annotation update events

This commit is contained in:
red 2023-10-02 14:03:04 +01:00
parent 830f36787b
commit 61fafc6a85
8 changed files with 181 additions and 175 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
.gitignore vendored
View File

@ -1,3 +1,4 @@
.idea
image/image.txt image/image.txt
image/dzi image/dzi
image/dzi_edited image/dzi_edited

2
README.md
View File

@ -9,4 +9,6 @@ uses
1. https://github.com/Deprecator16/OpenSeadragonSmartScrollZoom/ 1. https://github.com/Deprecator16/OpenSeadragonSmartScrollZoom/
2. https://github.com/openseadragon/openseadragon 2. https://github.com/openseadragon/openseadragon
3. https://github.com/annotorious/annotorious-openseadragon 3. https://github.com/annotorious/annotorious-openseadragon
1. https://github.com/wattapik/recogito-client-core
2. ^ you have to build the above with the recogito core i have here
4. https://github.com/VoidVolker/MagickSlicer 4. https://github.com/VoidVolker/MagickSlicer

34
image/script/generate_annotations.py
View File

@ -1,25 +1,21 @@
import json import json
import uuid import uuid
import requests import aiohttp
import asyncio
def get_post_data(folder_name): async def get_post_data(session, folder_name):
url = f"https://sketchersunited.org/posts/{folder_name.split('by')[0]}" url = f"https://sketchersunited.org/posts/{folder_name.split('by')[0]}"
headers = {"Accept": "text/json"} headers = {"Accept": "text/json"}
response = requests.get(url, headers=headers) async with session.get(url, headers=headers) as response:
if response.status_code == 200: if response.status == 200:
return response.json() return await response.json()
return None return None
with open('image.txt', 'r') as file: async def process_line(session, line):
lines = file.readlines()
annotations = []
for line in lines:
folder_name, x, y, _, _, _ = line.strip().split() folder_name, x, y, _, _, _ = line.strip().split()
annotation_id = str(uuid.uuid4()) annotation_id = str(uuid.uuid4())
post_data = get_post_data(folder_name) post_data = await get_post_data(session, folder_name)
if post_data: if post_data:
annotation_text = f'🖼️ <a href="https://sketchersunited.org/posts/{post_data["post"]["id"]}">{post_data["post"]["title"]}</a> <br>👤 <a href="https://sketchersunited.org/users/{post_data["post"]["profile"]["id"]}">@{post_data["post"]["profile"]["username"]}</a>' annotation_text = f'🖼️ <a href="https://sketchersunited.org/posts/{post_data["post"]["id"]}">{post_data["post"]["title"]}</a> <br>👤 <a href="https://sketchersunited.org/users/{post_data["post"]["profile"]["id"]}">@{post_data["post"]["profile"]["username"]}</a>'
else: else:
@ -44,10 +40,22 @@ for line in lines:
} }
} }
annotations.append(annotation)
print(f"Appended annotation for {folder_name}") print(f"Appended annotation for {folder_name}")
return annotation
async def main():
annotations = []
async with aiohttp.ClientSession() as session:
with open('image.txt', 'r') as file:
lines = file.readlines()
tasks = [process_line(session, line) for line in lines]
annotations = await asyncio.gather(*tasks)
with open('../annotations/annotations.w3c.json', 'w') as output_file: with open('../annotations/annotations.w3c.json', 'w') as output_file:
json.dump(annotations, output_file, indent=2) json.dump(annotations, output_file, indent=2)
print("Annotations JSON file created.") print("Annotations JSON file created.")
# Run the asynchronous code
asyncio.run(main())

20
index.html
View File

@ -35,7 +35,12 @@
<script src="script/openseadragon/openseadragon-annotorious.min.js"></script> <script src="script/openseadragon/openseadragon-annotorious.min.js"></script>
</head> </head>
<body> <body>
<div id = "container>">
<div id="viewer"></div> <div id="viewer"></div>
<div id = "mobile-banner">
<img src = "image/banner.png">
</div>
</div>
<!-- MODAL --> <!-- MODAL -->
<div id="modal-overlay"></div> <div id="modal-overlay"></div>
@ -54,14 +59,15 @@
<br>The shape won't seem very evident at the beginning, however as more submissions are made the more we can approximate the shape. <br>The shape won't seem very evident at the beginning, however as more submissions are made the more we can approximate the shape.
<br>You can use the view here to look at the submitted artworks and view the construction of the collaborative Sketchers United logo. <br>You can use the view here to look at the submitted artworks and view the construction of the collaborative Sketchers United logo.
<br> <br>
<br>We aim to update the view every few days with the newest submissions.</p> <br>We aim to update the view every day with the newest submissions.
<br>The more submissions we get, the higher the resolution of the logo we can build, meaning the better it looks!</p>
<h2>🌐 How do I use this page?</h2> <h2>🌐 How do I use this page?</h2>
<p>Use either the mouse wheel or your fingers to zoom in and out of the view. <p>Use either the mouse wheel or your fingers to zoom in and out of the view.
<br> (Not yet implemented) You can tap on the image to see who drew it and get a link to the post. <br>You can tap on the image to see who drew it and get a link to the post.
<br> <br>
<br>ℹ️ The view may get somewhat laggy on a mobile device. For the best experience use a desktop computer. <br>ℹ️ The view may get somewhat laggy on a mobile device.
<br>This is unavoidable due to the number of images downloaded and shown. <br>This is unavoidable due to the number of images downloaded and shown. For the best experience use a desktop computer.
<br>It may also fail to load images correctly on Chrome on newer versions of Android, leading to the page freezing. In this case, use the Firefox browser or a desktop computer. <br>It may also fail to load images correctly on Chrome on newer versions of Android, leading to the page freezing. In this case, use the Firefox browser or a desktop computer.
<h2>☝️ How do I join?</h2> <h2>☝️ How do I join?</h2>
@ -72,7 +78,7 @@
<br>You are allowed to submit more than one entry if you are working with friends to submit a collaborative entry. <br>You are allowed to submit more than one entry if you are working with friends to submit a collaborative entry.
<br>For example, you can submit an entry with only your own artwork, and then submit another entry which contains your work and the work of others that was created collaboratively. <br>For example, you can submit an entry with only your own artwork, and then submit another entry which contains your work and the work of others that was created collaboratively.
<p><b>⚠️ Make sure that it is square and at least 1000 pixels wide and high.</b> <p><b>⚠️ Make sure that it is square and exactly 1000 pixels wide and high. Also turn on the "download" option for the image whilst posting it.</b>
<br>We will be using all of the entries where possible, which means if your entry does not fit these requirements it will be cropped and upscaled, which may be destructive to your art.</p> <br>We will be using all of the entries where possible, which means if your entry does not fit these requirements it will be cropped and upscaled, which may be destructive to your art.</p>
<h2>💌 Who can I contact about this?</h2> <h2>💌 Who can I contact about this?</h2>
@ -87,7 +93,7 @@
<!-- USER INDICATOR --> <!-- USER INDICATOR -->
<div id="here-now"> <div id="here-now">
🌈<b class = "rainbow"> Here now:</b> <span id="clientCount">0</span> 🌈<b class = "rainbow"> Here now:</b> <span id="clientCount">Loading...</span>
</div> </div>
<!--- OPEN MODAL BUTTON --> <!--- OPEN MODAL BUTTON -->
@ -97,6 +103,8 @@
</div> </div>
</a> </a>
<!--- SCRIPTS --> <!--- SCRIPTS -->
<script src="script/modal.js"></script> <script src="script/modal.js"></script>
<script src="script/live.js"></script> <script src="script/live.js"></script>

23
script/annotations.js
View File

@ -4,27 +4,4 @@ anno.escape = false;
anno.loadAnnotations('annotations/annotations.w3c.json'); anno.loadAnnotations('annotations/annotations.w3c.json');
let annotationText = "" let annotationText = ""
function renderHTML()
{
const observer = new MutationObserver(() => {
const annotationTextElement = document.querySelector('.r6o-readonly-comment');
if (annotationTextElement) {
annotationTextElement.innerHTML = annotationText
observer.disconnect();
}
});
observer.observe(document.body, { childList: true, subtree: true });
}
anno.on('clickAnnotation', function(annotation, element)
{
annotationText = annotation.body[0].value
renderHTML()
});
viewer.addHandler('update-viewport', function(event)
{
renderHTML()
});

6
script/openseadragon/annotorious.min.css vendored
View File

File diff suppressed because one or more lines are too long

32
script/openseadragon/openseadragon-annotorious.min.js vendored
View File

File diff suppressed because one or more lines are too long

32
style.css
View File

@ -61,6 +61,10 @@ a {
color: white; color: white;
padding: 15px; padding: 15px;
z-index: 2; z-index: 2;
background-color:#333;
border-radius: 1rem;
border: 3px solid white;
margin: 5pt;
} }
#question { #question {
@ -170,12 +174,40 @@ a {
cursor: pointer; cursor: pointer;
} }
#mobile-banner {
display:none;
}
@media screen and (max-width: 1081px) and (-webkit-min-device-pixel-ratio: 2) { @media screen and (max-width: 1081px) and (-webkit-min-device-pixel-ratio: 2) {
#viewer { #viewer {
width: 100vw; width: 100vw;
height: 66vh; height: 66vh;
border-bottom: 3px white solid;
} }
#modal-content { #modal-content {
font-size: 20pt; font-size: 20pt;
} }
#container {
display: flex;
height: 100vh;
align-items: center;
justify-content: center;
}
#mobile-banner {
display: flex;
justify-content: center;
align-items: center;
box-sizing: border-box;
height: 27vh;
overflow: hidden;
background-color: #444;
}
#mobile-banner img {
max-width: 90%;
max-height: 100%;
}
} }