I'm working on a news publishing site that needs to load in stories from an RSS feed below the current news page. I've been using InfiniteAjaxScroll (http://infiniteajaxscroll.com/) to some success however, I've hit a brick wall. There is not way for me to dynamically change what story should load in next as you scroll down the page.
Does anyone know of any other plugins, tutorials, examples that replicate behavior like this. I've searched but come up with nothing that meets these requirements.
I'm trying to create something similar to what the Daily Beast has implemented on their site.
http://www.thedailybeast.com/articles/2014/11/05/inside-the-democrats-godawful-midterm-election-wipeout.html
How do they know what stories to load in?
Thanks!
If you're using the InfiniteAjaxScroll library, the "next story" is whatever link you define as the next URL which can be dynamic for each story you load.
Imagine your first story's HTML as something like this
<div class="stories">
<div class="story">
...
</div>
</div>
<div id="pagination">
next
</div>
Then in the storyC.html you have
...
<div id="pagination">
next
</div>
Assuming you're using some sort of dynamic backend, you would use some sort logic to grab a related story and just set that URL as the "next" URL.
Related
Not even sure I labeled this correctly, I am in the process of converting a site to Umbraco, and there are sections of the site that needs to be edited using the CMS tools in the back end, basically it is a grid with pictures and description text
Here is a sample of the HTML
<div class="hi-icon-effect-1 hi-icon-effect-1a">
<a class="hi-icon">
<img class="img-responsive " id="ImgSales" src="../../Images/sales_icon_circle_grey.png" alt="">
</a>
<p style="padding-left:5px;" id="lblSales" class="">Sales</p>
</div>
What I would like to be able to do is go to the content section of the admin and edit the list of items and configure the image and text for each item.
http://www2.strikemedia.co.za/
If you view the above link and scroll down there will be a grid of items (services) and it is this list that I want to be able to generate.
I am comfortable with all the technologies used in Umbraco, I just do not know the system well enough to do these kinds of modifications, can someone please assist or point me to the resources that will help me build this.
Thanks
You should take a look at the Archetype package: https://our.umbraco.org/projects/backoffice-extensions/archetype/
As far as I understand your question you are looking for a way to add X amount of similar items to the contents of a page - for this, Archetype is probably perfect :-)
Once you have your list of items added inside Umbraco, look here: https://github.com/kgiszewski/ArchetypeManual/blob/master/03%20-%20Template%20Usage.md
Use case #1 in this example will allow you to iterate through items and output it with whatever "template" you want (aka the HTML sample you provided).
I have a search bar on my unpublished website, and I was hoping that there's some kind of coding that could make it possible to search something that will draw a conclusion from my own website. (As of now, using the search bar takes me to google)
<form id="tfnewsearch" method="get" action="http://www.google.com">
<input type="text" class="tftextinput" name="q" size="21" maxlength="120"><input type="submit" value="search" class="tfbutton">
</form>
<div class="tfclear"></div>
Any suggestions?
You have added the link of google.com that is why you are redirecting to google.
For Your own search engine, you have to make a form for your site and some database queries which will select some data from your database and display the result. replace the google.com with your form url in action tag.
It does really depend on how your site is built, and whether it's fully accessible to public.
For example, if it's completely public, you can still use google to search your site by using the Google Custom Search API.
Otherwise, there's no magic potion. You will likely have to write some code to index your documents etc. Many sites achieve this by storing the information in a database and creating a full text index of the site, and then querying the database. But this will require more than just CSS and HTML.
I have this problem I'm facing. I have been working on a project using Grails based on the advice from a friend. I'm still a novice in using Grails, so any down to earth explanation would be highly welcomed.
My project is a web application which scans broken or dead links and displays them on a screen. The main application is written in Java, and it displays the output (good links, bad links, pages scanned) continuously on the system console as the scan goes on. I've finished implementing my UI, controllers, views, database using Grails. Now, I will like to display actively in a section of my GSP page say forager.gsp the current link being scanned, the current number of bad links found and the current page being scanned.
The attempts I have tried in implementing this active display include storing the output my application displays on the console in a table in my database. This table has a single row which is constantly updated as the current paged scanned changes, number of good links found changes and number of bad links found changes. As this particular table is being updated constantly, I've written an action in my controller which reads this single line and renders the result to my UI. The problem I'm now facing is that I need a way of constantly updating the result being displayed after an interval of time in my UI. I want the final output to look like
scanning: This page, Bad links: 8, good links: 200
So basically here is my controller action which reads the table from the database
import groovy.sql.Sql
class PHPController {
def index() {}
def dataSource
def ajax = {
def sql = new Sql(dataSource)
def errors = sql.rows("SELECT *from links")
render (view: 'index', template:'test', model:[errors:errors])
}
}
Here is the template I render test.gsp
<table border="0">
<g:each in="${ errors }" var="error">
<tr><td>${ error.address }</td><td>${ error.error}</td><td>${ error.pageLink}</td></tr>
</g:each>
</table>
For now I'm working with a test UI, which means this is not my UI but one I use for testing purposes, say index.gsp
<html>
<body>
<div><p>Pleaseeee, update only the ones below</p></div>
<script type="text/javascript">
function ClickMe(){
setInterval('document.getElementById("auto").click()',5000);
alert("Function works");
}
</script>
<div id="dont't touch">
<g:formRemote url="[controller:'PHP', action:'ajax']" update="ajaxDiv"
asynchronous="true" name="Form" onComplete="ClickMe()" after="ClickMe()">
<div>
<input id="auto" type="button" value="Click" />
</div>
</g:formRemote>
<div id="ajaxDiv">
<g:render template="/PHP/test"/>
</div>
</body>
</html>
The div I'm trying to update is "ajaxDiv". Anyone trying to answer this question can just assume that I dont have an index.gsp and can propose a solution from scratch. This is the first time I'm using Grails in my life so far, and also the first time I'm ever dealing with ajax in any form. The aim is to dynamically fetch data from my database and display the result. Or if someone knows how to directly mirror output from the system console unto the UI, that will also be great.
It sounds like a form would be appropriate for your needs. Check out the Grails documentation on forms. You should be able to render a form with the values you would like without too much trouble. Be sure to pay attention to your mapping and let me know if you have any questions after you have set index.gsp up to render a form for your values.
Hi I'am working for sone time with wicket and in my team we argue a lot abot the place that should be given to the design
I think that design should be only in markup in order to achive separation of concernes where others think what i am doing is a boiling plat code
for example we are using this structure to support IE8 usung round corners with pictures :
<div class="panel-wrapper">
<div class="panel-left"></div>
<div class="panel-right"></div>
<div class="panel-bottom"></div>
<div class="panel-top"></div>
<div class="panel-bottom-right"></div>
<div class="panel-bottom-left"></div>
<div class="panel-top-right"></div>
<div class="panel-top-left"></div>
<div class="panel-bg"></div>
<div class="panel-body">
//stuff
</div>
i think that allthoght it's against my belives as a developer this is the best way to achive mvc , to separate view from controler where others say that we should write this code once in wicket panel an derive from the wicket panel
what if tommarow this component would be in another place and the given markup would couse us problems such as using #override getVaration?
Why not use Behaviors?
Keep your component clean by putting the basic layout into the template but use AttributeAppender/AttributeModifiers to add CSS-Classes.
I think it's a good idea to allow designers (who should know about css and semantic markup) to create a static version of your page, then you can decide how to construct the panel and then "wicketize" your panel's markup. I think that's the role designers and developers can play.
Often when deciding how to create a panel, one might be concerned about "what if the markup changes"?.. Well, that's the reason why is useful to know the road map of your website and see how it can be reused. In my case, what I usually do is create an abstract panel with no markup and then start extending it, instead of creating styles and stuff like that, because that usually leads to changes in the panel every time you need a different style when you change the behavior of you panel depending on the style. If you think an abstract panel can be overkill, you can create a default panel with the markup that might get used the most and extend when necessary and use different markup for that new panel.
I've been scratching my head like crazy over this all day, there seems to be a hundred different ways to get what I want done but I want it done a certain way - which I can't find.
Here's what I'm working on: http://schmidtbrotherscutlery.com/dev/mySchmidt/myCutlery/
My setup is one view with four different pages, each filtered by category. Default page above lists all three categories at once, and the Category sublinks in the menu take you to the three other view pages that are filtered by a single category. What I need is each of the category sublinks to load their respective view pages with AJAX instead of page by page refresh like it is now. I realize I can effectively achieve the same thing with an exposed filter on the categories but I want these specific menu sublinks to load the view pages, not filter one view on it's own with an exposed form. This really doesn't seem to be that difficult and I don't know why I haven't been able to figure it out yet but I don't have much experience with Drupal+AJAX integration. Help please!
From what I've read it sounds like you should be able to put each of the views within a jQuery tab container. So for example:
<div id="tabs">
<div class="tab">
<?php views_embed_view('viewname', 'block_1')?>
</div>
<div class="tab">
<?php views_embed_view('viewname', 'block_2')?>
</div>
<div class="tab">
<?php views_embed_view('viewname', 'block_3')?>
</div>
</div>
This would allow you to cycle through each content piece without refreshing the page.