Learn & Launch project

[MilenKo]

Could someone advise me of the best approach for a custom Comments submission form as I tried to create MyCommentForm.php and include it where it is needed as per Ryan's earlier advice, but that did not work. Here is the content of the form:

Spoiler

<div id="comments" class="comments-area empty-comment">


	<div id="respond" class="comment-respond">
		<h3 id="reply-title" class="comment-reply-title">Leave a Reply <small>
				<a rel="nofollow" id="cancel-comment-reply-link" href="/nowknow-140/2013/10/28/nulla-bibendum-vel-ipsum-ut-suscipit/#respond" style="display:none;">Cancel reply</a>
			</small>
		</h3>
		<form class="comment-form" action="./#CommentForm" method="post" id="commentform" class="comment-form" novalidate>
			<div class="row">
				<div class="col-md-6">
					<div class="comment-form-author form-group">
						<label for="author">Name</label>
						<input id="author" name="cite" type="text" class="form-control" value="" size="30" maxlength="128" aria-required='true' />
					</div>
					<div class="comment-form-email form-group">
						<label for="email">Email</label>
						<input type="email" name="email" class="form-control" required="required" value="" id="email" size="30" maxlength="255" aria-required='true' />
					</div>
					<div class="comment-form-url form-group">
						<label for="url">Website</label>
						<input type="text" name="website" class="form-control" value="" id="url" size="30" maxlength="255"/>
					</div>
				</div>
				<div class="col-md-6">
					<div class="form-group">
						<label for="comment">Comment</label>
						<textarea name="text" class="form-control" rows="8" cols="45" id="comment" required="required"/></textarea>
					</div>
				</div>
			</div>
			<p class="form-submit">
				<input type="submit" name="CommentForm_submit" value="Post Comment" id="submit" class="submit" />
				<input type='hidden' name='page_id' value='<?=$page->id;?>' id='comment_post_ID' />
				<input type='hidden' name='parent_id' id='comment_parent' value='0' />
			</p>
		</form>
	</div>
	<!-- #respond -->
</div>
<!-- #comments -->

 

and the call in articles-inner.php is:

include("./includes/MyCommentForm.php");
$form = new MyCommentForm($page, $page->comments); 
echo $form->render();

Browsing an article page shows the form correctly, however the comment is not posted and I see an error:

Fatal error: Class 'MyCommentForm' not found in C:\OpenServer\domains\nowknow.pw\site\assets\cache\FileCompiler\site\templates\articles-inner.php on line 136
Error: Class 'MyCommentForm' not found (line 136 of C:\OpenServer\domains\nowknow.pw\site\assets\cache\FileCompiler\site\templates\articles-inner.php) 
 

[fbg13]

@MilenKo Ryan's example

include("./MyCommentForm.php");
$form = new MyCommentForm($page, $page->comments); 
echo $form->render(); 

is for extending the class inside /wire/modules/Fieldtype/FieldtypeComments/CommentForm.php with your own inside MyCommentForm.php and changing the necessary methods to suit your needs.

[MilenKo]

Ok, it makes sense now why it did not work. So any suggestions of the best practice to apply the existing bootstrap styles to the FieldtypeComments form?

[MilenKo]

After passing the initial validation with the team today (everyone liked the theme so far and most important the super-fast browsing thanks to PW), I got a request to put a star rating for all Articles and/or News.

Looking at rating options and abilities, I was not really able to find a module that would allow the needed functionality out of the box. Well except with one - FieldTypeRate which seems to be a mixture of a jquery start rating and an adoption module for PW. I quickly installed the module and started testing it, but I am unable to show the stars on the frontend ($page->article_rating).

Can someone propose a working sollution for a rating system (prefferably as a fieldtype) that works or any PW profile I can have a look and see how the rating is implemented?

[Zeka]

Hi @MilenKo

Did you see these modules? 

http://modules.processwire.com/modules/fieldtype-star-rating/

http://modules.processwire.com/modules/page-ratings/

[MilenKo]

@Zeka Thanks for the suggestions. I did see those two however I had issues showing the star rating on the frontend and even more to allow users to select one that can update the page rating.

I saw an example for the Star Rating Integer and am trying to implement it, but so far no luck. So far The FieldTypeRate was promissing an easy star appearance for the frontend, that can be manipulated from the admin but simply does not show the stars with PW 3x. That is why I asked if someone knows of a shared profile that uses the rating on both ends so that I can see and modify it for our needs.

[MilenKo]

I just checked the fieldtype-star-rating and it seems like it is not exactly what is needed as far as the module allows you to set a page rating within the admin and show the star numbers on the frontend. For my needs I need to have the reversed function (it would be good to have the rating manipulations from the admin but most important - it should allow visitors/users to vote for the page content).

Will be checking now the page-ratings to see how can this be implemented and if it would allow the above mentioned functionality to be achieved.

[MilenKo]

OK. I spent more than 4-5 hours trying to find a profile that has a rating or to find a working rating module that could be manipulated through FieldType or at least would allow simple voting and I did not found anything so far. There are two modules only that are working on the backend but you need to code your way out to a star interface through which you would push the rating or else.

How are you guys accomplishing such a request if you have a theme to work on? It would have been great to see the PW default profile to have implemented comments, ratings and other useful stuff other than the logical API calls to pages, hyperlinking, menus etc.

[Robin S]

4 hours ago, MilenKo said:

OK. I spent more than 4-5 hours trying to find a profile that has a rating or to find a working rating module that could be manipulated through FieldType or at least would allow simple voting and I did not found anything so far.

