Sponsored Content
Top Forums Web Development New Discussion Timeline in Vue.js UserCP Mockup Post 303031200 by Neo on Saturday 23rd of February 2019 11:26:01 AM
Old 02-23-2019
New Discussion Timeline in Vue.js UserCP Mockup

Well, thanks to the amazing power of Vue.js, we now have a new timeline in version 0.23 of the UserCP Mockup:

Wow! I'm really impressed with Vue.js.

Code:
https://www.unix.com/cp/index.php#/pages/timeline

In this version:
  • Created database, and PHP model for the remote AJAX (Axios) call to retrieve 100 more recent posts.
  • Identified the first post in a thread by comparing the firstpostid with the postid for each entry.
  • Positioned the timeline entries based on either "starting" or "replying" to a discussion.
  • Added links back to the post for each entry in the timeline.

It's working fine for me Smilie Hope it works a fine for you (in Chrome and Safari.. FF suxs, LOL)

ENJOY!

Image


Reference:

https://www.unix.com/web-programming...-new-post.html


Version 0.24:
  • Added link to each UIM / badge page to each timeline entry.
 

9 More Discussions You Might Find Interesting

1. Web Development

Vue.js UserCP Mockup Version 0.20 - Badge Notifications

Vue.js UserCP Mockup Version 0.20 - Badge Notifications https://www.unix.com/cp/index.php#/dashboardIn this mockup release: Badge Notifications are working with live data: Upper Right (see image) Added Axios to Vue and changed large table updates to axios (ajax) Note: Will reformat... (2 Replies)
Discussion started by: Neo
2 Replies

2. Web Development

MySQL Query to Build Mockup Vue.js UserCP Timeline Page

Here is the query (and some sample results) I plan to use to build a new timeline page in the mockup vue.js usercp I am working on. When the postid is the same as lastpostid, this means the timeline entry will be - "{{Member}} Started Discussion {{Thread Title}} at {{date and time}}" and when... (4 Replies)
Discussion started by: Neo
4 Replies

3. Web Development

New Badge Timeline in Vue.js UserCP Mockup

Continuing to think Vue.js is AWESOME, we now have a new badges timeline in version 0.26 of the UserCP Mockup: https://www.unix.com/cp/index.php#/pages/badges Changes: Added Mockup from Badges timeline. Changed notifications (upper right) to use v-for: bindings. Fixes minor vue routing... (0 Replies)
Discussion started by: Neo
0 Replies

4. What is on Your Mind?

My Charts in the Prototype Vue.js UserCP

Yea.... something I thought would take me an hour ended up taking most of the day. Well, it's not like those YT video tutorials where it take a week or more to make a video and the guys (gals) make it look so easy. But having said that, I'm happy to share with forum members the first "My... (6 Replies)
Discussion started by: Neo
6 Replies

5. Web Development

Simple Vue.js Component to Redirect to External Web Page Using Vue Router

Vue Router has some quirks and on of the quirks is that it is not reliable when adding external links using the vue-router library. After struggling with many solutions, I have found that creating a simple Vue.js component like this one seems to work the best (so far): Component Example: ... (0 Replies)
Discussion started by: Neo
0 Replies

6. Web Development

Vue JS 2 Tutorial by The Net Ninja: A Recommended Vue.js Video Tutorial Series

A number of people have asked me how to get started with Vue.js and my reply before today was to Google "Vue.js". That has changed and my recommendation to anyone who wants to learn the fastest growing, easiest to learn and use Vue.js web dev framework is to watch this video tutorial series: ... (0 Replies)
Discussion started by: Neo
0 Replies

7. What is on Your Mind?

New UserCP Update Profile Image Page (UserCP Screeching Frog 0.7485)

Update! UserCP Screeching Frog 0.7485 Created a new page for uploaded a profile picture (profile pictures are different than avatar pictures). https://www.unix.com/usercp/#/settings/other https://www.unix.com/members/1-albums225-picture1158.png ... (0 Replies)
Discussion started by: Neo
0 Replies

8. What is on Your Mind?

UserCP Screeching Frog 0.7446 Using Vue.js

Here is a status update on the new forum usercp. The current version of the new UserCP is Screeching Frog v0.7446. Most users will need to clear the files from your browser cache, quit and restart your browser to see the new version (check bottom of the page for version). Safari seems to... (9 Replies)
Discussion started by: Neo
9 Replies

9. What is on Your Mind?

Video Overview of the Vue.js UserCP @UNIX.com

Here is my second live video screencast (in my life, using Camtasia) with voice for the new usercp: Overview of the Vue.js UserCP @UNIX.com Shout outs to Don Cragun, Corona688, Rudi, Wolf, Made in Germany, stomp, Ravinder, Creative Tim, PubNub and others in the video. Thanks. If you are... (1 Reply)
Discussion started by: Neo
1 Replies
HTTP-CONTEXT-OPTIONS(3) 						 1						   HTTP-CONTEXT-OPTIONS(3)

