norfolkjs / norfolkjs.github.io

Website code for Norfolk.js
http://www.norfolkjs.org
12 stars 19 forks source link

Html encoding in event descriptions #66

Closed lynnaloo closed 9 years ago

lynnaloo commented 10 years ago

Need to change the events page so that the html tags instead of the meetup descriptions aren't shown as plain text:

This year we're going to be partnering with 757 Makerspace to celebrate International NodeBots Day (7/27)

qwo commented 10 years ago

Oops, just noticed this, ill fix it.

The meetup text just blobs the whole description out there and I was meaning to fix it. Anytime we use formatting, tags, bullets, links meetup blobs it.

we're using jquery, ill find maybe a plugin that could

jalbertbowden commented 10 years ago

how about parsing the events and outputting hcal events? meetup won't give you each line by line?

qwo commented 10 years ago

Hi @jalbertbowden here a sample dump of what a returned result looks like this but i would also check the /2/events meetup api but we're just using the 'event.description', maybe theres a better data point in the api. http://www.meetup.com/meetup_api/docs/2/event/#edit

This is where some hacking needs to be done.. https://github.com/norfolkjs/norfolkjs.github.io/blob/master/javascripts/events.js#L15-24

including json sample

[{
    "status": "upcoming",
    "visibility": "public",
    "maybe_rsvp_count": 0,
    "venue": {
        "id": 20494362,
        "lon": -76.285851,
        "repinned": false,
        "name": "O'Connor Brewing Co.",
        "state": "VA",
        "address_1": "211 W. 24th Street",
        "lat": 36.870041,
        "city": "Norfolk",
        "country": "us"
    },
    "id": "dsrsrjyskbfc",
    "utc_offset": -14400000,
    "time": 1406152800000,
    "waitlist_count": 0,
    "announced": true,
    "updated": 1404792784000,
    "yes_rsvp_count": 15,
    "created": 1401825340000,
    "event_url": "http://www.meetup.com/NorfolkJS/events/186938182/",
    "description": "<p>It's time again to get together for another Beer.js! This time, we'll be meeting at the new location of Norfolk's <a href=\"http://www.oconnorbrewing.com/\">O'Connor brewery</a>.</p> <p>Due to the brewery hours, this meetup will be on a Wednesday evening instead of our usual Monday evening. There will be wi-fi at the new location, so feel free to bring your laptop and do some hacking while you enjoy the beer.</p> <p>Also, if you're concerned about a safe ride home, don't forget to use our sponsor <a href=\"http://www.lyft.com\">Lyft</a>! </p>",
    "how_to_find_us": "Take note of the address because this is O'Connor's NEW location!",
    "name": "Beer.js - Enjoy JavaScript and Beer!",
    "headcount": 0,
    "group": {
        "id": 11012852,
        "group_lat": 36.86000061035156,
        "name": "NorfolkJS",
        "group_lon": -76.30000305175781,
        "join_mode": "approval",
        "urlname": "NorfolkJS",
        "who": "js ninjas"
    }
}, {
    "rsvp_limit": 60,
    "status": "upcoming",
    "visibility": "public",
    "maybe_rsvp_count": 0,
    "venue": {
        "id": 14851682,
        "zip": "23517",
        "lon": -76.290543,
        "repinned": false,
        "name": "757 Makerspace",
        "state": "VA",
        "address_1": "421 W. 22nd Street",
        "lat": 36.869335,
        "city": "Norfolk",
        "country": "us"
    },
    "id": "187172562",
    "utc_offset": -14400000,
    "duration": 25200000,
    "time": 1406383200000,
    "waitlist_count": 0,
    "announced": true,
    "updated": 1405297786000,
    "yes_rsvp_count": 15,
    "created": 1401913854000,
    "event_url": "http://www.meetup.com/NorfolkJS/events/187172562/",
    "description": "<p>This year we're going to be partnering with <a href=\"http://www.757makerspace.com\">757 Makerspace</a> to celebrate &lt;a&gt;International NodeBots Day (7/27)&lt;/a&gt; by building JavaScript-powered robots!</p> <p>Don't know what a NodeBot is? Check out the <a href=\"http://nodebots.io/projects.html\">gallery</a>!</p> <p>Beginners, experienced makers, and families are all welcome to attend. </p> <p>Come to spectate, learn about robotics, or join a group to make a JavaScript-powered <a href=\"http://sumobotkit.com/\">SumoBot</a>. If you have a different NodeBots project you'd like to work on, bring your materials and we'll help you build it during the event.</p> <p>At 5pm, all makers and developers will show off their NodeBot-building skills with a \"Battle of the Bots!\"</p> <p>We'll be providing refreshments and giving out some swag and raffle prizes from our sponsors!</p> <p>Sponsored by <a href=\"http://www.757makerspace.com\">757 Makerspace</a>, <a href=\"http://www.github.com\">Github</a>, <a href=\"http://www.thisisgrow.com\">Grow Interactive</a>, <a href=\"http://www.sendgrid.com\">SendGrid</a>, <a href=\"http://www.carrynorfolk.com\">Carry Norfolk</a>, <a href=\"http://www.bocoup.com\">Bocoup</a>, <a href=\"http://madebysway.com/\">Sway Creative</a>, and <a href=\"http://www.hybridsoftware.com\">Hybrid Software</a>. </p> <p>Want to sponsor a robot kit for the robot battle? Contact one of the <a href=\"http://www.meetup.com/NorfolkJS/members/?op=leaders\">organizers</a>!</p>",
    "name": "International NodeBots Day",
    "headcount": 0,
    "group": {
        "id": 11012852,
        "group_lat": 36.86000061035156,
        "name": "NorfolkJS",
        "group_lon": -76.30000305175781,
        "join_mode": "approval",
        "urlname": "NorfolkJS",
        "who": "js ninjas"
    }
}, {
    "rsvp_limit": 12,
    "status": "upcoming",
    "visibility": "public",
    "maybe_rsvp_count": 0,
    "venue": {
        "id": 19806822,
        "lon": -76.288292,
        "repinned": false,
        "name": "Sushi King",
        "state": "VA",
        "address_1": "420 Monticello Ave",
        "lat": 36.851135,
        "city": "Norfolk",
        "country": "us"
    },
    "id": "191861242",
    "utc_offset": -14400000,
    "time": 1408549500000,
    "waitlist_count": 0,
    "announced": false,
    "updated": 1403990981000,
    "yes_rsvp_count": 1,
    "created": 1403990966000,
    "event_url": "http://www.meetup.com/NorfolkJS/events/191861242/",
    "description": "<p>SushiJS: Talk JavaScript, Tech and Enjoy Sushi.</p> <p>SushiJS: Bringing together Norfolk JavaScript developers through sushi and conversation</p> <p>The venue has round tables, easy on conversation and $12 lunch specials.  </p> <p>Monthly Meetup Every Third Wednesday for Lunch Tentatively.</p> <p>Join Us.<br/><a href=\"https://github.com/norfolkjs/norfolk-va-usa\" class=\"linkified\">https://github.com/norfolkjs/norfolk-va-usa</a></p> <p>Got feedback or Questions? (A Better time? Favorite Place?)</p> <p>Contact Stanley at </p> <p>Email szheng@codeforamerica.org<br/> or<br/>Tweet at @stanzheng.</p>",
    "name": "SushiJS: Talk JavaScript, Tech and Enjoy Sushi.",
    "headcount": 0,
    "group": {
        "id": 11012852,
        "group_lat": 36.86000061035156,
        "name": "NorfolkJS",
        "group_lon": -76.30000305175781,
        "join_mode": "approval",
        "urlname": "NorfolkJS",
        "who": "js ninjas"
    }
}] 
jalbertbowden commented 10 years ago

