Skip to content

Commit

Permalink
Bundle highlight.js with GH dark style (#2057)
Browse files Browse the repository at this point in the history
  • Loading branch information
mvorisek authored May 27, 2023
1 parent dfd2bf3 commit a6dd2eb
Show file tree
Hide file tree
Showing 32 changed files with 14,169 additions and 76 deletions.
7 changes: 2 additions & 5 deletions demos/_includes/Demo.php
Original file line number Diff line number Diff line change
Expand Up @@ -19,9 +19,6 @@ class Demo extends Columns
/** @var bool */
public static $isInitialized = false;

/** @var string */
public $highlightDefaultStyle = 'dark';

/** @var int */
public $leftWidth = 8;
/** @var int */
Expand Down Expand Up @@ -75,8 +72,8 @@ public function setCodeAndCall(\Closure $fx, string $lang = 'php'): void
public function highLightCode(): void
{
if (!self::$isInitialized) {
$this->getApp()->requireCss('https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.16.2/styles/' . $this->highlightDefaultStyle . '.min.css');
$this->getApp()->requireJs('https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.16.2/highlight.min.js');
$this->getApp()->requireCss($this->getApp()->cdn['highlight.js'] . '/styles/github-dark-dimmed.min.css');
$this->getApp()->requireJs($this->getApp()->cdn['highlight.js'] . '/highlight.min.js');
$this->js(true, (new JsChain('hljs'))->initHighlighting());
self::$isInitialized = true;
}
Expand Down
15 changes: 10 additions & 5 deletions demos/basic/view.php
Original file line number Diff line number Diff line change
Expand Up @@ -64,18 +64,23 @@
Label::addTo($app, ['Plane ID: ', 'detail' => $plane->name]);

Header::addTo($app, ['Can interract with JavaScript actions']);
Button::addTo($app, ['Hide plane', 'icon' => 'down arrow'])->on('click', $plane->js()->hide());
Button::addTo($app, ['Show plane', 'icon' => 'up arrow'])->on('click', $plane->js()->show());
Button::addTo($app, ['Jiggle plane', 'icon' => 'expand'])->on('click', $plane->js()->transition('jiggle'));
Button::addTo($app, ['Reload plane', 'icon' => 'refresh'])->on('click', new JsReload($plane));
Button::addTo($app, ['Hide plane', 'icon' => 'down arrow'])
->on('click', $plane->js()->hide());
Button::addTo($app, ['Show plane', 'icon' => 'up arrow'])
->on('click', $plane->js()->show());
Button::addTo($app, ['Jiggle plane', 'icon' => 'expand'])
->on('click', $plane->js()->transition('jiggle'));
Button::addTo($app, ['Reload plane', 'icon' => 'refresh'])
->on('click', new JsReload($plane));

Header::addTo($app, ['Can be on a Virtual Page']);
$vp = VirtualPage::addTo($app)->set(function (VirtualPage $vp) use ($planeTemplate) {
$plane = View::addTo($vp, ['template' => $planeTemplate]);
Label::addTo($vp, ['Plane ID: ', 'class.bottom attached' => true, 'detail' => $plane->name]);
});

Button::addTo($app, ['Show $plane in a dialog', 'icon' => 'clone'])->on('click', new JsModal('Plane Box', $vp));
Button::addTo($app, ['Show $plane in a dialog', 'icon' => 'clone'])
->on('click', new JsModal('Plane Box', $vp));

Header::addTo($app, ['All components extend View (even paginator)']);
$columns = Columns::addTo($app);
Expand Down
9 changes: 5 additions & 4 deletions demos/collection/grid.php
Original file line number Diff line number Diff line change
Expand Up @@ -72,10 +72,11 @@
// $grid->addExecutorButton($deleteExecutor, new Button(['icon' => 'times circle outline']));

$sel = $grid->addSelection();
$grid->menu->addItem('show selection')->on('click', new JsExpression(
'alert(\'Selected: \' + [])',
[$sel->jsChecked()]
));
$grid->menu->addItem('show selection')
->on('click', new JsExpression(
'alert(\'Selected: \' + [])',
[$sel->jsChecked()]
));

// Setting ipp with an array will add an ItemPerPageSelector to paginator.
$grid->setIpp([10, 25, 50, 100]);
3 changes: 2 additions & 1 deletion demos/collection/multitable.php
Original file line number Diff line number Diff line change
Expand Up @@ -93,7 +93,8 @@ public function setModel(Model $model, array $route = []): void
$vp->js(true)->closest('.modal')->find('.header')->remove();
});

