Skip to content

Instantly share code, notes, and snippets.

@ceneon

ceneon/app.rb

Created December 17, 2014 14:33
Show Gist options
  • Save ceneon/c037ca756806724e66f1 to your computer and use it in GitHub Desktop.
Save ceneon/c037ca756806724e66f1 to your computer and use it in GitHub Desktop.
Download ZIP
Código fuente de la app Sinatra usada en la charla "Introducción a Ruby, Rails, y un poco de Sinatra" /// copiar index.html.erb en un subdirectorio 'views'
Raw
app.rb
#encoding: utf-8
require 'sinatra'
require 'twitter'
require 'flickraw'
require 'yaml' #for debugging purposes
FlickRaw.api_key = ""
FlickRaw.shared_secret = ""
client = Twitter::REST::Client.new do |config|
config.consumer_key = ""
config.consumer_secret = ""
config.access_token = ""
config.access_token_secret = ""
end
Tilt.register Tilt::ERBTemplate, 'html.erb'
get '/' do
erb :index
end
post '/' do
# params[:hashtag]
@search = true
@tweets = client.search("#" + params[:hashtag], { count: 10 })
@flickrs = flickr.photos.search(tags: params[:hashtag], tag_mode: 'all').photo
erb :index
end
Raw
index.html.erb
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<title>#Hashtags</title>
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" rel="stylesheet">
<style type="text/css">
body {
min-height: 2000px;
}
.navbar-static-top {
margin-bottom: 19px;
}
</style>
</head>
<body>
<!-- Static navbar -->
<nav class="navbar navbar-default navbar-static-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">#Hashtags</a>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<!--<li class="active"><a href="#"></a></li>-->
</ul>
</div><!--/.nav-collapse -->
</div>
</nav>
<div class="container">
<form role="form" method="post" action="">
<div class="row">
<div class="form-group col-md-3">
<label for="hashtag">Hashtag a buscar:</label>
<div class="input-group">
<span class="input-group-addon">#</span>
<input type="text" class="form-control" name="hashtag" id="hashtag" placeholder="wecodeio" value="<%= params[:hashtag] %>">
</div>
</div>
</div>
<button type="submit" class="btn btn-primary"><i class="glyphicon glyphicon-search"></i> Buscar</button>
</form>
<% if @search %>
<h2>Resultados de la búsqueda</h2>
<div class="row">
<div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
<h3>Tweets</h3>
<table class="table table-striped">
<thead>
<tr>
<th>Usuario</th>
<th>Tweet</th>
</tr>
</thead>
<tbody>
<% if not @tweets.first %>
<td colspan="2">
<%= @tweets.to_s %>
<em>No se encontraron tweets</em>
</td>
<% else
@tweets.each{ |tweet| %>
<tr>
<td>
<%= tweet.user.name %><br>
<a href="https://twitter.com/<%= tweet.user.screen_name %>" target="_blank">@<%= tweet.user.screen_name %></a>
</td>
<td>
<a href="<%= tweet.uri %>" target="_blank">
<%= tweet.text %>
</a>
</td>
</tr>
<% }
end %>
</tbody>
</table>
</div>
<div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
<h3>Fotos en Flickr</h3>
<% if @flickrs.empty? %>
<p><em>No se encontraron Flickrs</em></p>
<% else
@flickrs.each{ |flick| %>
<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
<a href="<%= FlickRaw.url_photopage(flick) %>" target="_blank">
<img src="<%= FlickRaw.url_n(flick) %>" alt="<%= flick.title %>" style="width:100%">
</a><br>
<%= flick.title %>
</div>
<% }
end %>
</div>
</div>
<% end %>
</div><!-- .container -->
<!-- Bootstrap core JavaScript
================================================== -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>
<script type="text/javascript">
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment