note simple sever based live edit web notes

note simple notes web page

Note is a simple sever based live page web note content management system. To use Note on your server set a password, Generate Note Code, upload this to your server and open the uploaded file in your browser. See what it looks like here and click edit to give it a try or learn more at ? help.

: set password only use alpha-numeric or ._+- characters. This is used as your Note edit password and the password for any password protected note.

<?php

/*
Account : ;
Software : Note by bizpep.com;
Build code-gen : - ;
Url : https://bizpep.com/note/

If this message appears in your browser when the file is run from your server, php is not available on that server. Without php this code will not function. When php is supported by your server none of this code is displayed or sent to the browser it is fully processed on the server. For more information visit https://bizpep.com

####If required the below variable can be changed by opening this file in a text editor and adjusting the value between "". This sets the password required to for edit note and to access password protected page (ppp=true) notes.
*/

$usep="test";

/*
Only adjust the above variable value between each "", only alpha-numeric or  ._+- characters allowed.
All works must be used as designed. Registered components must not be distributed. Suitability must be independently assessed and use indicates acceptance of any and all associated risk.
*/

$pKey='note_p';
  if(isset($_GET[$pKey])&&$_GET[$pKey]=='reset')
  {
	 setcookie($pKey,'',time()-(365*86400)); 
	 $pageDis='<!DOCTYPE html><html lang="en"><head><title>Saved Password Reset</title></head><body><h1 style="text-align:center;">Saved Password Reset</h1>';
	 $pageDis.='<form action="'.htmlspecialchars($_SERVER['PHP_SELF'], ENT_QUOTES | ENT_HTML5 | ENT_SUBSTITUTE, 'UTF-8').'" method="post" style="text-align:center;">';
	 $pageDis.='<p><input type="submit" value="Reload Page"/></p>';
	 $pageDis.='</form></body></html>';
	 echo $pageDis;
	 exit;
	}
	else if((isset($_COOKIE[$pKey])&&$_COOKIE[$pKey]==$usep)||(isset($_POST[$pKey])&&$_POST[$pKey]==$usep)||(isset($_GET[$pKey])&&$_GET[$pKey]==$usep))
  {
	 setcookie($pKey,$usep,time()+(365*86400));
	}
  else
  {
   $pageDis='<!DOCTYPE html><html lang="en"><head><title>Password Required</title></head><body><h1 style="text-align:center;">Password Required</h1>';
	 $pageDis.='<form action="'.htmlspecialchars($_SERVER['PHP_SELF'], ENT_QUOTES | ENT_HTML5 | ENT_SUBSTITUTE, 'UTF-8').'" method="post" style="text-align:center;">';
	 $pageDis.='<p><input type="password" autocomplete="current-password" name="'.$pKey.'" id="'.$pKey.'"/></p><p><input type="submit" value="Submit Password"/></p>';
	 $pageDis.='</form></body></html>';
	 echo $pageDis;
	 exit;
  }

$pppphp='<?php $usep=\''.$usep.'\'; $pKey=\''.$pKey.'\'; if(isset($_GET[$pKey])&&$_GET[$pKey]==\'reset\') { setcookie($pKey,\'\',time()-(365*86400),\'/\'); $pageDis=\'<!DOCTYPE html><html lang="en"><head><title>Saved Password Reset</title></head><body><h1 style="text-align:center;">Saved Password Reset</h1>\'; $pageDis.=\'<form action="\'.htmlspecialchars($_SERVER[\'PHP_SELF\'], ENT_QUOTES | ENT_HTML5 | ENT_SUBSTITUTE, \'UTF-8\').\'" method="post" style="text-align:center;">\'; $pageDis.=\'<p><input type="submit" value="Reload Page"/></p>\'; $pageDis.=\'</form></body></html>\'; echo $pageDis; exit; } else if((isset($_COOKIE[$pKey])&&$_COOKIE[$pKey]==$usep)||(isset($_POST[$pKey])&&$_POST[$pKey]==$usep)||(isset($_GET[$pKey])&&$_GET[$pKey]==$usep)) { setcookie($pKey,$usep,time()+(365*86400),\'/\'); } else { $pageDis=\'<!DOCTYPE html><html lang="en"><head><title>Password Required</title></head><body><h1 style="text-align:center;">Password Required</h1>\'; $pageDis.=\'<form action="\'.htmlspecialchars($_SERVER[\'PHP_SELF\'], ENT_QUOTES | ENT_HTML5 | ENT_SUBSTITUTE, \'UTF-8\').\'" method="post" style="text-align:center;">\'; $pageDis.=\'<p><input type="password" name="\'.$pKey.\'" id="\'.$pKey.\'"/></p><p><input type="submit" value="Submit Password"/></p>\'; $pageDis.=\'</form></body></html>\'; echo $pageDis; exit; } ?>';

$js='<script src="note.js"></script>';

$css='<link rel="stylesheet" href="note.css">';

$selfserver = $_SERVER['SERVER_NAME'];
$path_parts = pathinfo($_SERVER['PHP_SELF']);
$selfdir = $path_parts['dirname']; 
$selfbase = $path_parts['basename'];
$selffile = $path_parts['filename'];
$selfext = $path_parts['extension'];
$saveasdir = $selffile.'s';

