franci77
Members-
Posts
13 -
Joined
-
Last visited
Everything posted by franci77
-
are there any programming experts on this forum?
franci77 replied to franci77's topic in General Support
Sorry, I didn't mean no disrespect, just asking. Yes, I do not understand everything since I am a beginner in programming. I just wanted to ask you if in data["items"] the "items" refers to anything in particular, or is it just a name? And do I need to include data["items"] in for loop or is it possible that I can somehow include it $.each loop? And if I can, based on my plugin code, how could I do it? Thank you. Best regards, Franci -
are there any programming experts on this forum?
franci77 replied to franci77's topic in General Support
Hi guys! Thanks for all the help! That probably would work. But in your opinion, is there a way to customize Carousel core code? It probably would be easier and faster in my opinion, because in this case I would have to make all the adjustments to my code. Here is the part of the code where Carousel handles "jsonSuccess" and so on: loadContent : function(){ var base = this; if (typeof base.options.beforeInit === "function") { base.options.beforeInit.apply(this,[base.$elem]); } if (typeof base.options.jsonPath === "string") { var url = base.options.jsonPath; function getData(data) { if (typeof base.options.jsonSuccess === "function") { base.options.jsonSuccess.apply(this,[data]); } else { var content = ""; for(var i in data["owl"]){ content += data["owl"][i]["item"]; } base.$elem.html(content); } base.logIn(); } $.getJSON(url,getData); } else { base.logIn(); } } Since I am quite new in JS/jQuery, I don't really know much what is happening in this block of code. Can you check it out, please? Thank you. My plugin would be called in this block of code: $(document).ready(function() { $("#owl-demo").owlCarousel({ jsonPath: 'URL-to-JSON-file', jsonSuccess: $(document).matchCarousel() // call to my plugin matchCarousel.plugin.js }); It is not up to my so I guess there isn't much to do, but to create the site as my customers wants it. Again, thank you all guys for your effort in helping me! Best regards, Franci -
are there any programming experts on this forum?
franci77 replied to franci77's topic in General Support
Sorry, this really wasn't meant to be rude. Is just that I have this as a project that is due to today, and I am in a little hurry. -
are there any programming experts on this forum?
franci77 replied to franci77's topic in General Support
Hi! I am sorry, but there isn't any solution to this matter? Didn't think that this is so difficult. :/ Still, thank you all guys for trying! Hopefully the solution is going to be found, please tell me if anybody has got an idea. Best regards, Franci -
are there any programming experts on this forum?
franci77 replied to franci77's topic in General Support
Sorry, here is the question. I was just writting it So here is what I would like to do. My site uses free OWL carousel, and on the other side I have this JSON data file that can be reached through a URL. So I made a custom jQuery plugin that gets this file, process the JSON data and builds I HTML, that should be passed to OWL carousel as slides. The thing is that I can't pass the data from my plugin to Carousel. The Carousel has support for JSON data and here is the documentation how to initiate it (link): $(document).ready(function() { $("#owl-demo").owlCarousel({ jsonPath : 'url-to-file', // Allows you to load directly from a jSon file. required jsonSuccess : customDataSuccess // Success callback for $.getJSON build in into carousel. here the Carousel requires that it is a function }); function customDataSuccess(data){ var content = ""; for(var i in data["items"]){ var img = data["items"][i].img; var alt = data["items"][i].alt; content += "<img src=\"" +img+ "\" alt=\"" +alt+ "\">" } $("#owl-demo").html(content); } }); And here is my plugin code: (function ($) { $.fn.matchCarousel = function(options) { var settings = { 'maxMatches': 10 }; if (options) { $.extend(settings, options); } var url = "http://lsdev.betradar.com/ls/feeds/?/betradar/en/Europe:Berlin/gismo/event_fullfeed/0/5"; //this line shouldn't be required afterwards, since the URL is passed in OWL carousel plugin parameter as jsonPath $.getJSON(url, function (data) { // I think that there is something that needs to be done with this line of code var counter = 0; $.each(data.doc[0].data[0].realcategories, function (index, value) { var realCat = this.name; $.each(this.tournaments, function (x, y) { tourName = this.name; var tourSeasName = this.seasontypename; $.each(this.matches, function (i, j) { var resultHome = this.result.home; var resultAway = this.result.away; var teamHome = this.teams.home.name; var teamHomeAbbr = this.teams.home.abbr; var teamHomeId = this.teams.home.uid; var teamAway = this.teams.away.name; var teamAwayAbbr = this.teams.away.abbr; var teamAwayId = this.teams.away.uid; var time = this._dt.time; var date = this._dt.date; var statusId = this.status._id; var statusName = this.status.name; var matchId = this._id; var content = $('div.slider div#owl-demo').append('<div id="' + index + i + '" class="item"><img id="' + index + i + '" class="slider ' + index + i + '" alt="' + realCat + ': ' + tourName + ' - ' + tourSeasName + '" /><p class="league">' + tourName + ' - ' + tourSeasName + '</p><p class="catName">' + realCat + '</p><div class="teams"><div class="team1"><img src="http://ls.betradar.com/ls/crest/big/' + teamHomeId + '.png" alt="' + teamHome + '"/ ><p class = "teamName">' + teamHome + '</p></div><div class="data"></div><div class="team2"><img src="http://ls.betradar.com/ls/crest/big/' + teamAwayId + '.png" alt="' + teamAway + '"/ ><p class = "teamName">' + teamAway + '</p></div></div><div class="statusName"></div></div>'); var itemData = $('.item[id=' + index + i + '] .data'); var itemStatus = $('.item[id=' + index + i + '] .statusName'); if (statusId == 0) { $('img[id=' + index + i + ']').attr('src', 'images/bg-prematch.jpg'); itemData.html('<p class="dataText"><p class="vs">VS</p>' + time + '<br><span class="dateText">' + date + '</span></p>'); itemStatus.html('<span class="statusNameNS">' + statusName + '</span>'); } else if (statusId == 100) { $('img[id=' + index + i + ']').attr('src', 'images/bg-postmatch.jpg'); itemData.html('<p class="result">' + resultHome + ':' + resultAway + '</p>'); itemStatus.html('<span class="statusNameEnd">' + statusName + '</span>'); } else { $('img[id=' + index + i + ']').attr('src', 'images/bg-live.jpg'); itemData.html('<p class="result">' + resultHome + ':' + resultAway + '</p>'); itemStatus.html('<span class="statusNameMid">' + statusName + '</span>'); } if ($(".shell").css("width") == "430px"){ $('.item[id=' + index + i + '] .team1').html('<img src="http://ls.betradar.com/ls/crest/medium/' + teamHomeId + '.png" alt="' + teamHome + '"/ ><p class = "teamName">' + teamHome + '</p>'); $('.item[id=' + index + i + '] .team2').html('<img src="http://ls.betradar.com/ls/crest/medium/' + teamAwayId + '.png" alt="' + teamAway + '"/ ><p class = "teamName">' + teamAway + '</p>'); } if ($(".shell").css("width") == "320px"){ $('.item[id=' + index + i + '] .team1').html('<img src="http://ls.betradar.com/ls/crest/small/' + teamHomeId + '.png" alt="' + teamHome + '"/ ><p class = "teamName">' + teamHomeAbbr + '</p>'); $('.item[id=' + index + i + '] .team2').html('<img src="http://ls.betradar.com/ls/crest/small/' + teamAwayId + '.png" alt="' + teamAway + '"/ ><p class = "teamName">' + teamAwayAbbr + '</p>'); } counter++; return counter < settings['maxMatches']; }); return counter < settings['maxMatches']; }); return counter < settings['maxMatches']; }); }); } })(jQuery); I think that how I need to initiate the Carousel is something like this: $(document).ready(function() { $("#owl-demo").owlCarousel({ jsonPath: 'URL-to-JSON-file', jsonSuccess: $(document).matchCarousel() // here invokes my plugin. but this isn't correct, I just suspect that this has something to do with it }); And this is how the initiation code is written so that everything works correctly: $(document).ready(function() { $("#owl-demo").owlCarousel({ autoPlay: 5000, stopOnHover: true, slideSpeed: 300, paginationSpeed: 400, singleItem: true, jsonPath: 'http://lsdev.betradar.com/ls/feeds/?/betradar/en/Europe:Berlin/gismo/event_fullfeed/0/5', jsonSuccess: customDataSuccess }); function customDataSuccess(data) { var counter = 0; $.each(data.doc[0].data[0].realcategories, function (index, value) { var realCat = this.name; $.each(this.tournaments, function (x, y) { tourName = this.name; var tourSeasName = this.seasontypename; $.each(this.matches, function (i, j) { var resultHome = this.result.home; var resultAway = this.result.away; var teamHome = this.teams.home.name; var teamHomeAbbr = this.teams.home.abbr; var teamHomeId = this.teams.home.uid; var teamAway = this.teams.away.name; var teamAwayAbbr = this.teams.away.abbr; var teamAwayId = this.teams.away.uid; var time = this._dt.time; var date = this._dt.date; var statusId = this.status._id; var statusName = this.status.name; var matchId = this._id; var content = $('div.slider div#owl-demo').append('<div id="' + index + i + '" class="item"><img id="' + index + i + '" class="slider ' + index + i + '" alt="' + realCat + ': ' + tourName + ' - ' + tourSeasName + '" /><p class="league">' + tourName + ' - ' + tourSeasName + '</p><p class="catName">' + realCat + '</p><div class="teams"><div class="team1"><img src="http://ls.betradar.com/ls/crest/big/' + teamHomeId + '.png" alt="' + teamHome + '"/ ><p class = "teamName">' + teamHome + '</p></div><div class="data"></div><div class="team2"><img src="http://ls.betradar.com/ls/crest/big/' + teamAwayId + '.png" alt="' + teamAway + '"/ ><p class = "teamName">' + teamAway + '</p></div></div><div class="statusName"></div></div>'); var itemData = $('.item[id=' + index + i + '] .data'); var itemStatus = $('.item[id=' + index + i + '] .statusName'); if (statusId == 0) { $('img[id=' + index + i + ']').attr('src', 'images/bg-prematch.jpg'); itemData.html('<p class="dataText">VS<br />' + time + '<br><span class="dateText">' + date + '</span></p>'); itemStatus.html('<span class="statusNameNS">' + statusName + '</span>'); } else if (statusId == 100) { $('img[id=' + index + i + ']').attr('src', 'images/bg-postmatch.jpg'); itemData.html('<p class="result">' + resultHome + ':' + resultAway + '</p>'); itemStatus.html('<span class="statusNameEnd">' + statusName + '</span>'); } else { $('img[id=' + index + i + ']').attr('src', 'images/bg-live.jpg'); itemData.html('<p class="result">' + resultHome + ':' + resultAway + '</p>'); itemStatus.html('<span class="statusNameMid">' + statusName + '</span>'); } if ($(".shell").css("width") == "430px"){ $('.item[id=' + index + i + '] .team1').html('<img src="http://ls.betradar.com/ls/crest/medium/' + teamHomeId + '.png" alt="' + teamHome + '"/ ><p class = "teamName">' + teamHome + '</p>'); $('.item[id=' + index + i + '] .team2').html('<img src="http://ls.betradar.com/ls/crest/medium/' + teamAwayId + '.png" alt="' + teamAway + '"/ ><p class = "teamName">' + teamAway + '</p>'); } if ($(".shell").css("width") == "320px"){ $('.item[id=' + index + i + '] .team1').html('<img src="http://ls.betradar.com/ls/crest/small/' + teamHomeId + '.png" alt="' + teamHome + '"/ ><p class = "teamName">' + teamHomeAbbr + '</p>'); $('.item[id=' + index + i + '] .team2').html('<img src="http://ls.betradar.com/ls/crest/small/' + teamAwayId + '.png" alt="' + teamAway + '"/ ><p class = "teamName">' + teamAwayAbbr + '</p>'); } counter++; return counter < 10; }); return counter < 10; }); return counter < 10; }); }; }); All of the code is also available on jsFiddle. I just don't understand why it works if the code is written in the same file and why not if I call some plugin (in this case my "matchCarousel" plugin). But that is probably because I don't know much about jQuery because I am fairly new with it. And I need my code to be as a plugin because I must be able to provide parameters to it, in my case "maxMatches". So how can I make it this to work? I am absolutly clueless. Thank you very much. Best regards, Franci -
are there any programming experts on this forum?
franci77 replied to franci77's topic in General Support
Really, as odd it may seem, it is so "custom" jQuery, that I couldn't find any solution to my problem anywhere on google, e.g. stack overflow, jquery.com...not anywhere And I do believe that someone with more vast experience than I have would know how to solve what I need to be solved. So anyone who is willing to help me, I will much appreciate the help and I will buy him a beer And sorry for thinking this was a spam, but it got your attention, didn't it? -
Hi all! First of all to say, PW is great and I am using it for all my projects now. I came to a point where I needed to implement carousel/slider to my PW site with that is getting data from a JSON file. Now I am kindly asking everybody, are there any jQuery developers/experts on this forum? I would need some small help with this carousel Thank you everybody for any help! Best regards, Franci
-
Thanks Pete, just about to post the same thing here, but you beat me to it. First I asked this question here, but then I found out it could probably be a good thing to open a new topic to this question.
-
Hi, I have a question about PW. For developing totally custom applications/extensions, maybe parse some data from other site or whatever, you should need to build new module. I reckon modules are extensions to PW. It is said that PW is CMF (Content management framework), that shows when you use it's API. But is it also any kind of framework for PHP, that comes in handy, when developing custom applications? Such as is Codeigniter or CakePHP? Or must be code written in pure PHP? Thanks. Best regards, Franci
- 6 replies
-
- 1
-
- processwire
- pw
-
(and 2 more)
Tagged with:
-
@Grays just wanted to say too, that you are not alone, I am a newbie to. And this thread is cool because it just gave me a little bit of encouragement that I need to go into the PW, because before that I was like banging my head in the wall to get through it It looks like to many of us newbies, PW looks a little bit scary, when you want first get into the details how it works, a bit intimidating... but after a while, you see that it is not scary at all. I am on mostly on Joomla now for about 3-4 years. I could build a lot of things there. And I always had in my mind how I achieved something in Joomla and how I would achieve it in PW. And the more I get into the PW the more I see it is a piece of cake comparing to Joomla, even though Joomla is quite easy CMS. But you got to get a little bit dirty hands using PHP. But not much though, just as much as you want to get some custom output, but that are simple brackets of code, nothing much. That for me wasn't quite an issue, because if I wanted so specific output in Joomla, I also had to customize PHP code in there. And you don't really mess with the code in Joomla, if you really don't know what you are doing. If you go through the wiki, see tutorials etc. it will help you to understand PW quite soon. But I have another question about PW. For developing totally custom applications/extensions, maybe parse some data from other site or whatever, you should need to build new module. I reckon modules are extensions to PW. It is said that PW is CMF (Content management framework), that shows when you use it's API. But is it also any kind of framework for PHP, that comes in handy, when developing custom applications? Such as is Codeigniter or CakePHP? I know that this is a bit offtopic, and sorry for that.
-
Hi, Thank you Joss for extensive explanation and help. But I see more and more that there is no point in banging my head about how PW works, before I go through the tutorial. So first, I'll to that before everything else, I just need to find some time. Although I am really looking forward developing custom plugins/apps in PW. I think PW is quite the answer/solution I was looking. And will look little bit more about templating system. Anyways, more about my impressions about PW afterwards. Diogo thanks for explanation about how to make a translation. My language has accented characters (č, š, ž), where I can find encoding for those characters in JSON? For example I downloaded croatian translation, and so that there was some encoding for these characters, but I wasn't familiar with it, e.g. HTML encoding. Thanks again, Franci
-
Hi all, Thank you again guys. For helping and welcoming me. Yes, I have realised now, that the best way to start is to go through the tutorials. Kongondo, I think you are right, been with Joomla so long, that I will definitly need to unlearn it's ways. Because I think that when I am exploring PW, I always have in back of my mind, how would some solution for site would have been made in Joomla. I agree, Joss, I noticed PW doesn't have a system with articles and categories like Joomla. Don't say that this is the bad thing, probably is better (otherwise I wouldn't believe that PW would have such thing ), but I see that whole hierarchy of content is made just by pages and subpages, right? As Joss stated, maybe I want too much to explore and get acquianted with PW at first how it works, than to use it, as I probably should. I believe that this way will probably help me the most to understand PW. Although as far as I was exploring it, I definitly understand how (custom) fields are working, and that you assign the to each page and so on. But I am not quite sure, what are pages fields? What are they for and what is their use. How about templates, I know that they are easy to build, but are there any designs yet made? Or must each template design be custom made? I know, yes, that if it is custom made, that every site is unique then, but many of programmers or administrators are not also designers, they don't have the "touch" for design... as I do not. And one other thing... I see that there is not yet made translation of PW in my language. Maybe I should contribute a little to the community. Any pointers on how to make translations? Best regards, Franci
-
hi, I am new to this form and PW also and i would like to know a little more about it, i find it very interesting cms. i have quite extensive knowledge with joomla cms, i am using it now for 3+ years, but i would like to make a change now, have a different approach. besides i am eager to learn programming in PHP, i am a begginer, and i tried to find a good framework for php with quality cms, and PW seems to be quite a first candidate on my "list". for instance, i would like to know, how can search with the dropdowns be created? like the one we can see on Skyscrapes demo site? is it also possible that the dropdowns are dependent, so calles "chain selects"? i know this can be done wuth jquery, but is it maybe integrated in PW? how about security of PW? i didn't find any article about that... also, since i am eager to learn programming, i haven't found good article on how to begin with development in PW? i mean, yes there is API, but i was thinking something like examples or so. many people likes to learn from examples, and this way they learn the most. thank you in advance for your kind response. best regards, Franci