Button::addTo($app, ['Re-Import From Filesystem', 'class.top attached' => true])->on('click', new JsModal('Now importing ... ', $vp));
Button::addTo($app, ['Re-Import From Filesystem', 'class.top attached' => true])
->on('click', new JsModal('Now importing ... ', $vp));

$finderClass::addTo($app, ['bottom attached segment'])
->setModel($model->setLimit(10), [$model->fieldName()->SubFolder]);
9 changes: 6 additions & 3 deletions demos/form-control/calendar.php
Original file line number Diff line number Diff line change
Expand Up @@ -71,9 +71,12 @@
'caption' => 'Javascript action',
'options' => ['clickOpens' => false],
])->set(new \DateTime());
$control->addAction(['Today', 'icon' => 'calendar day'])->on('click', $control->getJsInstance()->setDate($app->uiPersistence->typecastSaveField($control->entityField->getField(), new \DateTime())));
$control->addAction(['Select...', 'icon' => 'calendar'])->on('click', $control->getJsInstance()->open());
$control->addAction(['Clear', 'icon' => 'times red'])->on('click', $control->getJsInstance()->clear());
$control->addAction(['Today', 'icon' => 'calendar day'])
->on('click', $control->getJsInstance()->setDate($app->uiPersistence->typecastSaveField($control->entityField->getField(), new \DateTime())));
$control->addAction(['Select...', 'icon' => 'calendar'])
->on('click', $control->getJsInstance()->open());
$control->addAction(['Clear', 'icon' => 'times red'])
->on('click', $control->getJsInstance()->clear());

$form->onSubmit(function (Form $form) use ($app) {
return new JsToast($app->encodeJson($form->model->get()));
Expand Down
3 changes: 2 additions & 1 deletion demos/form-control/lookup.php
Original file line number Diff line number Diff line change
Expand Up @@ -91,4 +91,5 @@
$a = Form\Control\Lookup::addTo($p, ['placeholder' => 'Search country', 'label' => 'Country: ']);
$a->setModel(new Country($p->getApp()->db));
});
Button::addTo($app, ['Open Lookup on a Modal window'])->on('click', $modal->jsShow());
Button::addTo($app, ['Open Lookup on a Modal window'])
->on('click', $modal->jsShow());
15 changes: 8 additions & 7 deletions demos/form/form2.php
Original file line number Diff line number Diff line change
Expand Up @@ -30,14 +30,15 @@

// form basic field group
$formAddress = $form->addGroup('Basic Country Information');
$name = $formAddress->addControl(Country::hinting()->fieldName()->name, ['width' => 'sixteen']);
$name->addAction(['Check Duplicate', 'iconRight' => 'search'])->on('click', function (Jquery $jquery, string $name) use ($app, $form) {
if ((new Country($app->db))->tryLoadBy(Country::hinting()->fieldName()->name, $name) !== null) {
return $form->js()->form('add prompt', Country::hinting()->fieldName()->name, 'This country name is already added.');
}
$nameInput = $formAddress->addControl(Country::hinting()->fieldName()->name, ['width' => 'sixteen']);
$nameInput->addAction(['Check Duplicate', 'iconRight' => 'search'])
->on('click', function (Jquery $jquery, string $name) use ($app, $form) {
if ((new Country($app->db))->tryLoadBy(Country::hinting()->fieldName()->name, $name) !== null) {
return $form->js()->form('add prompt', Country::hinting()->fieldName()->name, 'This country name is already added.');
}

return new JsToast('This country name can be added.');
}, ['args' => ['_n' => $name->jsInput()->val()]]);
return new JsToast('This country name can be added.');
}, ['args' => ['_n' => $nameInput->jsInput()->val()]]);

// form codes field group
$formCodes = $form->addGroup(['Codes']);
Expand Down
21 changes: 14 additions & 7 deletions demos/interactive/modal.php
Original file line number Diff line number Diff line change
Expand Up @@ -31,22 +31,28 @@

$modal = Modal::addTo($app, ['title' => 'Add a name']);
LoremIpsum::addTo($modal);
Button::addTo($modal, ['Hide'])->on('click', $modal->jsHide());
Button::addTo($modal, ['Hide'])
->on('click', $modal->jsHide());

