I know how to implement CodeMirror to a regular page but I have no idea how to do it on a MediaWiki webpage. I've tried adding the "codemirror.js" file the same way I added other scripts that I am using on the page but I get the error that "CodeMirror" is not defined when it is being initialized. In the code below shows how I added my previous scripts and the "codemirror.js".
$wgResourceModules['ext.SpecialRobotExp'] = array('scripts' => array(
'module/PID.js', 'module/grid.js', 'module/saveFile.js', 'module/codemirror.js'
),
What I need is to know where to save the codemirror.js file and how to load it to the page on a MediaWiki webpage.
Related
I display an SVG file using HTML img tag through the .html file of an Angular 6 component. Let's call this SVG file a.svg.
This a.svg image contains parts that are linked to other SVG files, and let's just consider the first of them, named b.svg.
All the SVG files are static. They are place in a subfolder of assets in Angular 6 application folder.
When I open a.svg directly under my Internet browser, I can click on hyperlinked parts and navigate to b.svg, without any problem.
Under Angular 6, file a.svg is displayed correctly, but apparently, I can not click on interactive parts.
I investigate the issue without being able to find a real clue about the root cause of such behabior. Maybe, related to security issue. I wonder
is this a desired behavior of Angular 6?
is there a way to tell Angular 6, to allow user interaction on these images ?
Finally found the right way to do so.
First, read security guide for angular which provides many good hints, although far from being exhaustive.
To make my code run smoothly, this is what I changed
Firstly, in angular component .html file, I changed the HTML img tag into a div tag, on which I used the [innerHTML] binding to an internal property named svgFromFile
<div class='e2e-inner-html-bound' [innerHTML]='svgFromFile'></div>
Then, in angular component .ts file, I changed the implementation to use bypassSecurityTrustHtml() on the content of the target SVG file
this.fn = '/assets/urba/diagram/' + params['fn'] + '.svg'; // from route parameter to image asset to be served
this.http.get(this.fn, {
responseType: 'text'
}).subscribe(
data => {
console.log(data);
this.svgFromFile = this.sanitizer.bypassSecurityTrustHtml(data);
},
error => console.log('svgFromFile', error)
);
Doing so, embedded URLS in SVG file are now active and dereferenceable.
We are planning to load a number of HTML files as they are in the site using Concrete5.
We had to do this since the number of files is too big to load them via editor.
(We are going to generate the html files with madcap flare)
However, I need to use the tag feature of concrete5 for the contents loaded by this method.
I am told by my developers that this is impossible.
Does anyone know how to use tags for files loaded without going through the C5 editor?
i.e. I want the contents in the manually linked html files to be searched and filtered within the site with the search feature and filter feature provided by C5
HELP!!
I recommend creating a very simple template consisting of the standard C5 header/footer code, with one big block as the contents of the body tag.
You can then import the pages by something along the lines of (pseudo-code):
$parent = Page::getByCollectionPath('/');
$ct = CollectionType::getByHandle('template_name');
$data = array(
'cName' => 'The page title',
'cHandle' => 'The trailing path component'
);
$page = $parent->add($ct, $data);
$blocks = $page->getBlocks('Main');
// Gross hack because the template has one block, and that a 'content' block
$blocks[0]->update('content', 'IMPORTED HTML BODY CONTENT');
After that, you can add tags either via the API or the Dashboard.
I'm trying to render a .html webpage using #Renderpage() method in Webmatrix but the .html extension is not supported by the method. I guess the method only supports cshtml extensions. Is there a way I can render html pages dynamically on my site (Webmatrix). I dont want to use an iframe because I'll definitely have issues with my jquery files.
I attempted something i feel is safe yet feels unsafe. I resolved to read the html file and inject it to the DOM manually using:
Array html = null;
var mypage = Server.MapPath(page);
if(File.Exists(mypage)){
html = File.ReadAllLines(mypage);
}
After reading the file.....i injected it to the DOM
<div class="s_content s fontfix left s_content2 downdown">
#foreach (var data in html) {
<text>#Html.Raw(data)</text>
}
</div>
All this runs on compilation time before the page is created for rendering.....I attempted some security measures by attempting to inject server-side C# code in the HTML file but was useless. Makes me feel safe atleast. Is this risky? What is the possible threat to this alternative. i wish i can still have an alternative proper solution from the house. Thanks though.
Assuming #Renderpage() doesn't support HTML files, why don't you try Jquery.load or Ajax. There are lots of tutorials based on dynamic loading of html content.
I do something similar but I don't use #Renderpage or an html file. Instead I am using the "onclick" event and a javascript function which opens a cshtml file. You just put this and the java script function in your main cshtml file in the hmtl section. It will open a file in the current directory called my_window.cshtml when clicked
<a onclick=openWin("my_window",700,850);>Open when clicked</a>
<script type="text/javascript">
function openWin(url, width, height)
{
myWindow=window.open(url,'_blank','width='+width+',height='+height);
myWindow.focus();
}
Hope this helps!
My Yii application has a particular section called 'Edit Profile' . It's a pretty data heavy section in the way a lot of data is pulled from db for this one .
However the problem is that I have tab pagination in this section . Because only this section uses tabs on the website I did not include the related CSS/Javascript files in the main layout header .These have been referenced in the view file itself . Because of this the tabs takes time to show up and the tab titles appear as a list first (for a second or two) and then get distributed into tabs with the correct UI . This is of course unacceptable behaviour . Is there any way to selectively include related js/css files into the header tag for this particular view or should I include it in main layhout file even though it won't be used in a lot of other places on the website thus possibly slowing down other pages .
Just specify the position for the file.
In your view where you are including the js or css :
// for js
Yii::app()->clientScript->registerScriptFile('url_of_file',CClientScript::POS_HEAD);
// for css
Yii::app()->clientScript->registerCssFile('url_of_file');
Recommended documentation: registerScriptFile() , and registerCssFile()
You can create your own layout in the layouts folder , where u can include all the required jquery scripts and css. U can then call your layout in the controller.
public function actionDoSomething(){
$this->layout = 'mylayout';
$this->render('myview');
}
I want to wrap a mediawiki site inside another site - using the header.inc and footer.inc files that the rest of the website's html files use.
I'm not familiar with php, is there a 'masterpage' file somewhere I can put them in?
Your best bet would be to create a custom skin, or edit one of the default skins, such as monobook. They control most of the basic presentation code. Here is one short tutorial on creating a custom skin. The files usually live in the /skins/ folder; if you skim through one, you can find where the HTML begins and ends.
You can include another file using the PHP include function, like so:
<html>
...
<body>
<?php
include 'header.inc';
?>
...
For future reference in the LocalSettings.php you can also prevent users from using any other skin.
$wgDefaultSkin = 'myskin';
$wgAllowUserSkin = false;
$wgSkipSkins = array( "chick", "cologneblue", "monobook", "modern", "myskin", "nostalgia", "simple", "standard" );