$appName="note";
$appUrl="https://bizpep.com/note/";

$accVar="Active=Full";

$active=explode('Active=',$accVar)[1];

if(stripos($active,'Full')===false)
{
  $actTime=explode(' ',$active)[0];
	if(strtotime($actTime) < time())
	{
	  header("Location: https://bizpep.com/expired.html?appName=".rawurlencode($appName)."&appUrl=".rawurlencode($appUrl));
		exit();
	}
}

if(($selfserver!='bizpep.com' || $selfdir!='/note')&&(!empty($_POST['saveas'])||!empty($_POST['listnotes'])||!empty($_POST['loadas'])||!empty($_POST['title'])||!empty($_POST['deleteas']))) 
{

if(!empty($_POST))
{
	foreach($_POST as $name=>$value)
  {	
 		$$name=$value;
  }
}

if(!empty($_GET))
{
	foreach($_GET as $name=>$value)
  {
 		$$name=$value;
  }
}

if(!empty($saveas))
{
  if (!is_dir($saveasdir))
  {
    mkdir($saveasdir);
  }
		
	$preHtml='<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>'.rawurldecode($saveas).'</title>';
	
	if(!empty($note_js))
	{		 
	 $preHtml.=$js;
  }
	
	if(!empty($note_css))
	{		 
	 $preHtml.=$css;
  }
	
	$preHtml.='</head>';
	
	if(!empty($note_js))
	{		 
	 $preHtml.='<body onload="init();">';
  }
	else
	{
	 $preHtml.='<body>';
	}
	$preHtml.='<div><h1>'.rawurldecode($saveas).'</h1>';
		
	$postHtml='</div></body></html>';

$domDoc = new DOMDocument();
  @$domDoc->loadHTML($preHtml.rawurldecode($note).$postHtml);
	
	$notehtml = $domDoc->saveHTML();
	
	if(!empty($note_ppp))
	{		 
	 $notehtml = $pppphp.$notehtml;
  }
	
  if(@file_put_contents($saveasdir.'/'.$saveas.'.'.$selfext, $notehtml,LOCK_EX)!==false)
  {
    echo ("Saved $saveasdir/$saveas.$selfext");
	}
	else
	{
	 echo ("Failed to save $saveas");
	}	
} 
else if(!empty($listnotes)) 
{
 if (is_dir($saveasdir))
 {
  $listdirs=scandir(dirname(__FILE__).'/'.$saveasdir);
  
  $known_directories = [".",".."];

$notesdirectories = $result = array_diff($listdirs, $known_directories);
 
  $listnotes=implode("|", $notesdirectories);

echo $listnotes;
 }
 else
 {
  echo '';
 }	
}
else if(!empty($loadas)||!empty($title)) 
{
  if(empty($loadas))
	{
	  $loadas=$title;
	}	
	
	$noteHtml = @file_get_contents(dirname(__FILE__).'/'.$saveasdir.'/'.$loadas.'.'.$selfext);
	
	if(strpos($noteHtml,' ?>')!==false)
	{
	  $noteHtml = explode(' ?>', $noteHtml)[1];	
	}
	
	if($noteHtml)
	{	
	 $domDoc = new DOMDocument();
   @$domDoc->loadHTML($noteHtml);
		
	 $notehtml=rawurlencode($domDoc->saveHTML($domDoc->getElementsByTagName('body')[0]));
	
   echo $notehtml;
	}
	else
	{
	 echo "Failed to load $loadas";
	} 
}
else if (!empty($deleteas))
{
 $delfile=dirname(__FILE__).'/'.$saveasdir.'/'.$deleteas.'.'.$selfext;
 if (file_exists($delfile))
 {
     unlink($delfile);
		 echo "Deleted $deleteas";
 }
 else
 {
    echo "Not found $deleteas";
 }
}

exit;
}
else
{

<!DOCTYPE html>
<html lang="en">
<head>

<?php

$reClean="/[^A-Z0-9._%+-@ ]/i";

if(!empty($_GET))
{
  foreach($_GET as $name=>$value)
  {
    if (get_magic_quotes_gpc())
    {
      $value=stripslashes($value);
    }
    $name=preg_replace($reClean, '',trim(rawurldecode($name)));
    $value=preg_replace($reClean, '',trim(rawurldecode($value)));
		$$name=$value;
		echo '<script>var '.$name.'="'.$value.'"</script>';
   }
}

if(!empty($_POST))
{
	foreach($_POST as $name=>$value)
  {
    if (get_magic_quotes_gpc())
    {
      $value=stripslashes($value);
    }
    $name=preg_replace($reClean, '',trim(rawurldecode($name)));
    $value=preg_replace($reClean, '',trim(rawurldecode($value)));
		$$name=$value;
		echo '<script>var '.$name.'="'.$value.'"</script>';
  }
}

<?php

echo '<script>var accVar = "'.$accVar.'"; var appUrl = "'.$appUrl.'"; var selfserver = "'.$selfserver.'"; var selfdir = "'.$selfdir.'"; var selffile = "'.$selffile.'"; var saveasdir = "'.$saveasdir.'"; var reqUrl = "'.$selfbase.'"; var saveasext = "'.$selfext.'";</script>';

window.onerror=errorSupress;
function errorSupress()
{
  return true;
}

var build="20211024.3";

var appId='note';
  
if(typeof e=='undefined'){var e='';}
if(typeof ap=='undefined'){var ap='';}
if(typeof accVar=='undefined'){var accVar='Account=,Active=';}

var varVar='note=';

var reqRes;
var httpp_request;
var postString;

var bNode;
var sectionsNode;
var appNode;

var oNode;
var oMesNode;
var mes;

var appSaveasNode;
var appNoteNode;
var appNoteHtmlNode;

var navAppNode;
var navAppDiv;

var accountNode;
var helpNode;

var firsttime='no';

var active='';
var note='';
var saveas='';
var title='';
var note_ppp='false';
var note_js='false';
var note_css='false';

function frameBuild()
{	
	bNode=document.getElementsByTagName('body')[0];
	sectionsNode=document.getElementById('sections');
	appNode=document.getElementById('app');
	appNode.onclick=function(){filterSections('app');}
	
	accountNode=document.getElementById('account');
	helpNode=document.getElementById('help');
	
	navAppNode=document.getElementById('navApp');
	navAppDiv=document.getElementById('navApp').getElementsByTagName('div')[0];
	
}

function accVarCk()
{
	var cd = new Date();
	var activeD=accVar.split(' ')[0];
	var ad = new Date(activeD);

if(cd>ad && active.indexOf('Expired')==-1)
	{
	  active=active+' Expired';
	}
	
	accVar='Account='+e+',Active='+active;
}

function accountDisplay()
{	
	var accDiv=document.getElementById('accountdetails');
	accDiv.innerHTML = '';
	
	accVars=accVar.split(',');
	for(var i=0;i<accVars.length;i++)
  {
	    var k = accVars[i].split('=')[0];
	    var v = accVars[i].split('=')[1];
			var pNode = document.createElement('p');
			
			var iNode = document.createElement("input");
      iNode.setAttribute('type','text');
			iNode.setAttribute('value',k);
			iNode.readOnly = true;
			pNode.appendChild(iNode);
			 
			var iNode = document.createElement("input");
      iNode.setAttribute('type','text');
			iNode.setAttribute('value',v);
			iNode.readOnly = true;
			pNode.appendChild(iNode);
			accDiv.appendChild(pNode);
  }	
	
	var pNode = document.createElement('p');
	var iNode = document.createElement("input");
  iNode.setAttribute('type','text');
	iNode.setAttribute('value','Build');
	iNode.readOnly = true;
	pNode.appendChild(iNode);	 
	var iNode = document.createElement("input");
  iNode.setAttribute('type','text');
	iNode.setAttribute('value',build);
	iNode.readOnly = true;
	pNode.appendChild(iNode);
	accDiv.appendChild(pNode);
}

function activateAcc()
{
  openOverlay();
  
	var pNode = document.createElement('p');
	pNode.innerHTML = '<b>Account Activation</b>';
	oMesNode.appendChild(pNode);
	
	pNode = document.createElement('p');
	pNode.innerHTML = 'Please activate your account for continued functionality. For code to continue functioning it must be generated with an <span onclick="noteAccount();" class="link">Active Full account</span>.</p><p><span onclick="noteAccount();" class="link">Please fully activate your account and rebuild your note code with an Active Full account for unlimited note use.</span></p>';
	oMesNode.appendChild(pNode);
	
	var pNode = document.createElement('p');
	pNode.innerHTML = 'Thank you';
  oMesNode.appendChild(pNode);
}

function expiredAcc()
{
  openOverlay();
  
	var pNode = document.createElement('p');
	pNode.innerHTML = '<b>Account Activation Expired</b>';
	oMesNode.appendChild(pNode);
	
	pNode = document.createElement('p');
	pNode.innerHTML = 'Your account activation period has expired. For code to continue functioning it must be generated with an <span onclick="noteAccount();" class="link">Active Full account</span>.</p><p><span onclick="noteAccount();" class="ink">Please fully activate your account and rebuild your note code with an Active Full account for unlimited note use.</span></p>';
	oMesNode.appendChild(pNode);
	
	var pNode = document.createElement('p');
	pNode.innerHTML = 'Thank you';
  oMesNode.appendChild(pNode);
}

function noteAccount()
{
  window.location.href = appUrl+'?display=account';
}

function refresh()
{
 window.location.href = window.location.href.replace(location.search, '');	
}

function openOverlay()
{	
	closeOverlay();
	
	var fNode = document.createElement("div");
	fNode.id="fade";
	document.getElementsByTagName("body")[0].appendChild(fNode);
	
	oNode = document.createElement("div");
	oNode.id="overlay";
	
	var divNode = document.createElement("div");
	divNode.style.textAlign = 'right';
	var bNode = document.createElement("button");
	bNode.className="bluebutbor";
	bNode.onclick = closeOverlay;
	var tNode = document.createTextNode("Close");
  bNode.appendChild(tNode);
	divNode.appendChild(bNode);
	oNode.appendChild(divNode);
	
	oMesNode = document.createElement("div");
	oMesNode.id="oMesNode";
	oNode.appendChild(oMesNode);
	
	document.getElementsByTagName("body")[0].appendChild(oNode);
}

function closeOverlay()
{
	if(document.getElementById("fade"))
	{
	  document.getElementById("fade").parentNode.removeChild(document.getElementById("fade"));
	}
	if(document.getElementById("overlay"))
	{
	  document.getElementById("overlay").parentNode.removeChild(document.getElementById("overlay"));
	}
}

appNoteNode=document.createElement('div');
				appNoteNode.id='note';
				
				if(typeof action !== 'undefined' && action=='edit')
		    {				
					appSaveasNode.contentEditable = true;
					appSaveasNode.style.cursor='pointer';
					appSaveasNode.title = 'type title';
					appSaveasNode.onblur = saveLocal;
					
					appNoteNode.contentEditable = true;
					appNoteNode.style.cursor='pointer';
					appNoteNode.title = 'type note';
					appNoteNode.onkeyup = changeKey;
					appNoteNode.onblur = saveLocal;
				}
					
	 			if(note.length>0)
				{
				  appNoteNode.innerHTML=note;
				}
				else
				{
				  appNoteNode.innerHTML="";
				}
				
				appNode.appendChild(appNoteNode);	
				
				if(typeof action !== 'undefined' && action=='edit')
		    {				
					buildControls();
					
					appNoteHtmlNode=document.createElement('textarea');
				  appNoteHtmlNode.id='noteHtml';
				  appNoteHtmlNode.style.textAlign = 'left';	
					appNoteHtmlNode.style.cursor='pointer';	
					appNoteHtmlNode.title = 'note html';	
				  appNoteHtmlNode.style.display='none';	
					
					if(appNoteNode.innerHTML.length>0)
					{
					  appNoteHtmlNode.value=appNoteNode.innerHTML;
					}
					else
					{
					   clearNoteHtml();
          }
					appNode.appendChild(appNoteHtmlNode);		
					
					buildHtmlControls()	
				}	
				else
				{
				 buildViewControls();
				}	
}

function buildViewControls()
{  
   var pNode = document.createElement("p");
	 pNode.style.textAlign = 'right';	
	 pNode.style.margin = '.1em';	
		 
	 spanNode = document.createElement("span");
	 spanNode.style.padding='.5em';  					 
	 spanNode.onclick=editView;
	 spanNode.title='reloads note in edit mode';
	 spanNode.className ='link'; 
	 textNode = document.createTextNode('edit');
   spanNode.appendChild(textNode);
	 pNode.appendChild(spanNode);
	 
	 aNode = document.createElement("a");
	 aNode.className ='link'; 
	 aNode.style.padding='.5em'; 
	 aNode.style.marginLeft='3em';
	 aNode.title='note developer';
	 aNode.href='https://bizpep.com/';
	 aNode.target='bizpep';
	 
	 spanNode = document.createElement("span");
	 spanNode.style.color='#ff6600';
	 spanNode.style.fontWeight='700';
	 spanNode.style.fontSize='120%';
	 textNode = document.createTextNode('+');
   spanNode.appendChild(textNode);
	 aNode.appendChild(spanNode);
	 	 
	 textNode = document.createTextNode('bizpep.com');
   aNode.appendChild(textNode);
	 
	 pNode.appendChild(aNode);
	 
	 appNode.insertBefore(pNode, appNode.childNodes[0]); 	
	 
   var pNode = document.createElement("p");
	 pNode.style.textAlign = 'right';	
	 pNode.style.margin = '.1em';	
		 
	 spanNode = document.createElement("span");
	 spanNode.style.padding='.5em';  					 
	 spanNode.onclick=editView;
	 spanNode.title='reloads note in edit mode';
	 spanNode.className ='link'; 
	 textNode = document.createTextNode('edit');
   spanNode.appendChild(textNode);
	 pNode.appendChild(spanNode);
	 
	 aNode = document.createElement("a");
	 aNode.className ='link'; 
	 aNode.style.padding='.5em'; 
	 aNode.style.marginLeft='3em';
	 aNode.title='note developer';
	 aNode.href='https://bizpep.com/';
	 aNode.target='bizpep';
	 
	 spanNode = document.createElement("span");
	 spanNode.style.color='#ff6600';
	 spanNode.style.fontWeight='700';
	 spanNode.style.fontSize='120%';
	 textNode = document.createTextNode('+');
   spanNode.appendChild(textNode);
	 aNode.appendChild(spanNode);
	 	 
	 textNode = document.createTextNode('bizpep.com');
   aNode.appendChild(textNode);
	 
	 pNode.appendChild(aNode);
	
	 appNode.appendChild(pNode);	 
}

function editView()
{
 window.location.href = window.location.href.replace(window.location.search,'')+'?action=edit';	
}

function preView()
{
  saveLocal();
	window.location.href = window.location.href.replace(window.location.search,'');	
}

function noteView()
{
	if(saveNote())
	{ 
	 window.location.href = window.location.href.replace(window.location.search,'')+'?title='+saveas;
	} 	
}

function liveView()
{
	if(saveNote())
	{ 
	 window.location.href=window.location.href.split("/").slice(0, -1).join("/")+'/'+saveasdir+'/'+saveas+'.'+saveasext;
  }
}

function buildHtmlControls()
{
   var pNode = document.createElement("p");
	 pNode.style.textAlign = 'left';	
	 pNode.style.margin = '.1em';	
	 pNode.style.display='none';
	 
	 spanNode = document.createElement("span");
	 spanNode.style.padding='.5em';  					 
	 spanNode.onclick=txHtml;
	 	
	 spanNode.title='transfers html contents to note contents, only use if you directly edit html';
	 spanNode.className ='link'; 
	 textNode = document.createTextNode('html to note');
   spanNode.appendChild(textNode);
	 pNode.appendChild(spanNode);

appNode.appendChild(pNode);	
}

function buildList()
{
  postString='listnotes=true';
	httpp();
}

function txHtml()
{
  appNoteNode.innerHTML=appNoteHtmlNode.value;
	saveLocal();
}

function saveLocal()
{
	ahrefBuild();
	if(typeof action !== 'undefined' && action=='edit')
  {
	  appNoteHtmlNode.value=appNoteNode.innerHTML;
  }
	changeNote();
}

function changeNote()
{
	k='note';
	
	appSaveasNode.innerText=appSaveasNode.innerText.trim().replace(/[^a-z0-9 ._-]+/gi,'');
	var saveasEnc=encodeURIComponent(appSaveasNode.innerText.trim());
	
	var noteEnc=encodeURIComponent(appNoteNode.innerHTML.trim().replace(/%/g,'&percnt;'));
		
	v=saveasEnc+':'+noteEnc;
  cv = varVar.split(k+'=')[1];
  varVar=varVar.replace(k+'='+cv,k+'='+v);
  var lsKey=appId+'_varVar';
  if(typeof(localStorage) !== 'undefined')
  { 
		localStorage[lsKey]=varVar;
  }
	
	saveas=decodeURIComponent(v.split(':')[0]);

note=decodeURIComponent(v.split(':')[1]).replace(/&percnt;/g,'%');	
		
	appNoteNode.blur();
}

function changeClear()
{
  appSaveasNode.innerHTML='';
  appNoteNode.innerHTML='';
	appNoteHtmlNode.value='';
	changeNote();
	clearNoteHtml();
}

function clearNoteHtml()
{
  appNoteHtmlNode.value='this is underlying note html when you type your note. If you need to change the underlying note html edit this and then transfer html to note.';
	appNoteHtmlNode.style.color='rgba(204,051,0,.5)';
}

function changeppp()
{
  note_ppp=this.checked;
	var cookKey=appId+'_ppp';
	var cookVal=note_ppp;
	
	var expDate = new Date();
  expDate.setTime(expDate.getTime() + 20 * 365 * 24 * 60 * 60 * 1000);
  document.cookie = cookKey + "=" + cookVal + ";SameSite=Strict;expires=" + expDate.toUTCString();
	
	alert('Save with password protect is '+note_ppp);
}

function changejs()
{
  note_js=this.checked;
	var cookKey=appId+'_js';
	var cookVal=note_js;
	
	var expDate = new Date();
  expDate.setTime(expDate.getTime() + 20 * 365 * 24 * 60 * 60 * 1000);
  document.cookie = cookKey + "=" + cookVal + ";SameSite=Strict;expires=" + expDate.toUTCString();
	
	alert('Save with js is '+note_js);
}

function changecss()
{
  note_css=this.checked;
	var cookKey=appId+'_css';
	var cookVal=note_css;
	
	var expDate = new Date();
  expDate.setTime(expDate.getTime() + 20 * 365 * 24 * 60 * 60 * 1000);
  document.cookie = cookKey + "=" + cookVal + ";SameSite=Strict;expires=" + expDate.toUTCString();
	
	alert('Save with css is '+note_css);
}

function loadSaveas()
{
	if(selfserver=='bizpep.com' && selfdir=='/note'){alert('In test mode server operations are disabled. Run generated note code on your server for server functionality.');return false;}
	
	var loadsaveas=this.innerText;
	
	saveas=loadsaveas.split('load ')[1].split('.'+saveasext)[0].trim();
	  
	appSaveasNode.innerText=saveas;

appSaveasNode.focus();
			
	loadNote();
}

function loadNote()
{
	if(selfserver=='bizpep.com' && selfdir=='/note'){alert('In test mode server operations are disabled. Run generated note code on your server for server functionality.');return false;}

saveLocal();
	
	var saveasEnc=encodeURIComponent(appSaveasNode.innerText.trim());
	
	postString="loadas="+saveasEnc;
	
	httpp();
	
}