$modalNoTitle = Modal::addTo($app, ['title' => false]);
LoremIpsum::addTo($modalNoTitle);
Button::addTo($modalNoTitle, ['Hide'])->on('click', $modalNoTitle->jsHide());
Button::addTo($modalNoTitle, ['Hide'])
->on('click', $modalNoTitle->jsHide());

$modalScrolling = Modal::addTo($app, ['title' => 'Long Content that Scrolls inside Modal']);
$modalScrolling->addScrolling();
LoremIpsum::addTo($modalScrolling);
LoremIpsum::addTo($modalScrolling);
LoremIpsum::addTo($modalScrolling);
Button::addTo($modalScrolling, ['Hide'])->on('click', $modalScrolling->jsHide());
Button::addTo($modalScrolling, ['Hide'])
->on('click', $modalScrolling->jsHide());

Button::addTo($bar, ['Show'])->on('click', $modal->jsShow());
Button::addTo($bar, ['No Title'])->on('click', $modalNoTitle->jsShow());
Button::addTo($bar, ['Scrolling Content'])->on('click', $modalScrolling->jsShow());
Button::addTo($bar, ['Show'])
->on('click', $modal->jsShow());
Button::addTo($bar, ['No Title'])
->on('click', $modalNoTitle->jsShow());
Button::addTo($bar, ['Scrolling Content'])
->on('click', $modalScrolling->jsShow());

// Modal demos.

Expand Down Expand Up @@ -92,7 +98,8 @@
$vp2Modal->set(function (View $p) use ($vp3Modal) {
ViewTester::addTo($p);
Message::addTo($p, [$_GET['color'] ?? 'No color'])->text->addParagraph('This text is loaded using a second modal.');
Button::addTo($p)->set('Third modal')->on('click', $vp3Modal->jsShow());
Button::addTo($p)->set('Third modal')
->on('click', $vp3Modal->jsShow());
});

$bar = View::addTo($app, ['ui' => 'buttons']);
Expand Down
3 changes: 2 additions & 1 deletion demos/interactive/popup.php
Original file line number Diff line number Diff line change
Expand Up @@ -285,4 +285,5 @@ public function linkCart(View $cart, JsExpressionable $jsAction = null): void
$button = Button::addTo($app, [null, 'icon' => 'volume down']);
$buttonPopup = Popup::addTo($app, [$button, 'triggerOn' => 'hover'])->setHoverable();

Form\Control\Checkbox::addTo($buttonPopup, ['Just On/Off', 'class.slider' => true])->on('change', $button->js()->find('.icon')->toggleClass('up down'));
Form\Control\Checkbox::addTo($buttonPopup, ['Just On/Off', 'class.slider' => true])
->on('change', $button->js()->find('.icon')->toggleClass('up down'));
6 changes: 4 additions & 2 deletions demos/interactive/progress.php
Original file line number Diff line number Diff line change
Expand Up @@ -13,5 +13,7 @@
$p = ProgressBar::addTo($app, [20]);

$p = ProgressBar::addTo($app, [60, 'indicating progress', 'class.indicating' => true]);
Button::addTo($app, ['increment'])->on('click', $p->jsIncrement());
Button::addTo($app, ['set'])->on('click', $p->jsValue(20));
Button::addTo($app, ['increment'])
->on('click', $p->jsIncrement());
Button::addTo($app, ['set'])
->on('click', $p->jsValue(20));
7 changes: 4 additions & 3 deletions demos/interactive/tabs.php
Original file line number Diff line number Diff line change
Expand Up @@ -40,9 +40,10 @@

// modal tab
$tabs->addTab('Modal popup', function (VirtualPage $vp) {
Button::addTo($vp, ['Load Lorem'])->on('click', Modal::addTo($vp)->set(function (View $p) {
LoremIpsum::addTo($p, ['size' => 2]);
})->jsShow());
Button::addTo($vp, ['Load Lorem'])
->on('click', Modal::addTo($vp)->set(function (View $p) {
LoremIpsum::addTo($p, ['size' => 2]);
})->jsShow());
});

// dynamic tab
Expand Down
9 changes: 6 additions & 3 deletions demos/interactive/virtual.php
Original file line number Diff line number Diff line change
Expand Up @@ -70,14 +70,17 @@
Header::addTo($app, ['Inside Modal', 'subHeader' => 'Virtual page content can be display using JsModal Class.']);