On 8/03/2017 at 5:44 PM, MilenKo said:

Well except with one - FieldTypeRate which seems to be a mixture of a jquery start rating and an adoption module for PW. I quickly installed the module and started testing it, but I am unable to show the stars on the frontend ($page->article_rating).

I think your time would have been better spent persisting with FieldtypeRate, which seems to be exactly what you are looking for. I installed it to test it and it works straight out of the box, so not sure how you have been going wrong. Just echo the field as per the documentation:

echo $page->my_rating_field; // of course change this to the name of your ratings field

There is a small error in the module code that will generate a PHP notice but it is an easy fix - delete line 66 as it looks like it is an accidental leftover from the FieldtypePoll that the module is based on.

[MilenKo]

Thanks for your info, @Robin S That it is exactly what I am looking for, however the issue is that it does not work with me. I installed the module, created a fiield article-rating and added a type Rate. After that I went to the articles-inner.php and put the call to the place I need to show the rating by: <? echo $page->recipe_rating;?> The issue is that I see nothing showing. To make sure it is not with some CSS overlaping or else, I moved the rating call to different places within the page but had no luck (I even tried to export the profile and test the module with PW 2.8.35 as it says works with 2x).

Oh, and I commented out the line 66 too. On the admin side, I set 5 stars and set the default score to 3. In the module config, other than that, there is nothing to configure (besides the access, advanced etc.) Am I missing something here?

[tpr]

Perhaps it's article-rating vs recipe_rating?

[Robin S]

@MilenKo, my tip is that if you want to really accelerate your learning of ProcessWire and PHP the single most important thing you can do is install Tracy Debugger and start dumping variables. Whenever you are confused or curious about something, dump it and explore it in the debugger. Installing Tracy also makes sure you are seeing PHP errors when they occur.

If you dump $page->recipe_rating you will probably find out where you are going wrong.

[MilenKo]

I am installing Tracy Debugger now, @Robin S You are right that the default debug message is not quite explanatory (especially for beginners). About recipe_rating - it was a typo so the correct is article_rating. I am playing with two themes and confused them. Will see what Tracy has to say about the issue as far as the rating is still not showing.

Thanks again for all the clever ideas and willing to share/help.

[MilenKo]

@Robin S I installed Tracy Debugger to see how it works and how can it help me troubleshoot the issue. To be sure there is no theme/styling issue, I installed the PW default profile and the FieldTypeRate module. Created a new field rating and assigned it to both - home and basic page. Added the rating to _main.php:

<main id='main'>
	<!-- main content -->
	<div id='content'>
		<h1><?php echo $title; ?> - <?php echo $page->rating; ?></h1>
		<?php echo $content; ?>
	</div>
	<!-- sidebar content -->
	<?php if($sidebar): ?>
	<aside id='sidebar'>
		<?php echo $sidebar; ?>
	</aside>
	<?php endif; ?>
</main>

Checked with Tracy and was able to see the code inserted in the page source with no errors pointed:

Spoiler

<!-- main content -->
<div id='content'>

	<h1>
		<span id=pw-edit-1 class='pw-edit pw-edit-InputfieldPageTitle' data-name=title data-page=1002 style='position:relative'>
			<span class=pw-edit-orig>Child page example 1</span>
			<span class=pw-edit-copy id=pw-editor-title-1002 style='display:none;-webkit-user-select:text;user-select:text;' contenteditable>Child page example 1</span>
		</span> - <script src='/site/modules/FieldtypeRate/raty/lib/jquery.raty.min.js' type='text/javascript'/>
		<div id="1002-rating" class="star-rating">
			<form method='post' action='./'>
				<input name="rating" value="1002" type="hidden">
				<input name="score" value="" type="hidden">
			</form>
		</div>
		<script type="text/javascript">
		$('#1002-rating').raty({
			number: 5,
			score: 3,
			path: "/site/modules/FieldtypeRate/raty/lib/img",
			readOnly: false,
			hints: ["1 star","2 stars","3 stars","4 stars","5 stars"],
			click: function(score, e) {
				var $form = $('#1002-rating form');
				$form.find('[name=score]').val(score);
				$form.submit();
			}
		});
		</script>
	</h1>

 

But still I see no rating etc. How were you able to make it work? Anything different than the steps I took? The only thing to check is if the plugin might not work with some of the settings of my local server (php version etc.) but I highly doubt everything else would and only that not. Read several times the installation instructions, checked the path to jquery.raty.min.js (clicking on the link opens the file in the browser), see the ratings call, checked the images and they are there too, reinstalled the module on 3 different themes - still nothing.

If possible, could you quickly share the steps you took to install the module and make it work as well as which version of php you are usin (just in case to match as close as possible to your setup)?

[Robin S]

@MilenKo, it won't be a PHP issue if you can see the markup in your page source. Could it be that you do not have jQuery included in your template? jQuery is a requirement for the module according to the GitHub readme.

Here is the module working with the "Blank" profile (note that I added jQuery to the head):

[MilenKo]

Hello again, @Robin S . No matter how strange it could sound, I included the jQuery that was provided with the demo folder by moving it to the proper scripts direction and including it in the header of the page. That did not work but including the online version from googleapis or code.jquery.com did the trick.

One less task to concur and now the only thing to do is to style it place the rating in the proper location and style it appropriately. But that is a story for another day.

I am again extremely thankful to your kind assistance and most of all - the patience Once I have the working code, will share it with the audience here so that we can move forward with the theme.