function deleteNote()
{
	if(selfserver=='bizpep.com' && selfdir=='/note'){alert('In test mode server operations are disabled. Run generated note code on your server for server functionality.');return false;}

function getTitle()
{	
	postString="title="+title;
	
	httpp();
}

</script>

<style>

body{text-align: justify;word-wrap:break-word; margin: auto; padding:1em;background-color: rgba(255,255,255,1); color:rgba(051,102,102,1); font-family:arial,helvetica,sans-serif; font-size: 14px; line-height:2em;}

header{height:42px;}

footer{padding-top:1em;border-top:3px solid rgba(255,102,0,1);background-color: rgba(255,255,255,1);font-size:1em;line-height:1.2em;text-align:right;}

nav{position:absolute;display:inline-block;z-index:4;background-color: rgba(255,255,255,1);border-width: 0px; border-radius: .2em; padding:.5em;}
nav div{display:none;font-weight: 500;}
nav:hover {box-shadow: 0px 0px .2em .1em #ccccff;}
nav:focus {box-shadow: 0px 0px .2em .1em #ccccff;}
nav:hover div{display:block;}
nav:focus div{display:block;}

nav div a{display:block;}
nav div span{display:block;}
nav div a span{display:inline; margin-left:0em;}

#navApp{left:1em;text-align:left;}
#navApp div span{padding-left:.5em;padding-right:.5em;}
#navApp div span:hover{background-color: rgba(204,204,255,.1);}
#navApp div a{padding-left:.5em;padding-right:.5em;}
#navApp div a:hover{background-color: rgba(204,204,255,.1);}

#fade {position: fixed; left: 0%;top: 0%; background-color: #000000; opacity:0.7; width: 100%;height: 100%; margin:0px; padding:0px; z-index: 199;}
#overlay {position: fixed; overflow: auto; left: 10%; top: 10%; width: 80%; height: 80%; margin:auto; z-index:200; background-color: #ffffff;color:#000000; border-width:0px; border-radius:1em;}
#overlay div {padding:1em; margin:auto; vertical-align:middle; text-align:center; line-height:1.2em;}

#sections {top:32px;}
#sections a:link{text-decoration: none;background-color:rgba(255,255,255,1); color:rgba(0,0,255,1); opacity:.7;}
#sections a:hover {opacity:1;}
#sections a:visited {color:rgba(0,0,255,.7);}
#sections a:active{color:rgba(0,0,255,1); opacity:1;}

h1{opacity:.7; font-size:1em; padding:0em; margin:0em; margin-left:.5em ;text-shadow: 1px 1px 1px rgba(0,0,0,.2); display:inline;}

#sections h2 {opacity:.7;font-size:1.2em; text-align:left;text-shadow: 1px 1px 1px rgba(0,0,0,.2);}

a:link{text-decoration: none;background-color:rgba(255,255,255,1); color:rgba(0,0,255,1); opacity:.7;}
a:hover {opacity:1;}
a:visited {color:rgba(0,0,255,.7);}
a:active{color:rgba(0,0,255,1); opacity:1;}

.link{text-decoration: none;background-color:rgba(255,255,255,1); cursor: pointer; color:rgba(0,0,255,1); opacity:.7;}
.link:hover {opacity:1;}
.link:visited{color:rgba(0,0,255,1); opacity:.7;}
.link:active{color:rgba(0,0,255,1); opacity:1;}

#account {line-height:2em;}
#accountdetails p input{width:200px;border-style:none;border-width:0em;}
#accountdetails p input:first-of-type{width:100px;font-weight: 700;text-align:left}

.bluebut{text-decoration:none;cursor: pointer; font-style: italic; font-weight: 700; color: #ffffff !important; background-color:#0000ff !important; opacity:.7; border-width: 0px; border-radius: .5em; padding:.3em; margin:.2em;}
.bluebut:hover {opacity:1; box-shadow: 0px 0px .2em .1em #0000ff;}

.redbut{cursor: pointer; font-style: italic; font-weight: 700; color: #ffffff; background-color:#ff0000; opacity:.7; border-width: 0px; border-radius: .5em; padding:.3em; margin:.2em;}
.redbut:hover {opacity:1; box-shadow: 0px 0px .2em .1em #ff0000;}

.bluebutbor{text-decoration:none;cursor: pointer; font-style: italic; font-weight: 700; color: #0000ff; background-color:#ffffff; opacity:.7; border-width: 0px; border-radius: .2em; padding:.2em; margin:.2em;}
.bluebutbor:hover {opacity:1; box-shadow: 0px 0px .2em .1em #0000ff;}

.subNav{text-align:center;font-size:small;font-family:arial,sans-serif;padding:1em;}
.subNav a+a{margin-left:3em;}
.logoplus{color:#ff6600;font-weight:700;font-size:120%;}

header{display:none;}
footer{display:none;}

img{max-width:100%;}

#saveas{box-sizing: border-box;border-style: solid;border-width: 1px;border-color: #f0f0f0;border-radius: 1em;padding-left: 1em;padding-right: 1em;margin-bottom: .5em;width:100%;min-height: 2em;}
#note{box-sizing: border-box;margin:0em;border-style: solid;border-width: 1px;border-color: #f0f0f0;border-radius: 1em;padding: 1em;width:100%;min-height: 10em;text-align: left;}
#noteHtml{box-sizing: border-box;margin:0em;border-style: solid;border-width: 1px;border-color: #f0f0f0;border-radius: 1em;padding: 1em;width:100%;min-height: 20%;text-align: left;}

#saveas:empty::before{content: 'type title here... this is used as the note header and saved file name.';color:rgba(204,051,0,.5);} 
#note:empty::before{content: 'type note here... this is your note it is auto saved locally, controls clear and preview use local data, show html displays the underlying note html, save and delete act on the server note, note view displays server note within the note application, live view displays standalone sever note. In edit mode saved server notes are displayed and can be loaded from the note menu. For a note to be live it must be saved to your server, selecting ppp will password protect the saved page. Note menu includes more ?help.';color:rgba(204,051,0,.5);}

#help img{width:16px; height:16px;}

</style>

<?php if(isset($_GET['action'])&&$_GET['action']=='edit'){ ?>
 	<style>
	 header{display:block;}
	 footer{display:block;}
  </style>
<?php  } ?>

<?php if(isset($_GET['title'])){ ?>
 	<style>
	  #saveas{border:none;}
		#note{border:none;}
  </style>
<?php  } ?>

</head>
<body onload="init();">

<nav id='navApp' tabindex='0'><span class='icon link'>&#x2630;</span> <h1><a href='https://bizpep.com/note/' class='link'>note</a></h1>
<div>
<span onclick='filterSections("help");this.parentNode.parentNode.blur();' class='link'>&#x3F; help</span>
<span onclick='refresh()' class='link'>&#x021BB; refresh</span>
<span onclick='filterSections("account");this.parentNode.parentNode.blur();' class='link'>&#x16E; account</span>
<span onclick='resetls()' class='link'>&#x26A0; reset</span>
<a href='https://bizpep.com/' target='bizpep' class='link'><span style='padding:0em; color:#ff6600;font-weight:700;font-size:120%'>+</span>bizpep.com</a>
</div>
</nav>

</header>

</section>

<p class="subNav"><a href='#' class='link' onclick='javascript:window.scrollTo(0, 0);return false;'>top</a> <a href='/' target='bizpep' class='link'><span class='logoplus'>+</span>bizpep.com</a></p>

<p>From the <a href="#navApp" class="link">&#x2630; top left</a> you can <b>load saved notes</b>, <b>&#x3F; help</b> and <b>&#x16E; account</b> status.</p>

<p>To add a note click edit and type the note title in the top title input. This is used as the note header (h1) and as the saved file name on the server. The saved file extension will be the same as this note file ie htm | html | php , a title must be provided before you can save and can only include alpha-numeric . _ - or space characters.</p>

<p>Note contents are typed in the next input, data is automatically saved locally. You can <b>clear</b> and <b>preview</b> note data.</p>

<p>When http:// or https:// followed by a link url is is included in note contents it is automatically converted to a link  ie https://bizpep.com/ becomes <a href="https://bizpep.com">bizpep.com</a>. If the url extension is an image file gif | jpg | png | svg | ico it is automatically converted to an image element ie https://bizpep.com/favicon.ico becomes <img src="https://bizpep.com/favicon.ico" alt="icon"></p>

<p>When you type your note underlying note body html can be displayed with <b>show html</b>. You can edit underlying note body html and then transfer <b>html to note</b>.</p>

<p><b>Save</b> saves the current note to your server. It is saved in an automatically created directory with the same name as your note file (this file) with an appended 's', with the current note title as its file name, and with the same extension as your note file ie note.html saves the note title 'test' to \notes\test.html . Initially you must save before you can access a server note.</p>

<p>Selecting <b>ppp</b> prior to save will password protect the saved page using the use password set in the note application.</p>

<p>Selecting <b>js</b> prior to save will add a script file link &lt;script src="note.js"&gt;&lt;/script&gt; to the head section of your note file and add onload="init()" to the body tag. When js is selected a custom script file <a href="https://bizpep.com/note/note.js" target='_blank' >note.js</a> with an onload function init() should be placed in the same directory as the saved note, this will add javascript to a live view note. You can also add a script file at the bottom of the note html &lt;script src="script.js"&gt;&lt;/script&gt;</p>

<p>Selecting <b>css</b> prior to save will add a css style sheet link &lt;link rel="stylesheet" href="note.css"&gt; to the head section of your note file. When css is selected a custom css style sheet file <a href="https://bizpep.com/note/note.css" target='_blank' >note.css </a> should be placed in the same directory as the saved note, this will style live view note.</p>

<p>In <b>edit mode</b> saved server notes are displayed and can be loaded from the note menu. Once loaded you use can use <b>note view</b> to display the server note within the note application, <b>live view</b> to display a standalone sever note and <b>delete</b> the server note. The live view url can be used independently from the note application, will always reflect all saved note edits, can be freely accessed when saved without ppp and if saved with ppp the ppp password will be required to access. For a note to be live it must first be saved to your server.</p>

<p>To set up an easily editable site, create your note files and save a site index file with the php code to include the desired live view note &lt;?php include './notes/mynote.html'; ?&gt;</p>

<p>You can also copy an existing page to notes either directly or use <a href="https://bizpep.com/textextract.html" target='bizpep'>text extractor</a> to extract text only from a url or to access components of the underlying page code.</p>

<p>Account status is Intro, Free, Full or Expired. Expired accounts may be functionally limited. Please consider supporting application development and activate your <span onclick='filterSections("account");' class='link'>&#x16E; account</span></p>

<p class="subNav"><a href='#' class='link' onclick='javascript:window.scrollTo(0, 0);return false;'>top</a> <a href='/' target='bizpep' class='link'><span class='logoplus'>+</span>bizpep.com</a></p>

</section>

<section id='account'>
<h2>Account</h2>
<div>
	<div id='accountmessage'>
	   	 <p>For code to continue functioning it must be generated with an <span onclick='noteAccount();' class='link'>Active Full account</span>.</p> 
	     <p><span onclick='noteAccount();' class='link'>Please fully active your account and rebuild your note code with an Active Full account for unlimited note use.</span></p>
	</div>
	 	 
  <div id="accountdetails"></div>
	
	<div id='privacy'>
    <p>All application data is stored on your local device and is not accessible to third parties. <span class='link' onclick="javascript:resetls()" >Reset</span> clears locally stored data. Only user verification and interaction data is remotely stored, it is confidential and used solely for service delivery.</p>
  </div>
	  
</div>

<p class="subNav"><a href='#' class='link' onclick='javascript:window.scrollTo(0, 0);return false;'>top</a> <a href='/' target='bizpep' class='link'><span class='logoplus'>+</span>bizpep.com</a></p>

</section>

</div>

<footer>
&copy;&nbsp;<a href='https://bizpep.com/' target='bizpep' class='link'><span style='padding:0em; color:#ff6600;font-weight:700;font-size:120%'>+</span>bizpep.com</a>
</footer>

</body>
</html>

<?php  } ?>

top +bizpep.com

Help

Note is a simple sever based live page web note content management system providing easily editable web notes and pages that can be freely accessed or password protected. It allows users to build basic web based password editable pages and web notes that always reflect current edits.

To use Note on your server set a password, Generate Note Code, upload this to your server and open the uploaded file in your browser. See what it looks like here and click edit to give it a try in test mode.

To get started generate note code, upload to your server and open in your browser.

To add a note click edit and type the note title in the top title input. This is used as the note header (h1) and as the saved file name on the server. The saved file extension will be the same as this note file ie htm | html | php , a title must be provided before you can save and can only include alpha-numeric . _ - or space characters.

Note contents are typed in the next input, data is automatically saved locally. You can clear and preview note data.

When http:// or https:// followed by a link url is is included in note contents it is automatically converted to a link ie https://bizpep.com/ becomes bizpep.com. If the url extension is an image file gif | jpg | png | svg | ico it is automatically converted to an image element ie https://bizpep.com/favicon.ico becomes

When you type your note underlying note html can be displayed with show html. You can edit underlying note html edit and then transfer html to note.

Save saves the current note to your server. It is saved in an automatically created directory with the same name as your note file (this file) with an appended 's', with the current note title as its file name, and with the same extension as your note file ie note.html saves the note title 'test' to \notes\test.html . Initially you must save before you can access a server note.

Selecting ppp prior to save will password protect the saved page using the use password set in the note application.

Selecting js prior to save will add a script file link <script src="note.js"></script> to the head section of your note file and add onload="init()" to the body tag. When js is selected a custom script file note.js with an onload function init() should be placed in the same directory as the saved note, this will add javascript to a live view note. You can also add a script file at the bottom of the note html <script src="script.js"></script>

Selecting css prior to save will add a css style sheet link <link rel="stylesheet" href="note.css"> to the head section of your note file. When css is selected a custom css style sheet file note.css should be placed in the same directory as the saved note, this will style live view note.

In edit mode saved server notes are displayed and can be loaded from the note menu. Once loaded you use can use note view to display the server note within the note application, live view to display a standalone sever note and delete the server note. The live view url can be used independently from the note application, will always reflect all saved note edits, can be freely accessed when saved without ppp and if saved with ppp the ppp password will be required to access. For a note to be live it must first be saved to your server.

To set up an easily editable site, create your note files and save a site index file with the php code to include the desired live view note <?php include './notes/mynote.html'; ?> . You can check your site headers and file content response with the HTTP Header Viewer.

You can also copy an existing page to notes either directly or use text reader extractor to extract text only from a url or to access components of the underlying page code.

Note code must be built with a fully activated account to maintain functionality, please consider supporting application development and activate your Ů account

top +bizpep.com

Account

Please consider supporting application development. Activate Full removes application restrictions and advertising, and supports continued application development.

Activate Full 9.95 USD for unlimted use.

Activate Free register your email for 14 day free activation.

All application data is stored on your local device and is not accessible to third parties. Reset clears locally stored data. Only user verification and interaction data is remotely stored, it is confidential and used solely for service delivery.

top +bizpep.com