$bar = View::addTo($app, ['ui' => 'buttons']);
Button::addTo($bar)->set('Load in Modal')->on('click', new JsModal('My Popup Title', $virtualPage->getJsUrl('cut')));
Button::addTo($bar)->set('Load in Modal')
->on('click', new JsModal('My Popup Title', $virtualPage->getJsUrl('cut')));

Button::addTo($bar)->set('Simulate slow load')->on('click', new JsModal('My Popup Title', $virtualPage->getJsUrl('cut') . '&slow=true'));
Button::addTo($bar)->set('Simulate slow load')
->on('click', new JsModal('My Popup Title', $virtualPage->getJsUrl('cut') . '&slow=true'));
if (isset($_GET['slow'])) {
sleep(1);
}

Button::addTo($bar)->set('No title')->on('click', new JsModal(null, $virtualPage->getJsUrl('cut')));
Button::addTo($bar)->set('No title')
->on('click', new JsModal(null, $virtualPage->getJsUrl('cut')));

View::addTo($app, ['ui' => 'hidden divider']);
$text = Text::addTo($app);
Expand Down
3 changes: 2 additions & 1 deletion demos/javascript/js.php
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,8 @@
$b = Button::addTo($app, ['name' => 'b2'])->set('Hide on click Button');
$b->js('click')->hide();

Button::addTo($app, ['Redirect'])->on('click', null, $app->jsRedirect(['foo' => 'bar']));
Button::addTo($app, ['Redirect'])
->on('click', null, $app->jsRedirect(['foo' => 'bar']));

