Skip to main content
Topic: showcase coming soon (Read 3087 times) previous topic - next topic
0 Members and 1 Guest are viewing this topic.

showcase coming soon

I'm probably a couple of months away from a showcase but I wanted to post an update here that I'm still:
  • converting the default template to RDFa using schema.org's ontology and sharing it here. (i have most of that done, btw)
  • implementing my asComments feature idea on 50,000+ page webiste
    • I'm auto-generating topics for each page of the website, then cron jobbing it
    • allow commenting on my 50,000+ pages
    • saving comments to each auto-generated topic as replies
    • query the forum's db for replies to include as schema.org: Comments, Questions & Answers on each of my 50,000+ data-rich, semantic RDFa webpages

Dude I can't wait to get out of the sandbox with this project. I have zero aesthetic distance from it (I'm completely engrossed) but according to the two others whom have seen it they agree, this is disruptive technology.

Btw, I believe I read somewhere here that someone was working on pretty URLs, any update on that project?

Re: showcase coming soon

Reply #1
Keep us updated and good luck with your project!
sorry for my bad english

Re: showcase coming soon

Reply #2
Really looking forward to the showcase :D
Squish squish. squish, squish, squish.
Find a bug,
Make a wish.

Re: showcase coming soon

Reply #3
Nice, will be good to see what you achieve.


Re: showcase coming soon

Reply #5
Btw, I believe I read somewhere here that someone was working on pretty URLs, any update on that project?
Not completed, nor that much tested:
https://github.com/elkarte/Elkarte/pull/3246
but still merged into 2.0. xD


Every page of my project has a pretty URL, I've even worked a logic for using user-submitted titles in URLs, 4,200 test cases and no problems --in English. I'm going to internationalize it when I have a moment to focus on it.  I've already had some Swedish words and French names with special-characters appear in my URLs, currently I'm filtering them for the URL (yet still using them in the title). Anyway, I'll probably end up modifying for pretty URLs for the forum pages too.  Anyway, my update. I haven't implemented the forum yet but the rest of the project is coming along fantastically. I haven't slept in a couple of months I'm so excited to make this thing happen.

Re: showcase coming soon

Reply #6
Who needs sleep :D
Squish squish. squish, squish, squish.
Find a bug,
Make a wish.

Re: showcase coming soon

Reply #7
Hi guys, I haven't implemented the forum (with comments mod) yet but I have publicly posted a link to my project so I'm sharing here too. I'm almost a third of the way finished with the project (not counting the forum+comments mod).

