Markdown : ajout du prévisualiser

Débugs modale share
amélioration visibilité etiquettes ressources

plugin/hackpoint/css/main.css

@@ -326,6 +326,7 @@ textarea.form-control.share-input{
 #resources-toolbar ul li > small{
 	color:#ffffff;
 	border-radius: 3px;
+	text-shadow: 0 0 4px rgba(0,0,0,1);
 	padding: 0 3px;
 	font-size: 10px;
 }
@@ -344,6 +345,19 @@ textarea.form-control.share-input{
 	display: none;
 }
 
+#sketch-editor.resource-readme{
+	display: flex;
+	
+}
+#sketch-editor.resource-readme > textarea{
+	width: 50%;
+}
+#sketch-editor.resource-readme > div{
+	width: 50%;
+	padding-left: 15px;
+	box-sizing: border-box;
+}
+
 .resource-dropdown{
 	position: absolute;
 	bottom: 0;

plugin/hackpoint/hackpoint.plugin.php

@@ -315,6 +315,7 @@ Plugin::addCss("/css/codemirror-monokai.css?v=1");
 Plugin::addCss("/css/component.css?v=1",true); 
 Plugin::addCss("/css/animate.min.css"); 
 
+Plugin::addJs("/js/marked.min.js?v=1"); 
 Plugin::addJs("/js/main.js?v=1"); 
 Plugin::addJs("/js/codemirror.js?v=1"); 
 Plugin::addJs("/js/component.js?v=2",true); 

plugin/hackpoint/js/main.js

@@ -1,5 +1,6 @@
 //CHARGEMENT DE LA PAGE
 function init_plugin_hackpoint(){
+
 	switch($.urlParam('page')){
 		case 'sheet.sketch':
 			if($('.hackpoint').hasClass('readonly')){
@@ -21,6 +22,13 @@ function init_plugin_hackpoint(){
 }
 
 
+function hackpoint_resource_markdown_parse(){
+	var editor = $('#content').data('codemirror');
+
+
+	$('#htmlcontent').html( marked(editor.getValue()));
+}
+
 //Enregistrement des configurations
 function hackpoint_setting_save(){
 	$.action({ 
@@ -47,7 +55,7 @@ modalize : function(options){
 		}
 
 		var form = obj.detach();
-		form.removeClass('hide');
+		form.removeClass('hidden');
 		modal.html(form.get(0).outerHTML);
     	
     	var modalize = {
@@ -391,9 +399,10 @@ function hackpoint_resource_title_edit(event,element){
 
 
 function hackpoint_resource_mirrorify(element,data){
-
+	var options = data;
 	if($('.hackpoint').hasClass('readonly')) data.readOnly = true;
 	var editor = CodeMirror.fromTextArea($(element).get(0), data);
+	$(element).data('codemirror',editor);
 	editor.on("blur", function(cm,obj){
 		if($('.hackpoint').hasClass('readonly')) return;
 		var data = {};
@@ -407,7 +416,10 @@ function hackpoint_resource_mirrorify(element,data){
 			},300);
 		});
 	});
+
+
 	editor.on("change", function() { 
+		if(options.change) options.change();
 		var data ={height:800};
 		var wrap = editor.getWrapperElement();      
 		var approp = editor.getScrollInfo().height > data.height ? data.height+"px" : "auto";
@@ -416,6 +428,7 @@ function hackpoint_resource_mirrorify(element,data){
 			editor.refresh();
 		}
 	});
+	if(options.complete) options.complete();
 }
 
 //Ajout ou modification d'élément resource

plugin/hackpoint/page.sheet.sketch.php

@@ -96,7 +96,7 @@ if(isset($_['sidebar']) && $_['sidebar'] == 0) $sketchClasses .= ' no-sidebar';
 <!-- MODALES -->
 
 <!-- Modale partage -->
-<div id="share-sketch-modal" class="hide" data-id="">
+<div id="share-sketch-modal" class="hidden" data-id="">
   <div class="modalize-header">
     <h4 class="text-uppercase font-weight-light"><i class="fas fa-share-alt"></i> Gestion des partages</h4>
   </div>

plugin/hackpoint/types/ReadmeType.class.php

@@ -21,13 +21,15 @@ class ReadmeType {
 	public static function toHtml($resource,$sketch=null){
 		$infos = self::manifest();
 		return array(
-			'html'=>'<textarea id="content" onblur="hackpoint_resource_save_content()" class="markdown-text">'.$resource->content.'</textarea>',
+			'html'=>'<textarea id="content" onblur="hackpoint_resource_save_content()" class="markdown-text">'.$resource->content.'</textarea><div id="htmlcontent"></div>',
 			'javascript' => "
 				hackpoint_resource_mirrorify('.markdown-text',{
 					mode : 'markdown',	
 					lineNumbers : false,
 					theme : 'monokai',
-					readOnly : false
+					readOnly : false,
+					change : function (){ hackpoint_resource_markdown_parse(); },
+					complete : function(){hackpoint_resource_markdown_parse();}
 				});
 			"
 		);