if (isset($_GET['foo']) && $_GET['foo'] === 'bar') {
$app->redirect(['foo' => 'baz']);
Expand Down
14 changes: 8 additions & 6 deletions demos/others/sticky2.php
Original file line number Diff line number Diff line change
Expand Up @@ -33,9 +33,10 @@
View::addTo($frame, ['ui' => 'hidden divider']);

// nested interractive elemetns will respect lockal sticky get
Button::addTo($frame, ['Triggering callback here will inherit color'])->on('click', function () {
return new JsToast('Color was = ' . $_GET['name']);
});
Button::addTo($frame, ['Triggering callback here will inherit color'])
->on('click', function () {
return new JsToast('Color was = ' . $_GET['name']);
});

// Next we have loader, which will dynamically load console which will dynamically output "success" message.
Loader::addTo($frame)->set(function (Loader $p) {
Expand All @@ -50,9 +51,10 @@
$t->addDecorator('name', [Table\Column\Link::class, [], ['name']]);

$frame = View::addTo($app, ['ui' => 'green segment']);
Button::addTo($frame, ['does not inherit sticky get'])->on('click', function () use ($app) {
return new JsToast('$_GET = ' . $app->encodeJson($_GET));
});
Button::addTo($frame, ['does not inherit sticky get'])
->on('click', function () use ($app) {
return new JsToast('$_GET = ' . $app->encodeJson($_GET));
});

Header::addTo($app, ['Use of View::url()']);

Expand Down
3 changes: 2 additions & 1 deletion docs/app.rst
Original file line number Diff line number Diff line change
Expand Up @@ -422,7 +422,8 @@ Populating the left menu object is simply a matter of adding the right menu item
This is the top menu of the admin layout. You can add other item to the top menu using::

Button::addTo($layout->menu->addItem(), ['View Source', 'class.teal' => true, 'icon' => 'github'])
->setAttr('target', '_blank')->on('click', new \Atk4\Ui\Js\JsExpression('document.location = [];', [$url . $f]));
->setAttr('target', '_blank')
->on('click', new \Atk4\Ui\Js\JsExpression('document.location = [];', [$url . $f]));

.. php:attr:: menuRight
Expand Down
7 changes: 4 additions & 3 deletions docs/grid.rst
Original file line number Diff line number Diff line change
Expand Up @@ -154,9 +154,10 @@ additionally place this column before any other column inside a grid. You can us
method to reference value of selected checkboxes inside any :ref:`js_action`::

$sel = $grid->addSelection();
$grid->menu->addItem('show selection')->on('click', new \Atk4\Ui\Js\JsExpression(
'alert(\'Selected: \' + [])', [$sel->jsChecked()]
));
$grid->menu->addItem('show selection')
->on('click', new \Atk4\Ui\Js\JsExpression(
'alert(\'Selected: \' + [])', [$sel->jsChecked()]
));

Sorting
=======
Expand Down
12 changes: 8 additions & 4 deletions docs/js.rst
Original file line number Diff line number Diff line change
Expand Up @@ -418,18 +418,22 @@ producing content of your dialog::
$modal = \Atk4\Ui\Modal::addTo($app, ['Modal Title']);
$modal->set(function (View $p) use ($modal) {
\Atk4\Ui\LoremIpsum::addTo($p);
\Atk4\Ui\Button::addTo($p, ['Hide'])->on('click', $modal->jsHide());
\Atk4\Ui\Button::addTo($p, ['Hide'])
->on('click', $modal->jsHide());
});

\Atk4\Ui\Button::addTo($app, ['Show'])->on('click', $modal->jsShow());
\Atk4\Ui\Button::addTo($app, ['Show'])
->on('click', $modal->jsShow());

Modal will render as a HTML `<div>` block but will be hidden. Alternatively you can use Modal without loadable content::

$modal = \Atk4\Ui\Modal::addTo($app, ['Modal Title']);
\Atk4\Ui\LoremIpsum::addTo($modal);
\Atk4\Ui\Button::addTo($modal, ['Hide'])->on('click', $modal->jsHide());
\Atk4\Ui\Button::addTo($modal, ['Hide'])
->on('click', $modal->jsHide());

\Atk4\Ui\Button::addTo($app, ['Show'])->on('click', $modal->jsShow());
\Atk4\Ui\Button::addTo($app, ['Show'])
->on('click', $modal->jsShow());

The second way is more convenient for creating static content, such as Terms of Service.

Expand Down
3 changes: 2 additions & 1 deletion docs/progressbar.rst
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,8 @@ with JavaScript::

$bar->value = 5; // sets this value instead of 0

Button::addTo($app, ['charge up the battery'])->on('click', $bar2->jsValue(100));
Button::addTo($app, ['charge up the battery'])
->on('click', $bar2->jsValue(100));

Updating Progress in RealTime
=============================
Expand Down
6 changes: 4 additions & 2 deletions docs/virtualpage.rst
Original file line number Diff line number Diff line change
Expand Up @@ -201,7 +201,8 @@ To indicate how custom binding works::
});


\Atk4\Ui\Button::addTo($app, ['Load data'])->on('click', $loader->js()->trigger('kaboom'));
\Atk4\Ui\Button::addTo($app, ['Load data'])
->on('click', $loader->js()->trigger('kaboom'));

This approach allow you to trigger loader from inside JavaScript easily. See also: https://api.jquery.com/trigger/

Expand All @@ -224,7 +225,8 @@ Next example will display DataTable, but will allow you to replace data with a f
->setModel($data)
->addCondition('year', $app->stickyGet('year'));

\Atk4\Ui\Button::addTo($box, ['Edit Data Settings'])->on('click', $loader->js()->trigger('edit'));
\Atk4\Ui\Button::addTo($box, ['Edit Data Settings'])
->on('click', $loader->js()->trigger('edit'));

$loader->set(function (\Atk4\Ui\Loader $p) {
$form = \Atk4\Ui\Form::addTo($p);
Expand Down
8 changes: 8 additions & 0 deletions public/external/.gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,14 @@
!/*/
/*/*

!/@highlightjs/cdn-assets/
/@highlightjs/cdn-assets/*
!/@highlightjs/cdn-assets/LICENS*
!/@highlightjs/cdn-assets/*.js
!/@highlightjs/cdn-assets/styles/
/@highlightjs/cdn-assets/styles/*
!/@highlightjs/cdn-assets/styles/github-dark-dimmed*.css

!/@shopify/draggable/
/@shopify/draggable/*
!/@shopify/draggable/LICENS*
Expand Down
29 changes: 29 additions & 0 deletions public/external/@highlightjs/cdn-assets/LICENSE
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
BSD 3-Clause License

Copyright (c) 2006, Ivan Sagalaev.
All rights reserved.

Redistribution and use in source and binary forms, with or without
modification, are permitted provided that the following conditions are met:

* Redistributions of source code must retain the above copyright notice, this
list of conditions and the following disclaimer.

* Redistributions in binary form must reproduce the above copyright notice,
this list of conditions and the following disclaimer in the documentation
and/or other materials provided with the distribution.

* Neither the name of the copyright holder nor the names of its
contributors may be used to endorse or promote products derived from
this software without specific prior written permission.

THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE
FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR
SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER
CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY,
OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
Loading

0 comments on commit a6dd2eb

Please sign in to comment.