Features:
  • auto-syndicated content - this instance of my system (for Tim Pool) gets updated with 6 videos a day, plus the auto-generated "day page"
  • search - this is only one of 3 parts of my search feature, I also have an autosuggest feature based on the current page's content + search-input value, I should have that live in a week, and the third search ...oh you're going to love this... FULL TEXT AUDIO SEARCH, yep, so you'll be able to search, "I went to the movies last night" and get a skip-to link to that point in one of the (currently 2,228) videos
  • dude, check out those semantics (link to Google's "Structured Data Testing Tool" for the given page at the bottom of every page)- I'm not sure but I think this might be the most dense implementation of linked-data on the web but if not, it will be soon. I'm getting extremely granular with my semantic markup, down to a single quote.
  • Coming soon: CommentCorrections --exactly what every journalist's website needs, but wait, it gets better: individual instances of my system can subscribe to others from trusted sources and crowdsource their corrections. So I'm taking static, dated content and turning it into a living, evolving story (with help from other journalists via subscriptions
  • ClaimReviews - Fact Checking the right way with linked-data
  • Tags - they default to the most generic entity type, "Thing" until they're properly defined, I'm building a proper glossary with them
  • More granular semantic entities include: Quotations, Claims, Comments, Questions and Answers

That's about the gist of it.

Oh, and just look at those extremely pretty URLs:


Also, I hope you enjoy Tim's content.

Thoughts?

Re: showcase coming soon

Reply #8
Were you planning on leaving the CSS inline or is that just for testing at this point. Just curious as there are different thoughts about doing that.

That is some set of structured data, holy cow!

How are you going to implement audio search, is there a library for such a thing?
Squish squish. squish, squish, squish.
Find a bug,
Make a wish.

Re: showcase coming soon

Reply #9
Were you planning on leaving the CSS inline or is that just for testing at this point. Just curious as there are different thoughts about doing that.

That is some set of structured data, holy cow!

How are you going to implement audio search, is there a library for such a thing?

Do you mean embedded CSS in the head? Yes, I'm trying to keep the requests to a minimum. I do have a few lines of inline-CSS for creating the "thumbnails" which are actually backgrounds. I did a bit of wizardry there... I didn't want to wrap anchors around multiple elements, so I used this combination of techniques... assigned a class for the links and declared all the background declarations except the background-image for the anchor's before, then in my HTML I added an HTML5 data- attribute to the anchor, then back in the CSS, I used the attribute selector to access it on the anchor, no-repeated it and positioned it far outside of the anchor's position then used inherit on the before to display it right where I wanted it. I used a similar technique for the durations and positioned them on top of the "thumbnails", again I used the HTM5 data- attribute on the anchor, then on the attribute selector in the CSS for the anchor's after. I should probably post code samples for this technique, I've never seen anyone try all of these together before. Anyway, not only am I minimizing the elements in the page, I'm also only looping through my db results once. 

Audio search, I need the subtitle files. I'm going to create a list of extended stop-words to filter from the fulltext of each subtitle file so I can minimize the size of the column in a db table. You'll actually match on that when you search, then I'll know which subtitle file to access to return the timestamp for that phrase in the video-file, that way I can build you a skip-to link.

Did you notice the structured data is dynamic instead of static? it is depends on the current page and its relationship to ancestor elements, some of it also depends on your actions, try submitting sjsjsjdkjfdklfjslkdjf in the search then check the structured data, you'll see you've completed a SearchAction but failed at a FndAction. This gets even crazier with the autosuggest, which is a ChooseAction, as soon as you start typing I inject a ActiveActionStatus in the SearchAction, if your value in the input doesn't have a match I inject a FailedActionStatus in the ChooseAction, and so on with several other conditions between the SearchAction, ChooseAction and FindAction.  Googlebot can read rendered markup, btw. So injecting elements in with javascript like this really flexes the muscles of schema's Action entities.

..oh, and btw, the structured data I added to the forum's default template (so far) also uses the action statuses for SearchAction and FindAction.


Re: showcase coming soon

Reply #10
....I should probably post code samples for this technique...

Code: [Select]
<style>
.searchTitle a:link, .searchTitle a:visited, .searchTitle a:hover, .searchTitle a:active {
    background-position: -1000px -1000px;
    background-repeat: no-repeat;
    min-width: 280px;
    max-width: 768px;
    min-height: 140px;
    display: block;
    margin: 0 auto;
    word-wrap: break-word;
    border-radius: 5px;
    background-color: #666;
    padding: 10px 0px 10px 10px;
    color: #fff;
    text-shadow: rgba(1,6,16, 1) 2px 2px 1px;
    text-decoration: none;
    max-width: 600px;
    vertical-align: baseline;
}

.searchTitle a::before {
    background-image: inherit;
    min-width: 200px;
    min-height: 116px;
    display: inline-block;
    vertical-align: -116px;
    float: left;
    background-attachment: scroll;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 200px 156px;
    background-color: #fff;
    margin-right: 10px;
    content: " ";
}

.searchTitle a::after {
    content: attr(data-duration);
    background-color: #000;
    color: #fff;
    position: absolute;
    top: 109px;
    right: calc(100% - 210px);
    display: inline-block;
    font-size: 0.7em;
    line-height: 0.9em;
    font-weight: normal;
    padding: 2px;
    font-family: initial;
    width: auto;
    height: auto;
}

</style>
<h5 property="headline" class="searchTitle"><a property="mainEntityOfPage" href="https://weburlate.com/timcast/news/2019-05-01/Athlete-LOSES-Landmark-Legal-Case-TESTOSTERONE-Will-Be-Restricted" style="background-image:url('https://i.ytimg.com/vi/FVTCDCkKd6E/hqdefault.jpg');" data-duration="11:01">Athlete LOSES Landmark Legal Case, TESTOSTERONE Will Be Restricted</a></h5>



Re: showcase coming soon

Reply #11
Do you mean embedded CSS in the head? Yes, I'm trying to keep the requests to a minimum.
Yes that is what I was referring to.   I guess that also prevents any render blocking css.
I do have a few lines of inline-CSS for creating the "thumbnails" which are actually backgrounds. I did a bit of wizardry there... I didn't want to wrap anchors around multiple elements, so I used this combination of techniques... assigned a class for the links and declared all the background declarations except the background-image for the anchor's before, then in my HTML I added an HTML5 data- attribute to the anchor, then back in the CSS, I used the attribute selector to access it on the anchor, no-repeated it and positioned it far outside of the anchor's position then used inherit on the before to display it right where I wanted it. I used a similar technique for the durations and positioned them on top of the "thumbnails", again I used the HTM5 data- attribute on the anchor, then on the attribute selector in the CSS for the anchor's after. I should probably post code samples for this technique, I've never seen anyone try all of these together before. Anyway, not only am I minimizing the elements in the page, I'm also only looping through my db results once.
Thanks for the example and the detailed explanation, that is a good technique, I may have to use that in the future !
Did you notice the structured data is dynamic instead of static?
I'm going back to take another look at all that structured data, I had not notice it was dynamic, very cool
Squish squish. squish, squish, squish.
Find a bug,
Make a wish.

 

Re: showcase coming soon

Reply #12
Tim uploads on a schedule, I believe that schedule is about to change but lately he has been uploading 10am, 1pm, 4pm, 6pm, 6:15pm and 6:30pm. A new "day page" is generated at midnight for the next day so since there's no content there I display the BroadcastEvent schedule.  I'm also comparing the current time to the scheduled time and giving you a countdown. If the upload is late (which happens often because youtube doesn't have the metadata available immediately) then I change the BroadcastEvent's EventStatusType from EventScheduled to EventPostponed then give you a "count-up" to how late. I'm still testing this part and have it hardcoded in my template, once I've worked it all out I'll create an admin-editable db table for it.

Re: showcase coming soon

Reply #13
I had not notice it was dynamic, very cool
Now you can see an actionStatus changing depending on user-actions. Look at the current day's page:

https://weburlate.com/timcast/news/2019-05-21

"inspect element" on the "Check for New Reports" button, toggle your browser so you can view the page and the HTML in the "inspector" of your dev tools at the same time and search for the
Code: [Select]
<link id="checkActionStatus" property="actionStatus" href="https://schema.org/PotentialActionStatus" />
in the inspector. Now click the "Check for New Reports" button and you'll see the actionstatus change from "PotentialActionStatus" to "CompletedActionStatus"

attached screencap shows before and after clicking the "Check for New Reports" button.

The button of course fires a script that checks for updates from youtube. I detail all of that in the semantics in that page. The best thing about adding a schema "Action" to this button is that even Googlebot will be able to "click the button" to update the page's content, no human interpretation needed.

Re: showcase coming soon

Reply #14
These two screencaps are of the semantics involved for that "Check for New Reports" button...