HTTP context options - HTTP context option listing

	Context options for http:// and https:// transports.

	      o $method
		string - GET, POST, or any other HTTP method supported by the remote server.  Defaults to GET.

	      o $header
		string	-  Additional  headers	to  be sent during request. Values in this option will override other values (such as User-agent:,
		Host:, and Authentication:).

	      o $user_agent
		string - Value to send with User-Agent: header. This value will only be used if user-agent is not specified in the header  context
		option above.  By default the user_agent php.ini setting is used.

	      o $content
		string - Additional data to be sent after the headers. Typically used with POST or PUT requests.

	      o $proxy
		string - URI specifying address of proxy server. (e.g.	tcp://proxy.example.com:5100).

	      o $request_fulluri
		boolean  -  When  set  to  TRUE,  the  entire  URI  will  be  used  when  constructing	the  request.  (i.e.  GET http://www.exam-
		ple.com/path/to/file.html HTTP/1.0). While this is a non-standard request format, some proxy  servers  require	it.   Defaults	to
		FALSE.

	      o $follow_location
		integer - Follow Location header redirects. Set to 0 to disable.  Defaults to 1.

	      o $max_redirects
		integer - The max number of redirects to follow. Value 1 or less means that no redirects are followed.	Defaults to 20.

	      o $protocol_version
		float - HTTP protocol version.	Defaults to 1.0.

	      Note

		      PHP prior to 5.3.0 does not implement chunked transfer decoding. If this value is set to 1.1 it is your responsibility to be
		     1.1 compliant.

	      o $timeout
		float - Read timeout in seconds, specified by a float (e.g.  10.5).  By default  the  default_socket_timeout  php.ini  setting	is
		used.

	      o $ignore_errors
		boolean - Fetch the content even on failure status codes.  Defaults to FALSE.

       +--------+---------------------------------------------------+
       |Version |						    |
       |	|						    |
       |	|		     Description		    |
       |	|						    |
       +--------+---------------------------------------------------+
       | 5.3.4	|						    |
       |	|						    |
       |	|	       Added $follow_location.		    |
       |	|						    |
       | 5.3.0	|						    |
       |	|						    |
       |	|  The	$protocol_version supports chunked transfer |
       |	| decoding when set to 1.1.			    |
       |	|						    |
       |5.2.10	|						    |
       |	|						    |
       |	|		Added $ignore_errors.		    |
       |	|						    |
       |5.2.10	|						    |
       |	|						    |
       |	|  The $header can now be  an  numerically  indexed |
       |	| array.					    |
       |	|						    |
       | 5.2.1	|						    |
       |	|						    |
       |	|		   Added $timeout.		    |
       |	|						    |
       | 5.1.0	|						    |
       |	|						    |
       |	|     Added HTTPS proxying through HTTP proxies.    |
       |	|						    |
       | 5.1.0	|						    |
       |	|						    |
       |	|		Added $max_redirects.		    |
       |	|						    |
       | 5.1.0	|						    |
       |	|						    |
       |	|	       Added $protocol_version. 	    |
       |	|						    |
       +--------+---------------------------------------------------+
       Example #1

	      Fetch a page and send POST data

	      <?php

	      $postdata = http_build_query(
		  array(
		      'var1' => 'some content',
		      'var2' => 'doh'
		  )
	      );

	      $opts = array('http' =>
		  array(
		      'method'	=> 'POST',
		      'header'	=> 'Content-type: application/x-www-form-urlencoded',
		      'content' => $postdata
		  )
	      );

	      $context = stream_context_create($opts);

	      $result = file_get_contents('http://example.com/submit.php', false, $context);

	      ?>

       Example #2

	      Ignore redirects but fetch headers and content

	      <?php

	      $url = "http://www.example.org/header.php";

	      $opts = array('http' =>
		  array(
		      'method' => 'GET',
		      'max_redirects' => '0',
		      'ignore_errors' => '1'
		  )
	      );

	      $context = stream_context_create($opts);
	      $stream = fopen($url, 'r', false, $context);

	      // header information as well as meta data
	      // about the stream
	      var_dump(stream_get_meta_data($stream));

	      // actual data at $url
	      var_dump(stream_get_contents($stream));
	      fclose($stream);
	      ?>

       Note

	      Underlying socket stream context options

	       Additional  context  options  may  be  supported  by the underlying transport For http:// streams, refer to context options for the
	      tcp:// transport. For https:// streams, refer to context options for the ssl:// transport.

       Note

	      HTTP status line

	       When this stream wrapper follows a redirect, the wrapper_data returned by stream_get_meta_data(3) might not necessarily contain the
	      HTTP status line that actually applies to the content data at index 0.

	      array (
		'wrapper_data' =>
		array (
		  0 => 'HTTP/1.0 301 Moved Permantenly',
		  1 => 'Cache-Control: no-cache',
		  2 => 'Connection: close',
		  3 => 'Location: http://example.com/foo.jpg',
		  4 => 'HTTP/1.1 200 OK',
		  ...

	       The  first  request  returned  a  301  (permanent redirect), so the stream wrapper automatically followed the redirect to get a 200
	      response (index = 4).

       "http://", "Socket context options", "SSL context options".

PHP Documentation Group 												   HTTP-CONTEXT-OPTIONS(3)
All times are GMT -4. The time now is 06:19 AM.
Unix & Linux Forums Content Copyright 1993-2022. All Rights Reserved.
Privacy Policy