werd. prolly showed you this a year+ ago: http://dev.bowdenweb.com/os/meetup/upcoming-events.html updated for this http://dev.bowdenweb.com/os/meetup/upcoming-js-events.html its really nasty bc its late and i'm lazy.....there are much better ways for appending vars and markup to dom. but thats really it....whatever you chose to show, show via css. after you comment i'll add the microformats for hcalendar event classes

qwo commented 10 years ago

@jalbertbowden i looked at your code examples. What you're talking about I think was discussed in the commit history. I see you're using string concatenation to build the DOM and thats fine.

https://github.com/norfolkjs/norfolkjs.github.io/pull/46/#issuecomment-46104732

We're using the way jquery handles dom as exampled from Travis and Ken

I'm not sure what you are referencing here.

but thats really it....whatever you chose to show, show via css. after you comment i'll add the microformats for hcalendar event classes

The meetup API is returning a blob with all the HTML tags and formatted tags. The solution is to convert this to markdown using some plugin or library but i do not know if theres a way to do that in the API.

jalbertbowden commented 10 years ago

yeah, their method is the way to concatenate. i'll merge them.

i meant if you want to show all of that info, you can, but some like state, country, and lat lon should probably be set to display:none because users dont care but bots do.

adding microformats: they're just classes. the example i showed you doesn't add the literal classes into the markup, but thats really easy now that the structure is set up....there.

once they're merged should be extremely easy still

qwo commented 10 years ago

i think we're talking about two different things.

are you talking about adding more data attributes into the events like long lats and state information and css? If so, go on right ahead and put a PR in for those features feel free.

edit: Travis would not accept my PR with String Concat, and now that I understand how jquery dom works its a pretty efficient solution to have cross browser supported solution so try not to add string concatenation if possible. Submit PR and I would be happy to review/try to help work through doing it using jQuery dom.

jalbertbowden commented 10 years ago

right. no, same thing. i agree their method is superior and said i would make mine reflect theirs.

:)

your cross-browser solution isn't very cross-browser if your using >= version 2.0

i read those threads then too

qwo commented 10 years ago

yeah that was good input and feedback and based off that, I evaluated and switched it to 1.9 in 702e6cd1818e8f04cb75cfd9bef3a2587034c34a because we weren't using any really bleeding edge features of jquery for it to warrant 2.0 and maybe breaking older browsers.

https://github.com/norfolkjs/norfolkjs.github.io/blob/master/_layouts/layout.html#L13